1 line
12 KiB
JavaScript
1 line
12 KiB
JavaScript
|
"use strict";import "../drag/index.js";importCss("/css/layer-normal.css");Anot.ui.layer="1.0.0-normal";const LANGUAGES={en:{TITLE:"Dialog",YES_BTN:"OK",NO_BTN:"Cancel",ERROR:"The layer instance is not exists",NEED_CONTAINER:'layer "tips" require a DOM object as container'},zh:{TITLE:"提示",YES_BTN:"确定",NO_BTN:"取消",ERROR:"要关闭的layer实例不存在",NEED_CONTAINER:"tips类型需要指定一个元素节点作为容器"},"zh-TW":{TITLE:"提示",YES_BTN:"確定",NO_BTN:"取消",ERROR:"要關閉的layer實例不存在",NEED_CONTAINER:"tips类型需要指定一個元素節點作爲容器"}};LANGUAGES["zh-CN"]=LANGUAGES.zh;const lang=LANGUAGES[window.__ENV_LANG__||navigator.language]||LANGUAGES.en;let layerDom={},layerObj={},unique=null,lid=0,defconf={type:1,background:"#fff",mask:!0,maskClose:!1,maskColor:null,radius:"0px",area:["auto","auto"],title:lang.TITLE,menubar:!0,content:"",fixed:!1,shift:"cc",offset:[],btns:[lang.YES_BTN,lang.NO_BTN]};const $doc=Anot(document),uuid=function(){return"layer-"+lid++},close=function(e){if("string"!=typeof e&&"number"!=typeof e)return Anot.error(lang.ERROR);if(/^layerwrap\-/.test(e)||layerObj["layerwrap-"+e])try{if(e=(layerObj["layerwrap-"+e]?"layerwrap-":"")+e,!layerObj[e].show)return;layerObj[e].parentElem.replaceChild(layerObj[e].wrap,layerDom[e][0]),layerObj[e].wrap.style.display="none",layerObj[e].show=!1}catch(e){}else{unique=null;try{layerDom[e][0].classList.add("shift"),layerDom[e][1].classList.add("shift"),layerDom[e][0].style.opacity="",layerDom[e][1].style.opacity=0,setTimeout(function(){layerDom[e][0].parentNode.removeChild(layerDom[e][0]),delete layerDom[e],delete Anot.vmodels[e]},200)}catch(e){}}document.body.style.overflow=""},repeat=function(e,t){let o=0,s="";for(;o<t;)s+=e,o++;return s},fixOffset=function(e){return e||0===e?e:"auto"};class __layer__{get dot(){return{1:1,2:1,3:5,4:5,5:9}}constructor(e){if(e){let{yes:t,no:o,success:s}=e;delete e.yes,delete e.no,delete e.success,this.__init__({state:{...e},props:{yes:t,no:o,success:s}}).append().show()}this.timeout=null}__init__(e){let t=e.$id||uuid();return this.init={$id:t,state:{...defconf,...e.state},props:e.props,skip:["area","shift","offset","mask","maskClose","container","follow"],methods:{shake(){this.$refs.layer.classList.add("scale"),setTimeout(()=>{this.$refs.layer.classList.remove("scale")},100)},onMaskClick:function(){this.type<4&&!this.maskClose?this.shake():this.maskClose&&this.close()},handleConfirm:function(){if(3===this.type&&!this.prompt)return this.shake();if("function"==typeof this.props.yes){let e=[this.$id];3===this.type&&e.unshift(this.prompt),this.props.yes.apply(this,e)}else this.close()},handleCancel:function(){"function"==typeof this.props.no?this.props.no.call(this,this.$id):this.close()},close:function(){close(this.$id)},cancelBubble:function(e){e.cancelBubble=!0}},mounted:function(){"function"==typeof this.props.success&&this.props.success.call(this)}},4===this.init.state.type&&(this.init.methods.autoSize=function(){let{layer:e,frame:t}=this.$refs;t.onload=function(){setTimeout(function(){try{let o=t.contentWindow.document.body,{clientWidth:s,clientHeight:n}=o;Anot(e).css({width:s,height:n,marginLeft:-s/2,marginTop:-n/2}),Anot(t).css({height:n})}catch(e){}},500)}}),this}create(){let{state:e,$id:t}=this.init,o=document.createElement("div"),s=document.createElement("div");if(o.setAttribute("anot",t),o.setAttribute(":click","onMaskClick"),o.classList.add("do-layer"),e.mask&&(o.classList.add("mask"),e.container&&e.container!==document.body&&o.classList.add("inner")),e.maskColor&&(o.style.background=e.maskColor),s.classList.add("layer-box"),s.classList.add("skin-normal"),e.extraClass&&(s.classList.add(e.extraClass),delete e.extraClass),"string"==typeof e.shift)s.classList.add("__"+e.shift);else for(let t in e.shift){let o=e.shift[t];o+=isFinite(o)?"px":"",s.style.cssText+=`${t}: ${o};`}e.toast?s.classList.add("type-toast"):s.classList.add("type-"+e.type),s.setAttribute("ref","layer"),s.setAttribute(":click","cancelBubble"),s.style.cssText+="border-radius:"+e.radius+"px",e.menubar||e.
|