portable-dialog-v3/portable-dialog-v3.umd.js

portable-dialog-v3是为了解决页面在使用弹窗时，维护弹窗数据及状态的代码可以单独抽离出来封装，防止页面弹窗过多时，代码维护困难。

(function(n,a){typeof exports=="object"&&typeof module<"u"?module.exports=a(require("vue")):typeof define=="function"&&define.amd?define(["vue"],a):(n=typeof globalThis<"u"?globalThis:n||self,n["portable-dialog-v3"]=a(n.Vue))})(this,function(n){"use strict";var a=document.createElement("style");a.textContent=`.open-dialog-mask{position:fixed;top:0;bottom:0;left:0;right:0;width:100%;background:rgba(22,22,22,.5);z-index:998}.open-dialog-wrapper{height:fit-content;z-index:999;background-color:#fff;position:fixed;animation:portable-dialog-fade-in .2s ease-in-out 1}.open-dialog-header{height:45px;line-height:45px;display:flex;justify-content:space-between;padding-right:10px;padding-left:10px;cursor:pointer;border-bottom:1px solid #ddd;color:#303133}.open-dialog-full-screen{top:0!important;height:100%!important;width:100%!important;transition:all .5s}@font-face{font-family:iconfont;src:url(data:font/ttf;base64,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) format("truetype")}.iconfont{font-family:iconfont!important;font-size:24px;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-close:before{content:"\\e668"}.icon-fullscreen-shrink:before{content:"\\e676"}.icon-fullscreen-expand:before{content:"\\e675"}
`,document.head.appendChild(a);const w="",I="",u={top:"10vh",closeAnimation:!1,hiddenHeader:!1,title:"",fullScreen:!1,hiddenZoomIcon:!1,hiddenCloseIcon:!1,cancelCallback:()=>{},okCallback:async()=>!0};function C(h,p={},A=u){let o=null,B=null,r=null,l=null,i=null,t=null,c=null,g=null;const e=document.createElement("div");e.classList.add("open-dialog-wrapper"),document.body.appendChild(e);const d=A.top||"10vh";if(e.style.top=d,e.style.left="50%",e.style.transform="translateX(-50%)",console.log("offsetTop",d),!A.closeAnimation){const s=parseFloat(d),m=String(s).length,b=d.slice(m),D=`@keyframes portable-dialog-fade-in {
        0% {
          top: ${Number(s*.8).toFixed(3)+b};
          left: 50%;
          opacity: 0;
          transform: translateX(-50%);
        }
        100% {
          top: ${d};
          left: 50%;
          opacity: 1;
          transform: translateX(-50%);
        }
      }`;let E=document.createElement("style");E.setAttribute("type","text/css"),E.innerText=D,document.getElementsByTagName("head")[0].appendChild(E)}A.hiddenHeader||(o=document.createElement("div"),o.classList.add("open-dialog-header"),e.appendChild(o),B=document.createElement("div"),B.classList.add("open-dialog-left-header"),o.appendChild(B),r=document.createElement("span"),r.classList.add("open-dialog--left-title"),r.innerText=A.title?A.title:"",B.appendChild(r),l=document.createElement("div"),l.classList.add("open-dialog-right-header"),o.appendChild(l)),A.fullScreen?e.classList.add("open-dialog-full-screen"):(l&&!(A!=null&&A.hiddenZoomIcon)&&(t=document.createElement("span"),t.classList.add("iconfont"),t.classList.add("icon-fullscreen-expand"),l.appendChild(t)),i=document.createElement("div"),i.classList.add("open-dialog-mask"),document.body.append(i)),l&&!(A!=null&&A.hiddenCloseIcon)&&(c=document.createElement("span"),c.classList.add("iconfont"),c.classList.add("icon-close"),l.appendChild(c));const Q=()=>{document.body.removeChild(e),g.unmount(),g=null,i&&document.body.removeChild(i)},G=()=>{Q(),A!=null&&A.cancelCallback&&A.cancelCallback()};c&&c.addEventListener("click",G),t&&t.addEventListener("click",()=>{e.classList.value.includes("open-dialog-full-screen")?(t.classList.remove("icon-fullscreen-shrink"),t.classList.add("icon-fullscreen-expand"),e.classList.remove("open-dialog-full-screen")):(e.classList.add("open-dialog-full-screen"),t.classList.remove("icon-fullscreen-expand"),t.classList.add("icon-fullscreen-shrink"))});const f=document.createElement("div");e.appendChild(f),g=n.createApp(n.h(h,Object.assign({onOk:async(s={})=>{if(A!=null&&A.okCallback)try{await A.okCallback(s)&&Q()}catch(m){console.error(m)}}},p))),g.mount(f)}return C});