vue-devui 1.0.0-rc.8 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +188 -149
- package/alert/index.es.js +14 -9
- package/alert/index.umd.js +1 -1
- package/alert/style.css +1 -1
- package/auto-complete/index.es.js +8392 -418
- package/auto-complete/index.umd.js +29 -5
- package/auto-complete/style.css +1 -1
- package/avatar/index.es.js +59 -74
- package/avatar/index.umd.js +1 -1
- package/badge/index.es.js +10 -4
- package/badge/index.umd.js +1 -1
- package/badge/style.css +1 -1
- package/button/index.es.js +191 -53
- package/button/index.umd.js +17 -17
- package/button/style.css +1 -1
- package/card/index.es.js +7 -3
- package/card/index.umd.js +1 -1
- package/card/style.css +1 -1
- package/checkbox/index.es.js +8050 -241
- package/checkbox/index.umd.js +27 -1
- package/checkbox/style.css +1 -1
- package/{date-picker → collapse}/index.d.ts +0 -0
- package/collapse/index.es.js +213 -0
- package/collapse/index.umd.js +1 -0
- package/{date-picker → collapse}/package.json +1 -1
- package/collapse/style.css +1 -0
- package/countdown/index.es.js +56 -13
- package/countdown/index.umd.js +1 -1
- package/date-picker-pro/index.d.ts +7 -0
- package/date-picker-pro/index.es.js +12022 -0
- package/date-picker-pro/index.umd.js +27 -0
- package/date-picker-pro/package.json +7 -0
- package/date-picker-pro/style.css +1 -0
- package/drawer/index.es.js +24 -7
- package/drawer/index.umd.js +1 -1
- package/drawer/style.css +1 -1
- package/dropdown/index.es.js +190 -165
- package/dropdown/index.umd.js +1 -1
- package/dropdown/style.css +1 -1
- package/editable-select/index.es.js +785 -145
- package/editable-select/index.umd.js +1 -1
- package/editable-select/style.css +1 -1
- package/form/index.es.js +399 -300
- package/form/index.umd.js +16 -16
- package/form/style.css +1 -1
- package/fullscreen/index.es.js +2 -2
- package/fullscreen/index.umd.js +1 -1
- package/grid/index.es.js +8 -6
- package/grid/index.umd.js +1 -1
- package/icon/index.es.js +185 -23
- package/icon/index.umd.js +1 -1
- package/icon/style.css +1 -0
- package/image-preview/index.es.js +2 -2
- package/image-preview/index.umd.js +1 -1
- package/image-preview/style.css +1 -1
- package/input/index.es.js +8220 -45
- package/input/index.umd.js +27 -1
- package/input/style.css +1 -1
- package/input-number/index.es.js +279 -204
- package/input-number/index.umd.js +1 -1
- package/input-number/style.css +1 -1
- package/layout/index.es.js +3 -3
- package/layout/index.umd.js +1 -1
- package/loading/index.es.js +53 -53
- package/loading/index.umd.js +1 -1
- package/loading/style.css +1 -1
- package/mention/index.d.ts +7 -0
- package/mention/index.es.js +8319 -0
- package/mention/index.umd.js +36 -0
- package/mention/package.json +7 -0
- package/mention/style.css +1 -0
- package/menu/index.d.ts +7 -0
- package/menu/index.es.js +921 -0
- package/menu/index.umd.js +1 -0
- package/menu/package.json +7 -0
- package/menu/style.css +1 -0
- package/message/index.d.ts +7 -0
- package/message/index.es.js +539 -0
- package/message/index.umd.js +1 -0
- package/message/package.json +7 -0
- package/message/style.css +1 -0
- package/modal/index.es.js +451 -173
- package/modal/index.umd.js +1 -1
- package/modal/style.css +1 -1
- package/notification/index.es.js +212 -70
- package/notification/index.umd.js +1 -1
- package/notification/style.css +1 -1
- package/nuxt/components/CheckboxButton.js +3 -0
- package/nuxt/components/Collapse.js +3 -0
- package/nuxt/components/CollapseItem.js +3 -0
- package/nuxt/components/DRangeDatePickerPro.js +3 -0
- package/nuxt/components/DatePickerPro.js +3 -0
- package/nuxt/components/Icon.js +1 -0
- package/nuxt/components/IconGroup.js +3 -0
- package/nuxt/components/LABEL_DATA.js +3 -0
- package/nuxt/components/Mention.js +3 -0
- package/nuxt/components/Menu.js +3 -0
- package/nuxt/components/MenuItem.js +3 -0
- package/nuxt/components/Message.js +3 -0
- package/nuxt/components/Option.js +3 -0
- package/nuxt/components/OptionGroup.js +3 -0
- package/nuxt/components/RadioButton.js +3 -0
- package/nuxt/components/Step.js +3 -0
- package/nuxt/components/Steps.js +3 -0
- package/nuxt/components/SubMenu.js +3 -0
- package/nuxt/components/TABLE_TOKEN.js +3 -0
- package/nuxt/components/TimePicker.js +3 -0
- package/nuxt/components/TimeSelect.js +3 -0
- package/nuxt/components/animationInjectionKey.js +3 -0
- package/nuxt/components/collapseItemProps.js +3 -0
- package/nuxt/components/collapseProps.js +3 -0
- package/nuxt/components/datePickerProCommonProps.js +3 -0
- package/nuxt/components/datePickerProPanelProps.js +3 -0
- package/nuxt/components/datePickerProProps.js +3 -0
- package/nuxt/components/iconProps.js +1 -0
- package/nuxt/components/mentionProps.js +3 -0
- package/nuxt/components/messageProps.js +3 -0
- package/nuxt/components/paginationInjectionKey.js +3 -0
- package/nuxt/components/roundInjectionKey.js +3 -0
- package/nuxt/components/skeletonItemProps.js +3 -0
- package/nuxt/components/stepProps.js +3 -0
- package/nuxt/components/stepsProps.js +3 -0
- package/nuxt/components/svgIconProps.js +3 -0
- package/nuxt/components/tableProps.js +3 -0
- package/nuxt/components/timerPickerPanelProps.js +3 -0
- package/nuxt/components/treeNodeProps.js +3 -0
- package/overlay/index.es.js +89 -142
- package/overlay/index.umd.js +1 -1
- package/overlay/style.css +1 -1
- package/package.json +8 -4
- package/pagination/index.es.js +10180 -129
- package/pagination/index.umd.js +27 -1
- package/pagination/style.css +1 -1
- package/panel/index.es.js +4 -0
- package/panel/index.umd.js +1 -1
- package/panel/style.css +1 -1
- package/popover/index.es.js +262 -229
- package/popover/index.umd.js +15 -15
- package/popover/style.css +1 -1
- package/progress/index.es.js +2 -2
- package/progress/index.umd.js +2 -2
- package/progress/style.css +1 -1
- package/radio/index.es.js +7954 -156
- package/radio/index.umd.js +27 -1
- package/radio/style.css +1 -1
- package/rate/index.es.js +16 -8
- package/rate/index.umd.js +1 -1
- package/rate/style.css +1 -1
- package/result/index.es.js +170 -22
- package/result/index.umd.js +1 -1
- package/result/style.css +1 -1
- package/search/index.es.js +3829 -1042
- package/search/index.umd.js +18 -18
- package/search/style.css +1 -1
- package/select/index.es.js +9202 -495
- package/select/index.umd.js +27 -1
- package/select/style.css +1 -1
- package/skeleton/index.es.js +89 -263
- package/skeleton/index.umd.js +1 -1
- package/skeleton/style.css +1 -1
- package/slider/index.es.js +118 -145
- package/slider/index.umd.js +1 -1
- package/slider/style.css +1 -1
- package/splitter/index.es.js +454 -233
- package/splitter/index.umd.js +13 -13
- package/splitter/style.css +1 -1
- package/statistic/index.es.js +34 -16
- package/statistic/index.umd.js +1 -1
- package/statistic/style.css +1 -1
- package/status/index.es.js +6 -2
- package/status/index.umd.js +1 -1
- package/status/style.css +1 -1
- package/steps/index.d.ts +7 -0
- package/steps/index.es.js +387 -0
- package/steps/index.umd.js +1 -0
- package/steps/package.json +7 -0
- package/steps/style.css +1 -0
- package/style.css +1 -1
- package/switch/index.es.js +7787 -62
- package/switch/index.umd.js +27 -1
- package/switch/style.css +1 -1
- package/table/index.es.js +5225 -1726
- package/table/index.umd.js +18 -18
- package/table/style.css +1 -1
- package/tabs/index.es.js +303 -102
- package/tabs/index.umd.js +1 -1
- package/tabs/style.css +1 -1
- package/tag/index.es.js +11 -8
- package/tag/index.umd.js +1 -1
- package/tag/style.css +1 -1
- package/textarea/index.es.js +7876 -41
- package/textarea/index.umd.js +35 -1
- package/textarea/style.css +1 -1
- package/time-picker/index.d.ts +7 -0
- package/time-picker/index.es.js +9549 -0
- package/time-picker/index.umd.js +27 -0
- package/time-picker/package.json +7 -0
- package/time-picker/style.css +1 -0
- package/time-select/index.d.ts +7 -0
- package/time-select/index.es.js +9607 -0
- package/time-select/index.umd.js +27 -0
- package/time-select/package.json +7 -0
- package/time-select/style.css +1 -0
- package/timeline/index.es.js +170 -22
- package/timeline/index.umd.js +1 -1
- package/timeline/style.css +1 -1
- package/tooltip/index.es.js +286 -238
- package/tooltip/index.umd.js +14 -14
- package/tooltip/style.css +1 -1
- package/tree/index.es.js +11342 -793
- package/tree/index.umd.js +27 -1
- package/tree/style.css +1 -1
- package/upload/index.es.js +458 -102
- package/upload/index.umd.js +1 -1
- package/upload/style.css +1 -1
- package/vue-devui.es.js +20475 -11072
- package/vue-devui.umd.js +31 -24
- package/date-picker/index.es.js +0 -1097
- package/date-picker/index.umd.js +0 -1
- package/date-picker/style.css +0 -1
- package/nuxt/components/DatePicker.js +0 -3
- package/nuxt/components/FormControl.js +0 -3
- package/nuxt/components/FormLabel.js +0 -3
- package/nuxt/components/Loading.js +0 -3
- package/nuxt/components/StickSlider.js +0 -3
- package/nuxt/components/formControlProps.js +0 -3
- package/nuxt/components/overlayEmits.js +0 -3
- package/nuxt/components/overlayProps.js +0 -3
|
@@ -0,0 +1 @@
|
|
|
1
|
+
var Ee=Object.defineProperty;var Ce=(m,n,S)=>n in m?Ee(m,n,{enumerable:!0,configurable:!0,writable:!0,value:S}):m[n]=S;var ae=(m,n,S)=>(Ce(m,typeof n!="symbol"?n+"":n,S),S);(function(m,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(m=typeof globalThis!="undefined"?globalThis:m||self,n(m.index={},m.Vue))})(this,function(m,n){"use strict";function S(e,a,t){let s=e;return a&&(s+=`__${a}`),t&&(s+=`--${t}`),s}function E(e,a=!1){const t=a?`.devui-${e}`:`devui-${e}`;return{b:()=>S(t),e:u=>u?S(t,u):"",m:u=>u?S(t,"",u):"",em:(u,f)=>u&&f?S(t,u,f):""}}const J=[];let K=[];const U=n.ref(24),_=E("menu"),le=E("submenu"),B=_.b(),Q=`${_.b()}-item-horizontal-wrapper`,X=`${_.b()}-item-select`,Y=`${_.b()}-active-parent`;function oe(e){U.value=e}function ie(e){J.push(e)}function re(){K=[],J.forEach(t=>{K.push(t.el.parentElement)});const e=[...K],a=t=>{var s;return(s=/layer_(\d*)/gim.exec(t))==null?void 0:s[1]};for(;e.length;){const t=e.shift();if(t==null?void 0:t.classList.contains(B)){const s=t.children;e.unshift(...Array.from(s));continue}else{if(t.tagName==="DIV")if(t.classList.contains(`${_.b()}-item-vertical-wrapper`)||t.classList.contains(`${le.b()}-menu-item-vertical-wrapper`)){const s=t.parentElement;if(e.unshift(...Array.from(t.children)),s==null?void 0:s.classList.contains(B))t.classList.add("layer_1");else{let l=a((s==null?void 0:s.classList.value)||"");l=Number(l),t.classList.add(`layer_${l}`)}}else{const s=t.parentElement;let l=a((s==null?void 0:s.classList.value)||"");l=Number(l),t.classList.add(`layer_${l}`),t.style.paddingLeft=`${(l===2?1:l-1)*U.value}px`}if(t.tagName==="UL"){const s=t.parentElement,l=t.children;for(let u=0;u<l.length;u++)e.unshift(l[u]);const i=(s==null?void 0:s.classList.value)||"";let d=a(i);(s==null?void 0:s.classList.contains(B))?(d=1,t.classList.add(`layer_${2}`)):(t.classList.add(`layer_${Number(d)+1}`),d=Number(d)+1)}if(t.tagName==="LI"){const s=t.parentElement,l=(s==null?void 0:s.classList.value)||"";let i=a(l);a(l),i=Number(i),t.style.padding=`0 ${i*U.value}px`}}}}function ce(e){var s;const a=e;let t=null;for(let l=0;l<a.length;l++){const i=a[l];((s=i==null?void 0:i.classList)==null?void 0:s.contains(`${_.b()}-horizontal`))&&(t=i)}return t}function de(e,a){let t=a.target,s=[];const{path:l}=a,i=ce(l);for(s=[...Array.from(i.children)],t.tagName==="SPAN"&&(t=t.parentElement);s.length;){const d=s.shift();if((d==null?void 0:d.tagName)==="UL"||(d==null?void 0:d.classList.contains(Q))){const u=d==null?void 0:d.children;s.unshift(...Array.from(u))}d!==t&&(d==null||d.classList.remove(X),d==null||d.classList.remove(Y))}}function ue(e,a){const t=[],s=a.path||a.composedPath&&a.composedPath();for(let l=0;l<s.length;l++){const i=s[l];if(!i.classList.contains(B))t.push(...Array.from(i.children));else{t.push(...Array.from(i.children));break}}for(;t.length;){const l=t.shift();((l==null?void 0:l.tagName)==="UL"||(l==null?void 0:l.classList.contains(Q)))&&t.push(...Array.from(l==null?void 0:l.children)),l!==e&&((l==null?void 0:l.tagName)==="DIV"&&t.unshift(...Array.from(l==null?void 0:l.children)),l==null||l.classList.remove(X),l==null||l.classList.remove(Y))}}function Z(e,a,t=!1){t?de(e,a):ue(e,a)}function fe(e){var s;const a=/layer_(\d{1,})/gim,t=e.className;return(s=a.exec(t))==null?void 0:s[1]}const me={disabled:{type:Boolean,default:!1},href:{type:String,default:""},route:{type:[String,Object]}},ee=E("menu");function te(e,a,t,s){const l=n.ref(!1);return t?e.includes(a)?l.value=!0:l.value=!1:e[0]===a&&!s.value?l.value=!0:l.value=!1,l.value}function pe(e){var t,s;let a=e.parentElement;for(;!a.classList.contains(ee.b());)((t=a.firstElementChild)==null?void 0:t.tagName)==="DIV"&&((s=a==null?void 0:a.firstElementChild)==null||s.classList.add(`${ee.b()}-active-parent`)),a=a.parentElement;return a}function he(e,a,t,s){if(t&&a){const l=e.route||s,i=a.push(l).then(d=>d);return{route:l,routerResult:i}}}const W=E("menu");function ne(e){const a=e.path;for(let t=0;t<a.length;t++){const s=a[t];if(s.classList.contains(`${W.b()}-horizontal`))break;if(s.classList.contains(`${W.b()}-item-horizontal-wrapper`))continue;s.tagName!=="SPAN"&&s.classList.add(`${W.b()}-item-select`)}}const T=E("menu"),x=`${T.b()}-item-select`,ge=`${T.b()}-item-disabled`;var q=n.defineComponent({name:"DMenuItem",props:me,setup(e,a){var c,p;const t=n.getCurrentInstance(),s=String(t==null?void 0:t.vnode.key),l=n.inject("menuStore"),i=n.inject("mode"),d=n.inject("multiple"),u=n.inject("defaultIndent"),f=n.inject("isCollapsed"),g=n.inject("defaultSelectKey"),{disabled:M}=n.toRefs(e),$=n.ref(te(g,s,d,M)),y=n.ref(!0),N=n.inject("rootMenuEmit"),z=n.inject("useRouter"),w=t==null?void 0:t.appContext.config.globalProperties.$router,L=n.computed(()=>({[`${T.b()}-item`]:!0,[`${T.b()}-item-isCollapsed`]:f.value,[x]:$.value,[ge]:M.value}));l.on("menuItem:clear:select",()=>{$.value=!1});const A=r=>{var v;r.stopPropagation();const o=r.currentTarget;let h;if(!e.disabled){if(!d)l.emit("menuItem:clear:select"),Z(o,r,i.value==="horizontal"),i.value==="horizontal"&&ne(r),$.value=!0,h=he(e,w,z,s);else if(o.classList.contains(x)){N("deselect",{type:"deselect",key:s,el:o,e:r}),$.value=!1;return}else $.value=!0,o.classList.add(x);h===void 0?N("select",{type:"select",key:s,el:o,e:r}):N("select",{type:"select",key:s,el:o,e:r,route:h})}if(i.value==="vertical"){const D=r.currentTarget;pe(D)}if(i.value==="horizontal"){const D=(v=o.parentElement)==null?void 0:v.parentElement;D==null||D.classList.add(`${T.b()}-active-parent`)}},P=n.createVNode("span",{class:`${T.b()}-icon`},[(p=(c=a.slots).icon)==null?void 0:p.call(c)]),b=n.ref(null);return n.watch(M,()=>{L.value[x]=!1}),n.watch(()=>g,r=>{$.value=te(r,s,d,M),L.value[x]=$.value}),n.onMounted(()=>{var h,v;let r="";const o=b.value;i.value==="vertical"&&(((v=(h=o.parentElement)==null?void 0:h.parentElement)==null?void 0:v.classList.contains(T.b()))?(y.value=!0,y.value&&(o.style.paddingRight="",o.style.paddingLeft=`${u}px`),n.watch(f,D=>{D?(o.style.padding!=="0"&&(r=o.style.padding),setTimeout(()=>{o.style.padding="0",o.style.width="",o.style.textAlign="center"},300),o.style.display="block"):(o.style.padding=`${r}`,o.style.textAlign="",o.style.display="flex")})):y.value=!1)}),()=>i.value==="vertical"?n.createVNode("div",{class:`${T.b()}-item-vertical-wrapper`},[n.createVNode("li",{class:L.value,onClick:A,ref:b},[a.slots.icon!==void 0&&P,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[n.withDirectives(n.createVNode("span",null,[(o=(r=a.slots).default)==null?void 0:o.call(r)]),[[n.vShow,!f.value]])]}}):n.createVNode("a",{href:e.href},[n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[(o=(r=a.slots).default)==null?void 0:o.call(r)]}})])])]):n.createVNode("li",{class:L.value,onClick:A,ref:b},[a.slots.icon!==void 0&&P,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[n.withDirectives(n.createVNode("span",null,[(o=(r=a.slots).default)==null?void 0:o.call(r)]),[[n.vShow,!f.value]])]}}):n.createVNode("a",{href:e.href},[n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[(o=(r=a.slots).default)==null?void 0:o.call(r)]}})])])}});const R=E("menu"),ye=E("submenu"),I=`${R.b()}-item-horizontal-wrapper-hidden`,H=`${R.b()}-item-horizontal-wrapper-show`;function j(e,a,t){const s=a.currentTarget,l=s.parentElement,i=t.children;if(t.style.padding="0 20px !important",e==="mouseenter"){if((l==null?void 0:l.tagName)==="DIV"){t.classList.add(`${R.b()}-item-horizontal-wrapper-level`);const{width:d}=s.getClientRects()[0];t.style.top="0px",t.style.left=`${d}px`}else t.style.top="26px",t.style.left="0px";t.classList.remove(I),t.classList.add(H);for(let d=0;d<i.length;d++){const u=i[d];if(u.tagName==="UL"&&u.classList.contains(ye.b())){const f=u.getElementsByClassName(`${R.b()}-item-horizontal-wrapper`)[0];u.addEventListener("mouseenter",g=>{g.stopPropagation(),j("mouseenter",g,f),f.classList.remove(I),f.classList.add(H)}),u.addEventListener("mouseleave",g=>{g.stopPropagation(),j("mouseleave",g,f),f.classList.remove(H),f.classList.add(I)})}}}e==="mouseleave"&&(t.classList.remove(H),t.classList.add(I))}const be={title:{type:String,default:""},disabled:{type:Boolean,default:!1}},se="0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out",k={"before-enter"(e){e.style.transition=se,e.setAttribute("data-oldPadding",e.style.padding),e.setAttribute("data-oldMargin",e.style.margin),e.style.height="0",e.style.padding="0",e.style.margin="0"},enter(e){e.dataset.oldOverflow=e.style.overflow,e.scrollHeight!==0?e.style.height=e.scrollHeight+"px":e.style.height="",e.style.padding=e.getAttribute("data-oldPadding"),e.style.margin=e.getAttribute("data-oldMargin"),e.style.overflow="hidden"},"after-enter"(e){e.style.transition="",e.style.transition="",e.style.height="",e.style.overflow=e.getAttribute("data-overflow")},"before-leave"(e){e.dataset||(e.dataset={}),e.dataset.oldPaddingTop=e.style.paddingTop,e.dataset.oldPaddingBottom=e.style.paddingBottom,e.dataset.oldOverflow=e.style.overflow,e.style.height=e.scrollHeight+"px",e.style.overflow="hidden"},leave(e){e.scrollHeight!==0&&(e.style.transition=se,e.style.height="0",e.style.paddingTop="0",e.style.paddingBottom="0")},"after-leave"(e){e.style.transition="",e.style.height="",e.style.overflow=e.dataset.oldOverflow,e.style.paddingTop=e.dataset.oldPaddingTop,e.style.paddingBottom=e.dataset.oldPaddingBottom}};var ve=n.defineComponent({name:"DMenuTransition",setup(e,a){return()=>n.createVNode(n.Transition,{onBeforeEnter:t=>k["before-enter"](t),onBeforeLeave:t=>k["before-leave"](t),onEnter:t=>k.enter(t),onAfterEnter:t=>k["after-enter"](t),onLeave:t=>k.leave(t),onAfterLeave:t=>k["after-leave"](t)},{default:()=>{var t,s;return[(s=(t=a.slots).default)==null?void 0:s.call(t)]}})}});const F=E("menu"),V=E("submenu").b();var O=n.defineComponent({name:"DSubMenu",props:be,setup(e,a){const t=n.ref(!0),{vnode:{key:s}}=n.getCurrentInstance(),l=String(s),i=n.ref(!1),d=n.inject("openKeys"),u=n.inject("defaultIndent"),f=n.inject("isCollapsed"),g=n.inject("mode"),M=n.ref(null),$=n.inject("rootMenuEmit"),y=g.value==="horizontal";l==="null"?console.warn("[devui][menu]: Key can not be null"):d.value.includes(l)?i.value=!0:i.value=!1;const N=c=>{c.preventDefault(),c.stopPropagation();const p=c.currentTarget;if(!(p.classList.contains(V)&&y)&&(y&&(Z(p,c,!0),ne(c)),!e.disabled&&g.value!=="horizontal")){const r=c.target;let o=c.target;if(r.tagName==="UL")r.classList.contains(`${V}-open`)?i.value=!i.value:i.value=i.value;else{for(;o&&o.tagName!=="UL"&&o.tagName!=="LI";)o=o.parentElement;o.tagName==="UL"&&(i.value=!i.value)}$("submenu-change",{type:"submenu-change",state:i.value,key:l,el:o})}},z=n.ref(null);let w;const L=n.ref(null),A=n.ref(null);let P="";const b=n.ref("");return n.watchEffect(()=>{w=z.value,ie({el:L.value})},{flush:"post"}),n.watch(()=>d,c=>{c.value.includes(l)?i.value=!0:i.value=!1},{deep:!0}),n.onMounted(()=>{var r;const c=A.value,p=L.value;re(),b.value=`layer_${(r=Array.from(p.classList).at(-1))==null?void 0:r.replace("layer_","")}`,y&&(L.value.addEventListener("mouseenter",o=>{o.stopPropagation(),j("mouseenter",o,w)}),L.value.addEventListener("mouseleave",o=>{o.stopPropagation(),j("mouseleave",o,w)})),n.watch(f,o=>{const h=Number(fe(p));Number.isNaN(h)||h>2&&(t.value=!f.value),o?(c.style.padding!=="0"&&(P=c.style.padding),setTimeout(()=>{c.style.padding="0",c.style.width="",c.style.textAlign="center"},300),c.style.display="block"):(c.style.padding=`${P}`,c.style.textAlign="",c.style.display="flex")})}),()=>{var c,p,r,o;return n.withDirectives(n.createVNode("ul",{onClick:N,class:[V,b.value],ref:L},[n.createVNode("div",{class:[`${V}-title`,e.disabled&&`${V}-disabled`],style:`padding: 0 ${u}px`,ref:A},[n.createVNode("span",{class:`${F.b()}-icon`},[(p=(c=a.slots)==null?void 0:c.icon)==null?void 0:p.call(c)]),n.withDirectives(n.createVNode("span",{class:`${V}-title-content`},[e.title]),[[n.vShow,!f.value]]),n.withDirectives(n.createVNode("i",{class:{"icon icon-chevron-up":b.value!==`layer_${V}`,"icon icon-chevron-right":b.value===`layer_${V}`,"is-opened":i.value}},null),[[n.vShow,!f.value&&s!=="overflowContainer"]])]),y?n.createVNode("div",{class:`${F.b()}-item-horizontal-wrapper ${F.b()}-item-horizontal-wrapper-hidden`,ref:z},[(o=(r=a.slots).default)==null?void 0:o.call(r)]):n.createVNode(ve,null,{default:()=>{var h,v;return[n.withDirectives(n.createVNode("div",{class:[`${V}-menu-item-vertical-wrapper`],ref:M},[(v=(h=a.slots).default)==null?void 0:v.call(h)]),[[n.vShow,i.value]])]}})]),[[n.vShow,t.value]])}}});const Le={width:{type:String,default:""},collapsed:{type:Boolean,default:!1},collapsedIndent:{type:Number,default:24},indentSize:{type:Number,default:24},multiple:{type:Boolean,default:!1},openKeys:{type:Array,default:[]},defaultSelectKeys:{type:Array,default:[]},mode:{type:String,default:"vertical"},router:{type:Boolean,default:!1}};var ze="";function we(e=8){const a="abcdefghijklmnopqrstuvwxyz0123456789";let t="";for(let s=0;s<e;s++)t+=a[parseInt((Math.random()*a.length).toString())];return t}const C={};class $e{constructor(a){ae(this,"rootMenuName");this.rootMenuName=a}on(a,t){var s;((s=C==null?void 0:C[this.rootMenuName])==null?void 0:s[a])||Reflect.set(C[this.rootMenuName],a,[]),C[this.rootMenuName][a].push(t)}emit(a,...t){C[this.rootMenuName][a].forEach(s=>s(...t))}off(a,t){const s=C[this.rootMenuName][a].indexOf(t);s>=0&&C[this.rootMenuName][a].splice(s,1)}}function Ne(e){return C[e]||Reflect.set(C,e,{}),new $e(e)}var G=n.defineComponent({name:"DMenu",props:Le,emits:["select","deselect","submenu-change"],setup(e,a){const t=E("menu"),{openKeys:s,mode:l,collapsed:i}=n.toRefs(e),d=we(16),u=Ne(d);n.provide("menuStore",u),n.provide("isCollapsed",i),n.provide("defaultIndent",e.indentSize),n.provide("multiple",e.multiple),n.provide("openKeys",s),n.provide("defaultSelectKey",e.defaultSelectKeys),n.provide("mode",l),n.provide("collapsedIndent",e.collapsedIndent),n.provide("rootMenuEmit",a.emit),n.provide("useRouter",e.router),oe(e.indentSize);const f=n.ref(null),g=n.ref(null),M=n.ref(0),$=n.computed(()=>({[`${t.b()}`]:!0,[`${t.b()}-vertical`]:l.value==="vertical",[`${t.b()}-horizontal`]:l.value==="horizontal",[`${t.b()}-collapsed`]:i.value}));return n.onMounted(()=>{var y;if(e.mode==="horizontal"){let N=!1;const z=(y=g.value)==null?void 0:y.$el,w=f.value,L=w.children,A=z.children[1],P=new IntersectionObserver(b=>{b.forEach(c=>{if(c.isIntersecting){if(!c.target.classList.contains(`${t.b()}-overflow-container`)&&c.target.style.visibility==="hidden"){P.unobserve(c.target);const p=A.lastChild;p&&w.insertBefore(p,z);const r=z.previousElementSibling;if(r&&P.observe(r),r==null?void 0:r.classList.contains("devui-submenu")){const o=r,h=r.children[1];o.addEventListener("mouseenter",v=>{v.stopPropagation(),j("mouseenter",v,h)}),o.addEventListener("mouseleave",v=>{v.stopPropagation(),j("mouseleave",v,h)})}c.target.style.visibility="",c.target.remove(),M.value-=1}}else{const p=c.target.cloneNode(!0);c.target.classList.contains(`${t.b()}-overflow-container`)?N&&c.target.previousElementSibling&&A.children.length?w.appendChild(c.target.previousElementSibling):N=!0:(M.value+=1,c.target.style.visibility="hidden",z.nextSibling?w.insertBefore(c.target,z.nextSibling):w.appendChild(c.target),A.appendChild(p))}})},{root:w,threshold:1,rootMargin:"8px"});for(let b=0;b<L.length;b++)P.observe(L[b])}}),()=>{var y,N;return n.createVNode("ul",{ref:f,class:$.value,style:[e.collapsed?`width:${e.collapsedIndent*2}px`:`width: ${e.width}`,"white-space: nowrap"]},[(N=(y=a.slots).default)==null?void 0:N.call(y),n.withDirectives(n.createVNode(O,{ref:g,key:"overflowContainer",title:"...",class:`${t.b()}-overflow-container`},null),[[n.vShow,M.value>0&&l.value==="horizontal"]])])}}}),Se={title:"Menu \u83DC\u5355",category:"\u5BFC\u822A",status:"100%",install(e){e.component(G.name,G),e.component(q.name,q),e.component(O.name,O)}};m.Menu=G,m.MenuItem=q,m.SubMenu=O,m.default=Se,Object.defineProperty(m,"__esModule",{value:!0}),m[Symbol.toStringTag]="Module"});
|
package/menu/style.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.devui-menu-vertical a,.devui-menu-horizontal a{text-decoration:none}.devui-menu-vertical ul,.devui-menu-vertical li,.devui-menu-horizontal ul,.devui-menu-horizontal li{list-style:none;white-space:nowrap}.devui-menu-horizontal{display:flex;box-sizing:border-box;line-height:var(--devui-line-height-base, 1.5);background:var(--devui-global-bg-normal);padding:14px 20px}.devui-menu-horizontal .devui-menu-item{display:flex;position:relative;box-sizing:content-box;padding:0 20px!important;line-height:24px;cursor:pointer}.devui-menu-horizontal .devui-menu-item:after{content:"";display:block;position:absolute;left:20px;right:20px;bottom:0;width:auto;height:2px}.devui-menu-horizontal :after{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));background:transparent}.devui-menu-horizontal .devui-menu-item-select .devui-submenu-title-content,.devui-menu-horizontal .devui-menu-active-parent .devui-submenu-title-content{color:var(--devui-menu-item-hover)}.devui-menu-horizontal .devui-menu-item-select:after,.devui-menu-horizontal .devui-menu-active-parent:after{display:block;position:absolute;left:20px;right:20px;bottom:0;width:auto;height:2px;content:"";opacity:1;background:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-menu-item span,.devui-menu-horizontal .devui-menu-item a{color:var(--devui-text, #252b3a)}.devui-menu-horizontal .devui-menu-item:hover span,.devui-menu-horizontal .devui-menu-item:hover a{color:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-menu-item:hover:after{background:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-submenu{margin:0;padding:0;position:relative}.devui-menu-horizontal .devui-submenu div.devui-submenu-title{padding:0 20px}.devui-menu-horizontal .devui-submenu div.devui-submenu-title span{margin:0}.devui-menu-horizontal .devui-submenu div.devui-submenu-title .icon-chevron-up,.devui-menu-horizontal .devui-submenu div.devui-submenu-title .icon-chevron-right{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-horizontal .devui-submenu:after{content:"";display:block;position:absolute;left:20px;right:20px;bottom:0;width:auto;height:2px}.devui-menu-horizontal .devui-submenu:hover{cursor:pointer}.devui-menu-horizontal .devui-submenu:hover:after{background:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-submenu:hover>div>i.icon-chevron-up{transform:rotate(180deg)}.devui-menu-horizontal .devui-submenu:hover>div>i.icon-chevron-right{transform:rotate(180deg)}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1)),left 0 linear;background:var(--devui-global-bg-normal);z-index:var(--devui-z-index-modal, 1050)}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));opacity:1;visibility:visible;max-height:100vh;padding:10px 0!important;border-radius:8px;position:absolute}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-menu-item{margin-top:5px}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-submenu{margin:5px 0;padding:0 20px!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-submenu div.devui-submenu-title{padding:0!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-menu-item-horizontal-wrapper-level .devui-submenu{padding:0 20px!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));visibility:hidden;position:absolute;padding:0!important;max-height:0;overflow:hidden;opacity:0}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden .devui-menu-item{margin-top:5px}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden .devui-submenu{margin:5px 0;padding:0 20px!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden .devui-submenu div.devui-submenu-title{padding:0!important}.devui-submenu-menu-item-vertical-wrapper{overflow:hidden}.devui-menu-vertical{padding:0;transition:width var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1)),padding var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));border-right:var(--devui-line, #d7d8da) 1px solid;background:var(--devui-area, #f8f8f8)!important}.devui-menu-vertical :after{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));background:transparent}.devui-menu-vertical .layer_1{margin:0!important}.devui-menu-vertical .layer_2>div.devui-submenu-title{margin:0!important;background:var(--devui-block, #ffffff)}.devui-menu-vertical.devui-menu-collapsed .devui-menu-icon{margin:auto}.devui-menu-vertical.devui-menu-collapsed ul li{display:none!important}.devui-menu-vertical.devui-menu-collapsed .devui-submenu div.devui-submenu-title .devui-menu-icon{margin:auto}.devui-menu-vertical .devui-menu-item-vertical-wrapper{padding-left:0!important}.devui-menu-vertical .devui-menu-item{width:100%;height:40px;flex-grow:1;line-height:40px;cursor:pointer;color:var(--devui-menu-item);background:var(--devui-block, #ffffff);display:flex}.devui-menu-vertical .devui-menu-item span:nth-child(2){text-align:left}.devui-menu-vertical div:not(.devui-submenu-menu-item-vertical-wrapper){display:flex;flex:auto}.devui-menu-vertical .devui-menu-item:after{display:block;position:absolute;right:0;top:0;transform:scaleX(0);content:"";opacity:1;background:var(--devui-primary-hover, #5e7ce0)}.devui-menu-vertical .devui-menu-item-select{background:var(--devui-primary-bg, #f2f5fc)!important;position:relative}.devui-menu-vertical .devui-menu-item-select span,.devui-menu-vertical .devui-menu-item-select a{color:var(--devui-menu-item-hover)}.devui-menu-vertical .devui-menu-item-select:after{display:block;position:absolute;right:0;top:0;height:100%;width:4px;content:"";opacity:1;background:var(--devui-brand, #5e7ce0);transform:scaleX(1)}.devui-menu-vertical .devui-submenu>div:hover span.devui-submenu-title-content{color:var(--devui-menu-item-hover)}.devui-menu-vertical .devui-menu-item:hover{color:var(--devui-menu-item-hover)}.devui-menu-vertical li.devui-menu-item,.devui-menu-vertical div.devui-submenu-title{white-space:nowrap;overflow:hidden}.devui-menu-vertical li.devui-menu-item span:nth-child(2),.devui-menu-vertical div.devui-submenu-title span:nth-child(2){overflow:hidden;text-overflow:ellipsis}.devui-menu-vertical li.devui-menu-item span:nth-child(2) span,.devui-menu-vertical div.devui-submenu-title span:nth-child(2) span{overflow:hidden;text-overflow:ellipsis}.devui-menu-vertical .devui-menu-item-isCollapsed{width:fit-content}.devui-menu-vertical .devui-menu-item-isCollapsed .devui-menu-icon{margin:auto}.devui-menu-vertical ul.devui-submenu{margin:0;padding:0}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title{display:flex;cursor:pointer;width:100%;height:40px;margin:4px 0;line-height:40px;padding-left:18px;align-items:center;color:var(--devui-menu-item)}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title:nth-child(1){font-size:var(--devui-font-size-lg, 14px)}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title span.devui-submenu-title-content{font-size:var(--devui-font-size-lg, 14px);flex:auto}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title span.devui-menu-icon{text-align:center}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title .icon-chevron-up{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title i.icon-chevron-up.is-opened{transform:rotate(180deg)}.devui-menu-vertical ul.devui-submenu .devui-menu-item{display:flex}.devui-menu-vertical ul.devui-submenu .devui-menu-item>span{flex:auto;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));color:var(--devui-menu-item-sub)}.devui-menu-vertical ul.devui-submenu .devui-menu-item:hover>span{color:var(--devui-menu-item-hover)}.devui-menu-vertical ul.devui-submenu .devui-menu-item-select *{color:var(--devui-menu-item-hover)!important}.devui-menu-vertical ul li~ul>div{margin-top:0!important}.devui-menu-vertical ul li{background:var(--devui-area, #f8f8f8)!important}.devui-menu-icon+span{margin-left:10px}.devui-menu-item-disabled,.devui-submenu-disabled,.devui-menu-item-disabled:hover,.devui-submenu-disabled:hover{color:var(--devui-menu-disabled)!important;cursor:not-allowed!important}.devui-submenu-disabled:hover span{color:var(--devui-menu-disabled)!important}.fade-enter-active,.fade-leave-active{transition:opacity var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1))}.fade-leave-to{display:none}.fade-enter-from,.fade-leave-to{opacity:0}
|
|
@@ -0,0 +1,539 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
import { defineComponent, toRefs, computed, createVNode, resolveDynamicComponent, mergeProps, watch, Transition, shallowReactive, createApp, onUnmounted, isVNode, reactive } from "vue";
|
|
21
|
+
const isString = (val) => typeof val === "string";
|
|
22
|
+
const DEFAULT_PREFIX = "icon";
|
|
23
|
+
const iconProps = {
|
|
24
|
+
name: {
|
|
25
|
+
type: String,
|
|
26
|
+
default: "",
|
|
27
|
+
required: true
|
|
28
|
+
},
|
|
29
|
+
size: {
|
|
30
|
+
type: [Number, String],
|
|
31
|
+
default: "inherit"
|
|
32
|
+
},
|
|
33
|
+
color: {
|
|
34
|
+
type: String,
|
|
35
|
+
default: "inherit"
|
|
36
|
+
},
|
|
37
|
+
component: {
|
|
38
|
+
type: Object,
|
|
39
|
+
default: null
|
|
40
|
+
},
|
|
41
|
+
classPrefix: {
|
|
42
|
+
type: String,
|
|
43
|
+
default: DEFAULT_PREFIX
|
|
44
|
+
},
|
|
45
|
+
operable: {
|
|
46
|
+
type: Boolean,
|
|
47
|
+
default: false
|
|
48
|
+
},
|
|
49
|
+
disabled: {
|
|
50
|
+
type: Boolean,
|
|
51
|
+
default: false
|
|
52
|
+
},
|
|
53
|
+
rotate: {
|
|
54
|
+
type: [Number, String]
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
const svgIconProps = {
|
|
58
|
+
name: {
|
|
59
|
+
type: String,
|
|
60
|
+
default: "",
|
|
61
|
+
required: true
|
|
62
|
+
},
|
|
63
|
+
color: {
|
|
64
|
+
type: String,
|
|
65
|
+
default: "inherit"
|
|
66
|
+
},
|
|
67
|
+
size: {
|
|
68
|
+
type: [Number, String],
|
|
69
|
+
default: "inherit"
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
function createBem(namespace, element, modifier) {
|
|
73
|
+
let cls = namespace;
|
|
74
|
+
if (element) {
|
|
75
|
+
cls += `__${element}`;
|
|
76
|
+
}
|
|
77
|
+
if (modifier) {
|
|
78
|
+
cls += `--${modifier}`;
|
|
79
|
+
}
|
|
80
|
+
return cls;
|
|
81
|
+
}
|
|
82
|
+
function useNamespace(block, needDot = false) {
|
|
83
|
+
const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
|
|
84
|
+
const b = () => createBem(namespace);
|
|
85
|
+
const e = (element) => element ? createBem(namespace, element) : "";
|
|
86
|
+
const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
|
|
87
|
+
const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
|
|
88
|
+
return {
|
|
89
|
+
b,
|
|
90
|
+
e,
|
|
91
|
+
m,
|
|
92
|
+
em
|
|
93
|
+
};
|
|
94
|
+
}
|
|
95
|
+
var icon = "";
|
|
96
|
+
var svgIcon = defineComponent({
|
|
97
|
+
name: "DSvgIcon",
|
|
98
|
+
props: svgIconProps,
|
|
99
|
+
setup(props) {
|
|
100
|
+
const {
|
|
101
|
+
name,
|
|
102
|
+
color,
|
|
103
|
+
size
|
|
104
|
+
} = toRefs(props);
|
|
105
|
+
const ns2 = useNamespace("svg-icon");
|
|
106
|
+
const iconName = computed(() => `#icon-${name.value}`);
|
|
107
|
+
const iconSize = computed(() => {
|
|
108
|
+
return typeof size.value === "number" ? `${size.value}px` : size.value;
|
|
109
|
+
});
|
|
110
|
+
const styles = {
|
|
111
|
+
width: iconSize.value,
|
|
112
|
+
height: iconSize.value
|
|
113
|
+
};
|
|
114
|
+
return () => {
|
|
115
|
+
return createVNode("svg", {
|
|
116
|
+
"class": ns2.b(),
|
|
117
|
+
"style": styles
|
|
118
|
+
}, [createVNode("use", {
|
|
119
|
+
"xlink:href": iconName.value,
|
|
120
|
+
"fill": color.value
|
|
121
|
+
}, null)]);
|
|
122
|
+
};
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
function isUrl(value) {
|
|
126
|
+
return /^((http|https):)?\/\//.test(value);
|
|
127
|
+
}
|
|
128
|
+
function useIconDom(props, ctx) {
|
|
129
|
+
const {
|
|
130
|
+
component,
|
|
131
|
+
name,
|
|
132
|
+
size,
|
|
133
|
+
color,
|
|
134
|
+
classPrefix,
|
|
135
|
+
rotate
|
|
136
|
+
} = toRefs(props);
|
|
137
|
+
const ns2 = useNamespace("icon");
|
|
138
|
+
const iconSize = computed(() => {
|
|
139
|
+
return typeof size.value === "number" ? `${size.value}px` : size.value;
|
|
140
|
+
});
|
|
141
|
+
const IconComponent = component.value ? resolveDynamicComponent(component.value) : resolveDynamicComponent(svgIcon);
|
|
142
|
+
const imgIconDom = () => {
|
|
143
|
+
return createVNode("img", mergeProps({
|
|
144
|
+
"src": name.value,
|
|
145
|
+
"alt": name.value.split("/")[name.value.split("/").length - 1],
|
|
146
|
+
"class": [(rotate == null ? void 0 : rotate.value) === "infinite" && ns2.m("spin")],
|
|
147
|
+
"style": {
|
|
148
|
+
width: iconSize.value || "",
|
|
149
|
+
transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`,
|
|
150
|
+
verticalAlign: "middle"
|
|
151
|
+
}
|
|
152
|
+
}, ctx.attrs), null);
|
|
153
|
+
};
|
|
154
|
+
const svgIconDom = () => {
|
|
155
|
+
return createVNode(IconComponent, mergeProps({
|
|
156
|
+
"name": name.value,
|
|
157
|
+
"color": color.value,
|
|
158
|
+
"size": iconSize.value,
|
|
159
|
+
"class": [(rotate == null ? void 0 : rotate.value) === "infinite" && ns2.m("spin")],
|
|
160
|
+
"style": {
|
|
161
|
+
transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`
|
|
162
|
+
}
|
|
163
|
+
}, ctx.attrs), null);
|
|
164
|
+
};
|
|
165
|
+
const fontIconDom = () => {
|
|
166
|
+
const fontIconClass = /^icon-/.test(name.value) ? name.value : `${classPrefix.value}-${name.value}`;
|
|
167
|
+
return createVNode("i", mergeProps({
|
|
168
|
+
"class": [classPrefix.value, fontIconClass, (rotate == null ? void 0 : rotate.value) === "infinite" && ns2.m("spin")],
|
|
169
|
+
"style": {
|
|
170
|
+
fontSize: iconSize.value,
|
|
171
|
+
color: color.value,
|
|
172
|
+
transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`
|
|
173
|
+
}
|
|
174
|
+
}, ctx.attrs), null);
|
|
175
|
+
};
|
|
176
|
+
const iconDom = () => {
|
|
177
|
+
return component.value ? svgIconDom() : isUrl(name.value) ? imgIconDom() : fontIconDom();
|
|
178
|
+
};
|
|
179
|
+
return {
|
|
180
|
+
iconDom
|
|
181
|
+
};
|
|
182
|
+
}
|
|
183
|
+
var Icon = defineComponent({
|
|
184
|
+
name: "DIcon",
|
|
185
|
+
props: iconProps,
|
|
186
|
+
emits: ["click"],
|
|
187
|
+
setup(props, ctx) {
|
|
188
|
+
const {
|
|
189
|
+
disabled,
|
|
190
|
+
operable
|
|
191
|
+
} = toRefs(props);
|
|
192
|
+
const {
|
|
193
|
+
iconDom
|
|
194
|
+
} = useIconDom(props, ctx);
|
|
195
|
+
const ns2 = useNamespace("icon");
|
|
196
|
+
const wrapClassed = computed(() => ({
|
|
197
|
+
[ns2.e("container")]: true,
|
|
198
|
+
[ns2.m("disabled")]: disabled.value,
|
|
199
|
+
[ns2.m("operable")]: operable.value,
|
|
200
|
+
[ns2.m("no-slots")]: !Object.keys(ctx.slots).length
|
|
201
|
+
}));
|
|
202
|
+
const onClick = (e) => {
|
|
203
|
+
if (disabled.value) {
|
|
204
|
+
return;
|
|
205
|
+
}
|
|
206
|
+
ctx.emit("click", e);
|
|
207
|
+
};
|
|
208
|
+
return () => {
|
|
209
|
+
var _a, _b, _c, _d;
|
|
210
|
+
return createVNode("div", {
|
|
211
|
+
"class": wrapClassed.value,
|
|
212
|
+
"onClick": onClick
|
|
213
|
+
}, [(_b = (_a = ctx.slots).prefix) == null ? void 0 : _b.call(_a), iconDom(), (_d = (_c = ctx.slots).suffix) == null ? void 0 : _d.call(_c)]);
|
|
214
|
+
};
|
|
215
|
+
}
|
|
216
|
+
});
|
|
217
|
+
var iconGroup = "";
|
|
218
|
+
defineComponent({
|
|
219
|
+
name: "DIconGroup",
|
|
220
|
+
setup(_, ctx) {
|
|
221
|
+
const ns2 = useNamespace("icon-group");
|
|
222
|
+
return () => {
|
|
223
|
+
var _a, _b;
|
|
224
|
+
return createVNode("div", {
|
|
225
|
+
"class": ns2.b()
|
|
226
|
+
}, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]);
|
|
227
|
+
};
|
|
228
|
+
}
|
|
229
|
+
});
|
|
230
|
+
var Close = defineComponent({
|
|
231
|
+
emits: ["click"],
|
|
232
|
+
setup(props, {
|
|
233
|
+
emit
|
|
234
|
+
}) {
|
|
235
|
+
const ns2 = useNamespace("message");
|
|
236
|
+
return () => createVNode("div", {
|
|
237
|
+
"class": ns2.e("icon-close"),
|
|
238
|
+
"onClick": (e) => emit("click", e)
|
|
239
|
+
}, [createVNode(Icon, {
|
|
240
|
+
"name": "close",
|
|
241
|
+
"size": "14px"
|
|
242
|
+
}, null)]);
|
|
243
|
+
}
|
|
244
|
+
});
|
|
245
|
+
const messageProps = {
|
|
246
|
+
id: {
|
|
247
|
+
type: String,
|
|
248
|
+
default: ""
|
|
249
|
+
},
|
|
250
|
+
visible: {
|
|
251
|
+
type: Boolean,
|
|
252
|
+
default: false
|
|
253
|
+
},
|
|
254
|
+
message: {
|
|
255
|
+
type: String,
|
|
256
|
+
default: ""
|
|
257
|
+
},
|
|
258
|
+
type: {
|
|
259
|
+
type: String,
|
|
260
|
+
default: "normal"
|
|
261
|
+
},
|
|
262
|
+
bordered: {
|
|
263
|
+
type: Boolean,
|
|
264
|
+
default: true
|
|
265
|
+
},
|
|
266
|
+
shadow: {
|
|
267
|
+
type: Boolean,
|
|
268
|
+
default: true
|
|
269
|
+
},
|
|
270
|
+
duration: {
|
|
271
|
+
type: Number,
|
|
272
|
+
default: 3e3
|
|
273
|
+
},
|
|
274
|
+
showClose: {
|
|
275
|
+
type: Boolean,
|
|
276
|
+
default: false
|
|
277
|
+
},
|
|
278
|
+
onClose: {
|
|
279
|
+
type: Function
|
|
280
|
+
}
|
|
281
|
+
};
|
|
282
|
+
const ns = useNamespace("message");
|
|
283
|
+
function SuccessIcon() {
|
|
284
|
+
return createVNode("svg", {
|
|
285
|
+
"viewBox": "0 0 1024 1024",
|
|
286
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
287
|
+
"class": ns.e("icon")
|
|
288
|
+
}, [createVNode("path", {
|
|
289
|
+
"fill": "currentColor",
|
|
290
|
+
"d": "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"
|
|
291
|
+
}, null)]);
|
|
292
|
+
}
|
|
293
|
+
function WarningIcon() {
|
|
294
|
+
return createVNode("svg", {
|
|
295
|
+
"viewBox": "0 0 1024 1024",
|
|
296
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
297
|
+
"class": ns.e("icon")
|
|
298
|
+
}, [createVNode("path", {
|
|
299
|
+
"fill": "currentColor",
|
|
300
|
+
"d": "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 192a58.432 58.432 0 0 0-58.24 63.744l23.36 256.384a35.072 35.072 0 0 0 69.76 0l23.296-256.384A58.432 58.432 0 0 0 512 256zm0 512a51.2 51.2 0 1 0 0-102.4 51.2 51.2 0 0 0 0 102.4z"
|
|
301
|
+
}, null)]);
|
|
302
|
+
}
|
|
303
|
+
function InfoIcon() {
|
|
304
|
+
return createVNode("svg", {
|
|
305
|
+
"viewBox": "0 0 1024 1024",
|
|
306
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
307
|
+
"class": ns.e("icon")
|
|
308
|
+
}, [createVNode("path", {
|
|
309
|
+
"fill": "currentColor",
|
|
310
|
+
"d": "M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"
|
|
311
|
+
}, null)]);
|
|
312
|
+
}
|
|
313
|
+
function ErrorIcon() {
|
|
314
|
+
return createVNode("svg", {
|
|
315
|
+
"viewBox": "0 0 1024 1024",
|
|
316
|
+
"xmlns": "http://www.w3.org/2000/svg",
|
|
317
|
+
"class": ns.e("icon")
|
|
318
|
+
}, [createVNode("path", {
|
|
319
|
+
"fill": "currentColor",
|
|
320
|
+
"d": "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 393.664L407.936 353.6a38.4 38.4 0 1 0-54.336 54.336L457.664 512 353.6 616.064a38.4 38.4 0 1 0 54.336 54.336L512 566.336 616.064 670.4a38.4 38.4 0 1 0 54.336-54.336L566.336 512 670.4 407.936a38.4 38.4 0 1 0-54.336-54.336L512 457.664z"
|
|
321
|
+
}, null)]);
|
|
322
|
+
}
|
|
323
|
+
var message$1 = "";
|
|
324
|
+
var Message$1 = defineComponent({
|
|
325
|
+
name: "DMessage",
|
|
326
|
+
props: messageProps,
|
|
327
|
+
emits: ["destroy", "close"],
|
|
328
|
+
setup(props, {
|
|
329
|
+
emit,
|
|
330
|
+
slots
|
|
331
|
+
}) {
|
|
332
|
+
const {
|
|
333
|
+
visible,
|
|
334
|
+
message: message2,
|
|
335
|
+
type,
|
|
336
|
+
bordered,
|
|
337
|
+
shadow,
|
|
338
|
+
showClose
|
|
339
|
+
} = toRefs(props);
|
|
340
|
+
const ns2 = useNamespace("message");
|
|
341
|
+
let timer = null;
|
|
342
|
+
let timestamp;
|
|
343
|
+
const handleDestroy = () => {
|
|
344
|
+
emit("destroy");
|
|
345
|
+
};
|
|
346
|
+
const close = () => {
|
|
347
|
+
var _a;
|
|
348
|
+
timer && clearTimeout(timer);
|
|
349
|
+
timer = null;
|
|
350
|
+
(_a = props.onClose) == null ? void 0 : _a.call(props);
|
|
351
|
+
};
|
|
352
|
+
const interrupt = () => {
|
|
353
|
+
if (timer) {
|
|
354
|
+
clearTimeout(timer);
|
|
355
|
+
timer = null;
|
|
356
|
+
}
|
|
357
|
+
};
|
|
358
|
+
const removeReset = () => {
|
|
359
|
+
if (props.visible) {
|
|
360
|
+
const remainTime = props.duration - (Date.now() - timestamp);
|
|
361
|
+
timer = setTimeout(close, remainTime);
|
|
362
|
+
}
|
|
363
|
+
};
|
|
364
|
+
watch(() => props.visible, (val) => {
|
|
365
|
+
if (val) {
|
|
366
|
+
timestamp = Date.now();
|
|
367
|
+
if (props.duration) {
|
|
368
|
+
timer = setTimeout(close, props.duration);
|
|
369
|
+
}
|
|
370
|
+
}
|
|
371
|
+
});
|
|
372
|
+
const classes = computed(() => ({
|
|
373
|
+
[ns2.b()]: true,
|
|
374
|
+
[ns2.m(type.value)]: true
|
|
375
|
+
}));
|
|
376
|
+
const lastOffset = computed(() => getLastOffset(props.id));
|
|
377
|
+
const styles = computed(() => {
|
|
378
|
+
const messageStyles = {};
|
|
379
|
+
if (!bordered.value) {
|
|
380
|
+
messageStyles["border"] = "none";
|
|
381
|
+
}
|
|
382
|
+
if (!shadow.value) {
|
|
383
|
+
messageStyles["box-shadow"] = "none";
|
|
384
|
+
}
|
|
385
|
+
return __spreadProps(__spreadValues({}, messageStyles), {
|
|
386
|
+
top: `${lastOffset.value}px`
|
|
387
|
+
});
|
|
388
|
+
});
|
|
389
|
+
const renderIcon = computed(() => {
|
|
390
|
+
const iconClasses = computed(() => ({
|
|
391
|
+
[ns2.e("image")]: true,
|
|
392
|
+
[ns2.em("image", type.value)]: true
|
|
393
|
+
}));
|
|
394
|
+
return !(!type.value || type.value === "normal") && createVNode("span", {
|
|
395
|
+
"class": iconClasses.value
|
|
396
|
+
}, [type.value && (type.value === "success" && createVNode(SuccessIcon, null, null) || type.value === "info" && createVNode(InfoIcon, null, null) || type.value === "warning" && createVNode(WarningIcon, null, null) || type.value === "error" && createVNode(ErrorIcon, null, null))]);
|
|
397
|
+
});
|
|
398
|
+
const renderText = computed(() => {
|
|
399
|
+
var _a;
|
|
400
|
+
const textClasses = computed(() => ({
|
|
401
|
+
[ns2.e("content")]: true,
|
|
402
|
+
[ns2.em("content", type.value)]: true
|
|
403
|
+
}));
|
|
404
|
+
return createVNode("span", {
|
|
405
|
+
"class": textClasses.value
|
|
406
|
+
}, [message2.value ? message2.value : (_a = slots.default) == null ? void 0 : _a.call(slots)]);
|
|
407
|
+
});
|
|
408
|
+
const renderClose = computed(() => {
|
|
409
|
+
return showClose.value && createVNode("span", {
|
|
410
|
+
"class": [ns2.e("close")],
|
|
411
|
+
"onClick": close
|
|
412
|
+
}, [createVNode(Close, null, null)]);
|
|
413
|
+
});
|
|
414
|
+
return () => {
|
|
415
|
+
return createVNode(Transition, {
|
|
416
|
+
"name": "message-fade",
|
|
417
|
+
"onAfterLeave": handleDestroy
|
|
418
|
+
}, {
|
|
419
|
+
default: () => [visible.value && createVNode("div", {
|
|
420
|
+
"class": classes.value,
|
|
421
|
+
"style": __spreadValues({}, styles.value),
|
|
422
|
+
"onMouseenter": interrupt,
|
|
423
|
+
"onMouseleave": removeReset
|
|
424
|
+
}, [renderIcon.value, renderText.value, renderClose.value])]
|
|
425
|
+
});
|
|
426
|
+
};
|
|
427
|
+
}
|
|
428
|
+
});
|
|
429
|
+
function _isSlot(s) {
|
|
430
|
+
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
431
|
+
}
|
|
432
|
+
const instances = shallowReactive([]);
|
|
433
|
+
const getLastOffset = (id) => {
|
|
434
|
+
const idx = instances.findIndex((instance) => instance.id === id);
|
|
435
|
+
return idx * 65 + 80;
|
|
436
|
+
};
|
|
437
|
+
const deleteInstance = (id) => {
|
|
438
|
+
const idx = instances.findIndex((instance) => instance.id === id);
|
|
439
|
+
if (idx !== -1) {
|
|
440
|
+
instances.splice(idx, 1);
|
|
441
|
+
}
|
|
442
|
+
return idx;
|
|
443
|
+
};
|
|
444
|
+
const initInstance = (id, props, message2) => {
|
|
445
|
+
const container = document.createElement("div");
|
|
446
|
+
container.id = id;
|
|
447
|
+
const app = createApp({
|
|
448
|
+
setup() {
|
|
449
|
+
onUnmounted(() => {
|
|
450
|
+
document.body.removeChild(container);
|
|
451
|
+
});
|
|
452
|
+
return () => createVNode(Message$1, mergeProps(props, {
|
|
453
|
+
"id": id,
|
|
454
|
+
"onDestroy": app.unmount
|
|
455
|
+
}), _isSlot(message2) ? message2 : {
|
|
456
|
+
default: () => [message2]
|
|
457
|
+
});
|
|
458
|
+
}
|
|
459
|
+
});
|
|
460
|
+
document.body.appendChild(container);
|
|
461
|
+
app.mount(container);
|
|
462
|
+
return {
|
|
463
|
+
id,
|
|
464
|
+
props
|
|
465
|
+
};
|
|
466
|
+
};
|
|
467
|
+
const defaultOptions = {
|
|
468
|
+
duration: 3e3,
|
|
469
|
+
type: "normal"
|
|
470
|
+
};
|
|
471
|
+
const normalizeOptions = (params) => {
|
|
472
|
+
const options = !params || isString(params) ? {
|
|
473
|
+
message: params
|
|
474
|
+
} : params;
|
|
475
|
+
const normalized = __spreadValues(__spreadValues({}, defaultOptions), options);
|
|
476
|
+
return normalized;
|
|
477
|
+
};
|
|
478
|
+
let seed = 0;
|
|
479
|
+
function open(options) {
|
|
480
|
+
const originOnClose = options.onClose || null;
|
|
481
|
+
const messageContent = options.message;
|
|
482
|
+
delete options.message;
|
|
483
|
+
const props = reactive(__spreadProps(__spreadValues(__spreadValues({}, defaultOptions), options), {
|
|
484
|
+
onClose: () => {
|
|
485
|
+
props.visible = false;
|
|
486
|
+
deleteInstance(props.id);
|
|
487
|
+
originOnClose == null ? void 0 : originOnClose();
|
|
488
|
+
}
|
|
489
|
+
}));
|
|
490
|
+
seed++;
|
|
491
|
+
const id = `message_${seed}`;
|
|
492
|
+
props.id = id;
|
|
493
|
+
const messageContext = initInstance(id, props, messageContent);
|
|
494
|
+
instances.push(messageContext);
|
|
495
|
+
props.visible = true;
|
|
496
|
+
}
|
|
497
|
+
function message(params) {
|
|
498
|
+
const options = normalizeOptions(params);
|
|
499
|
+
open(__spreadValues({}, options));
|
|
500
|
+
}
|
|
501
|
+
function success(params) {
|
|
502
|
+
const options = normalizeOptions(params);
|
|
503
|
+
open(__spreadProps(__spreadValues({}, options), {
|
|
504
|
+
type: "success"
|
|
505
|
+
}));
|
|
506
|
+
}
|
|
507
|
+
function error(params) {
|
|
508
|
+
const options = normalizeOptions(params);
|
|
509
|
+
open(__spreadProps(__spreadValues({}, options), {
|
|
510
|
+
type: "error"
|
|
511
|
+
}));
|
|
512
|
+
}
|
|
513
|
+
function warning(params) {
|
|
514
|
+
const options = normalizeOptions(params);
|
|
515
|
+
open(__spreadProps(__spreadValues({}, options), {
|
|
516
|
+
type: "warning"
|
|
517
|
+
}));
|
|
518
|
+
}
|
|
519
|
+
function info(params) {
|
|
520
|
+
const options = normalizeOptions(params);
|
|
521
|
+
open(__spreadProps(__spreadValues({}, options), {
|
|
522
|
+
type: "info"
|
|
523
|
+
}));
|
|
524
|
+
}
|
|
525
|
+
const Message = Object.assign(message, {
|
|
526
|
+
success,
|
|
527
|
+
error,
|
|
528
|
+
warning,
|
|
529
|
+
info
|
|
530
|
+
});
|
|
531
|
+
var index = {
|
|
532
|
+
title: "Message \u5168\u5C40\u63D0\u793A",
|
|
533
|
+
category: "\u53CD\u9988",
|
|
534
|
+
status: "100%",
|
|
535
|
+
install(app) {
|
|
536
|
+
app.config.globalProperties.$message = Message;
|
|
537
|
+
}
|
|
538
|
+
};
|
|
539
|
+
export { Message, index as default, messageProps };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
var ie=Object.defineProperty,ue=Object.defineProperties;var de=Object.getOwnPropertyDescriptors;var B=Object.getOwnPropertySymbols;var me=Object.prototype.hasOwnProperty,fe=Object.prototype.propertyIsEnumerable;var L=(c,e,f)=>e in c?ie(c,e,{enumerable:!0,configurable:!0,writable:!0,value:f}):c[e]=f,p=(c,e)=>{for(var f in e||(e={}))me.call(e,f)&&L(c,f,e[f]);if(B)for(var f of B(e))fe.call(e,f)&&L(c,f,e[f]);return c},b=(c,e)=>ue(c,de(e));(function(c,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis!="undefined"?globalThis:c||self,e(c.index={},c.Vue))})(this,function(c,e){"use strict";const f=n=>typeof n=="string",k={name:{type:String,default:"",required:!0},size:{type:[Number,String],default:"inherit"},color:{type:String,default:"inherit"},component:{type:Object,default:null},classPrefix:{type:String,default:"icon"},operable:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},rotate:{type:[Number,String]}},O={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};function C(n,t,s){let o=n;return t&&(o+=`__${t}`),s&&(o+=`--${s}`),o}function y(n,t=!1){const s=t?`.devui-${n}`:`devui-${n}`;return{b:()=>C(s),e:l=>l?C(s,l):"",m:l=>l?C(s,"",l):"",em:(l,d)=>l&&d?C(s,l,d):""}}var ge="",_=e.defineComponent({name:"DSvgIcon",props:O,setup(n){const{name:t,color:s,size:o}=e.toRefs(n),r=y("svg-icon"),a=e.computed(()=>`#icon-${t.value}`),g=e.computed(()=>typeof o.value=="number"?`${o.value}px`:o.value),l={width:g.value,height:g.value};return()=>e.createVNode("svg",{class:r.b(),style:l},[e.createVNode("use",{"xlink:href":a.value,fill:s.value},null)])}});function j(n){return/^((http|https):)?\/\//.test(n)}function A(n,t){const{component:s,name:o,size:r,color:a,classPrefix:g,rotate:l}=e.toRefs(n),d=y("icon"),i=e.computed(()=>typeof r.value=="number"?`${r.value}px`:r.value),m=s.value?e.resolveDynamicComponent(s.value):e.resolveDynamicComponent(_),v=()=>e.createVNode("img",e.mergeProps({src:o.value,alt:o.value.split("/")[o.value.split("/").length-1],class:[(l==null?void 0:l.value)==="infinite"&&d.m("spin")],style:{width:i.value||"",transform:`rotate(${l==null?void 0:l.value}deg)`,verticalAlign:"middle"}},t.attrs),null),z=()=>e.createVNode(m,e.mergeProps({name:o.value,color:a.value,size:i.value,class:[(l==null?void 0:l.value)==="infinite"&&d.m("spin")],style:{transform:`rotate(${l==null?void 0:l.value}deg)`}},t.attrs),null),N=()=>{const S=/^icon-/.test(o.value)?o.value:`${g.value}-${o.value}`;return e.createVNode("i",e.mergeProps({class:[g.value,S,(l==null?void 0:l.value)==="infinite"&&d.m("spin")],style:{fontSize:i.value,color:a.value,transform:`rotate(${l==null?void 0:l.value}deg)`}},t.attrs),null)};return{iconDom:()=>s.value?z():j(o.value)?v():N()}}var R=e.defineComponent({name:"DIcon",props:k,emits:["click"],setup(n,t){const{disabled:s,operable:o}=e.toRefs(n),{iconDom:r}=A(n,t),a=y("icon"),g=e.computed(()=>({[a.e("container")]:!0,[a.m("disabled")]:s.value,[a.m("operable")]:o.value,[a.m("no-slots")]:!Object.keys(t.slots).length})),l=d=>{s.value||t.emit("click",d)};return()=>{var d,i,m,v;return e.createVNode("div",{class:g.value,onClick:l},[(i=(d=t.slots).prefix)==null?void 0:i.call(d),r(),(v=(m=t.slots).suffix)==null?void 0:v.call(m)])}}}),ye="";e.defineComponent({name:"DIconGroup",setup(n,t){const s=y("icon-group");return()=>{var o,r;return e.createVNode("div",{class:s.b()},[(r=(o=t.slots).default)==null?void 0:r.call(o)])}}});var E=e.defineComponent({emits:["click"],setup(n,{emit:t}){const s=y("message");return()=>e.createVNode("div",{class:s.e("icon-close"),onClick:o=>t("click",o)},[e.createVNode(R,{name:"close",size:"14px"},null)])}});const x={id:{type:String,default:""},visible:{type:Boolean,default:!1},message:{type:String,default:""},type:{type:String,default:"normal"},bordered:{type:Boolean,default:!0},shadow:{type:Boolean,default:!0},duration:{type:Number,default:3e3},showClose:{type:Boolean,default:!1},onClose:{type:Function}},V=y("message");function F(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"},null)])}function U(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 192a58.432 58.432 0 0 0-58.24 63.744l23.36 256.384a35.072 35.072 0 0 0 69.76 0l23.296-256.384A58.432 58.432 0 0 0 512 256zm0 512a51.2 51.2 0 1 0 0-102.4 51.2 51.2 0 0 0 0 102.4z"},null)])}function q(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"},null)])}function G(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 393.664L407.936 353.6a38.4 38.4 0 1 0-54.336 54.336L457.664 512 353.6 616.064a38.4 38.4 0 1 0 54.336 54.336L512 566.336 616.064 670.4a38.4 38.4 0 1 0 54.336-54.336L566.336 512 670.4 407.936a38.4 38.4 0 1 0-54.336-54.336L512 457.664z"},null)])}var ve="",X=e.defineComponent({name:"DMessage",props:x,emits:["destroy","close"],setup(n,{emit:t,slots:s}){const{visible:o,message:r,type:a,bordered:g,shadow:l,showClose:d}=e.toRefs(n),i=y("message");let m=null,v;const z=()=>{t("destroy")},N=()=>{var u;m&&clearTimeout(m),m=null,(u=n.onClose)==null||u.call(n)},P=()=>{m&&(clearTimeout(m),m=null)},S=()=>{if(n.visible){const u=n.duration-(Date.now()-v);m=setTimeout(N,u)}};e.watch(()=>n.visible,u=>{u&&(v=Date.now(),n.duration&&(m=setTimeout(N,n.duration)))});const oe=e.computed(()=>({[i.b()]:!0,[i.m(a.value)]:!0})),se=e.computed(()=>H(n.id)),le=e.computed(()=>{const u={};return g.value||(u.border="none"),l.value||(u["box-shadow"]="none"),b(p({},u),{top:`${se.value}px`})}),ae=e.computed(()=>{const u=e.computed(()=>({[i.e("image")]:!0,[i.em("image",a.value)]:!0}));return!(!a.value||a.value==="normal")&&e.createVNode("span",{class:u.value},[a.value&&(a.value==="success"&&e.createVNode(F,null,null)||a.value==="info"&&e.createVNode(q,null,null)||a.value==="warning"&&e.createVNode(U,null,null)||a.value==="error"&&e.createVNode(G,null,null))])}),ce=e.computed(()=>{var T;const u=e.computed(()=>({[i.e("content")]:!0,[i.em("content",a.value)]:!0}));return e.createVNode("span",{class:u.value},[r.value?r.value:(T=s.default)==null?void 0:T.call(s)])}),re=e.computed(()=>d.value&&e.createVNode("span",{class:[i.e("close")],onClick:N},[e.createVNode(E,null,null)]));return()=>e.createVNode(e.Transition,{name:"message-fade",onAfterLeave:z},{default:()=>[o.value&&e.createVNode("div",{class:oe.value,style:p({},le.value),onMouseenter:P,onMouseleave:S},[ae.value,ce.value,re.value])]})}});function W(n){return typeof n=="function"||Object.prototype.toString.call(n)==="[object Object]"&&!e.isVNode(n)}const I=e.shallowReactive([]),H=n=>I.findIndex(s=>s.id===n)*65+80,J=n=>{const t=I.findIndex(s=>s.id===n);return t!==-1&&I.splice(t,1),t},K=(n,t,s)=>{const o=document.createElement("div");o.id=n;const r=e.createApp({setup(){return e.onUnmounted(()=>{document.body.removeChild(o)}),()=>e.createVNode(X,e.mergeProps(t,{id:n,onDestroy:r.unmount}),W(s)?s:{default:()=>[s]})}});return document.body.appendChild(o),r.mount(o),{id:n,props:t}},D={duration:3e3,type:"normal"},h=n=>{const t=!n||f(n)?{message:n}:n;return p(p({},D),t)};let $=0;function w(n){const t=n.onClose||null,s=n.message;delete n.message;const o=e.reactive(b(p(p({},D),n),{onClose:()=>{o.visible=!1,J(o.id),t==null||t()}}));$++;const r=`message_${$}`;o.id=r;const a=K(r,o,s);I.push(a),o.visible=!0}function Q(n){const t=h(n);w(p({},t))}function Y(n){const t=h(n);w(b(p({},t),{type:"success"}))}function Z(n){const t=h(n);w(b(p({},t),{type:"error"}))}function ee(n){const t=h(n);w(b(p({},t),{type:"warning"}))}function ne(n){const t=h(n);w(b(p({},t),{type:"info"}))}const M=Object.assign(Q,{success:Y,error:Z,warning:ee,info:ne});var te={title:"Message \u5168\u5C40\u63D0\u793A",category:"\u53CD\u9988",status:"100%",install(n){n.config.globalProperties.$message=M}};c.Message=M,c.default=te,c.messageProps=x,Object.defineProperty(c,"__esModule",{value:!0}),c[Symbol.toStringTag]="Module"});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.devui-icon__container{display:inline-block;color:var(--devui-icon-fill, #71757f)}.devui-icon__container>*:not(:last-child){vertical-align:middle;margin-right:8px}.devui-icon__container i{vertical-align:middle;transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--no-slots i,.devui-icon--no-slots img{display:block}.devui-icon--disabled{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-icon--disabled i{color:var(--devui-disabled-text, #adb0b8)}.devui-icon--operable:not(.devui-icon--disabled){cursor:pointer;transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--operable:not(.devui-icon--disabled) i{cursor:pointer}.devui-icon--operable:hover:not(.devui-icon--disabled){color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:hover:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-hover, var(--devui-list-item-hover-bg, #f2f2f3))}.devui-icon--operable:hover:not(.devui-icon--disabled) i{color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:active:not(.devui-icon--disabled){color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable:active:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-active, var(--devui-list-item-active-bg, #f2f5fc))}.devui-icon--operable:active:not(.devui-icon--disabled) i{color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable.devui-icon__container{height:32px;line-height:32px;padding:0 8px;margin-left:-8px;border-radius:var(--devui-border-radius, 2px);transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--spin{animation:iconSpin 2.5s linear infinite}.devui-svg-icon{vertical-align:middle}@keyframes iconSpin{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.devui-icon-group{display:inline-flex;align-items:center}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable){padding:8px;margin-left:0}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable):first-child{margin-left:-8px}.devui-icon-group>*:not(:first-child){margin-left:0}.devui-message{position:fixed;z-index:var(--devui-z-index-modal, 1079);padding:10px 15px;border-radius:var(--devui-border-radius-feedback, 4px);left:50%;transform:translate(-50%);top:80px;display:flex;align-items:center;border-width:1px;border-style:solid;border-color:var(--devui-line, #d7d8da);box-shadow:0 3px 6px -4px #0000001f,0 6px 16px #00000014,0 9px 28px 8px #0000000d;background-color:var(--devui-base-bg, #ffffff);transition:top .5s ease}.devui-message--success{background-color:var(--devui-success-bg, #edfff9);border-color:var(--devui-success-line, #50d4ab)}.devui-message--info{background-color:var(--devui-info-bg, #f2f5fc);border-color:var(--devui-info-line, #5e7ce0)}.devui-message--warning{background-color:var(--devui-warning-bg, #fff3e8);border-color:var(--devui-warning-line, #fa9841)}.devui-message--error{background-color:var(--devui-danger-bg, #ffeeed);border-color:var(--devui-danger-line, #f66f6a)}.devui-message__close{margin-left:auto;padding-left:10px;margin-top:-2px}.devui-message__image{margin-top:1px;display:inline-block;width:var(--devui-font-size-icon, 16px);min-width:var(--devui-font-size-icon, 16px);min-height:var(--devui-font-size-icon, 16px);height:var(--devui-font-size-icon, 16px);padding:0;line-height:1;margin-right:10px}.devui-message__image--success{color:var(--devui-success, #50d4ab)}.devui-message__image--info{color:var(--devui-info, #5e7ce0)}.devui-message__image--warning{color:var(--devui-warning, #fac20a)}.devui-message__image--error{color:var(--devui-danger, #f66f6a)}.devui-message__content{font-size:var(--devui-font-size-page-title, 16px);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.devui-message__content--success{color:var(--devui-success, #50d4ab)}.devui-message__content--info{color:var(--devui-info, #5e7ce0)}.devui-message__content--warning{color:var(--devui-warning, #fac20a)}.devui-message__content--error{color:var(--devui-danger, #f66f6a)}.message-fade-enter-active,.message-fade-leave-active{transform:translate(-50%);transition:all .5s ease}.message-fade-enter-from,.message-fade-leave-to{opacity:0;transform:translate(-50%,-200%)}
|