| 1 |
- import{d as v,f as p,ag as s,aB as A,ar as n,aD as u,k as r,at as i,aq as c,ah as l,au as h}from"./vue-vendor-Be68asQ6.js";import{P as I}from"./index-X83NmVMq.js";import{C as B}from"./index-BZ_MXCtW.js";import{C as E,a as D}from"./index-DqJHbrLx.js";import{u as k}from"./upload-BVxWqCoy.js";import{h as y}from"./header-DrqstxrB.js";import{ah as w,a as P}from"./index-BFfnEkVs.js";import"./antd-vue-vendor-DcqS7Wvq.js";import"./useContentHeight-DnE6GxS2.js";import"./useWindowSizeFn-BTSGGcie.js";import"./vxe-table-vendor-DHF2TRpV.js";import"./useContentViewHeight-BVCc9jQl.js";import"./usePageContext-WlOC5VNa.js";import"./injectionKey-DPVn4AgL.js";import"./index-BIPzXG41.js";import"./index-CXEQnmRq.js";import"./useTimeout-Ca5eqGu-.js";import"./useIntersectionObserver-Bl62RIZ4.js";import"./index-CETWS1o0.js";import"./BasicModal-D4gc2R81.js";import"./base64Conver-24EVOS6V.js";const $=v({components:{PageWrapper:I,CropperImage:D,CollapseContainer:B,CropperAvatar:E},setup(){var t;const e=p(""),m=p(""),d=p(""),C=p(""),g=w(),F=p(((t=g.getUserInfo)==null?void 0:t.avatar)||"");function f({imgBase64:a,imgInfo:_}){e.value=_,m.value=a}function o({imgBase64:a,imgInfo:_}){d.value=_,C.value=a}return{img:y,info:e,circleInfo:d,cropperImg:m,circleImg:C,handleCropend:f,handleCircleCropend:o,avatar:F,uploadApi:k}}}),N={class:"container p-4"},S={class:"cropper-container mr-10"},V=["src"],W={key:0},U={class:"container p-4"},q={class:"cropper-container mr-10"},b=["src"],j={key:0};function z(e,m,d,C,g,F){const f=s("CropperAvatar"),o=s("CollapseContainer"),t=s("CropperImage"),a=s("PageWrapper");return n(),A(a,{title:"图片裁剪示例",content:"需要开启测试接口服务才能进行上传测试!"},{default:u(()=>[r(o,{title:"头像裁剪"},{default:u(()=>[r(f,{uploadApi:e.uploadApi,value:e.avatar},null,8,["uploadApi","value"])]),_:1}),r(o,{title:"矩形裁剪",class:"my-4"},{default:u(()=>[i("div",N,[i("div",S,[r(t,{ref:"refCropper",src:e.img,onCropend:e.handleCropend,style:{width:"40vw"}},null,8,["src","onCropend"])]),e.cropperImg?(n(),c("img",{key:0,src:e.cropperImg,class:"croppered",alt:""},null,8,V)):l("",!0)]),e.cropperImg?(n(),c("p",W,"裁剪后图片信息:"+h(e.info),1)):l("",!0)]),_:1}),r(o,{title:"圆形裁剪"},{default:u(()=>[i("div",U,[i("div",q,[r(t,{ref:"refCropper",src:e.img,onCropend:e.handleCircleCropend,style:{width:"40vw"},circled:""},null,8,["src","onCropend"])]),e.circleImg?(n(),c("img",{key:0,src:e.circleImg,class:"croppered"},null,8,b)):l("",!0)]),e.circleImg?(n(),c("p",j,"裁剪后图片信息:"+h(e.circleInfo),1)):l("",!0)]),_:1})]),_:1})}const se=P($,[["render",z],["__scopeId","data-v-c768e869"]]);export{se as default};
|