vue-pure-admin/dist/static/js/index-DqrfDJy-.js

import{R as B}from"./index-BvroBZv4.js";import{d as R,r as t,a as j,c as m,w as r,b as s,j as N,e as n,f as o,h as d,i as u,m as V,k as h,u as v,C as g,B as l,aL as z}from"./index-ypfYKP8A.js";const D="/vue-pure-admin/static/png/avatar-BYZ7LL6-.png",I={class:"card-header"},L={class:"font-medium"},A={"element-loading-background":"transparent"},E={class:"flex flex-wrap justify-center items-center text-center"},J={key:1,class:"mt-1"},Y=R({name:"Cropping",__name:"index",setup(P){const e=t(),_=t(),k=t(),c=t(!1),a=t("");function w({base64:f,blob:i,info:p}){e.value=p,a.value=f}return j(()=>{_.value.hide()}),(f,i)=>{const p=s("el-link"),x=s("el-image"),C=s("el-popover"),y=s("el-card"),b=N("loading");return n(),m(y,{shadow:"never"},{header:r(()=>[o("div",I,[o("span",L,[d(" 图片裁剪，基于开源的 "),u(p,{href:"https://fengyuanchen.github.io/cropperjs/",target:"_blank",style:{margin:"0 4px 5px","font-size":"16px"}},{default:r(()=>[d(" cropperjs ")]),_:1}),d(" 进行二次封装（提示：右键下面左侧裁剪区可开启功能菜单） ")])])]),default:r(()=>[V((n(),h("div",A,[u(C,{ref_key:"popoverRef",ref:_,visible:c.value,placement:"right",width:"300px"},{reference:r(()=>[u(v(B),{ref_key:"refCropper",ref:k,class:"w-[30vw]",src:v(D),circled:"",onCropper:w,onReadied:i[0]||(i[0]=S=>c.value=!0)},null,8,["src"])]),default:r(()=>[o("div",E,[a.value?(n(),m(x,{key:0,src:a.value,"preview-src-list":Array.of(a.value),fit:"cover"},null,8,["src","preview-src-list"])):g("",!0),e.value?(n(),h("div",J,[o("p",null," 图像大小："+l(parseInt(e.value.width))+" × "+l(parseInt(e.value.height))+"像素 ",1),o("p",null," 文件大小："+l(v(z)(e.value.size))+"（"+l(e.value.size)+" 字节） ",1)])):g("",!0)])]),_:1},8,["visible"])])),[[b,!c.value]])]),_:1})}}});export{Y as default};