vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
12 lines (11 loc) • 2.53 kB
JavaScript
;const c=require("@vuux/utils");class l{static list=[];static install;static createMessage(t){const{type:s,content:i,duration:e=2e3}=t,a=document.createElement("div");return a.classList.add("app-message"),a.style.top=`${l.list.length*50+20}px`,s==="success"?a.innerHTML=`
<div class="message-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g fill="none"><path d="m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z"/><path fill="var(--app-success)" d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12S6.477 2 12 2m3.535 6.381l-4.95 4.95l-2.12-2.121a1 1 0 0 0-1.415 1.414l2.758 2.758a1.1 1.1 0 0 0 1.556 0l5.586-5.586a1 1 0 0 0-1.415-1.415"/></g></svg>
</div>
<div class="message-content">${i}</div>
`:a.innerHTML=`
<div class="message-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="var(--app-danger)" d="m12 13.4l2.9 2.9q.275.275.7.275t.7-.275t.275-.7t-.275-.7L13.4 12l2.9-2.9q.275-.275.275-.7t-.275-.7t-.7-.275t-.7.275L12 10.6L9.1 7.7q-.275-.275-.7-.275t-.7.275t-.275.7t.275.7l2.9 2.9l-2.9 2.9q-.275.275-.275.7t.275.7t.7.275t.7-.275zm0 8.6q-2.075 0-3.9-.788t-3.175-2.137T2.788 15.9T2 12t.788-3.9t2.137-3.175T8.1 2.788T12 2t3.9.788t3.175 2.137T21.213 8.1T22 12t-.788 3.9t-2.137 3.175t-3.175 2.138T12 22"/></svg>
</div>
<div class="message-content">${i}</div>
`,{message:a,duration:e}}static remove(t){const s=l.list.indexOf(t);if(s>=0){l.list.splice(s,1),document.body.removeChild(t);for(let i=0;i<l.list.length;i++)l.list[i].style.top=`${i*50+20}px`}}static async autoClose(t,s){await c.Utils.wait(s),t.classList.add("is-hide"),await c.Utils.wait(300),l.remove(t)}static add(t,s){l.list.push(t),document.body.appendChild(t),l.autoClose(t,s)}static success(t,s=2e3){const{message:i,duration:e}=l.createMessage({type:"success",content:t,duration:s});l.add(i,e)}static error(t,s=2e3){const{message:i,duration:e}=l.createMessage({type:"error",content:t,duration:s});l.add(i,e)}}module.exports=l;