2 lines
7.0 KiB
JavaScript
2 lines
7.0 KiB
JavaScript
var t,i;import{G as e,H as n,aM as o,ax as a,o as s,c as r,w as l,n as d,A as h,b as m,F as c,r as u,m as f,h as p,t as y,d as g,K as v,ai as S,j as w}from"./index-d76b1e7a.js";import{_ as $}from"./_plugin-vue_export-helper.1b428a4d.js";const x=$({name:"uv-loading-icon",mixins:[e,n,{props:{show:{type:Boolean,default:!0},color:{type:String,default:"#909193"},textColor:{type:String,default:"#909193"},vertical:{type:Boolean,default:!1},mode:{type:String,default:"spinner"},size:{type:[String,Number],default:24},textSize:{type:[String,Number],default:15},textStyle:{type:Object,default:()=>({})},text:{type:[String,Number],default:""},timingFunction:{type:String,default:"linear"},duration:{type:[String,Number],default:1200},inactiveColor:{type:String,default:""},...null==(i=null==(t=uni.$uv)?void 0:t.props)?void 0:i.loadingIcon}}],data:()=>({array12:Array.from({length:12}),aniAngel:360,webviewHide:!1,loading:!1}),computed:{otherBorderColor(){const t=o(this.color,"#ffffff",100)[80];return"circle"===this.mode?this.inactiveColor?this.inactiveColor:t:"transparent"}},watch:{show(t){}},mounted(){this.init()},methods:{init(){setTimeout((()=>{}),20)},addEventListenerToWebview(){const t=a(),i=t[t.length-1].$getAppWebview();i.addEventListener("hide",(()=>{this.webviewHide=!0})),i.addEventListener("show",(()=>{this.webviewHide=!1}))}}},[["render",function(t,i,e,n,o,a){const S=g,w=v;return t.show?(s(),r(S,{key:0,class:d(["uv-loading-icon",[t.vertical&&"uv-loading-icon--vertical"]]),style:h([t.$uv.addStyle(t.customStyle)])},{default:l((()=>[o.webviewHide?f("",!0):(s(),r(S,{key:0,class:d(["uv-loading-icon__spinner",[`uv-loading-icon__spinner--${t.mode}`]]),ref:"ani",style:h({color:t.color,width:t.$uv.addUnit(t.size),height:t.$uv.addUnit(t.size),borderTopColor:t.color,borderBottomColor:a.otherBorderColor,borderLeftColor:a.otherBorderColor,borderRightColor:a.otherBorderColor,"animation-duration":`${t.duration}ms`,"animation-timing-function":"semicircle"===t.mode||"circle"===t.mode?t.timingFunction:""})},{default:l((()=>["spinner"===t.mode?(s(!0),m(c,{key:0},u(o.array12,((t,i)=>(s(),r(S,{key:i,class:"uv-loading-icon__dot"})))),128)):f("",!0)])),_:1},8,["class","style"])),t.text?(s(),r(w,{key:1,class:"uv-loading-icon__text",style:h([{fontSize:t.$uv.addUnit(t.textSize),color:t.textColor},t.$uv.addStyle(t.textStyle)])},{default:l((()=>[p(y(t.text),1)])),_:1},8,["style"])):f("",!0)])),_:1},8,["style","class"])):f("",!0)}],["__scopeId","data-v-3dff3dce"]]);class b{constructor(t,i){this.options=t,this.animation=S({...t}),this.currentStepAnimates={},this.next=0,this.$=i}_nvuePushAnimates(t,i){let e=this.currentStepAnimates[this.next],n={};if(n=e||{styles:{},config:{}},_.includes(t)){n.styles.transform||(n.styles.transform="");let e="";"rotate"===t&&(e="deg"),n.styles.transform+=`${t}(${i+e}) `}else n.styles[t]=`${i}`;this.currentStepAnimates[this.next]=n}_animateRun(t={},i={}){let e=this.$.$refs.ani.ref;if(e)return new Promise(((n,o)=>{nvueAnimation.transition(e,{styles:t,...i},(t=>{n()}))}))}_nvueNextAnimate(t,i=0,e){let n=t[i];if(n){let{styles:o,config:a}=n;this._animateRun(o,a).then((()=>{i+=1,this._nvueNextAnimate(t,i,e)}))}else this.currentStepAnimates={},"function"==typeof e&&e(),this.isEnd=!0}step(t={}){return this.animation.step(t),this}run(t){this.$.animationData=this.animation.export(),this.$.timer=setTimeout((()=>{"function"==typeof t&&t()}),this.$.durationTime)}}const _=["matrix","matrix3d","rotate","rotate3d","rotateX","rotateY","rotateZ","scale","scale3d","scaleX","scaleY","scaleZ","skew","skewX","skewY","translate","translate3d","translateX","translateY","translateZ"];function C(t,i){if(i)return clearTimeout(i.timer),new b(t,i)}_.concat(["opacity","backgroundColor"],["width","height","left","right","top","bottom"]).forEach((t=>{b.prototype[t]=function(...i){return this.animation[t](...i),this}}));const k=$({name:"uv-transition",mixins:[e,n],emits:["click","change"],props:{show:{type:Boolean,default:!1},mode:{type:[Array,String,null],default:()=>"fade"},duration:{type:[String,Number],default:300},timingFunction:{type:String,default:"ease-out"},customClass:{type:String,default:""},cellChild:{type:Boolean,default:!1}},data:()=>({isShow:!1,transform:"",opacity:1,animationData:{},durationTime:300,config:{}}),watch:{show:{handler(t){t?this.open():this.isShow&&this.close()},immediate:!0}},computed:{transformStyles(){const t={transform:this.transform,opacity:this.opacity,...this.$uv.addStyle(this.customStyle),"transition-duration":this.duration/1e3+"s"};return this.$uv.addStyle(t,"string")}},created(){this.config={duration:this.duration,timingFunction:this.timingFunction,transformOrigin:"50% 50%",delay:0},this.durationTime=this.duration},methods:{init(t={}){t.duration&&(this.durationTime=t.duration),this.animation=C(Object.assign(this.config,t),this)},onClick(){this.$emit("click",{detail:this.isShow})},step(t,i={}){if(this.animation){for(let i in t)try{"object"==typeof t[i]?this.animation[i](...t[i]):this.animation[i](t[i])}catch(e){console.error(`方法 ${i} 不存在`)}return this.animation.step(i),this}},run(t){this.animation&&this.animation.run(t)},open(){clearTimeout(this.timer),this.transform="",this.isShow=!0;let{opacity:t,transform:i}=this.styleInit(!1);void 0!==t&&(this.opacity=t),this.transform=i,this.$nextTick((()=>{this.timer=setTimeout((()=>{this.animation=C(this.config,this),this.tranfromInit(!1).step(),this.animation.run(),this.opacity=1,this.$emit("change",{detail:this.isShow})}),20)}))},close(t){this.animation&&this.tranfromInit(!0).step().run((()=>{this.isShow=!1,this.animationData=null,this.animation=null;let{opacity:t,transform:i}=this.styleInit(!1);this.opacity=t||1,this.transform=i,this.$emit("change",{detail:this.isShow})}))},styleInit(t){let i={transform:""},e=(t,e)=>{"fade"===e?i.opacity=this.animationType(t)[e]:i.transform+=this.animationType(t)[e]+" "};return"string"==typeof this.mode?e(t,this.mode):this.mode.forEach((i=>{e(t,i)})),i},tranfromInit(t){let i=(t,i)=>{let e=null;"fade"===i?e=t?0:1:(e=t?"-100%":"0","zoom-in"===i&&(e=t?.8:1),"zoom-out"===i&&(e=t?1.2:1),"slide-right"===i&&(e=t?"100%":"0"),"slide-bottom"===i&&(e=t?"100%":"0")),this.animation[this.animationMode()[i]](e)};return"string"==typeof this.mode?i(t,this.mode):this.mode.forEach((e=>{i(t,e)})),this.animation},animationType:t=>({fade:t?1:0,"slide-top":`translateY(${t?"0":"-100%"})`,"slide-right":`translateX(${t?"0":"100%"})`,"slide-bottom":`translateY(${t?"0":"100%"})`,"slide-left":`translateX(${t?"0":"-100%"})`,"zoom-in":`scaleX(${t?1:.8}) scaleY(${t?1:.8})`,"zoom-out":`scaleX(${t?1:1.2}) scaleY(${t?1:1.2})`}),animationMode:()=>({fade:"opacity","slide-top":"translateY","slide-right":"translateX","slide-bottom":"translateY","slide-left":"translateX","zoom-in":"scale","zoom-out":"scale"}),toLine:t=>t.replace(/([A-Z])/g,"-$1").toLowerCase()}},[["render",function(t,i,e,n,o,a){const m=g;return o.isShow?(s(),r(m,{key:0,ref:"ani",animation:o.animationData,class:d(e.customClass),style:h(a.transformStyles),onClick:a.onClick},{default:l((()=>[w(t.$slots,"default")])),_:3},8,["animation","class","style","onClick"])):f("",!0)}]]);export{k as _,x as a};
|