vue-devui 1.5.0 → 1.5.2
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 +10 -7
- package/image-preview/index.es.js +2 -0
- package/image-preview/index.umd.js +1 -1
- package/menu/index.es.js +7 -7
- package/menu/index.umd.js +1 -1
- package/package.json +2 -1
- package/pagination/index.es.js +8 -8
- package/pagination/index.umd.js +11 -11
- package/select/index.es.js +8 -8
- package/select/index.umd.js +12 -12
- package/tag/index.es.js +8 -8
- package/tag/index.umd.js +1 -1
- package/time-select/index.es.js +8 -8
- package/time-select/index.umd.js +5 -5
- package/vue-devui.es.js +18 -16
- package/vue-devui.umd.js +8 -8
package/README.md
CHANGED
|
@@ -41,18 +41,17 @@ Install with pnpm
|
|
|
41
41
|
pnpm add vue-devui
|
|
42
42
|
```
|
|
43
43
|
|
|
44
|
-
|
|
45
44
|
Then import `DevUI` in the `main.ts` file:
|
|
46
45
|
|
|
47
46
|
```ts
|
|
48
|
-
import { createApp } from 'vue'
|
|
49
|
-
import App from './App.vue'
|
|
47
|
+
import { createApp } from 'vue';
|
|
48
|
+
import App from './App.vue';
|
|
50
49
|
|
|
51
50
|
// Import Vue DevUI component and style
|
|
52
|
-
import DevUI from 'vue-devui'
|
|
53
|
-
import 'vue-devui/style.css'
|
|
51
|
+
import DevUI from 'vue-devui';
|
|
52
|
+
import 'vue-devui/style.css';
|
|
54
53
|
|
|
55
|
-
createApp(App).use(DevUI).mount('#app')
|
|
54
|
+
createApp(App).use(DevUI).mount('#app');
|
|
56
55
|
```
|
|
57
56
|
|
|
58
57
|
Then you can use the vue devui component(such as `<d-button>`) in the `App.vue` file:
|
|
@@ -119,6 +118,7 @@ Maintainers are community members who have made outstanding contributions and ha
|
|
|
119
118
|
- [brenner8023](https://github.com/brenner8023)
|
|
120
119
|
|
|
121
120
|
Outstanding contributions include, but are not limited to, the following:
|
|
121
|
+
|
|
122
122
|
- 10 or more PRs are merged
|
|
123
123
|
- Put forward more than 10 review opinions approved by PR authors
|
|
124
124
|
- Provide constructive optimization advice and promote the project to become better
|
|
@@ -220,6 +220,9 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
|
|
|
220
220
|
<td align="center"><a href="https://github.com/Whbbit1999"><img src="https://avatars.githubusercontent.com/u/60510247?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Whbbit1999</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=Whbbit1999" title="Code">💻</a></td>
|
|
221
221
|
<td align="center"><a href="https://github.com/zhaoShijuan"><img src="https://avatars.githubusercontent.com/u/31791365?v=4?s=100" width="100px;" alt=""/><br /><sub><b>zhaoShijuan</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=zhaoShijuan" title="Code">💻</a></td>
|
|
222
222
|
<td align="center"><a href="https://github.com/XiaoRIGE"><img src="https://avatars.githubusercontent.com/u/33147011?v=4?s=100" width="100px;" alt=""/><br /><sub><b>XiaoRIGE</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=XiaoRIGE" title="Code">💻</a></td>
|
|
223
|
+
<td align="center"><a href="https://github.com/xiaogonggong-w"><img src="https://avatars.githubusercontent.com/u/79799040?v=4" width="100px;" alt=""/><br /><sub><b>xiaogonggong-w</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=xiaogonggong-w" title="Code">💻</a></td>
|
|
224
|
+
<td align="center"><a href="https://github.com/hqchqc"><img src="https://avatars.githubusercontent.com/u/51051157?v=4" width="100px;" alt=""/><br /><sub><b>hqchqc</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=hqchqc" title="Code">💻</a></td>
|
|
225
|
+
<td align="center"><a href="https://github.com/Lucky-Ya-Q"><img src="https://avatars.githubusercontent.com/u/63504321?v=4" width="100px;" alt=""/><br /><sub><b>Lucky-Ya-Q</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=Lucky-Ya-Q" title="Code">💻</a></td>
|
|
223
226
|
</tr>
|
|
224
227
|
</tbody>
|
|
225
228
|
</table>
|
|
@@ -233,7 +236,7 @@ This project follows the [all-contributors](https://github.com/all-contributors/
|
|
|
233
236
|
|
|
234
237
|
## Partner project
|
|
235
238
|
|
|
236
|
-
- [H5-Dooring - 让H5制作,更简单](http://h5.dooring.cn/)
|
|
239
|
+
- [H5-Dooring - 让 H5 制作,更简单](http://h5.dooring.cn/)
|
|
237
240
|
- [灯塔 - 公益性质的反霸凌团队](https://www.light-tower.top/)
|
|
238
241
|
|
|
239
242
|
## License
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var X=Object.defineProperty;var R=(s,e,d)=>e in s?X(s,e,{enumerable:!0,configurable:!0,writable:!0,value:d}):s[e]=d;var r=(s,e,d)=>(R(s,typeof e!="symbol"?e+"":e,d),d);(function(s,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis!="undefined"?globalThis:s||self,e(s.index={},s.Vue))})(this,function(s,e){"use strict";const d={url:{type:String,default:"",required:!0},previewUrlList:{type:Array,default:()=>[],required:!0},zIndex:{type:Number,required:!1},backDropZIndex:{type:Number,required:!1}};class k{constructor(o,n={}){r(this,"el");r(this,"oTransformX",0);r(this,"oTransformY",0);r(this,"transformX");r(this,"transformY");r(this,"zoom");r(this,"rotate");r(this,"STEP",.25);r(this,"MIN_SCALE",.2);r(this,"MAX_SCALE",2.5);r(this,"TRANSFORMX",0);r(this,"TRANSFORMY",0);r(this,"ZOOM",1);r(this,"ROTATE",0);this.el=o,this.transformX=n.transformX||this.TRANSFORMX,this.transformY=n.transformY||this.TRANSFORMY,this.zoom=n.zoom||this.ZOOM,this.rotate=n.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=o=>{const n=o.clientX,i=o.clientY;document.onmousemove=l=>{const u=l.clientX-n,m=l.clientY-i;this.transformX=this.oTransformX+u,this.transformY=this.oTransformY+m,this.el.style.cursor="grabbing",this.setPosition()}},document.onmouseup=()=>{document.onmousemove=null,this.oTransformX=this.transformX,this.oTransformY=this.transformY,this.el.style.cursor="grab"}}onMouseWheel(){const o=this.throttle(this.setMouseWheel,100);this.el.onmousewheel=n=>{const i=-n.wheelDelta||n.deltaY||n.detail;o(i)}}throttle(o,n){let i=null;return(...l)=>{i||setTimeout(()=>{i=null,o.apply(this,l)},n)}}setMouseWheel(o){if(o<0){if(this.zoom>=this.MAX_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-in",this.setZoomIn(this.STEP)}else{if(this.zoom<=this.MIN_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-out",this.setZoomOut(this.STEP)}this.setPosition()}setZoomIn(o=this.STEP){this.zoom=Math.min(this.MAX_SCALE,this.zoom+o),this.setPosition()}setZoomOut(o=this.STEP){this.zoom=Math.max(this.MIN_SCALE,this.zoom-o),this.setPosition()}setZoomBest(){this.reset(),this.setPosition()}setZoomOriginal(){this.reset(),this.setPosition()}setRotate(){this.rotate+=.25,this.setPosition()}reset(){this.transformX=this.TRANSFORMX,this.transformY=this.TRANSFORMY,this.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}function f(t,o,n){let i=t;return o&&(i+=`__${o}`),n&&(i+=`--${n}`),i}function I(t,o=!1){const n=o?`.devui-${t}`:`devui-${t}`;return{b:()=>f(n),e:a=>a?f(n,a):"",m:a=>a?f(n,"",a):"",em:(a,L)=>a&&L?f(n,a,L):""}}var Y="",Z=e.defineComponent({name:"DImagePreview",props:d,emits:[],setup(t){const o=I("image-preview");let n=null;const i=e.ref(0),l=e.computed(()=>t.previewUrlList[i.value]),u=t.zIndex?{zIndex:t.zIndex}:{},m=t.backDropZIndex?{zIndex:t.backDropZIndex}:{};function a(){const h=document.querySelector(`.${o.e("main-image")}`);n=new k(h)}function L(){i.value=t.previewUrlList.findIndex(h=>h===t.url)}function w(){i.value=i.value<=0?t.previewUrlList.length-1:i.value-1}function p(){i.value=i.value>=t.previewUrlList.length-1?0:i.value+1}function y(){c.close()}function T(){n.setZoomIn()}function $(){n.setZoomOut()}function D(){n.setRotate()}function A(){n.setZoomBest()}function E(){n.setZoomOriginal()}function V(h){h.defaultPrevented||(h.code==="Escape"?y():h.code==="ArrowLeft"?w():h.code==="ArrowRight"&&p())}function S(){document.addEventListener("keydown",V,!1)}function O(){document.removeEventListener("keydown",V,!1)}return e.onMounted(()=>{L(),a(),S()}),e.onUnmounted(()=>{O()}),()=>e.createVNode(e.Fragment,null,[e.createVNode("div",{class:o.b(),style:u},[e.createVNode("img",{class:o.e("main-image"),src:l.value},null),e.createVNode("button",{class:o.e("close-btn"),onClick:y},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8 13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542 2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"},null)])])]),e.createVNode("button",{class:o.e("arrow-left"),onClick:w},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("button",{class:o.e("arrow-right"),onClick:p},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("div",{class:o.e("toolbar")},[e.createVNode("button",{onClick:T},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z"},null)])])])]),e.createVNode("button",{onClick:$},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"},null)])])])]),e.createVNode("button",{onClick:D},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468 7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356 12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355 0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289 2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661 13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151 Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6 10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712 9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712 7.17157288,10 8,10 Z",fill:"#293040"},null)])])]),e.createVNode("button",{onClick:w},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("span",{class:o.e("index")},[i.value+1,e.createTextVNode(":"),t.previewUrlList.length]),e.createVNode("button",{onClick:p},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("button",{onClick:A},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275 L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914 L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16 L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994 L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914 L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",fill:"#293040","fill-rule":"nonzero"},null)])])]),e.createVNode("button",{onClick:E},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])]),e.createVNode("div",{class:o.e("bg"),style:m},null)])}});function M(t){return e.createApp(Z,t)}class c{static open(o){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),M(o).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var o;(o=this.$body)==null||o.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}r(c,"$body",null),r(c,"$div",null),r(c,"$overflow","");function x(t){c.open({url:t.url,previewUrlList:t.previewUrlList,zIndex:t.zIndex,backDropZIndex:t.backDropZIndex})}function N(){c.close()}function C(t){return[...t.querySelectorAll("img")].map(n=>n.getAttribute("src"))}function v(t){var i;t.stopPropagation();const o=t.currentTarget,n=t.target;if(((i=n==null?void 0:n.nodeName)==null?void 0:i.toLowerCase())==="img"){const l=C(o),u=n.getAttribute("src");x({url:u,previewUrlList:l,zIndex:o==null?void 0:o.zIndex,backDropZIndex:o==null?void 0:o.backDropZIndex})}}function g(t){t.addEventListener("click",v)}function z(t){t.removeEventListener("click",v)}var b={mounted(t,o){if(!o.value)return g(t);const{custom:n,disableDefault:i}=o.value;n instanceof Object&&(n.open=()=>{const l=C(t);x({url:l==null?void 0:l[0],previewUrlList:l,zIndex:t==null?void 0:t.zIndex,backDropZIndex:t==null?void 0:t.backDropZIndex})},n.close=()=>N()),!i&&g(t)},unmounted(){N()},updated(t,o){var n,i;if(t.zIndex=(n=o.value)==null?void 0:n.zIndex,t.backDropZIndex=(i=o.value)==null?void 0:i.backDropZIndex,o.value){const{value:{disableDefault:l},oldValue:{disableDefault:u}}=o;l!==u&&(l?z(t):g(t))}}},P={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.directive("d-image-preview",b),t.config.globalProperties.$imagePreviewService=c}};s.ImagePreviewDirective=b,s.ImagePreviewService=c,s.default=P,s.imagePreviewProps=d,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
|
|
1
|
+
var X=Object.defineProperty;var Y=(s,e,d)=>e in s?X(s,e,{enumerable:!0,configurable:!0,writable:!0,value:d}):s[e]=d;var r=(s,e,d)=>(Y(s,typeof e!="symbol"?e+"":e,d),d);(function(s,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis!="undefined"?globalThis:s||self,e(s.index={},s.Vue))})(this,function(s,e){"use strict";const d={url:{type:String,default:"",required:!0},previewUrlList:{type:Array,default:()=>[],required:!0},zIndex:{type:Number,required:!1},backDropZIndex:{type:Number,required:!1}};class k{constructor(o,n={}){r(this,"el");r(this,"oTransformX",0);r(this,"oTransformY",0);r(this,"transformX");r(this,"transformY");r(this,"zoom");r(this,"rotate");r(this,"STEP",.25);r(this,"MIN_SCALE",.2);r(this,"MAX_SCALE",2.5);r(this,"TRANSFORMX",0);r(this,"TRANSFORMY",0);r(this,"ZOOM",1);r(this,"ROTATE",0);this.el=o,this.transformX=n.transformX||this.TRANSFORMX,this.transformY=n.transformY||this.TRANSFORMY,this.zoom=n.zoom||this.ZOOM,this.rotate=n.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=o=>{const n=o.clientX,i=o.clientY;document.onmousemove=l=>{const u=l.clientX-n,m=l.clientY-i;this.transformX=this.oTransformX+u,this.transformY=this.oTransformY+m,this.el.style.cursor="grabbing",this.setPosition()}},document.onmouseup=()=>{document.onmousemove=null,this.oTransformX=this.transformX,this.oTransformY=this.transformY,this.el.style.cursor="grab"}}onMouseWheel(){const o=this.throttle(this.setMouseWheel,100);this.el.onmousewheel=n=>{const i=-n.wheelDelta||n.deltaY||n.detail;o(i)}}throttle(o,n){let i=null;return(...l)=>{i||setTimeout(()=>{i=null,o.apply(this,l)},n)}}setMouseWheel(o){if(o<0){if(this.zoom>=this.MAX_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-in",this.setZoomIn(this.STEP)}else{if(this.zoom<=this.MIN_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-out",this.setZoomOut(this.STEP)}this.setPosition()}setZoomIn(o=this.STEP){this.zoom=Math.min(this.MAX_SCALE,this.zoom+o),this.setPosition()}setZoomOut(o=this.STEP){this.zoom=Math.max(this.MIN_SCALE,this.zoom-o),this.setPosition()}setZoomBest(){this.reset(),this.setPosition()}setZoomOriginal(){this.reset(),this.setPosition()}setRotate(){this.rotate+=.25,this.setPosition()}reset(){this.transformX=this.TRANSFORMX,this.transformY=this.TRANSFORMY,this.oTransformX=this.transformX,this.oTransformY=this.transformY,this.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}function f(t,o,n){let i=t;return o&&(i+=`__${o}`),n&&(i+=`--${n}`),i}function I(t,o=!1){const n=o?`.devui-${t}`:`devui-${t}`;return{b:()=>f(n),e:a=>a?f(n,a):"",m:a=>a?f(n,"",a):"",em:(a,L)=>a&&L?f(n,a,L):""}}var R="",Z=e.defineComponent({name:"DImagePreview",props:d,emits:[],setup(t){const o=I("image-preview");let n=null;const i=e.ref(0),l=e.computed(()=>t.previewUrlList[i.value]),u=t.zIndex?{zIndex:t.zIndex}:{},m=t.backDropZIndex?{zIndex:t.backDropZIndex}:{};function a(){const h=document.querySelector(`.${o.e("main-image")}`);n=new k(h)}function L(){i.value=t.previewUrlList.findIndex(h=>h===t.url)}function w(){i.value=i.value<=0?t.previewUrlList.length-1:i.value-1}function p(){i.value=i.value>=t.previewUrlList.length-1?0:i.value+1}function y(){c.close()}function T(){n.setZoomIn()}function $(){n.setZoomOut()}function D(){n.setRotate()}function A(){n.setZoomBest()}function E(){n.setZoomOriginal()}function V(h){h.defaultPrevented||(h.code==="Escape"?y():h.code==="ArrowLeft"?w():h.code==="ArrowRight"&&p())}function S(){document.addEventListener("keydown",V,!1)}function O(){document.removeEventListener("keydown",V,!1)}return e.onMounted(()=>{L(),a(),S()}),e.onUnmounted(()=>{O()}),()=>e.createVNode(e.Fragment,null,[e.createVNode("div",{class:o.b(),style:u},[e.createVNode("img",{class:o.e("main-image"),src:l.value},null),e.createVNode("button",{class:o.e("close-btn"),onClick:y},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8 13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542 2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"},null)])])]),e.createVNode("button",{class:o.e("arrow-left"),onClick:w},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("button",{class:o.e("arrow-right"),onClick:p},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("div",{class:o.e("toolbar")},[e.createVNode("button",{onClick:T},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z"},null)])])])]),e.createVNode("button",{onClick:$},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"},null)])])])]),e.createVNode("button",{onClick:D},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468 7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356 12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355 0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289 2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661 13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151 Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6 10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712 9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712 7.17157288,10 8,10 Z",fill:"#293040"},null)])])]),e.createVNode("button",{onClick:w},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("span",{class:o.e("index")},[i.value+1,e.createTextVNode(":"),t.previewUrlList.length]),e.createVNode("button",{onClick:p},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("button",{onClick:A},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275 L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914 L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16 L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994 L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914 L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",fill:"#293040","fill-rule":"nonzero"},null)])])]),e.createVNode("button",{onClick:E},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])]),e.createVNode("div",{class:o.e("bg"),style:m},null)])}});function M(t){return e.createApp(Z,t)}class c{static open(o){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),M(o).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var o;(o=this.$body)==null||o.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}r(c,"$body",null),r(c,"$div",null),r(c,"$overflow","");function x(t){c.open({url:t.url,previewUrlList:t.previewUrlList,zIndex:t.zIndex,backDropZIndex:t.backDropZIndex})}function N(){c.close()}function C(t){return[...t.querySelectorAll("img")].map(n=>n.getAttribute("src"))}function v(t){var i;t.stopPropagation();const o=t.currentTarget,n=t.target;if(((i=n==null?void 0:n.nodeName)==null?void 0:i.toLowerCase())==="img"){const l=C(o),u=n.getAttribute("src");x({url:u,previewUrlList:l,zIndex:o==null?void 0:o.zIndex,backDropZIndex:o==null?void 0:o.backDropZIndex})}}function g(t){t.addEventListener("click",v)}function z(t){t.removeEventListener("click",v)}var b={mounted(t,o){if(!o.value)return g(t);const{custom:n,disableDefault:i}=o.value;n instanceof Object&&(n.open=()=>{const l=C(t);x({url:l==null?void 0:l[0],previewUrlList:l,zIndex:t==null?void 0:t.zIndex,backDropZIndex:t==null?void 0:t.backDropZIndex})},n.close=()=>N()),!i&&g(t)},unmounted(){N()},updated(t,o){var n,i;if(t.zIndex=(n=o.value)==null?void 0:n.zIndex,t.backDropZIndex=(i=o.value)==null?void 0:i.backDropZIndex,o.value){const{value:{disableDefault:l},oldValue:{disableDefault:u}}=o;l!==u&&(l?z(t):g(t))}}},P={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.directive("d-image-preview",b),t.config.globalProperties.$imagePreviewService=c}};s.ImagePreviewDirective=b,s.ImagePreviewService=c,s.default=P,s.imagePreviewProps=d,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
|
package/menu/index.es.js
CHANGED
|
@@ -121,8 +121,7 @@ function getRoot(path) {
|
|
|
121
121
|
function clearSelect_isHorizontal(ele, event) {
|
|
122
122
|
let element = event.target;
|
|
123
123
|
let stack = [];
|
|
124
|
-
const
|
|
125
|
-
const root = getRoot(path);
|
|
124
|
+
const root = getRoot(event.composedPath());
|
|
126
125
|
stack = [...Array.from(root.children)];
|
|
127
126
|
if (element.tagName === "SPAN") {
|
|
128
127
|
element = element.parentElement;
|
|
@@ -232,7 +231,7 @@ function changeRoute(props, router, useRouter, key) {
|
|
|
232
231
|
}
|
|
233
232
|
const ns$3 = useNamespace("menu");
|
|
234
233
|
function useClick(e) {
|
|
235
|
-
const paths = e.
|
|
234
|
+
const paths = e.composedPath();
|
|
236
235
|
for (let i = 0; i < paths.length; i++) {
|
|
237
236
|
const path = paths[i];
|
|
238
237
|
if (path.classList.contains(`${ns$3.b()}-horizontal`)) {
|
|
@@ -265,7 +264,7 @@ var MenuItem = defineComponent({
|
|
|
265
264
|
const {
|
|
266
265
|
disabled
|
|
267
266
|
} = toRefs(props);
|
|
268
|
-
const isSelect = ref(initSelect(defaultSelectKey, key, multiple, disabled));
|
|
267
|
+
const isSelect = ref(initSelect(defaultSelectKey.value, key, multiple, disabled));
|
|
269
268
|
const isLayer1 = ref(true);
|
|
270
269
|
const rootMenuEmit = inject("rootMenuEmit");
|
|
271
270
|
const useRouter = inject("useRouter");
|
|
@@ -344,7 +343,7 @@ var MenuItem = defineComponent({
|
|
|
344
343
|
classObject.value[menuItemSelect] = false;
|
|
345
344
|
}
|
|
346
345
|
});
|
|
347
|
-
watch(() => defaultSelectKey, (n) => {
|
|
346
|
+
watch(() => [...defaultSelectKey.value], (n) => {
|
|
348
347
|
isSelect.value = initSelect(n, key, multiple, disabled);
|
|
349
348
|
classObject.value[menuItemSelect] = isSelect.value;
|
|
350
349
|
});
|
|
@@ -796,7 +795,8 @@ var Menu = defineComponent({
|
|
|
796
795
|
const {
|
|
797
796
|
openKeys,
|
|
798
797
|
mode,
|
|
799
|
-
collapsed
|
|
798
|
+
collapsed,
|
|
799
|
+
defaultSelectKeys
|
|
800
800
|
} = toRefs(props);
|
|
801
801
|
const menuId = randomId(16);
|
|
802
802
|
const store = useStore(menuId);
|
|
@@ -805,7 +805,7 @@ var Menu = defineComponent({
|
|
|
805
805
|
provide("defaultIndent", props["indentSize"]);
|
|
806
806
|
provide("multiple", props["multiple"]);
|
|
807
807
|
provide("openKeys", openKeys);
|
|
808
|
-
provide("defaultSelectKey",
|
|
808
|
+
provide("defaultSelectKey", defaultSelectKeys);
|
|
809
809
|
provide("mode", mode);
|
|
810
810
|
provide("collapsedIndent", props["collapsedIndent"]);
|
|
811
811
|
provide("rootMenuEmit", ctx.emit);
|
package/menu/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var Ae=Object.defineProperty;var ze=(h,n,$)=>n in h?Ae(h,n,{enumerable:!0,configurable:!0,writable:!0,value:$}):h[n]=$;var re=(h,n,$)=>(ze(h,typeof n!="symbol"?n+"":n,$),$);(function(h,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(h=typeof globalThis!="undefined"?globalThis:h||self,n(h.index={},h.Vue))})(this,function(h,n){"use strict";function $(e,l,t){let s=e;return l&&(s+=`__${l}`),t&&(s+=`--${t}`),s}function S(e,l=!1){const t=l?`.devui-${e}`:`devui-${e}`;return{b:()=>$(t),e:u=>u?$(t,u):"",m:u=>u?$(t,"",u):"",em:(u,f)=>u&&f?$(t,u,f):""}}const Q=[];let U=[];const W=n.ref(24),D=S("menu"),ce=S("submenu"),R=D.b(),X=`${D.b()}-item-horizontal-wrapper`,Y=`${D.b()}-item-select`,Z=`${D.b()}-active-parent`;function de(e){W.value=e}function ue(e){Q.push(e)}function fe(){U=[],Q.forEach(t=>{U.push(t.el.parentElement)});const e=[...U],l=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(R)){const s=t.children;e.unshift(...Array.from(s));continue}else{if(t.tagName==="DIV")if(t.classList.contains(`${D.b()}-item-vertical-wrapper`)||t.classList.contains(`${ce.b()}-menu-item-vertical-wrapper`)){const s=t.parentElement;if(e.unshift(...Array.from(t.children)),s==null?void 0:s.classList.contains(R))t.classList.add("layer_1");else{let a=l((s==null?void 0:s.classList.value)||"");a=Number(a),t.classList.add(`layer_${a}`)}}else{const s=t.parentElement;let a=l((s==null?void 0:s.classList.value)||"");a=Number(a),t.classList.add(`layer_${a}`),t.style.paddingLeft=`${(a===2?1:a-1)*W.value}px`}if(t.tagName==="UL"){const s=t.parentElement,a=t.children;for(let u=0;u<a.length;u++)e.unshift(a[u]);const c=(s==null?void 0:s.classList.value)||"";let i=l(c);(s==null?void 0:s.classList.contains(R))?(i=1,t.classList.add(`layer_${2}`)):(t.classList.add(`layer_${Number(i)+1}`),i=Number(i)+1)}if(t.tagName==="LI"){const s=t.parentElement,a=(s==null?void 0:s.classList.value)||"";let c=l(a);l(a),c=Number(c),t.style.padding=`0 ${c*W.value}px`}}}}function me(e){var s;const l=e;let t=null;for(let a=0;a<l.length;a++){const c=l[a];((s=c==null?void 0:c.classList)==null?void 0:s.contains(`${D.b()}-horizontal`))&&(t=c)}return t}function pe(e,l){let t=l.target,s=[];const{path:a}=l,c=me(a);for(s=[...Array.from(c.children)],t.tagName==="SPAN"&&(t=t.parentElement);s.length;){const i=s.shift();if((i==null?void 0:i.tagName)==="UL"||(i==null?void 0:i.classList.contains(X))){const u=i==null?void 0:i.children;s.unshift(...Array.from(u))}i!==t&&(i==null||i.classList.remove(Y),i==null||i.classList.remove(Z))}}function he(e,l){const t=[],s=l.path||l.composedPath&&l.composedPath();for(let a=0;a<s.length;a++){const c=s[a];if(!c.classList.contains(R))t.push(...Array.from(c.children));else{t.push(...Array.from(c.children));break}}for(;t.length;){const a=t.shift();((a==null?void 0:a.tagName)==="UL"||(a==null?void 0:a.classList.contains(X)))&&t.push(...Array.from(a==null?void 0:a.children)),a!==e&&((a==null?void 0:a.tagName)==="DIV"&&t.unshift(...Array.from(a==null?void 0:a.children)),a==null||a.classList.remove(Y),a==null||a.classList.remove(Z))}}function ee(e,l,t=!1){t?pe(e,l):he(e,l)}function ge(e){var s;const l=/layer_(\d{1,})/gim,t=e.className;return(s=l.exec(t))==null?void 0:s[1]}const ye={disabled:{type:Boolean,default:!1},href:{type:String,default:""},route:{type:[String,Object]}},te=S("menu");function ne(e,l,t,s){const a=n.ref(!1);return t?e.includes(l)?a.value=!0:a.value=!1:e[0]===l&&!s.value?a.value=!0:a.value=!1,a.value}function be(e){var t,s;let l=e.parentElement;for(;!l.classList.contains(te.b());)((t=l.firstElementChild)==null?void 0:t.tagName)==="DIV"&&((s=l==null?void 0:l.firstElementChild)==null||s.classList.add(`${te.b()}-active-parent`)),l=l.parentElement;return l}function ve(e,l,t,s){if(t&&l){const a=e.route||s,c=l.push(a).then(i=>i);return{route:a,routerResult:c}}}const q=S("menu");function se(e){const l=e.path;for(let t=0;t<l.length;t++){const s=l[t];if(s.classList.contains(`${q.b()}-horizontal`))break;if(s.classList.contains(`${q.b()}-item-horizontal-wrapper`))continue;s.tagName!=="SPAN"&&s.classList.add(`${q.b()}-item-select`)}}const P=S("menu"),_=`${P.b()}-item-select`,Le=`${P.b()}-item-disabled`;var F=n.defineComponent({name:"DMenuItem",props:ye,setup(e,l){var d,g;const t=n.getCurrentInstance(),s=String(t==null?void 0:t.vnode.key),a=n.inject("menuStore"),c=n.inject("mode"),i=n.inject("multiple"),u=n.inject("defaultIndent"),f=n.inject("isCollapsed"),y=n.inject("defaultSelectKey"),{disabled:A}=n.toRefs(e),b=n.ref(ne(y,s,i,A)),E=n.ref(!0),z=n.inject("rootMenuEmit"),x=n.inject("useRouter"),v=t==null?void 0:t.appContext.config.globalProperties.$router,p=n.computed(()=>({[`${P.b()}-item`]:!0,[`${P.b()}-item-isCollapsed`]:f.value,[_]:b.value,[Le]:A.value}));a.on("menuItem:clear:select",()=>{b.value=!1});const L=r=>{var V;r.stopPropagation();const o=r.currentTarget;let m;if(e.disabled&&r.preventDefault(),!e.disabled){if(!i)a.emit("menuItem:clear:select"),ee(o,r,c.value==="horizontal"),c.value==="horizontal"&&se(r),b.value=!0,m=ve(e,v,x,s);else if(o.classList.contains(_)){z("deselect",{type:"deselect",key:s,el:o,e:r}),b.value=!1;return}else b.value=!0,o.classList.add(_);m===void 0?z("select",{type:"select",key:s,el:o,e:r}):z("select",{type:"select",key:s,el:o,e:r,route:m})}if(c.value==="vertical"){const M=r.currentTarget;be(M)}if(c.value==="horizontal"){const M=(V=o.parentElement)==null?void 0:V.parentElement;M==null||M.classList.add(`${P.b()}-active-parent`)}},w=n.createVNode("span",{class:`${P.b()}-icon`},[(g=(d=l.slots).icon)==null?void 0:g.call(d)]),N=n.ref(null);return n.watch(A,()=>{i||(p.value[_]=!1)}),n.watch(()=>y,r=>{b.value=ne(r,s,i,A),p.value[_]=b.value}),n.onMounted(()=>{var m,V;let r="";const o=N.value;c.value==="vertical"&&(((V=(m=o.parentElement)==null?void 0:m.parentElement)==null?void 0:V.classList.contains(P.b()))?(E.value=!0,E.value&&(o.style.paddingRight="",o.style.paddingLeft=`${u}px`),n.watch(f,M=>{M?(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")})):E.value=!1)}),()=>c.value==="vertical"?n.createVNode("div",{class:`${P.b()}-item-vertical-wrapper`},[n.createVNode("li",{class:p.value,onClick:L,ref:N},[l.slots.icon!==void 0&&w,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[n.withDirectives(n.createVNode("span",null,[(o=(r=l.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=l.slots).default)==null?void 0:o.call(r)]}})])])]):n.createVNode("li",{class:p.value,onClick:L,ref:N},[l.slots.icon!==void 0&&w,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[n.withDirectives(n.createVNode("span",null,[(o=(r=l.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=l.slots).default)==null?void 0:o.call(r)]}})])])}});function ae(e=8){const l="abcdefghijklmnopqrstuvwxyz0123456789";let t="";for(let s=0;s<e;s++)t+=l[parseInt((Math.random()*l.length).toString())];return t}function le(e){for(;e&&e.tagName!=="LI"&&e.tagName!=="UL";)e=e.parentElement;return e}const oe="0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out",j={"before-enter"(e){e.style.transition=oe,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=oe,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 we=n.defineComponent({name:"DMenuTransition",setup(e,l){return()=>n.createVNode(n.Transition,{onBeforeEnter:t=>j["before-enter"](t),onBeforeLeave:t=>j["before-leave"](t),onEnter:t=>j.enter(t),onAfterEnter:t=>j["after-enter"](t),onLeave:t=>j.leave(t),onAfterLeave:t=>j["after-leave"](t)},{default:()=>{var t,s;return[(s=(t=l.slots).default)==null?void 0:s.call(t)]}})}});const Ne={title:{type:String,default:""},disabled:{type:Boolean,default:!1}},O=S("menu"),$e=S("submenu"),I=`${O.b()}-item-horizontal-wrapper-hidden`,H=`${O.b()}-item-horizontal-wrapper-show`;function k(e,l,t){const s=l.currentTarget,a=s.parentElement,c=t.children;if(t.style.padding="0 20px !important",e==="mouseenter"){if((a==null?void 0:a.tagName)==="DIV"){t.classList.add(`${O.b()}-item-horizontal-wrapper-level`);const{width:i}=s.getClientRects()[0];t.style.top="0px",t.style.left=`${i}px`}else t.style.top="26px",t.style.left="0px";t.classList.remove(I),t.classList.add(H);for(let i=0;i<c.length;i++){const u=c[i];if(u.tagName==="UL"&&u.classList.contains($e.b())){const f=u.getElementsByClassName(`${O.b()}-item-horizontal-wrapper`)[0];u.addEventListener("mouseenter",y=>{y.stopPropagation(),k("mouseenter",y,f),f.classList.remove(I),f.classList.add(H)}),u.addEventListener("mouseleave",y=>{y.stopPropagation(),k("mouseleave",y,f),f.classList.remove(H),f.classList.add(I)})}}}e==="mouseleave"&&(t.classList.remove(H),t.classList.add(I))}const G=S("menu"),T=S("submenu").b();var K=n.defineComponent({name:"DSubMenu",props:Ne,setup(e,l){const t=n.ref(!0),{vnode:{key:s}}=n.getCurrentInstance();let a=String(s);const c=n.inject("openKeys"),i=n.ref(c.value.includes(a)),u=n.inject("defaultIndent"),f=n.inject("isCollapsed"),y=n.inject("mode"),A=n.ref(null),b=n.inject("rootMenuEmit"),E=y.value==="horizontal";a==="null"&&(console.warn("[devui][menu]: Key can not be null"),a=`randomKey-${ae(16)}`);const z=d=>{d.stopPropagation();const g=le(d.target);if(!(g.classList.contains(T)&&E)&&(E&&(ee(g,d,!0),se(d)),!e.disabled&&y.value!=="horizontal")){const r=le(d.target),o=c.value.indexOf(a);o>=0&&r.tagName==="UL"?c.value.splice(o,1):r.tagName==="UL"&&c.value.push(a),i.value=c.value.indexOf(a)>=0,b("submenu-change",{type:"submenu-change",state:i.value,key:a,el:g})}},x=n.ref(null);let v;const p=n.ref(null),L=n.ref(null);let w="";const N=n.ref("");return n.watchEffect(()=>{v=x.value,ue({el:p.value})},{flush:"post"}),n.watch(()=>c,d=>{d.value.includes(a)?i.value=!0:i.value=!1},{deep:!0}),n.onMounted(()=>{var r;const d=L.value,g=p.value;fe(),N.value=`layer_${(r=Array.from(g.classList).at(-1))==null?void 0:r.replace("layer_","")}`,E&&!e.disabled&&(p.value.addEventListener("mouseenter",o=>{o.stopPropagation(),k("mouseenter",o,v)}),p.value.addEventListener("mouseleave",o=>{o.stopPropagation(),k("mouseleave",o,v)})),n.watch(f,o=>{const m=Number(ge(g));Number.isNaN(m)||m>2&&(t.value=!f.value),o?(d.style.padding!=="0"&&(w=d.style.padding),setTimeout(()=>{d.style.padding="0",d.style.width="",d.style.textAlign="center"},300),d.style.display="block"):(d.style.padding=`${w}`,d.style.textAlign="",d.style.display="flex")})}),()=>{var d,g,r,o;return n.withDirectives(n.createVNode("ul",{onClick:z,class:[T,N.value,e.disabled&&`${T}-disabled`],ref:p},[n.createVNode("div",{class:[`${T}-title`],style:`padding: 0 ${u}px`,ref:L},[n.createVNode("span",{class:`${G.b()}-icon`},[(g=(d=l.slots)==null?void 0:d.icon)==null?void 0:g.call(d)]),n.withDirectives(n.createVNode("span",{class:`${T}-title-content`},[e.title]),[[n.vShow,!f.value]]),n.withDirectives(n.createVNode("i",{class:{"icon icon-chevron-up":N.value!==`layer_${T}`,"icon icon-chevron-right":N.value===`layer_${T}`,"is-opened":i.value}},null),[[n.vShow,!f.value&&s!=="overflowContainer"]])]),E?n.withDirectives(n.createVNode("div",{class:`${G.b()}-item-horizontal-wrapper ${G.b()}-item-horizontal-wrapper-hidden`,ref:x},[(o=(r=l.slots).default)==null?void 0:o.call(r)]),[[n.vShow,!e.disabled]]):n.createVNode(we,null,{default:()=>{var m,V;return[n.withDirectives(n.createVNode("div",{class:[`${T}-menu-item-vertical-wrapper`],ref:A},[(V=(m=l.slots).default)==null?void 0:V.call(m)]),[[n.vShow,i.value]])]}})]),[[n.vShow,t.value]])}}});const Se={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 Pe="";const C={};class Ce{constructor(l){re(this,"rootMenuName");this.rootMenuName=l}on(l,t){var s;((s=C==null?void 0:C[this.rootMenuName])==null?void 0:s[l])||Reflect.set(C[this.rootMenuName],l,[]),C[this.rootMenuName][l].push(t)}emit(l,...t){C[this.rootMenuName][l].forEach(s=>s(...t))}off(l,t){const s=C[this.rootMenuName][l].indexOf(t);s>=0&&C[this.rootMenuName][l].splice(s,1)}}function Ee(e){return C[e]||Reflect.set(C,e,{}),new Ce(e)}var J=n.defineComponent({name:"DMenu",props:Se,emits:["select","deselect","submenu-change"],setup(e,l){const t=S("menu"),{openKeys:s,mode:a,collapsed:c}=n.toRefs(e),i=ae(16),u=Ee(i);n.provide("menuStore",u),n.provide("isCollapsed",c),n.provide("defaultIndent",e.indentSize),n.provide("multiple",e.multiple),n.provide("openKeys",s),n.provide("defaultSelectKey",e.defaultSelectKeys),n.provide("mode",a),n.provide("collapsedIndent",e.collapsedIndent),n.provide("rootMenuEmit",l.emit),n.provide("useRouter",e.router),de(e.indentSize);const f=n.ref(null),y=n.ref(0),A=n.ref(null),b=`${t.b()}-item-select`,E=n.computed(()=>({[`${t.b()}`]:!0,[`${t.b()}-vertical`]:a.value==="vertical",[`${t.b()}-horizontal`]:a.value==="horizontal",[`${t.b()}-collapsed`]:c.value})),z=n.reactive({[b]:!1,[`${t.b()}-overflow-container`]:!0}),x=v=>{const p=Array.from(v.children);for(const L of p)if(L.classList.contains(b)){z[b]=!0;break}else z[b]=!1};return n.onMounted(()=>{var v;if(e.mode==="horizontal"){let p=!1;const L=(v=A.value)==null?void 0:v.$el,w=f.value,N=w.children,d=L.children[1],g=new IntersectionObserver(r=>{r.forEach(o=>{if(o.isIntersecting){if(!o.target.classList.contains(`${t.b()}-overflow-container`)&&o.target.style.visibility==="hidden"){g.unobserve(o.target),w.insertBefore(o.target,L),o.target.style.visibility="";const m=L.previousElementSibling;if(m&&o.boundingClientRect.width%o.target.getBoundingClientRect().width===0&&g.observe(m),m==null?void 0:m.classList.contains("devui-submenu")){const M=m,ie=m.children[1];M.addEventListener("mouseenter",B=>{B.stopPropagation(),k("mouseenter",B,ie)}),M.addEventListener("mouseleave",B=>{B.stopPropagation(),k("mouseleave",B,ie)})}y.value-=1,g.observe(o.target),d.lastChild&&d.removeChild(d.lastChild),x(d)}}else{const m=o.target.cloneNode(!0);o.target.classList.contains(`${t.b()}-overflow-container`)?p&&o.target.previousElementSibling&&d.children.length?w.appendChild(o.target.previousElementSibling):p=!0:(y.value+=1,o.target.style.visibility="hidden",L.nextSibling?w.insertBefore(o.target,L.nextSibling):w.appendChild(o.target),d.appendChild(m),x(d))}})},{root:w,threshold:1,rootMargin:"8px"});for(let r=0;r<N.length;r++)g.observe(N[r])}}),()=>{var v,p;return n.createVNode("ul",{ref:f,class:E.value,style:[e.collapsed?`width:${e.collapsedIndent*2}px`:`width: ${e.width}`]},[(p=(v=l.slots).default)==null?void 0:p.call(v),n.withDirectives(n.createVNode(K,{ref:A,key:"overflowContainer",title:"...",class:z},null),[[n.vShow,y.value>0&&a.value==="horizontal"]])])}}}),Me={title:"Menu \u83DC\u5355",category:"\u5BFC\u822A",status:"100%",install(e){e.component(J.name,J),e.component(F.name,F),e.component(K.name,K)}};h.Menu=J,h.MenuItem=F,h.SubMenu=K,h.default=Me,Object.defineProperty(h,"__esModule",{value:!0}),h[Symbol.toStringTag]="Module"});
|
|
1
|
+
var ze=Object.defineProperty;var Pe=(y,n,S)=>n in y?ze(y,n,{enumerable:!0,configurable:!0,writable:!0,value:S}):y[n]=S;var ce=(y,n,S)=>(Pe(y,typeof n!="symbol"?n+"":n,S),S);(function(y,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(y=typeof globalThis!="undefined"?globalThis:y||self,n(y.index={},y.Vue))})(this,function(y,n){"use strict";function S(e,l,t){let s=e;return l&&(s+=`__${l}`),t&&(s+=`--${t}`),s}function C(e,l=!1){const t=l?`.devui-${e}`:`devui-${e}`;return{b:()=>S(t),e:f=>f?S(t,f):"",m:f=>f?S(t,"",f):"",em:(f,m)=>f&&m?S(t,f,m):""}}const Q=[];let U=[];const W=n.ref(24),D=C("menu"),de=C("submenu"),R=D.b(),X=`${D.b()}-item-horizontal-wrapper`,Y=`${D.b()}-item-select`,Z=`${D.b()}-active-parent`;function ue(e){W.value=e}function fe(e){Q.push(e)}function me(){U=[],Q.forEach(t=>{U.push(t.el.parentElement)});const e=[...U],l=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(R)){const s=t.children;e.unshift(...Array.from(s));continue}else{if(t.tagName==="DIV")if(t.classList.contains(`${D.b()}-item-vertical-wrapper`)||t.classList.contains(`${de.b()}-menu-item-vertical-wrapper`)){const s=t.parentElement;if(e.unshift(...Array.from(t.children)),s==null?void 0:s.classList.contains(R))t.classList.add("layer_1");else{let a=l((s==null?void 0:s.classList.value)||"");a=Number(a),t.classList.add(`layer_${a}`)}}else{const s=t.parentElement;let a=l((s==null?void 0:s.classList.value)||"");a=Number(a),t.classList.add(`layer_${a}`),t.style.paddingLeft=`${(a===2?1:a-1)*W.value}px`}if(t.tagName==="UL"){const s=t.parentElement,a=t.children;for(let f=0;f<a.length;f++)e.unshift(a[f]);const o=(s==null?void 0:s.classList.value)||"";let c=l(o);(s==null?void 0:s.classList.contains(R))?(c=1,t.classList.add(`layer_${2}`)):(t.classList.add(`layer_${Number(c)+1}`),c=Number(c)+1)}if(t.tagName==="LI"){const s=t.parentElement,a=(s==null?void 0:s.classList.value)||"";let o=l(a);l(a),o=Number(o),t.style.padding=`0 ${o*W.value}px`}}}}function pe(e){var s;const l=e;let t=null;for(let a=0;a<l.length;a++){const o=l[a];((s=o==null?void 0:o.classList)==null?void 0:s.contains(`${D.b()}-horizontal`))&&(t=o)}return t}function he(e,l){let t=l.target,s=[];const a=pe(l.composedPath());for(s=[...Array.from(a.children)],t.tagName==="SPAN"&&(t=t.parentElement);s.length;){const o=s.shift();if((o==null?void 0:o.tagName)==="UL"||(o==null?void 0:o.classList.contains(X))){const c=o==null?void 0:o.children;s.unshift(...Array.from(c))}o!==t&&(o==null||o.classList.remove(Y),o==null||o.classList.remove(Z))}}function ge(e,l){const t=[],s=l.path||l.composedPath&&l.composedPath();for(let a=0;a<s.length;a++){const o=s[a];if(!o.classList.contains(R))t.push(...Array.from(o.children));else{t.push(...Array.from(o.children));break}}for(;t.length;){const a=t.shift();((a==null?void 0:a.tagName)==="UL"||(a==null?void 0:a.classList.contains(X)))&&t.push(...Array.from(a==null?void 0:a.children)),a!==e&&((a==null?void 0:a.tagName)==="DIV"&&t.unshift(...Array.from(a==null?void 0:a.children)),a==null||a.classList.remove(Y),a==null||a.classList.remove(Z))}}function ee(e,l,t=!1){t?he(e,l):ge(e,l)}function ye(e){var s;const l=/layer_(\d{1,})/gim,t=e.className;return(s=l.exec(t))==null?void 0:s[1]}const be={disabled:{type:Boolean,default:!1},href:{type:String,default:""},route:{type:[String,Object]}},te=C("menu");function ne(e,l,t,s){const a=n.ref(!1);return t?e.includes(l)?a.value=!0:a.value=!1:e[0]===l&&!s.value?a.value=!0:a.value=!1,a.value}function ve(e){var t,s;let l=e.parentElement;for(;!l.classList.contains(te.b());)((t=l.firstElementChild)==null?void 0:t.tagName)==="DIV"&&((s=l==null?void 0:l.firstElementChild)==null||s.classList.add(`${te.b()}-active-parent`)),l=l.parentElement;return l}function Le(e,l,t,s){if(t&&l){const a=e.route||s,o=l.push(a).then(c=>c);return{route:a,routerResult:o}}}const q=C("menu");function se(e){const l=e.composedPath();for(let t=0;t<l.length;t++){const s=l[t];if(s.classList.contains(`${q.b()}-horizontal`))break;if(s.classList.contains(`${q.b()}-item-horizontal-wrapper`))continue;s.tagName!=="SPAN"&&s.classList.add(`${q.b()}-item-select`)}}const A=C("menu"),_=`${A.b()}-item-select`,we=`${A.b()}-item-disabled`;var F=n.defineComponent({name:"DMenuItem",props:be,setup(e,l){var u,p;const t=n.getCurrentInstance(),s=String(t==null?void 0:t.vnode.key),a=n.inject("menuStore"),o=n.inject("mode"),c=n.inject("multiple"),f=n.inject("defaultIndent"),m=n.inject("isCollapsed"),v=n.inject("defaultSelectKey"),{disabled:M}=n.toRefs(e),$=n.ref(ne(v.value,s,c,M)),L=n.ref(!0),x=n.inject("rootMenuEmit"),P=n.inject("useRouter"),V=t==null?void 0:t.appContext.config.globalProperties.$router,h=n.computed(()=>({[`${A.b()}-item`]:!0,[`${A.b()}-item-isCollapsed`]:m.value,[_]:$.value,[we]:M.value}));a.on("menuItem:clear:select",()=>{$.value=!1});const w=r=>{var g;r.stopPropagation();const i=r.currentTarget;let d;if(e.disabled&&r.preventDefault(),!e.disabled){if(!c)a.emit("menuItem:clear:select"),ee(i,r,o.value==="horizontal"),o.value==="horizontal"&&se(r),$.value=!0,d=Le(e,V,P,s);else if(i.classList.contains(_)){x("deselect",{type:"deselect",key:s,el:i,e:r}),$.value=!1;return}else $.value=!0,i.classList.add(_);d===void 0?x("select",{type:"select",key:s,el:i,e:r}):x("select",{type:"select",key:s,el:i,e:r,route:d})}if(o.value==="vertical"){const T=r.currentTarget;ve(T)}if(o.value==="horizontal"){const T=(g=i.parentElement)==null?void 0:g.parentElement;T==null||T.classList.add(`${A.b()}-active-parent`)}},N=n.createVNode("span",{class:`${A.b()}-icon`},[(p=(u=l.slots).icon)==null?void 0:p.call(u)]),b=n.ref(null);return n.watch(M,()=>{c||(h.value[_]=!1)}),n.watch(()=>[...v.value],r=>{$.value=ne(r,s,c,M),h.value[_]=$.value}),n.onMounted(()=>{var d,g;let r="";const i=b.value;o.value==="vertical"&&(((g=(d=i.parentElement)==null?void 0:d.parentElement)==null?void 0:g.classList.contains(A.b()))?(L.value=!0,L.value&&(i.style.paddingRight="",i.style.paddingLeft=`${f}px`),n.watch(m,T=>{T?(i.style.padding!=="0"&&(r=i.style.padding),setTimeout(()=>{i.style.padding="0",i.style.width="",i.style.textAlign="center"},300),i.style.display="block"):(i.style.padding=`${r}`,i.style.textAlign="",i.style.display="flex")})):L.value=!1)}),()=>o.value==="vertical"?n.createVNode("div",{class:`${A.b()}-item-vertical-wrapper`},[n.createVNode("li",{class:h.value,onClick:w,ref:b},[l.slots.icon!==void 0&&N,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,i;return[n.withDirectives(n.createVNode("span",null,[(i=(r=l.slots).default)==null?void 0:i.call(r)]),[[n.vShow,!m.value]])]}}):n.createVNode("a",{href:e.href},[n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,i;return[(i=(r=l.slots).default)==null?void 0:i.call(r)]}})])])]):n.createVNode("li",{class:h.value,onClick:w,ref:b},[l.slots.icon!==void 0&&N,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,i;return[n.withDirectives(n.createVNode("span",null,[(i=(r=l.slots).default)==null?void 0:i.call(r)]),[[n.vShow,!m.value]])]}}):n.createVNode("a",{href:e.href},[n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,i;return[(i=(r=l.slots).default)==null?void 0:i.call(r)]}})])])}});function ae(e=8){const l="abcdefghijklmnopqrstuvwxyz0123456789";let t="";for(let s=0;s<e;s++)t+=l[parseInt((Math.random()*l.length).toString())];return t}function le(e){for(;e&&e.tagName!=="LI"&&e.tagName!=="UL";)e=e.parentElement;return e}const oe="0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out",j={"before-enter"(e){e.style.transition=oe,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=oe,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 Ne=n.defineComponent({name:"DMenuTransition",setup(e,l){return()=>n.createVNode(n.Transition,{onBeforeEnter:t=>j["before-enter"](t),onBeforeLeave:t=>j["before-leave"](t),onEnter:t=>j.enter(t),onAfterEnter:t=>j["after-enter"](t),onLeave:t=>j.leave(t),onAfterLeave:t=>j["after-leave"](t)},{default:()=>{var t,s;return[(s=(t=l.slots).default)==null?void 0:s.call(t)]}})}});const $e={title:{type:String,default:""},disabled:{type:Boolean,default:!1}},O=C("menu"),Se=C("submenu"),I=`${O.b()}-item-horizontal-wrapper-hidden`,H=`${O.b()}-item-horizontal-wrapper-show`;function k(e,l,t){const s=l.currentTarget,a=s.parentElement,o=t.children;if(t.style.padding="0 20px !important",e==="mouseenter"){if((a==null?void 0:a.tagName)==="DIV"){t.classList.add(`${O.b()}-item-horizontal-wrapper-level`);const{width:c}=s.getClientRects()[0];t.style.top="0px",t.style.left=`${c}px`}else t.style.top="26px",t.style.left="0px";t.classList.remove(I),t.classList.add(H);for(let c=0;c<o.length;c++){const f=o[c];if(f.tagName==="UL"&&f.classList.contains(Se.b())){const m=f.getElementsByClassName(`${O.b()}-item-horizontal-wrapper`)[0];f.addEventListener("mouseenter",v=>{v.stopPropagation(),k("mouseenter",v,m),m.classList.remove(I),m.classList.add(H)}),f.addEventListener("mouseleave",v=>{v.stopPropagation(),k("mouseleave",v,m),m.classList.remove(H),m.classList.add(I)})}}}e==="mouseleave"&&(t.classList.remove(H),t.classList.add(I))}const G=C("menu"),z=C("submenu").b();var K=n.defineComponent({name:"DSubMenu",props:$e,setup(e,l){const t=n.ref(!0),{vnode:{key:s}}=n.getCurrentInstance();let a=String(s);const o=n.inject("openKeys"),c=n.ref(o.value.includes(a)),f=n.inject("defaultIndent"),m=n.inject("isCollapsed"),v=n.inject("mode"),M=n.ref(null),$=n.inject("rootMenuEmit"),L=v.value==="horizontal";a==="null"&&(console.warn("[devui][menu]: Key can not be null"),a=`randomKey-${ae(16)}`);const x=u=>{u.stopPropagation();const p=le(u.target);if(!(p.classList.contains(z)&&L)&&(L&&(ee(p,u,!0),se(u)),!e.disabled&&v.value!=="horizontal")){const r=le(u.target),i=o.value.indexOf(a);i>=0&&r.tagName==="UL"?o.value.splice(i,1):r.tagName==="UL"&&o.value.push(a),c.value=o.value.indexOf(a)>=0,$("submenu-change",{type:"submenu-change",state:c.value,key:a,el:p})}},P=n.ref(null);let V;const h=n.ref(null),w=n.ref(null);let N="";const b=n.ref("");return n.watchEffect(()=>{V=P.value,fe({el:h.value})},{flush:"post"}),n.watch(()=>o,u=>{u.value.includes(a)?c.value=!0:c.value=!1},{deep:!0}),n.onMounted(()=>{var r;const u=w.value,p=h.value;me(),b.value=`layer_${(r=Array.from(p.classList).at(-1))==null?void 0:r.replace("layer_","")}`,L&&!e.disabled&&(h.value.addEventListener("mouseenter",i=>{i.stopPropagation(),k("mouseenter",i,V)}),h.value.addEventListener("mouseleave",i=>{i.stopPropagation(),k("mouseleave",i,V)})),n.watch(m,i=>{const d=Number(ye(p));Number.isNaN(d)||d>2&&(t.value=!m.value),i?(u.style.padding!=="0"&&(N=u.style.padding),setTimeout(()=>{u.style.padding="0",u.style.width="",u.style.textAlign="center"},300),u.style.display="block"):(u.style.padding=`${N}`,u.style.textAlign="",u.style.display="flex")})}),()=>{var u,p,r,i;return n.withDirectives(n.createVNode("ul",{onClick:x,class:[z,b.value,e.disabled&&`${z}-disabled`],ref:h},[n.createVNode("div",{class:[`${z}-title`],style:`padding: 0 ${f}px`,ref:w},[n.createVNode("span",{class:`${G.b()}-icon`},[(p=(u=l.slots)==null?void 0:u.icon)==null?void 0:p.call(u)]),n.withDirectives(n.createVNode("span",{class:`${z}-title-content`},[e.title]),[[n.vShow,!m.value]]),n.withDirectives(n.createVNode("i",{class:{"icon icon-chevron-up":b.value!==`layer_${z}`,"icon icon-chevron-right":b.value===`layer_${z}`,"is-opened":c.value}},null),[[n.vShow,!m.value&&s!=="overflowContainer"]])]),L?n.withDirectives(n.createVNode("div",{class:`${G.b()}-item-horizontal-wrapper ${G.b()}-item-horizontal-wrapper-hidden`,ref:P},[(i=(r=l.slots).default)==null?void 0:i.call(r)]),[[n.vShow,!e.disabled]]):n.createVNode(Ne,null,{default:()=>{var d,g;return[n.withDirectives(n.createVNode("div",{class:[`${z}-menu-item-vertical-wrapper`],ref:M},[(g=(d=l.slots).default)==null?void 0:g.call(d)]),[[n.vShow,c.value]])]}})]),[[n.vShow,t.value]])}}});const Ce={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 Te="";const E={};class Ee{constructor(l){ce(this,"rootMenuName");this.rootMenuName=l}on(l,t){var s;((s=E==null?void 0:E[this.rootMenuName])==null?void 0:s[l])||Reflect.set(E[this.rootMenuName],l,[]),E[this.rootMenuName][l].push(t)}emit(l,...t){E[this.rootMenuName][l].forEach(s=>s(...t))}off(l,t){const s=E[this.rootMenuName][l].indexOf(t);s>=0&&E[this.rootMenuName][l].splice(s,1)}}function Me(e){return E[e]||Reflect.set(E,e,{}),new Ee(e)}var J=n.defineComponent({name:"DMenu",props:Ce,emits:["select","deselect","submenu-change"],setup(e,l){const t=C("menu"),{openKeys:s,mode:a,collapsed:o,defaultSelectKeys:c}=n.toRefs(e),f=ae(16),m=Me(f);n.provide("menuStore",m),n.provide("isCollapsed",o),n.provide("defaultIndent",e.indentSize),n.provide("multiple",e.multiple),n.provide("openKeys",s),n.provide("defaultSelectKey",c),n.provide("mode",a),n.provide("collapsedIndent",e.collapsedIndent),n.provide("rootMenuEmit",l.emit),n.provide("useRouter",e.router),ue(e.indentSize);const v=n.ref(null),M=n.ref(0),$=n.ref(null),L=`${t.b()}-item-select`,x=n.computed(()=>({[`${t.b()}`]:!0,[`${t.b()}-vertical`]:a.value==="vertical",[`${t.b()}-horizontal`]:a.value==="horizontal",[`${t.b()}-collapsed`]:o.value})),P=n.reactive({[L]:!1,[`${t.b()}-overflow-container`]:!0}),V=h=>{const w=Array.from(h.children);for(const N of w)if(N.classList.contains(L)){P[L]=!0;break}else P[L]=!1};return n.onMounted(()=>{var h;if(e.mode==="horizontal"){let w=!1;const N=(h=$.value)==null?void 0:h.$el,b=v.value,u=b.children,p=N.children[1],r=new IntersectionObserver(i=>{i.forEach(d=>{if(d.isIntersecting){if(!d.target.classList.contains(`${t.b()}-overflow-container`)&&d.target.style.visibility==="hidden"){r.unobserve(d.target),b.insertBefore(d.target,N),d.target.style.visibility="";const g=N.previousElementSibling;if(g&&d.boundingClientRect.width%d.target.getBoundingClientRect().width===0&&r.observe(g),g==null?void 0:g.classList.contains("devui-submenu")){const ie=g,re=g.children[1];ie.addEventListener("mouseenter",B=>{B.stopPropagation(),k("mouseenter",B,re)}),ie.addEventListener("mouseleave",B=>{B.stopPropagation(),k("mouseleave",B,re)})}M.value-=1,r.observe(d.target),p.lastChild&&p.removeChild(p.lastChild),V(p)}}else{const g=d.target.cloneNode(!0);d.target.classList.contains(`${t.b()}-overflow-container`)?w&&d.target.previousElementSibling&&p.children.length?b.appendChild(d.target.previousElementSibling):w=!0:(M.value+=1,d.target.style.visibility="hidden",N.nextSibling?b.insertBefore(d.target,N.nextSibling):b.appendChild(d.target),p.appendChild(g),V(p))}})},{root:b,threshold:1,rootMargin:"8px"});for(let i=0;i<u.length;i++)r.observe(u[i])}}),()=>{var h,w;return n.createVNode("ul",{ref:v,class:x.value,style:[e.collapsed?`width:${e.collapsedIndent*2}px`:`width: ${e.width}`]},[(w=(h=l.slots).default)==null?void 0:w.call(h),n.withDirectives(n.createVNode(K,{ref:$,key:"overflowContainer",title:"...",class:P},null),[[n.vShow,M.value>0&&a.value==="horizontal"]])])}}}),Ae={title:"Menu \u83DC\u5355",category:"\u5BFC\u822A",status:"100%",install(e){e.component(J.name,J),e.component(F.name,F),e.component(K.name,K)}};y.Menu=J,y.MenuItem=F,y.SubMenu=K,y.default=Ae,Object.defineProperty(y,"__esModule",{value:!0}),y[Symbol.toStringTag]="Module"});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "vue-devui",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "DevUI components based on Vite and Vue3",
|
|
6
6
|
"keywords": [
|
|
@@ -33,6 +33,7 @@
|
|
|
33
33
|
"@vue/shared": "^3.2.33",
|
|
34
34
|
"@vueuse/core": "8.9.4",
|
|
35
35
|
"async-validator": "^4.0.7",
|
|
36
|
+
"clipboard-copy": "^4.0.1",
|
|
36
37
|
"dayjs": "^1.11.3",
|
|
37
38
|
"devui-theme": "^0.0.1",
|
|
38
39
|
"fs-extra": "^10.0.0",
|
package/pagination/index.es.js
CHANGED
|
@@ -8823,18 +8823,18 @@ var Tag = defineComponent({
|
|
|
8823
8823
|
e.stopPropagation();
|
|
8824
8824
|
emit("tagDelete", e);
|
|
8825
8825
|
};
|
|
8826
|
+
const contentColor = computed(() => {
|
|
8827
|
+
return isDefaultTag() ? "" : checked.value ? "#fff" : themeColor.value;
|
|
8828
|
+
});
|
|
8826
8829
|
const closeIconEl = () => {
|
|
8830
|
+
const iconName = isDefaultTag() ? "error-o" : "close";
|
|
8827
8831
|
return deletable.value ? createVNode("a", {
|
|
8828
8832
|
"class": "remove-button",
|
|
8829
8833
|
"onClick": handleDelete
|
|
8830
|
-
}, [
|
|
8831
|
-
"size": "12px",
|
|
8832
|
-
"name": "error-o",
|
|
8833
|
-
"color": "#adb0b8"
|
|
8834
|
-
}, null) : createVNode(resolveComponent("d-icon"), {
|
|
8834
|
+
}, [createVNode(resolveComponent("d-icon"), {
|
|
8835
8835
|
"size": "12px",
|
|
8836
|
-
"name":
|
|
8837
|
-
"color":
|
|
8836
|
+
"name": iconName,
|
|
8837
|
+
"color": contentColor.value
|
|
8838
8838
|
}, null)]) : null;
|
|
8839
8839
|
};
|
|
8840
8840
|
const unWatch = watch(checked, (newVal) => {
|
|
@@ -8850,7 +8850,7 @@ var Tag = defineComponent({
|
|
|
8850
8850
|
"class": tagClass.value,
|
|
8851
8851
|
"style": {
|
|
8852
8852
|
display: "block",
|
|
8853
|
-
color:
|
|
8853
|
+
color: contentColor.value,
|
|
8854
8854
|
backgroundColor: checked.value ? themeColor.value : !color.value ? "" : "var(--devui-base-bg, #ffffff)"
|
|
8855
8855
|
},
|
|
8856
8856
|
"title": tagTitle
|