vue-devui 1.5.1 → 1.5.3
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 +5 -0
- package/image-preview/index.es.js +14 -7
- package/image-preview/index.umd.js +1 -1
- package/modal/index.es.js +6 -0
- package/modal/index.umd.js +1 -1
- package/package.json +1 -1
- package/types/image-preview/src/image-preview-service.d.ts +1 -1
- package/vue-devui.es.js +21 -8
- package/vue-devui.umd.js +3 -3
package/README.md
CHANGED
|
@@ -224,6 +224,11 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
|
|
|
224
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
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>
|
|
226
226
|
</tr>
|
|
227
|
+
<tr>
|
|
228
|
+
<td align="center"><a href="https://github.com/xGuangsPBD"><img src="https://avatars.githubusercontent.com/u/41880611?v=4" width="100px;" alt=""/><br /><sub><b>xGuangsPBD</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=xGuangsPBD" title="Code">💻</a></td>
|
|
229
|
+
<td align="center"><a href="https://github.com/cnvoid"><img src="https://avatars.githubusercontent.com/u/17289381?v=4" width="100px;" alt=""/><br /><sub><b>cnvoid</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=cnvoid" title="Code">💻</a></td>
|
|
230
|
+
<td align="center"><a href="https://github.com/sakanaovo"><img src="https://avatars.githubusercontent.com/u/86860377?v=4" width="100px;" alt=""/><br /><sub><b>sakanaovo</b></sub></a><br /><a href="https://github.com/DevCloudFE/vue-devui/commits?author=sakanaovo" title="Code">💻</a></td>
|
|
231
|
+
</tr>
|
|
227
232
|
</tbody>
|
|
228
233
|
</table>
|
|
229
234
|
|
|
@@ -419,10 +419,10 @@ class ImagePreviewService {
|
|
|
419
419
|
this.$body.style.setProperty("overflow", "hidden", "important");
|
|
420
420
|
}
|
|
421
421
|
static close() {
|
|
422
|
-
var _a;
|
|
422
|
+
var _a, _b;
|
|
423
423
|
(_a = this.$body) == null ? void 0 : _a.style.setProperty("overflow", this.$overflow);
|
|
424
424
|
this.$overflow = null;
|
|
425
|
-
this.$div && this.$body.removeChild(this.$div);
|
|
425
|
+
this.$div && ((_b = this.$body) == null ? void 0 : _b.removeChild(this.$div));
|
|
426
426
|
this.$body = null;
|
|
427
427
|
this.$div = null;
|
|
428
428
|
}
|
|
@@ -442,7 +442,11 @@ function unmountedPreviewImages() {
|
|
|
442
442
|
ImagePreviewService.close();
|
|
443
443
|
}
|
|
444
444
|
function getImgByEl(el) {
|
|
445
|
-
const
|
|
445
|
+
const imgs = [...el.querySelectorAll("img")];
|
|
446
|
+
const urlList = imgs.map((item) => {
|
|
447
|
+
var _a;
|
|
448
|
+
return (_a = item.getAttribute("preview-src") || item.getAttribute("src")) != null ? _a : "";
|
|
449
|
+
});
|
|
446
450
|
return urlList;
|
|
447
451
|
}
|
|
448
452
|
function handleImg(e) {
|
|
@@ -453,6 +457,9 @@ function handleImg(e) {
|
|
|
453
457
|
if (((_a = target == null ? void 0 : target.nodeName) == null ? void 0 : _a.toLowerCase()) === "img") {
|
|
454
458
|
const urlList = getImgByEl(el);
|
|
455
459
|
const url = target.getAttribute("src");
|
|
460
|
+
if (!url) {
|
|
461
|
+
return console.error("attribute is not exist");
|
|
462
|
+
}
|
|
456
463
|
mountedPreviewImages({
|
|
457
464
|
url,
|
|
458
465
|
previewUrlList: urlList,
|
|
@@ -469,7 +476,7 @@ function removeHandle(el) {
|
|
|
469
476
|
}
|
|
470
477
|
var ImagePreviewDirective = {
|
|
471
478
|
mounted(el, binding) {
|
|
472
|
-
if (!binding.value) {
|
|
479
|
+
if (!(binding == null ? void 0 : binding.value)) {
|
|
473
480
|
return handleImgByEl(el);
|
|
474
481
|
}
|
|
475
482
|
const { custom, disableDefault } = binding.value;
|
|
@@ -495,9 +502,9 @@ var ImagePreviewDirective = {
|
|
|
495
502
|
},
|
|
496
503
|
updated(el, binding) {
|
|
497
504
|
var _a, _b;
|
|
498
|
-
el.zIndex = (_a = binding.value) == null ? void 0 : _a.zIndex;
|
|
499
|
-
el.backDropZIndex = (_b = binding.value) == null ? void 0 : _b.backDropZIndex;
|
|
500
|
-
if (binding.value) {
|
|
505
|
+
el.zIndex = (_a = binding == null ? void 0 : binding.value) == null ? void 0 : _a.zIndex;
|
|
506
|
+
el.backDropZIndex = (_b = binding == null ? void 0 : binding.value) == null ? void 0 : _b.backDropZIndex;
|
|
507
|
+
if (binding == null ? void 0 : binding.value) {
|
|
501
508
|
const {
|
|
502
509
|
value: { disableDefault },
|
|
503
510
|
oldValue: { disableDefault: oldDisableDefault }
|
|
@@ -1 +1 @@
|
|
|
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"});
|
|
1
|
+
var X=Object.defineProperty;var Y=(l,e,c)=>e in l?X(l,e,{enumerable:!0,configurable:!0,writable:!0,value:c}):l[e]=c;var i=(l,e,c)=>(Y(l,typeof e!="symbol"?e+"":e,c),c);(function(l,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(l=typeof globalThis!="undefined"?globalThis:l||self,e(l.index={},l.Vue))})(this,function(l,e){"use strict";const c={url:{type:String,default:"",required:!0},previewUrlList:{type:Array,default:()=>[],required:!0},zIndex:{type:Number,required:!1},backDropZIndex:{type:Number,required:!1}};class I{constructor(t,n={}){i(this,"el");i(this,"oTransformX",0);i(this,"oTransformY",0);i(this,"transformX");i(this,"transformY");i(this,"zoom");i(this,"rotate");i(this,"STEP",.25);i(this,"MIN_SCALE",.2);i(this,"MAX_SCALE",2.5);i(this,"TRANSFORMX",0);i(this,"TRANSFORMY",0);i(this,"ZOOM",1);i(this,"ROTATE",0);this.el=t,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=t=>{const n=t.clientX,r=t.clientY;document.onmousemove=s=>{const d=s.clientX-n,m=s.clientY-r;this.transformX=this.oTransformX+d,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 t=this.throttle(this.setMouseWheel,100);this.el.onmousewheel=n=>{const r=-n.wheelDelta||n.deltaY||n.detail;t(r)}}throttle(t,n){let r=null;return(...s)=>{r||setTimeout(()=>{r=null,t.apply(this,s)},n)}}setMouseWheel(t){if(t<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(t=this.STEP){this.zoom=Math.min(this.MAX_SCALE,this.zoom+t),this.setPosition()}setZoomOut(t=this.STEP){this.zoom=Math.max(this.MIN_SCALE,this.zoom-t),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(o,t,n){let r=o;return t&&(r+=`__${t}`),n&&(r+=`--${n}`),r}function Z(o,t=!1){const n=t?`.devui-${o}`:`devui-${o}`;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="",b=e.defineComponent({name:"DImagePreview",props:c,emits:[],setup(o){const t=Z("image-preview");let n=null;const r=e.ref(0),s=e.computed(()=>o.previewUrlList[r.value]),d=o.zIndex?{zIndex:o.zIndex}:{},m=o.backDropZIndex?{zIndex:o.backDropZIndex}:{};function a(){const h=document.querySelector(`.${t.e("main-image")}`);n=new I(h)}function L(){r.value=o.previewUrlList.findIndex(h=>h===o.url)}function g(){r.value=r.value<=0?o.previewUrlList.length-1:r.value-1}function p(){r.value=r.value>=o.previewUrlList.length-1?0:r.value+1}function V(){u.close()}function T(){n.setZoomIn()}function $(){n.setZoomOut()}function D(){n.setRotate()}function A(){n.setZoomBest()}function E(){n.setZoomOriginal()}function k(h){h.defaultPrevented||(h.code==="Escape"?V():h.code==="ArrowLeft"?g():h.code==="ArrowRight"&&p())}function S(){document.addEventListener("keydown",k,!1)}function O(){document.removeEventListener("keydown",k,!1)}return e.onMounted(()=>{L(),a(),S()}),e.onUnmounted(()=>{O()}),()=>e.createVNode(e.Fragment,null,[e.createVNode("div",{class:t.b(),style:d},[e.createVNode("img",{class:t.e("main-image"),src:s.value},null),e.createVNode("button",{class:t.e("close-btn"),onClick:V},[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:t.e("arrow-left"),onClick:g},[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:t.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:t.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:g},[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:t.e("index")},[r.value+1,e.createTextVNode(":"),o.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:t.e("bg"),style:m},null)])}});function M(o){return e.createApp(b,o)}class u{static open(t){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),M(t).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var t,n;(t=this.$body)==null||t.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&((n=this.$body)==null||n.removeChild(this.$div)),this.$body=null,this.$div=null}}i(u,"$body",null),i(u,"$div",null),i(u,"$overflow","");function x(o){u.open({url:o.url,previewUrlList:o.previewUrlList,zIndex:o.zIndex,backDropZIndex:o.backDropZIndex})}function N(){u.close()}function C(o){return[...o.querySelectorAll("img")].map(r=>{var s;return(s=r.getAttribute("preview-src")||r.getAttribute("src"))!=null?s:""})}function v(o){var r;o.stopPropagation();const t=o.currentTarget,n=o.target;if(((r=n==null?void 0:n.nodeName)==null?void 0:r.toLowerCase())==="img"){const s=C(t),d=n.getAttribute("src");if(!d)return console.error("attribute is not exist");x({url:d,previewUrlList:s,zIndex:t==null?void 0:t.zIndex,backDropZIndex:t==null?void 0:t.backDropZIndex})}}function w(o){o.addEventListener("click",v)}function z(o){o.removeEventListener("click",v)}var y={mounted(o,t){if(!(t==null?void 0:t.value))return w(o);const{custom:n,disableDefault:r}=t.value;n instanceof Object&&(n.open=()=>{const s=C(o);x({url:s==null?void 0:s[0],previewUrlList:s,zIndex:o==null?void 0:o.zIndex,backDropZIndex:o==null?void 0:o.backDropZIndex})},n.close=()=>N()),!r&&w(o)},unmounted(){N()},updated(o,t){var n,r;if(o.zIndex=(n=t==null?void 0:t.value)==null?void 0:n.zIndex,o.backDropZIndex=(r=t==null?void 0:t.value)==null?void 0:r.backDropZIndex,t==null?void 0:t.value){const{value:{disableDefault:s},oldValue:{disableDefault:d}}=t;s!==d&&(s?z(o):w(o))}}},P={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(o){o.directive("d-image-preview",y),o.config.globalProperties.$imagePreviewService=u}};l.ImagePreviewDirective=y,l.ImagePreviewService=u,l.default=P,l.imagePreviewProps=c,Object.defineProperty(l,"__esModule",{value:!0}),l[Symbol.toStringTag]="Module"});
|
package/modal/index.es.js
CHANGED
|
@@ -741,6 +741,12 @@ var Modal = defineComponent({
|
|
|
741
741
|
watch(modelValue, (val) => {
|
|
742
742
|
if (val && !keepLast.value) {
|
|
743
743
|
clearPosition();
|
|
744
|
+
nextTick(() => {
|
|
745
|
+
const autofocus = document == null ? void 0 : document.querySelector("[autofocus]");
|
|
746
|
+
if (autofocus) {
|
|
747
|
+
autofocus.focus();
|
|
748
|
+
}
|
|
749
|
+
});
|
|
744
750
|
}
|
|
745
751
|
});
|
|
746
752
|
const renderType = () => {
|
package/modal/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var ve=Object.defineProperty,ge=Object.defineProperties;var we=Object.getOwnPropertyDescriptors;var P=Object.getOwnPropertySymbols;var _=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable;var S=(c,e,u)=>e in c?ve(c,e,{enumerable:!0,configurable:!0,writable:!0,value:u}):c[e]=u,$=(c,e)=>{for(var u in e||(e={}))_.call(e,u)&&S(c,u,e[u]);if(P)for(var u of P(e))q.call(e,u)&&S(c,u,e[u]);return c},T=(c,e)=>ge(c,we(e));var W=(c,e)=>{var u={};for(var b in c)_.call(c,b)&&e.indexOf(b)<0&&(u[b]=c[b]);if(c!=null&&P)for(var b of P(c))e.indexOf(b)<0&&q.call(c,b)&&(u[b]=c[b]);return u};var G=(c,e,u)=>(S(c,typeof e!="symbol"?e+"":e,u),u);(function(c,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue"),require("@floating-ui/dom")):typeof define=="function"&&define.amd?define(["exports","vue","@floating-ui/dom"],e):(c=typeof globalThis!="undefined"?globalThis:c||self,e(c.index={},c.Vue,c.dom))})(this,function(c,e,u){"use strict";const b={modelValue:{type:Boolean,default:!1},title:{type:String,default:""},lockScroll:{type:Boolean,default:!0},draggable:{type:Boolean,default:!0},closeOnClickOverlay:{type:Boolean,default:!0},beforeClose:{type:Function},escapable:{type:Boolean,default:!0},showClose:{type:Boolean,default:!0},showAnimation:{type:Boolean,default:!0},showOverlay:{type:Boolean,default:!0},appendToBody:{type:Boolean,default:!0},type:{type:String,default:""},keepLast:{type:Boolean,default:!1}},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]}},J={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};function O(t,o,n){let l=t;return o&&(l+=`__${o}`),n&&(l+=`--${n}`),l}function V(t,o=!1){const n=o?`.devui-${t}`:`devui-${t}`;return{b:()=>O(n),e:r=>r?O(n,r):"",m:r=>r?O(n,"",r):"",em:(r,d)=>r&&d?O(n,r,d):""}}var Ve="",Q=e.defineComponent({name:"DSvgIcon",props:J,setup(t){const{name:o,color:n,size:l}=e.toRefs(t),a=V("svg-icon"),i=e.computed(()=>`#icon-${o.value}`),s=e.computed(()=>typeof l.value=="number"?`${l.value}px`:l.value),r={width:s.value,height:s.value};return()=>e.createVNode("svg",{class:a.b(),style:r},[e.createVNode("use",{"xlink:href":i.value,fill:n.value},null)])}});function Z(t){return/^((http|https):)?\/\//.test(t)}function ee(t,o){const{component:n,name:l,size:a,color:i,classPrefix:s,rotate:r}=e.toRefs(t),d=V("icon"),f=e.computed(()=>typeof a.value=="number"?`${a.value}px`:a.value),m=n.value?e.resolveDynamicComponent(n.value):e.resolveDynamicComponent(Q),p=()=>e.createVNode("img",e.mergeProps({src:l.value,alt:l.value.split("/")[l.value.split("/").length-1],class:[(r==null?void 0:r.value)==="infinite"&&d.m("spin")],style:{width:f.value||"",transform:`rotate(${r==null?void 0:r.value}deg)`,verticalAlign:"middle"}},o.attrs),null),y=()=>e.createVNode(m,e.mergeProps({name:l.value,color:i.value,size:f.value,class:[(r==null?void 0:r.value)==="infinite"&&d.m("spin")],style:{transform:`rotate(${r==null?void 0:r.value}deg)`}},o.attrs),null),h=()=>{const w=/^icon-/.test(l.value)?l.value:`${s.value}-${l.value}`;return e.createVNode("i",e.mergeProps({class:[s.value,w,(r==null?void 0:r.value)==="infinite"&&d.m("spin")],style:{fontSize:f.value,color:i.value,transform:`rotate(${r==null?void 0:r.value}deg)`}},o.attrs),null)};return{iconDom:()=>n.value?y():Z(l.value)?p():h()}}var I=e.defineComponent({name:"DIcon",props:K,emits:["click"],setup(t,o){const{disabled:n,operable:l}=e.toRefs(t),{iconDom:a}=ee(t,o),i=V("icon"),s=e.computed(()=>({[i.e("container")]:!0,[i.m("disabled")]:n.value,[i.m("operable")]:l.value,[i.m("no-slots")]:!Object.keys(o.slots).length})),r=d=>{n.value||o.emit("click",d)};return()=>{var d,f,m,p;return e.createVNode("div",{class:s.value,onClick:r},[(f=(d=o.slots).prefix)==null?void 0:f.call(d),a(),(p=(m=o.slots).suffix)==null?void 0:p.call(m)])}}}),Ee="";e.defineComponent({name:"DIconGroup",setup(t,o){const n=V("icon-group");return()=>{var l,a;return e.createVNode("div",{class:n.b()},[(a=(l=o.slots).default)==null?void 0:a.call(l)])}}});const te={modelValue:{type:Boolean,default:!1},lockScroll:{type:Boolean,default:!0},closeOnClickOverlay:{type:Boolean,default:!0}};function R(){if(document.documentElement.scrollHeight>document.documentElement.clientHeight){const t=document.documentElement.scrollTop,o=document.documentElement.getAttribute("style");return document.documentElement.style.position="fixed",document.documentElement.style.top=`-${t}px`,document.documentElement.style.width=document.documentElement.style.width||"100%",document.documentElement.style.overflowY="scroll",()=>{o?document.documentElement.setAttribute("style",o):document.documentElement.removeAttribute("style"),document.documentElement.scrollTop=t}}}function oe(t,o){let n;const l=i=>{i.preventDefault(),o.emit("click",i),t.closeOnClickOverlay&&o.emit("update:modelValue",!1)},a=()=>{n==null||n()};return e.watch(()=>t.modelValue,i=>{i?t.lockScroll&&(n=R()):a()}),e.onUnmounted(a),{onClick:l}}var Ce="";const ne=e.defineComponent({name:"DFixedOverlay",inheritAttrs:!1,props:te,emits:["update:modelValue","click"],setup(t,o){const{modelValue:n}=e.toRefs(t),l=V("fixed-overlay"),{onClick:a}=oe(t,o);return()=>e.createVNode(e.Transition,{name:l.m("fade")},{default:()=>{var i,s;return[n.value&&e.createVNode("div",e.mergeProps({class:l.b()},o.attrs,{onClick:a}),[(s=(i=o.slots).default)==null?void 0:s.call(i)])]}})}}),le={modelValue:{type:Boolean,default:!1},origin:{type:Object,require:!0},position:{type:Array,default:["bottom"]},offset:{type:[Number,Object],default:8},shiftOffset:{type:Number},align:{type:String,default:null},showArrow:{type:Boolean,default:!1},isArrowCenter:{type:Boolean,default:!0},clickEventBubble:{type:Boolean,default:!1}};function ae(t){const o=/(auto|scroll|hidden)/;for(let n=t;n=n.parentElement;n.parentElement!==document.body){const l=window.getComputedStyle(n);if(o.test(l.overflow+l.overflowX+l.overflowY))return n}return window}function re(t,o,n,l){let{x:a,y:i}=o;if(!t){const{width:s,height:r}=l;a&&n.includes("start")&&(a=12),a&&n.includes("end")&&(a=Math.round(s-24)),i&&n.includes("start")&&(i=10),i&&n.includes("end")&&(i=r-14)}return{x:a,y:i}}function ie(t,o){const n=e.ref(),l=e.ref();let a=null;const i=(r,d,f,m)=>{const{x:p,y}=re(t.isArrowCenter,f,d,m.getBoundingClientRect()),h={top:"bottom",right:"left",bottom:"top",left:"right"}[d.split("-")[0]];Object.assign(r.style,{left:p?`${p}px`:"",top:y?`${y}px`:"",right:"",bottom:"",[h]:"-4px"})},s=async()=>{const r=t.origin,d=e.unref(n.value),f=e.unref(l.value),m=[u.offset(t.offset),u.autoPlacement({alignment:t.align,allowedPlacements:t.position})];t.showArrow&&m.push(u.arrow({element:f})),t.shiftOffset!==void 0&&m.push(u.shift());const{x:p,y,placement:h,middlewareData:g}=await u.computePosition(r,d,{strategy:"fixed",middleware:m});let w=p,E=y;if(t.shiftOffset!==void 0){const{x:N,y:x}=g.shift;N<0&&(w-=t.shiftOffset),N>0&&(w+=t.shiftOffset),x<0&&(E-=t.shiftOffset),x>0&&(E+=t.shiftOffset)}o("positionChange",h),Object.assign(d.style,{top:`${E}px`,left:`${w}px`}),t.showArrow&&i(f,h,g.arrow,d)};return e.watch(()=>t.modelValue,()=>{t.modelValue&&t.origin?(a=ae(t.origin),e.nextTick(s),a==null||a.addEventListener("scroll",s),a!==window&&window.addEventListener("scroll",s),window.addEventListener("resize",s)):(a==null||a.removeEventListener("scroll",s),a!==window&&window.removeEventListener("scroll",s),window.removeEventListener("resize",s))}),e.onUnmounted(()=>{a==null||a.removeEventListener("scroll",s),a!==window&&window.removeEventListener("scroll",s),window.removeEventListener("resize",s)}),{arrowRef:l,overlayRef:n,updatePosition:s}}var Ne="";e.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:le,emits:["update:modelValue","positionChange"],setup(t,{slots:o,attrs:n,emit:l,expose:a}){const i=V("flexible-overlay"),{clickEventBubble:s}=e.toRefs(t),{arrowRef:r,overlayRef:d,updatePosition:f}=ie(t,l);return a({updatePosition:f}),()=>{var m;return t.modelValue&&e.createVNode("div",e.mergeProps({ref:d,class:i.b()},n,{onClick:e.withModifiers(()=>({}),[s.value?"":"stop"]),onPointerup:e.withModifiers(()=>({}),["stop"])}),[(m=o.default)==null?void 0:m.call(o),t.showArrow&&e.createVNode("div",{ref:r,class:i.e("arrow")},null)])}}});const se=typeof window!="undefined";function ce(t,o){function n(){o("update:modelValue",!1)}function l(){t.beforeClose?t.beforeClose(n):n()}function a(i){i.code==="Escape"&&l()}return e.onMounted(()=>{t.escapable&&window.addEventListener("keydown",a)}),e.onUnmounted(()=>{t.escapable&&window.addEventListener("keydown",a)}),{execClose:l}}function de(t){let o;const n=()=>{o==null||o()};e.watch(()=>t.modelValue,l=>{l?t.lockScroll&&(o=R()):n()},{immediate:!0}),e.onUnmounted(n)}function z(t,o="px"){return t?typeof t=="string"?t:typeof t=="number"?`${t}${o}`:"":""}const ue=(t,o,n)=>{const l=e.ref("translate(-50%, -50%)");let a={offsetX:0,offsetY:0};const i=f=>{const m=f.clientX,p=f.clientY,{offsetX:y,offsetY:h}=a,g=t.value.getBoundingClientRect(),w=g.left,E=g.top,N=g.width,x=g.height,C=document.documentElement.clientWidth,v=document.documentElement.clientHeight,A=-w+y,pe=-E+h,ye=C-w-N+y,he=v-E-x+h,F=U=>{const j=Math.min(Math.max(y+U.clientX-m,A),ye),H=Math.min(Math.max(h+U.clientY-p,pe),he);a={offsetX:j,offsetY:H},l.value=`translate(calc(-50% + ${z(j)}), calc(-50% + ${z(H)}))`},Y=()=>{document.removeEventListener("mousemove",F),document.removeEventListener("mouseup",Y)};document.addEventListener("mousemove",F),document.addEventListener("mouseup",Y)},s=()=>{o.value&&t.value&&o.value.addEventListener("mousedown",i)},r=()=>{o.value&&t.value&&o.value.removeEventListener("mousedown",i)};return e.onMounted(()=>{e.watchEffect(()=>{n.value?s():r()})}),e.onBeforeUnmount(()=>{r()}),{clearPosition:()=>{a={offsetX:0,offsetY:0},l.value="translate(-50%, -50%)"},modalPosition:l}};var B=e.defineComponent({name:"DModalHeader",setup(t,{slots:o}){const n=V("modal");return()=>{var l;return e.createVNode("div",{class:n.e("header")},[(l=o.default)==null?void 0:l.call(o)])}}}),D=e.defineComponent({name:"DModalBody",setup(t,{slots:o}){const n=V("modal");return()=>{var l;return e.createVNode("div",{class:n.e("body")},[(l=o.default)==null?void 0:l.call(o)])}}}),xe="",k=e.defineComponent({name:"DModal",inheritAttrs:!1,props:b,emits:["update:modelValue"],setup(t,{slots:o,attrs:n,emit:l}){const a=V("modal"),{modelValue:i,title:s,showClose:r,showOverlay:d,appendToBody:f,closeOnClickOverlay:m,keepLast:p}=e.toRefs(t),{execClose:y}=ce(t,l);de(t);const h=e.ref(),g=e.ref(),w=e.computed(()=>t.draggable),{clearPosition:E,modalPosition:N}=ue(h,g,w);e.watch(i,C=>{C&&!p.value&&E()});const x=()=>{const v=[{type:"success",text:"\u6210\u529F",icon:"right-o",color:"var(--devui-success)"},{type:"failed",text:"\u9519\u8BEF",icon:"error-o",color:"var(--devui-danger)"},{type:"warning",text:"\u8B66\u544A",icon:"warning-o",color:"var(--devui-warning)"},{type:"info",text:"\u4FE1\u606F",icon:"info-o",color:"var(--devui-info)"}].find(A=>A.type===t.type);return e.createVNode("div",{style:{cursor:t.draggable?"move":"default"},ref:g},[e.createVNode(B,null,{default:()=>[e.createVNode("div",{class:"type-content"},[e.createVNode("div",{class:"type-content-icon"},[e.createVNode(I,{name:v==null?void 0:v.icon,color:v==null?void 0:v.color},null)]),e.createVNode("div",{class:"type-content-text"},[v==null?void 0:v.text])])]})])};return()=>e.createVNode(e.Teleport,{to:"body",disabled:!f.value},{default:()=>[d.value&&e.createVNode(ne,e.mergeProps({modelValue:i.value},{"onUpdate:modelValue":y},{class:a.e("overlay"),"lock-scroll":!1,"close-on-click-overlay":m.value,style:{zIndex:"calc(var(--devui-z-index-modal, 1050) - 1)"}}),null),e.createVNode(e.Transition,{name:t.showAnimation?a.m("wipe"):""},{default:()=>{var C;return[i.value&&e.createVNode("div",e.mergeProps({ref:h,class:a.b()},n,{onClick:v=>v.stopPropagation(),style:{transform:N.value}}),[r.value&&e.createVNode("div",{onClick:y,class:"btn-close"},[e.createVNode(I,{name:"close",size:"20px"},null)]),t.type?x():e.createVNode("div",{style:{cursor:t.draggable?"move":"default"},ref:g},[o.header?o.header():s.value&&e.createVNode(B,null,{default:()=>[s.value]})]),e.createVNode(D,null,{default:()=>{var v;return[(v=o.default)==null?void 0:v.call(o)]}}),(C=o.footer)==null?void 0:C.call(o)])]}})]})}}),X=e.defineComponent({name:"DModalFooter",setup(t,{slots:o}){const n=V("modal");return()=>{var l;return e.createVNode("div",{class:n.e("footer")},[(l=o.default)==null?void 0:l.call(o)])}}});class fe{constructor(o){this.anchorContainer=o}renderModal(o,n,l){const a=e.h(this.component(),n,l);return e.render(a,o),a}renderNull(o){setTimeout(()=>{e.render(null,o)},500)}}let M;class L extends fe{component(){return k}open(o={}){const n=document.createElement("div");this.anchorContainer.appendChild(n);const m=o,{header:l,content:a,footer:i}=m,s=W(m,["header","content","footer"]),r=(p,y)=>this.renderModal(n,T($({},p),{modelValue:!0,"onUpdate:modelValue":y}),{header:l,default:a,footer:i}),d=()=>{var y,h,g;const p=w=>{w||d()};r(s,w=>{w?r(s,p):(this.renderModal(n,T($({},s),{modelValue:!1})),this.renderNull(n))}),(g=(h=(y=M==null?void 0:M.component)==null?void 0:y.exposed)==null?void 0:h.handleVisibleChange)==null||g.call(h,!1)},f=p=>{p||d()};return this.renderModal(n,{modelValue:!1}),M=r(s,f),{hide:d}}}G(L,"token","MODAL_SERVICE_TOKEN");var me={title:"Modal \u5F39\u7A97",category:"\u53CD\u9988",status:"100%",install(t){if(t.component(k.name,k),t.component(B.name,B),t.component(D.name,D),t.component(X.name,X),!se)return;let o=document.getElementById("d-modal-anchors-container");o||(o=document.createElement("div"),o.setAttribute("id","d-modal-anchors-container"),document.body.appendChild(o)),t.provide(L.token,new L(o))}};c.Modal=k,c.default=me,c.modalProps=b,Object.defineProperty(c,"__esModule",{value:!0}),c[Symbol.toStringTag]="Module"});
|
|
1
|
+
var ve=Object.defineProperty,ge=Object.defineProperties;var we=Object.getOwnPropertyDescriptors;var P=Object.getOwnPropertySymbols;var _=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable;var A=(c,e,u)=>e in c?ve(c,e,{enumerable:!0,configurable:!0,writable:!0,value:u}):c[e]=u,T=(c,e)=>{for(var u in e||(e={}))_.call(e,u)&&A(c,u,e[u]);if(P)for(var u of P(e))q.call(e,u)&&A(c,u,e[u]);return c},$=(c,e)=>ge(c,we(e));var W=(c,e)=>{var u={};for(var b in c)_.call(c,b)&&e.indexOf(b)<0&&(u[b]=c[b]);if(c!=null&&P)for(var b of P(c))e.indexOf(b)<0&&q.call(c,b)&&(u[b]=c[b]);return u};var G=(c,e,u)=>(A(c,typeof e!="symbol"?e+"":e,u),u);(function(c,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue"),require("@floating-ui/dom")):typeof define=="function"&&define.amd?define(["exports","vue","@floating-ui/dom"],e):(c=typeof globalThis!="undefined"?globalThis:c||self,e(c.index={},c.Vue,c.dom))})(this,function(c,e,u){"use strict";const b={modelValue:{type:Boolean,default:!1},title:{type:String,default:""},lockScroll:{type:Boolean,default:!0},draggable:{type:Boolean,default:!0},closeOnClickOverlay:{type:Boolean,default:!0},beforeClose:{type:Function},escapable:{type:Boolean,default:!0},showClose:{type:Boolean,default:!0},showAnimation:{type:Boolean,default:!0},showOverlay:{type:Boolean,default:!0},appendToBody:{type:Boolean,default:!0},type:{type:String,default:""},keepLast:{type:Boolean,default:!1}},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]}},J={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};function O(t,o,n){let l=t;return o&&(l+=`__${o}`),n&&(l+=`--${n}`),l}function V(t,o=!1){const n=o?`.devui-${t}`:`devui-${t}`;return{b:()=>O(n),e:r=>r?O(n,r):"",m:r=>r?O(n,"",r):"",em:(r,d)=>r&&d?O(n,r,d):""}}var Ve="",Q=e.defineComponent({name:"DSvgIcon",props:J,setup(t){const{name:o,color:n,size:l}=e.toRefs(t),a=V("svg-icon"),i=e.computed(()=>`#icon-${o.value}`),s=e.computed(()=>typeof l.value=="number"?`${l.value}px`:l.value),r={width:s.value,height:s.value};return()=>e.createVNode("svg",{class:a.b(),style:r},[e.createVNode("use",{"xlink:href":i.value,fill:n.value},null)])}});function Z(t){return/^((http|https):)?\/\//.test(t)}function ee(t,o){const{component:n,name:l,size:a,color:i,classPrefix:s,rotate:r}=e.toRefs(t),d=V("icon"),f=e.computed(()=>typeof a.value=="number"?`${a.value}px`:a.value),m=n.value?e.resolveDynamicComponent(n.value):e.resolveDynamicComponent(Q),p=()=>e.createVNode("img",e.mergeProps({src:l.value,alt:l.value.split("/")[l.value.split("/").length-1],class:[(r==null?void 0:r.value)==="infinite"&&d.m("spin")],style:{width:f.value||"",transform:`rotate(${r==null?void 0:r.value}deg)`,verticalAlign:"middle"}},o.attrs),null),h=()=>e.createVNode(m,e.mergeProps({name:l.value,color:i.value,size:f.value,class:[(r==null?void 0:r.value)==="infinite"&&d.m("spin")],style:{transform:`rotate(${r==null?void 0:r.value}deg)`}},o.attrs),null),v=()=>{const w=/^icon-/.test(l.value)?l.value:`${s.value}-${l.value}`;return e.createVNode("i",e.mergeProps({class:[s.value,w,(r==null?void 0:r.value)==="infinite"&&d.m("spin")],style:{fontSize:f.value,color:i.value,transform:`rotate(${r==null?void 0:r.value}deg)`}},o.attrs),null)};return{iconDom:()=>n.value?h():Z(l.value)?p():v()}}var I=e.defineComponent({name:"DIcon",props:K,emits:["click"],setup(t,o){const{disabled:n,operable:l}=e.toRefs(t),{iconDom:a}=ee(t,o),i=V("icon"),s=e.computed(()=>({[i.e("container")]:!0,[i.m("disabled")]:n.value,[i.m("operable")]:l.value,[i.m("no-slots")]:!Object.keys(o.slots).length})),r=d=>{n.value||o.emit("click",d)};return()=>{var d,f,m,p;return e.createVNode("div",{class:s.value,onClick:r},[(f=(d=o.slots).prefix)==null?void 0:f.call(d),a(),(p=(m=o.slots).suffix)==null?void 0:p.call(m)])}}}),Ee="";e.defineComponent({name:"DIconGroup",setup(t,o){const n=V("icon-group");return()=>{var l,a;return e.createVNode("div",{class:n.b()},[(a=(l=o.slots).default)==null?void 0:a.call(l)])}}});const te={modelValue:{type:Boolean,default:!1},lockScroll:{type:Boolean,default:!0},closeOnClickOverlay:{type:Boolean,default:!0}};function R(){if(document.documentElement.scrollHeight>document.documentElement.clientHeight){const t=document.documentElement.scrollTop,o=document.documentElement.getAttribute("style");return document.documentElement.style.position="fixed",document.documentElement.style.top=`-${t}px`,document.documentElement.style.width=document.documentElement.style.width||"100%",document.documentElement.style.overflowY="scroll",()=>{o?document.documentElement.setAttribute("style",o):document.documentElement.removeAttribute("style"),document.documentElement.scrollTop=t}}}function oe(t,o){let n;const l=i=>{i.preventDefault(),o.emit("click",i),t.closeOnClickOverlay&&o.emit("update:modelValue",!1)},a=()=>{n==null||n()};return e.watch(()=>t.modelValue,i=>{i?t.lockScroll&&(n=R()):a()}),e.onUnmounted(a),{onClick:l}}var Ce="";const ne=e.defineComponent({name:"DFixedOverlay",inheritAttrs:!1,props:te,emits:["update:modelValue","click"],setup(t,o){const{modelValue:n}=e.toRefs(t),l=V("fixed-overlay"),{onClick:a}=oe(t,o);return()=>e.createVNode(e.Transition,{name:l.m("fade")},{default:()=>{var i,s;return[n.value&&e.createVNode("div",e.mergeProps({class:l.b()},o.attrs,{onClick:a}),[(s=(i=o.slots).default)==null?void 0:s.call(i)])]}})}}),le={modelValue:{type:Boolean,default:!1},origin:{type:Object,require:!0},position:{type:Array,default:["bottom"]},offset:{type:[Number,Object],default:8},shiftOffset:{type:Number},align:{type:String,default:null},showArrow:{type:Boolean,default:!1},isArrowCenter:{type:Boolean,default:!0},clickEventBubble:{type:Boolean,default:!1}};function ae(t){const o=/(auto|scroll|hidden)/;for(let n=t;n=n.parentElement;n.parentElement!==document.body){const l=window.getComputedStyle(n);if(o.test(l.overflow+l.overflowX+l.overflowY))return n}return window}function re(t,o,n,l){let{x:a,y:i}=o;if(!t){const{width:s,height:r}=l;a&&n.includes("start")&&(a=12),a&&n.includes("end")&&(a=Math.round(s-24)),i&&n.includes("start")&&(i=10),i&&n.includes("end")&&(i=r-14)}return{x:a,y:i}}function ie(t,o){const n=e.ref(),l=e.ref();let a=null;const i=(r,d,f,m)=>{const{x:p,y:h}=re(t.isArrowCenter,f,d,m.getBoundingClientRect()),v={top:"bottom",right:"left",bottom:"top",left:"right"}[d.split("-")[0]];Object.assign(r.style,{left:p?`${p}px`:"",top:h?`${h}px`:"",right:"",bottom:"",[v]:"-4px"})},s=async()=>{const r=t.origin,d=e.unref(n.value),f=e.unref(l.value),m=[u.offset(t.offset),u.autoPlacement({alignment:t.align,allowedPlacements:t.position})];t.showArrow&&m.push(u.arrow({element:f})),t.shiftOffset!==void 0&&m.push(u.shift());const{x:p,y:h,placement:v,middlewareData:g}=await u.computePosition(r,d,{strategy:"fixed",middleware:m});let w=p,E=h;if(t.shiftOffset!==void 0){const{x,y:N}=g.shift;x<0&&(w-=t.shiftOffset),x>0&&(w+=t.shiftOffset),N<0&&(E-=t.shiftOffset),N>0&&(E+=t.shiftOffset)}o("positionChange",v),Object.assign(d.style,{top:`${E}px`,left:`${w}px`}),t.showArrow&&i(f,v,g.arrow,d)};return e.watch(()=>t.modelValue,()=>{t.modelValue&&t.origin?(a=ae(t.origin),e.nextTick(s),a==null||a.addEventListener("scroll",s),a!==window&&window.addEventListener("scroll",s),window.addEventListener("resize",s)):(a==null||a.removeEventListener("scroll",s),a!==window&&window.removeEventListener("scroll",s),window.removeEventListener("resize",s))}),e.onUnmounted(()=>{a==null||a.removeEventListener("scroll",s),a!==window&&window.removeEventListener("scroll",s),window.removeEventListener("resize",s)}),{arrowRef:l,overlayRef:n,updatePosition:s}}var xe="";e.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:le,emits:["update:modelValue","positionChange"],setup(t,{slots:o,attrs:n,emit:l,expose:a}){const i=V("flexible-overlay"),{clickEventBubble:s}=e.toRefs(t),{arrowRef:r,overlayRef:d,updatePosition:f}=ie(t,l);return a({updatePosition:f}),()=>{var m;return t.modelValue&&e.createVNode("div",e.mergeProps({ref:d,class:i.b()},n,{onClick:e.withModifiers(()=>({}),[s.value?"":"stop"]),onPointerup:e.withModifiers(()=>({}),["stop"])}),[(m=o.default)==null?void 0:m.call(o),t.showArrow&&e.createVNode("div",{ref:r,class:i.e("arrow")},null)])}}});const se=typeof window!="undefined";function ce(t,o){function n(){o("update:modelValue",!1)}function l(){t.beforeClose?t.beforeClose(n):n()}function a(i){i.code==="Escape"&&l()}return e.onMounted(()=>{t.escapable&&window.addEventListener("keydown",a)}),e.onUnmounted(()=>{t.escapable&&window.addEventListener("keydown",a)}),{execClose:l}}function de(t){let o;const n=()=>{o==null||o()};e.watch(()=>t.modelValue,l=>{l?t.lockScroll&&(o=R()):n()},{immediate:!0}),e.onUnmounted(n)}function z(t,o="px"){return t?typeof t=="string"?t:typeof t=="number"?`${t}${o}`:"":""}const ue=(t,o,n)=>{const l=e.ref("translate(-50%, -50%)");let a={offsetX:0,offsetY:0};const i=f=>{const m=f.clientX,p=f.clientY,{offsetX:h,offsetY:v}=a,g=t.value.getBoundingClientRect(),w=g.left,E=g.top,x=g.width,N=g.height,C=document.documentElement.clientWidth,y=document.documentElement.clientHeight,S=-w+h,pe=-E+v,ye=C-w-x+h,he=y-E-N+v,F=U=>{const j=Math.min(Math.max(h+U.clientX-m,S),ye),H=Math.min(Math.max(v+U.clientY-p,pe),he);a={offsetX:j,offsetY:H},l.value=`translate(calc(-50% + ${z(j)}), calc(-50% + ${z(H)}))`},Y=()=>{document.removeEventListener("mousemove",F),document.removeEventListener("mouseup",Y)};document.addEventListener("mousemove",F),document.addEventListener("mouseup",Y)},s=()=>{o.value&&t.value&&o.value.addEventListener("mousedown",i)},r=()=>{o.value&&t.value&&o.value.removeEventListener("mousedown",i)};return e.onMounted(()=>{e.watchEffect(()=>{n.value?s():r()})}),e.onBeforeUnmount(()=>{r()}),{clearPosition:()=>{a={offsetX:0,offsetY:0},l.value="translate(-50%, -50%)"},modalPosition:l}};var B=e.defineComponent({name:"DModalHeader",setup(t,{slots:o}){const n=V("modal");return()=>{var l;return e.createVNode("div",{class:n.e("header")},[(l=o.default)==null?void 0:l.call(o)])}}}),D=e.defineComponent({name:"DModalBody",setup(t,{slots:o}){const n=V("modal");return()=>{var l;return e.createVNode("div",{class:n.e("body")},[(l=o.default)==null?void 0:l.call(o)])}}}),Ne="",k=e.defineComponent({name:"DModal",inheritAttrs:!1,props:b,emits:["update:modelValue"],setup(t,{slots:o,attrs:n,emit:l}){const a=V("modal"),{modelValue:i,title:s,showClose:r,showOverlay:d,appendToBody:f,closeOnClickOverlay:m,keepLast:p}=e.toRefs(t),{execClose:h}=ce(t,l);de(t);const v=e.ref(),g=e.ref(),w=e.computed(()=>t.draggable),{clearPosition:E,modalPosition:x}=ue(v,g,w);e.watch(i,C=>{C&&!p.value&&(E(),e.nextTick(()=>{const y=document==null?void 0:document.querySelector("[autofocus]");y&&y.focus()}))});const N=()=>{const y=[{type:"success",text:"\u6210\u529F",icon:"right-o",color:"var(--devui-success)"},{type:"failed",text:"\u9519\u8BEF",icon:"error-o",color:"var(--devui-danger)"},{type:"warning",text:"\u8B66\u544A",icon:"warning-o",color:"var(--devui-warning)"},{type:"info",text:"\u4FE1\u606F",icon:"info-o",color:"var(--devui-info)"}].find(S=>S.type===t.type);return e.createVNode("div",{style:{cursor:t.draggable?"move":"default"},ref:g},[e.createVNode(B,null,{default:()=>[e.createVNode("div",{class:"type-content"},[e.createVNode("div",{class:"type-content-icon"},[e.createVNode(I,{name:y==null?void 0:y.icon,color:y==null?void 0:y.color},null)]),e.createVNode("div",{class:"type-content-text"},[y==null?void 0:y.text])])]})])};return()=>e.createVNode(e.Teleport,{to:"body",disabled:!f.value},{default:()=>[d.value&&e.createVNode(ne,e.mergeProps({modelValue:i.value},{"onUpdate:modelValue":h},{class:a.e("overlay"),"lock-scroll":!1,"close-on-click-overlay":m.value,style:{zIndex:"calc(var(--devui-z-index-modal, 1050) - 1)"}}),null),e.createVNode(e.Transition,{name:t.showAnimation?a.m("wipe"):""},{default:()=>{var C;return[i.value&&e.createVNode("div",e.mergeProps({ref:v,class:a.b()},n,{onClick:y=>y.stopPropagation(),style:{transform:x.value}}),[r.value&&e.createVNode("div",{onClick:h,class:"btn-close"},[e.createVNode(I,{name:"close",size:"20px"},null)]),t.type?N():e.createVNode("div",{style:{cursor:t.draggable?"move":"default"},ref:g},[o.header?o.header():s.value&&e.createVNode(B,null,{default:()=>[s.value]})]),e.createVNode(D,null,{default:()=>{var y;return[(y=o.default)==null?void 0:y.call(o)]}}),(C=o.footer)==null?void 0:C.call(o)])]}})]})}}),X=e.defineComponent({name:"DModalFooter",setup(t,{slots:o}){const n=V("modal");return()=>{var l;return e.createVNode("div",{class:n.e("footer")},[(l=o.default)==null?void 0:l.call(o)])}}});class fe{constructor(o){this.anchorContainer=o}renderModal(o,n,l){const a=e.h(this.component(),n,l);return e.render(a,o),a}renderNull(o){setTimeout(()=>{e.render(null,o)},500)}}let M;class L extends fe{component(){return k}open(o={}){const n=document.createElement("div");this.anchorContainer.appendChild(n);const m=o,{header:l,content:a,footer:i}=m,s=W(m,["header","content","footer"]),r=(p,h)=>this.renderModal(n,$(T({},p),{modelValue:!0,"onUpdate:modelValue":h}),{header:l,default:a,footer:i}),d=()=>{var h,v,g;const p=w=>{w||d()};r(s,w=>{w?r(s,p):(this.renderModal(n,$(T({},s),{modelValue:!1})),this.renderNull(n))}),(g=(v=(h=M==null?void 0:M.component)==null?void 0:h.exposed)==null?void 0:v.handleVisibleChange)==null||g.call(v,!1)},f=p=>{p||d()};return this.renderModal(n,{modelValue:!1}),M=r(s,f),{hide:d}}}G(L,"token","MODAL_SERVICE_TOKEN");var me={title:"Modal \u5F39\u7A97",category:"\u53CD\u9988",status:"100%",install(t){if(t.component(k.name,k),t.component(B.name,B),t.component(D.name,D),t.component(X.name,X),!se)return;let o=document.getElementById("d-modal-anchors-container");o||(o=document.createElement("div"),o.setAttribute("id","d-modal-anchors-container"),document.body.appendChild(o)),t.provide(L.token,new L(o))}};c.Modal=k,c.default=me,c.modalProps=b,Object.defineProperty(c,"__esModule",{value:!0}),c[Symbol.toStringTag]="Module"});
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@ import { ImagePreviewProps } from './image-preview-types';
|
|
|
2
2
|
declare class ImagePreviewService {
|
|
3
3
|
static $body: HTMLElement | null;
|
|
4
4
|
static $div: HTMLDivElement | null;
|
|
5
|
-
static $overflow: string;
|
|
5
|
+
static $overflow: string | null;
|
|
6
6
|
static open(props: ImagePreviewProps): void;
|
|
7
7
|
static close(): void;
|
|
8
8
|
}
|
package/vue-devui.es.js
CHANGED
|
@@ -22571,10 +22571,10 @@ class ImagePreviewService {
|
|
|
22571
22571
|
this.$body.style.setProperty("overflow", "hidden", "important");
|
|
22572
22572
|
}
|
|
22573
22573
|
static close() {
|
|
22574
|
-
var _a;
|
|
22574
|
+
var _a, _b;
|
|
22575
22575
|
(_a = this.$body) == null ? void 0 : _a.style.setProperty("overflow", this.$overflow);
|
|
22576
22576
|
this.$overflow = null;
|
|
22577
|
-
this.$div && this.$body.removeChild(this.$div);
|
|
22577
|
+
this.$div && ((_b = this.$body) == null ? void 0 : _b.removeChild(this.$div));
|
|
22578
22578
|
this.$body = null;
|
|
22579
22579
|
this.$div = null;
|
|
22580
22580
|
}
|
|
@@ -22594,7 +22594,11 @@ function unmountedPreviewImages() {
|
|
|
22594
22594
|
ImagePreviewService.close();
|
|
22595
22595
|
}
|
|
22596
22596
|
function getImgByEl(el) {
|
|
22597
|
-
const
|
|
22597
|
+
const imgs = [...el.querySelectorAll("img")];
|
|
22598
|
+
const urlList = imgs.map((item) => {
|
|
22599
|
+
var _a;
|
|
22600
|
+
return (_a = item.getAttribute("preview-src") || item.getAttribute("src")) != null ? _a : "";
|
|
22601
|
+
});
|
|
22598
22602
|
return urlList;
|
|
22599
22603
|
}
|
|
22600
22604
|
function handleImg(e) {
|
|
@@ -22605,6 +22609,9 @@ function handleImg(e) {
|
|
|
22605
22609
|
if (((_a = target == null ? void 0 : target.nodeName) == null ? void 0 : _a.toLowerCase()) === "img") {
|
|
22606
22610
|
const urlList = getImgByEl(el);
|
|
22607
22611
|
const url2 = target.getAttribute("src");
|
|
22612
|
+
if (!url2) {
|
|
22613
|
+
return console.error("attribute is not exist");
|
|
22614
|
+
}
|
|
22608
22615
|
mountedPreviewImages({
|
|
22609
22616
|
url: url2,
|
|
22610
22617
|
previewUrlList: urlList,
|
|
@@ -22621,7 +22628,7 @@ function removeHandle(el) {
|
|
|
22621
22628
|
}
|
|
22622
22629
|
var ImagePreviewDirective = {
|
|
22623
22630
|
mounted(el, binding) {
|
|
22624
|
-
if (!binding.value) {
|
|
22631
|
+
if (!(binding == null ? void 0 : binding.value)) {
|
|
22625
22632
|
return handleImgByEl(el);
|
|
22626
22633
|
}
|
|
22627
22634
|
const { custom, disableDefault } = binding.value;
|
|
@@ -22647,9 +22654,9 @@ var ImagePreviewDirective = {
|
|
|
22647
22654
|
},
|
|
22648
22655
|
updated(el, binding) {
|
|
22649
22656
|
var _a, _b;
|
|
22650
|
-
el.zIndex = (_a = binding.value) == null ? void 0 : _a.zIndex;
|
|
22651
|
-
el.backDropZIndex = (_b = binding.value) == null ? void 0 : _b.backDropZIndex;
|
|
22652
|
-
if (binding.value) {
|
|
22657
|
+
el.zIndex = (_a = binding == null ? void 0 : binding.value) == null ? void 0 : _a.zIndex;
|
|
22658
|
+
el.backDropZIndex = (_b = binding == null ? void 0 : binding.value) == null ? void 0 : _b.backDropZIndex;
|
|
22659
|
+
if (binding == null ? void 0 : binding.value) {
|
|
22653
22660
|
const {
|
|
22654
22661
|
value: { disableDefault },
|
|
22655
22662
|
oldValue: { disableDefault: oldDisableDefault }
|
|
@@ -25060,6 +25067,12 @@ var Modal = defineComponent({
|
|
|
25060
25067
|
watch(modelValue, (val) => {
|
|
25061
25068
|
if (val && !keepLast.value) {
|
|
25062
25069
|
clearPosition();
|
|
25070
|
+
nextTick(() => {
|
|
25071
|
+
const autofocus = document == null ? void 0 : document.querySelector("[autofocus]");
|
|
25072
|
+
if (autofocus) {
|
|
25073
|
+
autofocus.focus();
|
|
25074
|
+
}
|
|
25075
|
+
});
|
|
25063
25076
|
}
|
|
25064
25077
|
});
|
|
25065
25078
|
const renderType = () => {
|
|
@@ -39036,7 +39049,7 @@ const installs = [
|
|
|
39036
39049
|
VirtualListInstall
|
|
39037
39050
|
];
|
|
39038
39051
|
var vueDevui = {
|
|
39039
|
-
version: "1.5.
|
|
39052
|
+
version: "1.5.3",
|
|
39040
39053
|
install(app) {
|
|
39041
39054
|
installs.forEach((p) => app.use(p));
|
|
39042
39055
|
}
|