cione-comp-lib/lib/packages/co-image-std/index2.js

`$ yarn add cione-comp-lib` 或者 `$ npm i cione-comp-lib -S`

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var e=require("vue"),t=require("./imagePreview.js");require("./index.vue_vue_type_style_index_0_scoped_true_lang.js");var a=require("../../_virtual/plugin-vue_export-helper.js");const r=e.defineComponent({name:"CoImageStd",components:{ImagePreview:t.default},props:{src:{type:String},width:{type:String},height:{type:String},preview:{type:Boolean},opacity:{type:Number,default:100},backgroundSize:{type:String},rotate:{type:Number,default:0},isRotate:{type:Boolean,default:!1},rotateTimer:{type:Number,default:2},clockType:{type:String,default:"middle"}},setup(t){const a=e.ref(t.src),r=e.ref(!1),o=e.ref(),i=e.ref(),n=e.ref(!1),l=e.ref(t.rotate+"deg"),c=e.ref(`${360+t.rotate}deg`),u=e.ref(t.isRotate),s=e.ref(!0);e.watch((()=>t.src),(()=>{a.value=t.src})),e.watch((()=>t.rotate),(()=>{l.value=t.rotate+"deg",c.value=`${360+t.rotate}deg`,d("--startRotat",l.value),d("--endRotate",c.value)})),e.watch((()=>t.isRotate),(()=>{u.value=t.isRotate}));const d=(e,t)=>{t&&document.documentElement.style.setProperty(e,t.trim())};return e.onMounted((()=>{s.value=!1,e.nextTick((()=>{s.value=!0,l.value=t.rotate+"deg",c.value=`${360+t.rotate}deg`,d("--startRotat",l.value),d("--endRotate",c.value)}))})),{showRotate:s,imgSrc:a,refPreBox:o,refPreImg:i,isMask:r,isReset:n,startRotate:l,endRotate:c,isRotateState:u,picturePreview:e=>{t.preview&&(r.value=!0)},imagePreviewChange:()=>{r.value=!1},updataSrc:e=>{a.value=e},...e.toRefs(t)}}});var o=a.default(r,[["render",function(t,a,r,o,i,n){const l=e.resolveComponent("ImagePreview");return e.openBlock(),e.createElementBlock("div",{class:"co-image-std",style:e.normalizeStyle({width:t.width||"100%",height:t.height||"100%"})},[t.showRotate?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass("image-std__box "+(t.isRotateState?"image-std__animation":"")),style:e.normalizeStyle({width:t.width||"100%",height:t.height||"100%",opacity:t.opacity/100,backgroundImage:`url(${t.imgSrc})`,backgroundRepeat:"repeat"===t.backgroundSize?"repeat":"no-repeat",backgroundSize:"repeat"===t.backgroundSize?"inherit":t.backgroundSize,backgroundPosition:"repeat"===t.backgroundSize?"left top":"center center",transform:`rotate(${t.rotate}deg)`,animationDuration:`${t.rotateTimer}s`,animationPlayState:t.isRotateState?"running":"paused",cursor:t.preview?"pointer":""}),onClick:a[0]||(a[0]=(...e)=>t.picturePreview&&t.picturePreview(...e))},null,6)):e.createCommentVNode("",!0),e.createVNode(l,{modelValue:t.isMask,"onUpdate:modelValue":a[1]||(a[1]=e=>t.isMask=e),src:t.imgSrc,"onUpdate:src":a[2]||(a[2]=e=>t.imgSrc=e),clockType:t.clockType,"onUpdate:clockType":a[3]||(a[3]=e=>t.clockType=e),onChange:t.imagePreviewChange},null,8,["modelValue","src","clockType","onChange"])],4)}],["__scopeId","data-v-c41ac8bc"]]);exports.default=o;