vue-amazing-ui/lib/modal/Modal.vue2.cjs

An Amazing Vue3 UI Components Library, Using TypeScript.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),m=require("../button/index.cjs"),ee=require("../utils/index.cjs"),te={class:"modal-body"},oe={key:1,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},le={key:2,class:"icon-svg",focusable:"false","data-icon":"info-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},ae={key:3,class:"icon-svg",focusable:"false","data-icon":"check-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},ne={key:4,class:"icon-svg",focusable:"false","data-icon":"close-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true","fill-rule":"evenodd",viewBox:"64 64 896 896"},re={key:5,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},ce={class:"modal-btns"},se={class:"modal-body"},ie={key:1,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},de={key:2,class:"icon-svg",focusable:"false","data-icon":"info-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},ue={key:3,class:"icon-svg",focusable:"false","data-icon":"check-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},me={key:4,class:"icon-svg",focusable:"false","data-icon":"close-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true","fill-rule":"evenodd",viewBox:"64 64 896 896"},ve={key:5,class:"icon-svg",focusable:"false","data-icon":"exclamation-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},fe={class:"modal-btns"},pe=e.defineComponent({__name:"Modal",props:{width:{default:420},icon:{default:void 0},title:{default:void 0},titleStyle:{default:()=>({})},content:{default:void 0},contentStyle:{default:()=>({})},bodyClass:{default:void 0},bodyStyle:{default:()=>({})},cancelText:{default:"取消"},cancelProps:{default:()=>({})},okText:{default:"确定"},okType:{default:"primary"},okProps:{default:()=>({})},noticeText:{default:"知道了"},noticeProps:{default:()=>({})},destroyOnClose:{type:Boolean,default:!1},centered:{type:Boolean,default:!1},top:{default:100},transformOrigin:{default:"mouse"},confirmLoading:{type:Boolean,default:!1},blockScroll:{type:Boolean,default:!0},keyboard:{type:Boolean,default:!0},maskClosable:{type:Boolean,default:!0},maskStyle:{default:()=>({})}},emits:["update:open","cancel","ok","know"],setup(K,{expose:R,emit:W}){const k=K,h=e.ref(),s=e.ref(null),c=e.ref(!1),y=e.ref(!1),i=e.ref(!1),d=e.ref("50% 50%"),n=e.ref(),l=e.ref(),{colorPalettes:q}=ee.useInject("Modal"),v=W,g=e.computed(()=>{const t=a("width");return typeof t=="number"?`${t}px`:t}),Y=e.computed(()=>{const t=a("top");return typeof t=="number"?`${t}px`:t}),w=e.computed(()=>a("centered")),j=e.computed(()=>w.value?{width:g.value,transformOrigin:d.value}:{width:g.value,top:Y.value,transformOrigin:d.value}),C=e.computed(()=>a("titleStyle")),B=e.computed(()=>a("contentStyle")),V=e.computed(()=>a("bodyClass")),S=e.computed(()=>a("bodyStyle")),F=e.computed(()=>a("maskStyle")),f=e.computed(()=>a("icon")),x=e.computed(()=>a("title")),z=e.computed(()=>a("content")),N=e.computed(()=>a("cancelText")),E=e.computed(()=>a("cancelProps")),b=e.computed(()=>a("okType")),T=e.computed(()=>a("okText")),M=e.computed(()=>a("okProps")),O=e.computed(()=>a("noticeText")),P=e.computed(()=>a("noticeProps")),$=e.computed(()=>a("destroyOnClose"));e.watch(c,async t=>{const o=a("blockScroll");t?(await e.nextTick(),h.value.focus(),o&&(document.documentElement.style.overflowY="hidden",document.body.style.overflowY="hidden")):o&&(document.documentElement.style.removeProperty("overflow-y"),document.body.style.removeProperty("overflow-y"))},{immediate:!0}),e.watchEffect(()=>{i.value=k.confirmLoading}),e.onMounted(()=>{document.addEventListener("click",D,!0)}),e.onUnmounted(()=>{document.removeEventListener("click",D,!0)});function D(t){c.value||(s.value={x:t.clientX,y:t.clientY})}async function H(t){if(y.value=!0,await e.nextTick(),a("transformOrigin")==="mouse"&&s.value){const r=t.getBoundingClientRect();d.value=`${s.value.x-r.left}px ${s.value.y-r.top}px`}else d.value="50% 50%"}function I(t){if(a("transformOrigin")==="mouse"&&s.value){const r=t.getBoundingClientRect();d.value=`${s.value.x-r.left}px ${s.value.y-r.top}px`}else d.value="50% 50%"}function A(){y.value=!1}function a(t){var r;let o=k[t];return((r=n.value)==null?void 0:r[t])!==void 0&&(o=n.value[t]),o}function U(t){l.value="info",n.value=t,u()}function X(t){l.value="success",n.value=t,u()}function G(t){l.value="error",n.value=t,u()}function J(t){l.value="warning",n.value=t,u()}function Q(t){l.value="confirm",n.value=t,u()}function Z(t){l.value="erase",n.value=t,u()}function u(){c.value=!0,v("update:open",!0)}function p(){var t;(t=n.value)!=null&&t.onCancel&&n.value.onCancel(),c.value=!1,v("cancel")}async function L(){var t;(t=n.value)!=null&&t.onOk&&(i.value=!0,await n.value.onOk(),i.value=!1),c.value=!1,v("ok")}function _(){var t;(t=n.value)!=null&&t.onKnow&&n.value.onKnow(),c.value=!1,v("know")}return R({info:U,success:X,error:G,warning:J,confirm:Q,erase:Z}),(t,o)=>(e.openBlock(),e.createElementBlock("div",{class:"m-modal-root",style:e.normalizeStyle(`
      --modal-primary-color: ${e.unref(q)[5]};
      --modal-success-color: #52c41a;
      --modal-error-color: #ff4d4f;
      --modal-warning-color: #faad14;
      --modal-confirm-color: #faad14;
      --modal-erase-color: #faad14;
    `)},[e.createVNode(e.Transition,{name:"fade"},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{class:"modal-mask",style:e.normalizeStyle(F.value)},null,4),[[e.vShow,c.value]])]),_:1}),e.withDirectives(e.createElementVNode("div",{tabindex:"-1",ref_key:"modalWrapRef",ref:h,class:e.normalizeClass(["m-modal-wrap",{"flex-centered":w.value}]),onClick:o[0]||(o[0]=e.withModifiers(r=>a("maskClosable")?p():()=>!1,["self"])),onKeydown:o[1]||(o[1]=e.withKeys(r=>a("keyboard")?p():()=>!1,["esc"]))},[e.createVNode(e.Transition,{name:"zoom","enter-from-class":"zoom-enter","enter-active-class":"zoom-enter","enter-to-class":"zoom-enter zoom-enter-active","leave-from-class":"zoom-leave","leave-active-class":"zoom-leave zoom-leave-active","leave-to-class":"zoom-leave zoom-leave-active",onBeforeEnter:H,onBeforeLeave:I,onAfterLeave:A},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{class:"m-modal",style:e.normalizeStyle(j.value)},[$.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["modal-body-wrap",V.value]),style:e.normalizeStyle(S.value)},[e.createElementVNode("div",te,[e.createElementVNode("div",{class:e.normalizeClass(["modal-header",{[`icon-${l.value}`]:["info","success","error","warning","confirm","erase"].includes(l.value)}])},[e.renderSlot(t.$slots,"icon",{},()=>[f.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value),{key:0,class:"icon-svg"})):l.value==="confirm"||l.value==="erase"?(e.openBlock(),e.createElementBlock("svg",oe,o[2]||(o[2]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"},null,-1),e.createElementVNode("path",{d:"M464 688a48 48 0 1096 0 48 48 0 10-96 0zm24-112h48c4.4 0 8-3.6 8-8V296c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8z"},null,-1)]))):l.value==="info"?(e.openBlock(),e.createElementBlock("svg",le,o[3]||(o[3]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm32 664c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V456c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272zm-32-344a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)]))):l.value==="success"?(e.openBlock(),e.createElementBlock("svg",ae,o[4]||(o[4]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"},null,-1)]))):l.value==="error"?(e.openBlock(),e.createElementBlock("svg",ne,o[5]||(o[5]=[e.createElementVNode("path",{d:"M512 64c247.4 0 448 200.6 448 448S759.4 960 512 960 64 759.4 64 512 264.6 64 512 64zm127.98 274.82h-.04l-.08.06L512 466.75 384.14 338.88c-.04-.05-.06-.06-.08-.06a.12.12 0 00-.07 0c-.03 0-.05.01-.09.05l-45.02 45.02a.2.2 0 00-.05.09.12.12 0 000 .07v.02a.27.27 0 00.06.06L466.75 512 338.88 639.86c-.05.04-.06.06-.06.08a.12.12 0 000 .07c0 .03.01.05.05.09l45.02 45.02a.2.2 0 00.09.05.12.12 0 00.07 0c.02 0 .04-.01.08-.05L512 557.25l127.86 127.87c.04.04.06.05.08.05a.12.12 0 00.07 0c.03 0 .05-.01.09-.05l45.02-45.02a.2.2 0 00.05-.09.12.12 0 000-.07v-.02a.27.27 0 00-.05-.06L557.25 512l127.87-127.86c.04-.04.05-.06.05-.08a.12.12 0 000-.07c0-.03-.01-.05-.05-.09l-45.02-45.02a.2.2 0 00-.09-.05.12.12 0 00-.07 0z"},null,-1)]))):l.value==="warning"?(e.openBlock(),e.createElementBlock("svg",re,o[6]||(o[6]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)]))):e.createCommentVNode("",!0)],!0),e.createElementVNode("div",{class:"modal-title",style:e.normalizeStyle(C.value)},[e.renderSlot(t.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(x.value),1)],!0)],4)],2),e.createElementVNode("div",{class:"modal-content",style:e.normalizeStyle(B.value)},[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(z.value),1)],!0)],4)]),e.createElementVNode("div",ce,[["confirm","erase"].includes(l.value)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(e.unref(m.default),e.mergeProps({class:"mr8",onClick:p},E.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(N.value),1)]),_:1},16),e.createVNode(e.unref(m.default),e.mergeProps({type:b.value,loading:i.value,onClick:L},M.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(T.value),1)]),_:1},16,["type","loading"])],64)):e.createCommentVNode("",!0),["info","success","error","warning"].includes(l.value)?(e.openBlock(),e.createBlock(e.unref(m.default),e.mergeProps({key:1,type:"primary",loading:i.value,onClick:_},P.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(O.value),1)]),_:1},16,["loading"])):e.createCommentVNode("",!0)])],6)),$.value&&c.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["modal-body-wrap",V.value]),style:e.normalizeStyle(S.value)},[e.createElementVNode("div",se,[e.createElementVNode("div",{class:e.normalizeClass(["modal-header",{[`icon-${l.value}`]:["info","success","error","warning","confirm","erase"].includes(l.value)}])},[e.renderSlot(t.$slots,"icon",{},()=>[f.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value),{key:0,class:"icon-svg"})):l.value==="confirm"||l.value==="erase"?(e.openBlock(),e.createElementBlock("svg",ie,o[7]||(o[7]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"},null,-1),e.createElementVNode("path",{d:"M464 688a48 48 0 1096 0 48 48 0 10-96 0zm24-112h48c4.4 0 8-3.6 8-8V296c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8z"},null,-1)]))):l.value==="info"?(e.openBlock(),e.createElementBlock("svg",de,o[8]||(o[8]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm32 664c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V456c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272zm-32-344a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)]))):l.value==="success"?(e.openBlock(),e.createElementBlock("svg",ue,o[9]||(o[9]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"},null,-1)]))):l.value==="error"?(e.openBlock(),e.createElementBlock("svg",me,o[10]||(o[10]=[e.createElementVNode("path",{d:"M512 64c247.4 0 448 200.6 448 448S759.4 960 512 960 64 759.4 64 512 264.6 64 512 64zm127.98 274.82h-.04l-.08.06L512 466.75 384.14 338.88c-.04-.05-.06-.06-.08-.06a.12.12 0 00-.07 0c-.03 0-.05.01-.09.05l-45.02 45.02a.2.2 0 00-.05.09.12.12 0 000 .07v.02a.27.27 0 00.06.06L466.75 512 338.88 639.86c-.05.04-.06.06-.06.08a.12.12 0 000 .07c0 .03.01.05.05.09l45.02 45.02a.2.2 0 00.09.05.12.12 0 00.07 0c.02 0 .04-.01.08-.05L512 557.25l127.86 127.87c.04.04.06.05.08.05a.12.12 0 00.07 0c.03 0 .05-.01.09-.05l45.02-45.02a.2.2 0 00.05-.09.12.12 0 000-.07v-.02a.27.27 0 00-.05-.06L557.25 512l127.87-127.86c.04-.04.05-.06.05-.08a.12.12 0 000-.07c0-.03-.01-.05-.05-.09l-45.02-45.02a.2.2 0 00-.09-.05.12.12 0 00-.07 0z"},null,-1)]))):l.value==="warning"?(e.openBlock(),e.createElementBlock("svg",ve,o[11]||(o[11]=[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z"},null,-1)]))):e.createCommentVNode("",!0)],!0),e.createElementVNode("div",{class:"modal-title",style:e.normalizeStyle(C.value)},[e.renderSlot(t.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(x.value),1)],!0)],4)],2),e.createElementVNode("div",{class:"modal-content",style:e.normalizeStyle(B.value)},[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(z.value),1)],!0)],4)]),e.createElementVNode("div",fe,[["confirm","erase"].includes(l.value)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(e.unref(m.default),e.mergeProps({class:"mr8",onClick:p},E.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(N.value),1)]),_:1},16),e.createVNode(e.unref(m.default),e.mergeProps({type:b.value,loading:i.value,onClick:L},M.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(T.value),1)]),_:1},16,["type","loading"])],64)):e.createCommentVNode("",!0),["info","success","error","warning"].includes(l.value)?(e.openBlock(),e.createBlock(e.unref(m.default),e.mergeProps({key:1,type:"primary",loading:i.value,onClick:_},P.value),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(O.value),1)]),_:1},16,["loading"])):e.createCommentVNode("",!0)])],6)):e.createCommentVNode("",!0)],4),[[e.vShow,c.value]])]),_:3})],34),[[e.vShow,y.value]])],4))}});exports.default=pe;