imperative-modal
Version:
1.npm run build:lib 打包库 2.npm run release 发布到 npm
2 lines (1 loc) • 10.4 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");var _;const I=typeof window<"u",S=t=>typeof t=="string",b=()=>{};I&&((_=window?.navigator)!=null&&_.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function V(t){return typeof t=="function"?t():e.unref(t)}function F(t){return t}function M(t){return e.getCurrentScope()?(e.onScopeDispose(t),!0):!1}function B(t){var o;const n=V(t);return(o=n?.$el)!=null?o:n}const k=I?window:void 0;function g(...t){let o,n,r,p;if(S(t[0])||Array.isArray(t[0])?([n,r,p]=t,o=k):[o,n,r,p]=t,!o)return b;Array.isArray(n)||(n=[n]),Array.isArray(r)||(r=[r]);const f=[],d=()=>{f.forEach(i=>i()),f.length=0},c=(i,v,h,u)=>(i.addEventListener(v,h,u),()=>i.removeEventListener(v,h,u)),l=e.watch(()=>[B(o),V(p)],([i,v])=>{d(),i&&f.push(...n.flatMap(h=>r.map(u=>c(i,h,u,v))))},{immediate:!0,flush:"post"}),m=()=>{l(),d()};return M(m),m}const x=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},N="__vueuse_ssr_handlers__";x[N]=x[N]||{};function L(t={}){const{type:o="page",touch:n=!0,resetOnTouchEnds:r=!1,initialValue:p={x:0,y:0},window:f=k,eventFilter:d}=t,c=e.ref(p.x),l=e.ref(p.y),m=e.ref(null),i=s=>{o==="page"?(c.value=s.pageX,l.value=s.pageY):o==="client"?(c.value=s.clientX,l.value=s.clientY):o==="movement"&&(c.value=s.movementX,l.value=s.movementY),m.value="mouse"},v=()=>{c.value=p.x,l.value=p.y},h=s=>{if(s.touches.length>0){const y=s.touches[0];o==="page"?(c.value=y.pageX,l.value=y.pageY):o==="client"&&(c.value=y.clientX,l.value=y.clientY),m.value="touch"}},u=s=>d===void 0?i(s):d(()=>i(s),{}),a=s=>d===void 0?h(s):d(()=>h(s),{});return f&&(g(f,"mousemove",u,{passive:!0}),g(f,"dragover",u,{passive:!0}),n&&o!=="movement"&&(g(f,"touchstart",a,{passive:!0}),g(f,"touchmove",a,{passive:!0}),r&&g(f,"touchend",v,{passive:!0}))),{x:c,y:l,sourceType:m}}var C;(function(t){t.UP="UP",t.RIGHT="RIGHT",t.DOWN="DOWN",t.LEFT="LEFT",t.NONE="NONE"})(C||(C={}));var P=Object.defineProperty,O=Object.getOwnPropertySymbols,T=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable,E=(t,o,n)=>o in t?P(t,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[o]=n,W=(t,o)=>{for(var n in o||(o={}))T.call(o,n)&&E(t,n,o[n]);if(O)for(var n of O(o))z.call(o,n)&&E(t,n,o[n]);return t};const R={easeInSine:[.12,0,.39,0],easeOutSine:[.61,1,.88,1],easeInOutSine:[.37,0,.63,1],easeInQuad:[.11,0,.5,0],easeOutQuad:[.5,1,.89,1],easeInOutQuad:[.45,0,.55,1],easeInCubic:[.32,0,.67,0],easeOutCubic:[.33,1,.68,1],easeInOutCubic:[.65,0,.35,1],easeInQuart:[.5,0,.75,0],easeOutQuart:[.25,1,.5,1],easeInOutQuart:[.76,0,.24,1],easeInQuint:[.64,0,.78,0],easeOutQuint:[.22,1,.36,1],easeInOutQuint:[.83,0,.17,1],easeInExpo:[.7,0,.84,0],easeOutExpo:[.16,1,.3,1],easeInOutExpo:[.87,0,.13,1],easeInCirc:[.55,0,1,.45],easeOutCirc:[0,.55,.45,1],easeInOutCirc:[.85,0,.15,1],easeInBack:[.36,0,.66,-.56],easeOutBack:[.34,1.56,.64,1],easeInOutBack:[.68,-.6,.32,1.6]};W({linear:F},R);const w=Symbol("ModalContext");function j(){const{x:t,y:o}=L(),n=e.inject(w);if(!n)throw new Error("ProvideContext 未提供,请确保在应用中已提供相应的 ProvideContext!");const{modalReactiveList:r,createModal:p,destroyModal:f}=n,d=e.computed(()=>{const a=r.value.length-1;return r.value[a]});function c(a,s){return p({...s,type:a,pointerX:t.value,pointerY:o.value}),d.value?.promise}const l=a=>c("default",a),m=a=>c("success",a),i=a=>c("warning",a),v=a=>c("error",a),h=a=>c("info",a);function u(a){a?d?.value?.resolve(a):d?.value?.reject("取消"),f()}return{create:l,info:h,success:m,warning:i,error:v,destroy:u}}function $(t=8){return Math.random().toString(16).slice(2,2+t)}const A=e.defineComponent({name:"Info",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"14496",width:"26",height:"26"},[e.createVNode("path",{d:"M512 512m-448 0a448 448 0 1 0 896 0 448 448 0 1 0-896 0Z",fill:"#2196F3","p-id":"14497"},null),e.createVNode("path",{d:"M469.333333 469.333333h85.333334v234.666667h-85.333334z",fill:"#FFFFFF","p-id":"14498"},null),e.createVNode("path",{d:"M512 352m-53.333333 0a53.333333 53.333333 0 1 0 106.666666 0 53.333333 53.333333 0 1 0-106.666666 0Z",fill:"#FFFFFF","p-id":"14499"},null)])}}),Q=e.defineComponent({name:"Success",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"4256",width:"26",height:"26"},[e.createVNode("path",{d:"M512 512m-448 0a448 448 0 1 0 896 0 448 448 0 1 0-896 0Z",fill:"#07C160","p-id":"4257"},null),e.createVNode("path",{d:"M466.7 679.8c-8.5 0-16.6-3.4-22.6-9.4l-181-181.1c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l158.4 158.5 249-249c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3L489.3 670.4c-6 6-14.1 9.4-22.6 9.4z",fill:"#FFFFFF","p-id":"4258"},null)])}}),X=e.defineComponent({name:"Warning",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"17307",width:"26",height:"26"},[e.createVNode("path",{d:"M512 64c247.424 0 448 200.576 448 448S759.424 960 512 960 64 759.424 64 512 264.576 64 512 64z m64 608H448v128h128V672z m32-448H416l64 400h64l64-400z",fill:"#E6960C","p-id":"17308"},null)])}}),Y=e.defineComponent({name:"Error",render(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"15486",width:"26",height:"26"},[e.createVNode("path",{d:"M512 0C229.376 0 0 229.376 0 512s229.376 512 512 512 512-229.376 512-512S794.624 0 512 0z m218.624 672.256c15.872 15.872 15.872 41.984 0 57.856-8.192 8.192-18.432 11.776-29.184 11.776s-20.992-4.096-29.184-11.776L512 569.856l-160.256 160.256c-8.192 8.192-18.432 11.776-29.184 11.776s-20.992-4.096-29.184-11.776c-15.872-15.872-15.872-41.984 0-57.856L454.144 512 293.376 351.744c-15.872-15.872-15.872-41.984 0-57.856 15.872-15.872 41.984-15.872 57.856 0L512 454.144l160.256-160.256c15.872-15.872 41.984-15.872 57.856 0 15.872 15.872 15.872 41.984 0 57.856L569.856 512l160.768 160.256z",fill:"#CF3736","p-id":"15487"},null)])}}),H=e.defineComponent({name:"Close",render(){return e.createVNode("svg",{class:"icon",viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg","p-id":"3779",width:"26",height:"26"},[e.createVNode("path",{d:"M572.16 512l183.466667-183.04a42.666667 42.666667 0 1 0-60.586667-60.586667L512 451.84l-183.04-183.466667a42.666667 42.666667 0 0 0-60.586667 60.586667l183.466667 183.04-183.466667 183.04a42.666667 42.666667 0 0 0 0 60.586667 42.666667 42.666667 0 0 0 60.586667 0l183.04-183.466667 183.04 183.466667a42.666667 42.666667 0 0 0 60.586667 0 42.666667 42.666667 0 0 0 0-60.586667z","p-id":"3780"},null)])}}),D={class:"modal-header"},U={class:"title"},Z={class:"modal_body"},q={class:"confirm_text"},G={class:"close-icon"},K={class:"text"},J={class:"modal_footer"},ee=e.defineComponent({__name:"modalWrap",props:{id:{type:String,required:!0},type:{type:String,default:"default"},title:{type:String,default:"标题"},content:{type:String,default:"默认内容"},mask:{type:Boolean,default:!0},width:{type:Number,default:420},pointerX:{type:Number},pointerY:{type:Number}},setup(t){const{modalReactiveList:o,destroyModal:n}=e.inject(w),r=t,p={info:A,success:Q,warning:X,error:Y},f=e.computed(()=>(console.log(p[r.type]),p[r.type])),d=e.computed(()=>o.value.find(u=>u.id==r.id)),c=e.computed(()=>d.value?.visible),l=e.computed(()=>({opacity:c.value?"1":"0",zIndex:d.value?.zIndex})),m=e.computed(()=>{const u=(document.documentElement.clientWidth-r.width)/2,a=r.pointerX?r.pointerX-u+"px":"0px",s=r.pointerY?r.pointerY-100+"px":"0px";return{width:`${r.width}px`,marginLeft:`-${r.width/2}px`,transform:`scale(${c.value?"1":"0"})`,transformOrigin:`${a} ${s} 0px`}});function i(u){u.target.className==="modal_wrap"&&h()}function v(){d.value.resolve("确认"),n()}function h(){d.value.reject("取消"),n()}return(u,a)=>{const s=e.resolveComponent("el-button");return e.openBlock(),e.createElementBlock("div",{class:"modal_wrap",style:e.normalizeStyle(l.value),onClick:i},[e.createElementVNode("div",{role:"modal",tabindex:"-1",class:"modal_content",style:e.normalizeStyle(m.value)},[e.createElementVNode("div",D,[e.createElementVNode("p",U,e.toDisplayString(t.title),1),e.createElementVNode("i",{class:"close-icon",onClick:h},[e.createVNode(e.unref(H))])]),e.createElementVNode("div",Z,[e.renderSlot(u.$slots,"default",{},void 0,!0)]),t.type!="default"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("div",q,[e.createElementVNode("i",G,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value)))]),e.createElementVNode("span",K,e.toDisplayString(t.content),1)]),e.createElementVNode("div",J,[e.createVNode(s,{type:"default",onClick:h},{default:e.withCtx(()=>a[0]||(a[0]=[e.createTextVNode("取消")])),_:1}),e.createVNode(s,{type:"primary",onClick:v},{default:e.withCtx(()=>a[1]||(a[1]=[e.createTextVNode("确认")])),_:1})])],64)):e.createCommentVNode("",!0)],4)],4)}}});const te=(t,o)=>{const n=t.__vccOpts||t;for(const[r,p]of o)n[r]=p;return n},ne=te(ee,[["__scopeId","data-v-83d69dc2"]]),oe=e.defineComponent({__name:"modalProvider",setup(t){let o=999,n=null;const r=e.ref([]),p=e.computed(()=>r.value.map(l=>{const{component:m,props:i,...v}=l;return{id:v.id,options:v,props:i,component:e.toRaw(m)}}));function f(l){console.log(l),n&&clearTimeout(n);const m=$();let i,v;const h=new Promise((a,s)=>{i=a,v=s}),u={...l,id:m,visible:!1,zIndex:o++,promise:h,resolve:i,reject:v};r.value.push(u),console.log(r),e.nextTick(()=>{const a=r.value.findIndex(s=>s.id==m);r.value[a].visible=!0})}function d(){const l=r.value.length-1;l>-1&&(r.value[l].visible=!1,n=setTimeout(()=>{c(l)},300))}function c(l){r.value.splice(l,1)}return e.provide(w,{modalReactiveList:r,createModal:f,destroyModal:d}),(l,m)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.renderSlot(l.$slots,"default"),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,i=>(e.openBlock(),e.createBlock(ne,e.mergeProps({key:i.id,ref_for:!0},i.options),e.createSlots({_:2},[i.options.type==="default"?{name:"default",fn:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(i.component),e.mergeProps({ref_for:!0},i.props),null,16))]),key:"0"}:void 0]),1040))),128))],64))}});exports.ModalProvider=oe;exports.useModal=j;