vue-devui 1.0.0-beta.4 → 1.0.0-beta.8
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/accordion/index.d.ts +7 -0
- package/accordion/index.es.js +186 -139
- package/accordion/index.umd.js +1 -1
- package/accordion/style.css +1 -1
- package/alert/index.d.ts +7 -0
- package/alert/index.es.js +1 -1
- package/alert/index.umd.js +1 -1
- package/anchor/index.d.ts +7 -0
- package/avatar/index.d.ts +7 -0
- package/avatar/index.es.js +1 -1
- package/avatar/index.umd.js +1 -1
- package/back-top/index.d.ts +7 -0
- package/back-top/index.es.js +128 -0
- package/back-top/index.umd.js +1 -0
- package/back-top/package.json +7 -0
- package/back-top/style.css +1 -0
- package/badge/index.d.ts +7 -0
- package/badge/index.es.js +1 -1
- package/badge/index.umd.js +1 -1
- package/breadcrumb/index.d.ts +7 -0
- package/button/index.d.ts +7 -0
- package/button/index.es.js +4 -4
- package/button/index.umd.js +1 -1
- package/card/index.d.ts +7 -0
- package/card/index.es.js +1 -1
- package/card/index.umd.js +1 -1
- package/carousel/index.d.ts +7 -0
- package/carousel/index.es.js +3 -3
- package/carousel/index.umd.js +1 -1
- package/cascader/index.d.ts +7 -0
- package/cascader/index.es.js +1239 -83
- package/cascader/index.umd.js +1 -1
- package/cascader/style.css +1 -1
- package/checkbox/index.d.ts +7 -0
- package/checkbox/index.es.js +1 -1
- package/checkbox/index.umd.js +1 -1
- package/comment/index.d.ts +7 -0
- package/comment/index.es.js +57 -0
- package/comment/index.umd.js +1 -0
- package/comment/package.json +7 -0
- package/comment/style.css +1 -0
- package/countdown/index.d.ts +7 -0
- package/countdown/index.es.js +167 -0
- package/countdown/index.umd.js +1 -0
- package/countdown/package.json +7 -0
- package/countdown/style.css +1 -0
- package/date-picker/index.d.ts +7 -0
- package/date-picker/index.es.js +15 -15
- package/date-picker/index.umd.js +1 -1
- package/dragdrop/index.d.ts +7 -0
- package/drawer/index.d.ts +7 -0
- package/drawer/index.es.js +33 -9
- package/drawer/index.umd.js +1 -1
- package/dropdown/index.d.ts +7 -0
- package/dropdown/index.es.js +61 -61
- package/dropdown/index.umd.js +1 -1
- package/editable-select/index.d.ts +7 -0
- package/editable-select/index.es.js +53 -26
- package/editable-select/index.umd.js +9 -9
- package/form/index.d.ts +7 -0
- package/form/index.es.js +175 -80
- package/form/index.umd.js +1 -1
- package/form/style.css +1 -1
- package/fullscreen/index.d.ts +7 -0
- package/fullscreen/index.es.js +1 -1
- package/fullscreen/index.umd.js +1 -1
- package/gantt/index.d.ts +7 -0
- package/grid/index.d.ts +7 -0
- package/grid/index.es.js +2 -2
- package/grid/index.umd.js +1 -1
- package/icon/index.d.ts +7 -0
- package/icon/index.es.js +4 -4
- package/icon/index.umd.js +1 -1
- package/image-preview/index.d.ts +7 -0
- package/image-preview/index.es.js +23 -2
- package/image-preview/index.umd.js +1 -1
- package/index.d.ts +7 -0
- package/input/index.d.ts +7 -0
- package/input/index.es.js +12 -12
- package/input/index.umd.js +1 -1
- package/input-icon/index.d.ts +7 -0
- package/input-icon/index.es.js +331 -0
- package/input-icon/index.umd.js +1 -0
- package/input-icon/package.json +7 -0
- package/input-icon/style.css +1 -0
- package/input-number/index.d.ts +7 -0
- package/input-number/index.es.js +3 -3
- package/input-number/index.umd.js +1 -1
- package/layout/index.d.ts +7 -0
- package/layout/index.es.js +1 -1
- package/layout/index.umd.js +1 -1
- package/loading/index.d.ts +7 -0
- package/loading/index.es.js +1 -1
- package/loading/index.umd.js +1 -1
- package/modal/index.d.ts +7 -0
- package/modal/index.es.js +58 -57
- package/modal/index.umd.js +1 -1
- package/nav-sprite/index.d.ts +7 -0
- package/overlay/index.d.ts +7 -0
- package/overlay/index.es.js +56 -55
- package/overlay/index.umd.js +1 -1
- package/package.json +2 -31
- package/pagination/index.d.ts +7 -0
- package/pagination/index.es.js +3 -3
- package/pagination/index.umd.js +1 -1
- package/panel/index.d.ts +7 -0
- package/popover/index.d.ts +7 -0
- package/popover/index.es.js +1 -1
- package/popover/index.umd.js +1 -1
- package/progress/index.d.ts +7 -0
- package/progress/index.es.js +1 -1
- package/progress/index.umd.js +2 -2
- package/quadrant-diagram/index.d.ts +7 -0
- package/radio/index.d.ts +7 -0
- package/radio/index.es.js +1 -1
- package/radio/index.umd.js +1 -1
- package/rate/index.d.ts +7 -0
- package/rate/index.es.js +1 -1
- package/rate/index.umd.js +1 -1
- package/read-tip/index.d.ts +7 -0
- package/read-tip/index.es.js +61 -24
- package/read-tip/index.umd.js +1 -1
- package/read-tip/style.css +1 -1
- package/result/index.d.ts +7 -0
- package/result/index.es.js +118 -0
- package/result/index.umd.js +1 -0
- package/result/package.json +7 -0
- package/result/style.css +1 -0
- package/ripple/index.d.ts +7 -0
- package/ripple/index.es.js +5 -2
- package/ripple/index.umd.js +1 -1
- package/search/index.d.ts +7 -0
- package/search/index.es.js +14 -14
- package/search/index.umd.js +1 -1
- package/select/index.d.ts +7 -0
- package/select/index.es.js +3 -3
- package/select/index.umd.js +1 -1
- package/skeleton/index.d.ts +7 -0
- package/skeleton/index.es.js +148 -26
- package/skeleton/index.umd.js +1 -1
- package/skeleton/style.css +1 -1
- package/slider/index.d.ts +7 -0
- package/slider/index.es.js +1 -1
- package/slider/index.umd.js +1 -1
- package/splitter/index.d.ts +7 -0
- package/splitter/index.es.js +24 -25
- package/splitter/index.umd.js +1 -1
- package/status/index.d.ts +7 -0
- package/status/index.es.js +1 -1
- package/status/index.umd.js +1 -1
- package/steps-guide/index.d.ts +7 -0
- package/steps-guide/index.es.js +97 -74
- package/steps-guide/index.umd.js +1 -1
- package/sticky/index.d.ts +7 -0
- package/style.css +1 -1
- package/switch/index.d.ts +7 -0
- package/switch/index.es.js +1 -1
- package/switch/index.umd.js +1 -1
- package/table/index.d.ts +7 -0
- package/table/index.es.js +1492 -157
- package/table/index.umd.js +1 -1
- package/table/style.css +1 -1
- package/tabs/index.d.ts +7 -0
- package/tabs/index.es.js +1 -0
- package/tabs/index.umd.js +1 -1
- package/tag/index.d.ts +7 -0
- package/tag/index.es.js +94 -12
- package/tag/index.umd.js +1 -1
- package/tag/style.css +1 -1
- package/tag-input/index.d.ts +7 -0
- package/tag-input/index.es.js +1 -1
- package/tag-input/index.umd.js +1 -1
- package/textarea/index.d.ts +7 -0
- package/textarea/index.es.js +1 -1
- package/textarea/index.umd.js +1 -1
- package/time-axis/index.d.ts +7 -0
- package/time-axis/index.es.js +240 -21
- package/time-axis/index.umd.js +1 -1
- package/time-axis/style.css +1 -1
- package/time-picker/index.d.ts +7 -0
- package/time-picker/index.es.js +12 -7
- package/time-picker/index.umd.js +1 -1
- package/time-picker/style.css +1 -1
- package/toast/index.d.ts +7 -0
- package/toast/index.es.js +4 -4
- package/toast/index.umd.js +1 -1
- package/tooltip/index.d.ts +7 -0
- package/transfer/index.d.ts +7 -0
- package/transfer/index.es.js +301 -62
- package/transfer/index.umd.js +1 -1
- package/transfer/style.css +1 -1
- package/tree/index.d.ts +7 -0
- package/tree/index.es.js +160 -31
- package/tree/index.umd.js +1 -1
- package/tree-select/index.d.ts +7 -0
- package/tree-select/index.es.js +435 -110
- package/tree-select/index.umd.js +1 -1
- package/tree-select/style.css +1 -1
- package/upload/index.d.ts +7 -0
- package/upload/index.es.js +4 -4
- package/upload/index.umd.js +1 -1
- package/vue-devui.es.js +14014 -11820
- package/vue-devui.umd.js +19 -19
package/grid/index.es.js
CHANGED
|
@@ -68,7 +68,7 @@ function useColClassNames(props) {
|
|
|
68
68
|
});
|
|
69
69
|
}
|
|
70
70
|
function setSpace(val) {
|
|
71
|
-
return
|
|
71
|
+
return ` ${val.trim()}${val && " "}`;
|
|
72
72
|
}
|
|
73
73
|
function useSize(colSizes) {
|
|
74
74
|
const keys = Object.keys(colSizes).filter((key) => key in screenSizes);
|
|
@@ -260,7 +260,7 @@ Col.install = function(app) {
|
|
|
260
260
|
var index = {
|
|
261
261
|
title: "Grid \u6805\u683C",
|
|
262
262
|
category: "\u5E03\u5C40",
|
|
263
|
-
status: "
|
|
263
|
+
status: "100%",
|
|
264
264
|
install(app) {
|
|
265
265
|
app.use(Col);
|
|
266
266
|
app.use(Row);
|
package/grid/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var X=Object.defineProperty;var L=Object.getOwnPropertySymbols;var q=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var M=(u,t,i)=>t in u?X(u,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):u[t]=i,l=(u,t)=>{for(var i in t||(t={}))q.call(t,i)&&M(u,i,t[i]);if(L)for(var i of L(t))H.call(t,i)&&M(u,i,t[i]);return u};(function(u,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(u=typeof globalThis!="undefined"?globalThis:u||self,t(u.index={},u.Vue))})(this,function(u,t){"use strict";const i={align:{type:String,default:"top"},gutter:{type:[Number,Object,Array],default:0},justify:{type:String,default:"start"},wrap:{type:Boolean,default:!1}},m=[Number,Object],E={xs:m,sm:m,md:m,lg:m,xl:m,xxl:m},g=Number,T={flex:[String,Number],order:g},N={offset:g,pull:g,push:g,span:g},A=l(l(l({},T),N),E),d="devui-col";function p(e,n){return n!==void 0?` ${e}-${n}`:""}function
|
|
1
|
+
var X=Object.defineProperty;var L=Object.getOwnPropertySymbols;var q=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var M=(u,t,i)=>t in u?X(u,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):u[t]=i,l=(u,t)=>{for(var i in t||(t={}))q.call(t,i)&&M(u,i,t[i]);if(L)for(var i of L(t))H.call(t,i)&&M(u,i,t[i]);return u};(function(u,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(u=typeof globalThis!="undefined"?globalThis:u||self,t(u.index={},u.Vue))})(this,function(u,t){"use strict";const i={align:{type:String,default:"top"},gutter:{type:[Number,Object,Array],default:0},justify:{type:String,default:"start"},wrap:{type:Boolean,default:!1}},m=[Number,Object],E={xs:m,sm:m,md:m,lg:m,xl:m,xxl:m},g=Number,T={flex:[String,Number],order:g},N={offset:g,pull:g,push:g,span:g},A=l(l(l({},T),N),E),d="devui-col";function p(e,n){return n!==void 0?` ${e}-${n}`:""}function _(e){return t.computed(()=>{const n=p(`${d}-span`,e.span),o=p(`${d}-offset`,e.offset),c=p(`${d}-pull`,e.pull),a=p(`${d}-push`,e.push);return`${n}${o}${c}${a}`})}function w(e){return` ${e.trim()}${e&&" "}`}function z(e){const n=Object.keys(e).filter(o=>o in E);return t.computed(()=>n.reduce((o,c)=>{const a=typeof e[c];if(a==="number")o=`${w(o)}${d}-${c}-span-${e[c]}`;else if(a==="object"){const s=Object.keys(e[c]).filter(r=>r in N).reduce((r,f)=>typeof e[c][f]!="number"?"":(r=`${w(r)}${d}-${c}-${f}-${e[c][f]}`,r),"");o=`${w(o)}${s}`}return o},""))}const B=["xxl","xl","lg","md","sm","xs"],j={xs:"screen and (max-width: 575px)",sm:"screen and (min-width: 576px)",md:"screen and (min-width: 768px)",lg:"screen and (min-width: 992px)",xl:"screen and (min-width: 1200px)",xxl:"screen and (min-width: 1600px)"},$=new Map;let v=-1;const C={},P={};function F(e){return $.size||V(),v+=1,$.set(v,e),e(l({},C)),v}function U(e){$.delete(e),$.size===0&&D()}function V(){Object.keys(j).forEach(e=>{const n=window.matchMedia(j[e]);n.matches&&(C[e]=!0,R());const o=c=>{C[e]=c.matches,R()};n.addEventListener("change",o),P[e]={res:n,listener:o}})}function D(){Object.keys(j).forEach(e=>{const n=P[e];n.res.removeEventListener("change",n.listener)}),$.clear()}function R(){$.forEach(e=>{e(l({},C))})}var J="";const h="devui-row";var y=t.defineComponent({name:"DRow",props:i,emits:[],setup(e,{slots:n}){const o=t.ref({}),c=t.computed(()=>{const s=p(`${h}-align`,e.align),r=p(`${h}-justify`,e.justify),f=e.wrap?` ${h}-wrap`:"";return`${s}${r}${f}`});let a;t.onMounted(()=>{a=F(s=>{o.value=s})}),t.onUnmounted(()=>{U(a)});const x=t.computed(()=>{if(!e.gutter)return{};let s=[0,0];Array.isArray(e.gutter)?s=e.gutter:typeof e.gutter=="number"?s=[e.gutter,0]:B.some(O=>{const S=e.gutter[O];return o.value[O]&&S?(typeof S=="number"?s=[S,0]:s=S,!0):!1});const r=`${(s[0]||0)/2}px`,f=`${(s[0]||0)/2}px`,I=`${(s[1]||0)/2}px`,K=`${(s[1]||0)/2}px`;return{paddingLeft:r,paddingRight:f,paddingTop:I,paddingBottom:K}});return t.provide("gutterStyle",x),()=>{var s;return t.createVNode("div",{class:`${h}${c.value}`},[(s=n.default)==null?void 0:s.call(n)])}}}),Q="",b=t.defineComponent({name:"DCol",props:A,setup(e,{slots:n}){const o=r=>typeof r=="number"?`${r} ${r} auto`:/^\d+(\.\d+)?(px|rem|em|%)$/.test(r)?`0 0 ${r}`:r,c=_(e),a=z(e),x=t.computed(()=>({flex:o(e.flex),order:e.order})),s=t.inject("gutterStyle");return()=>{var r;return t.createVNode("div",{class:`${d}${c.value}${a.value}`,style:l(l({},x.value),s.value)},[(r=n.default)==null?void 0:r.call(n)])}}});y.install=function(e){e.component(y.name,y)},b.install=function(e){e.component(b.name,b)};var G={title:"Grid \u6805\u683C",category:"\u5E03\u5C40",status:"100%",install(e){e.use(b),e.use(y)}};u.Col=b,u.Row=y,u.default=G,Object.defineProperty(u,"__esModule",{value:!0}),u[Symbol.toStringTag]="Module"});
|
package/icon/index.d.ts
ADDED
package/icon/index.es.js
CHANGED
|
@@ -14,7 +14,7 @@ var __spreadValues = (a, b) => {
|
|
|
14
14
|
}
|
|
15
15
|
return a;
|
|
16
16
|
};
|
|
17
|
-
import { defineComponent, createVNode
|
|
17
|
+
import { defineComponent, createVNode } from "vue";
|
|
18
18
|
var Icon = defineComponent({
|
|
19
19
|
name: "DIcon",
|
|
20
20
|
props: {
|
|
@@ -45,7 +45,7 @@ var Icon = defineComponent({
|
|
|
45
45
|
color,
|
|
46
46
|
classPrefix
|
|
47
47
|
} = this;
|
|
48
|
-
return
|
|
48
|
+
return /^((https?):)?\/\//.test(name) ? createVNode("img", {
|
|
49
49
|
"src": name,
|
|
50
50
|
"alt": name.split("/")[name.split("/").length - 1],
|
|
51
51
|
"style": {
|
|
@@ -57,7 +57,7 @@ var Icon = defineComponent({
|
|
|
57
57
|
fontSize: size,
|
|
58
58
|
color
|
|
59
59
|
}
|
|
60
|
-
}, null)
|
|
60
|
+
}, null);
|
|
61
61
|
}
|
|
62
62
|
});
|
|
63
63
|
Icon.install = function(app) {
|
|
@@ -66,7 +66,7 @@ Icon.install = function(app) {
|
|
|
66
66
|
var index = {
|
|
67
67
|
title: "Icon \u56FE\u6807",
|
|
68
68
|
category: "\u901A\u7528",
|
|
69
|
-
status: "
|
|
69
|
+
status: "100%",
|
|
70
70
|
install(app) {
|
|
71
71
|
app.use(Icon);
|
|
72
72
|
}
|
package/icon/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var
|
|
1
|
+
var f=Object.defineProperty;var s=Object.getOwnPropertySymbols;var a=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var u=(t,e,n)=>e in t?f(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,l=(t,e)=>{for(var n in e||(e={}))a.call(e,n)&&u(t,n,e[n]);if(s)for(var n of s(e))p.call(e,n)&&u(t,n,e[n]);return t};(function(t,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(t=typeof globalThis!="undefined"?globalThis:t||self,e(t.index={},t.Vue))})(this,function(t,e){"use strict";var n=e.defineComponent({name:"DIcon",props:{name:{type:String,required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}},setup(i){return l({},i)},render(){const{name:i,size:o,color:c,classPrefix:r}=this;return/^((https?):)?\/\//.test(i)?e.createVNode("img",{src:i,alt:i.split("/")[i.split("/").length-1],style:{width:o}},null):e.createVNode("i",{class:`${r} ${r}-${i}`,style:{fontSize:o,color:c}},null)}});n.install=function(i){i.component(n.name,n)};var d={title:"Icon \u56FE\u6807",category:"\u901A\u7528",status:"100%",install(i){i.use(n)}};t.Icon=n,t.default=d,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
|
|
@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
|
|
|
4
4
|
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
5
5
|
return value;
|
|
6
6
|
};
|
|
7
|
-
import { defineComponent, ref, computed, onMounted, createVNode, createTextVNode, createApp } from "vue";
|
|
7
|
+
import { defineComponent, ref, computed, onMounted, onUnmounted, createVNode, createTextVNode, createApp } from "vue";
|
|
8
8
|
var imagePreview$1 = "";
|
|
9
9
|
const imagePreviewProps = {
|
|
10
10
|
url: {
|
|
@@ -171,9 +171,30 @@ var imagePreview = defineComponent({
|
|
|
171
171
|
function onZoomOriginal() {
|
|
172
172
|
transform.setZoomOriginal();
|
|
173
173
|
}
|
|
174
|
+
function onKeyDown(event) {
|
|
175
|
+
if (event.defaultPrevented)
|
|
176
|
+
return;
|
|
177
|
+
if (event.code == "Escape") {
|
|
178
|
+
onClose();
|
|
179
|
+
} else if (event.code == "ArrowLeft") {
|
|
180
|
+
onPrev();
|
|
181
|
+
} else if (event.code == "ArrowRight") {
|
|
182
|
+
onNext();
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
function initKeyboard() {
|
|
186
|
+
document.addEventListener("keydown", onKeyDown, false);
|
|
187
|
+
}
|
|
188
|
+
function unKeyBoard() {
|
|
189
|
+
document.removeEventListener("keydown", onKeyDown, false);
|
|
190
|
+
}
|
|
174
191
|
onMounted(() => {
|
|
175
192
|
initIndex();
|
|
176
193
|
initTransform();
|
|
194
|
+
initKeyboard();
|
|
195
|
+
});
|
|
196
|
+
onUnmounted(() => {
|
|
197
|
+
unKeyBoard();
|
|
177
198
|
});
|
|
178
199
|
return () => {
|
|
179
200
|
return createVNode("div", {
|
|
@@ -410,7 +431,7 @@ var ImagePreviewDirective = {
|
|
|
410
431
|
var index = {
|
|
411
432
|
title: "ImagePreview \u56FE\u7247\u9884\u89C8",
|
|
412
433
|
category: "\u6570\u636E\u5C55\u793A",
|
|
413
|
-
status: "
|
|
434
|
+
status: "100%",
|
|
414
435
|
install(app) {
|
|
415
436
|
app.directive("d-image-preview", ImagePreviewDirective);
|
|
416
437
|
app.config.globalProperties.$imagePreviewService = ImagePreviewService;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var T=Object.defineProperty;var $=(s,e,d)=>e in s?T(s,e,{enumerable:!0,configurable:!0,writable:!0,value:d}):s[e]=d;var n=(s,e,d)=>($(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";var d="";const v={url:{type:String,default:""},previewUrlList:{type:Array,default:()=>[]}};class C{constructor(t,o={}){n(this,"el");n(this,"oTransformX",0);n(this,"oTransformY",0);n(this,"transformX");n(this,"transformY");n(this,"zoom");n(this,"rotate");n(this,"STEP",.25);n(this,"MIN_SCALE",.2);n(this,"MAX_SCALE",2.5);n(this,"TRANSFORMX",0);n(this,"TRANSFORMY",0);n(this,"ZOOM",1);n(this,"ROTATE",0);this.el=t,this.transformX=o.transformX||this.TRANSFORMX,this.transformY=o.transformY||this.TRANSFORMY,this.zoom=o.zoom||this.ZOOM,this.rotate=o.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=t=>{const o=t.clientX,r=t.clientY;document.onmousemove=l=>{const c=l.clientX-o,h=l.clientY-r;this.transformX=this.oTransformX+c,this.transformY=this.oTransformY+h,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=o=>{const r=-o.wheelDelta||o.deltaY||o.detail;t(r)}}throttle(t,o){let r=null;return(...l)=>{r||setTimeout(()=>{r=null,t.apply(this,l)},o)}}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.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}var N=e.defineComponent({name:"DImagePreview",props:v,emits:[],setup(i){let t=null;const o=e.ref(0),r=e.computed(()=>i.previewUrlList[o.value]);function l(){const u=document.querySelector(".devui-image-preview-main-image");t=new C(u)}function c(){o.value=i.previewUrlList.findIndex(u=>u===i.url)}function h(){o.value=o.value<=0?i.previewUrlList.length-1:o.value-1}function p(){o.value=o.value>=i.previewUrlList.length-1?0:o.value+1}function x(){a.close()}function M(){t.setZoomIn()}function b(){t.setZoomOut()}function Z(){t.setRotate()}function k(){t.setZoomBest()}function P(){t.setZoomOriginal()}return e.onMounted(()=>{c(),l()}),()=>e.createVNode("div",{class:"devui-image-preview"},[e.createVNode("img",{class:"devui-image-preview-main-image",src:r.value},null),e.createVNode("button",{class:"devui-image-preview-close-btn",onClick:x},[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:"devui-image-preview-arrow-left",onClick:h},[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:"devui-image-preview-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:"devui-image-preview-toolbar"},[e.createVNode("button",{onClick:M},[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:b},[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:Z},[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:h},[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:"devui-image-preview-index"},[o.value+1,e.createTextVNode(":"),i.previewUrlList.length]),e.createVNode("button",{class:"devui-next",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:k},[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:P},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])])}});function V(i){return e.createApp(N,i)}class a{static open(t){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),V(t).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var t;(t=this.$body)==null||t.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}n(a,"$body",null),n(a,"$div",null),n(a,"$overflow","");function m(i,t){a.open({url:i,previewUrlList:t})}function f(){a.close()}function g(i){return[...i.querySelectorAll("img")].map(o=>o.getAttribute("src"))}function L(i){i.addEventListener("click",t=>{var r;t.stopPropagation();const o=t.target;if(((r=o==null?void 0:o.nodeName)==null?void 0:r.toLowerCase())==="img"){const l=g(i),c=o.getAttribute("src");m(c,l)}})}var w={mounted(i,t){if(!t.value)return L(i);const{custom:o,disableDefault:r}=t.value;o instanceof Object&&(o.open=()=>{const l=g(i);m(l==null?void 0:l[0],l)},o.close=()=>f()),!r&&L(i)},unmounted(){f()}},y={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"\u5DF2\u5B8C\u6210",install(i){i.directive("d-image-preview",w),i.config.globalProperties.$imagePreviewService=a}};s.ImagePreviewDirective=w,s.ImagePreviewService=a,s.default=y,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
|
|
1
|
+
var E=Object.defineProperty;var O=(r,e,c)=>e in r?E(r,e,{enumerable:!0,configurable:!0,writable:!0,value:c}):r[e]=c;var n=(r,e,c)=>(O(r,typeof e!="symbol"?e+"":e,c),c);(function(r,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,e(r.index={},r.Vue))})(this,function(r,e){"use strict";var c="";const N={url:{type:String,default:""},previewUrlList:{type:Array,default:()=>[]}};class V{constructor(t,o={}){n(this,"el");n(this,"oTransformX",0);n(this,"oTransformY",0);n(this,"transformX");n(this,"transformY");n(this,"zoom");n(this,"rotate");n(this,"STEP",.25);n(this,"MIN_SCALE",.2);n(this,"MAX_SCALE",2.5);n(this,"TRANSFORMX",0);n(this,"TRANSFORMY",0);n(this,"ZOOM",1);n(this,"ROTATE",0);this.el=t,this.transformX=o.transformX||this.TRANSFORMX,this.transformY=o.transformY||this.TRANSFORMY,this.zoom=o.zoom||this.ZOOM,this.rotate=o.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=t=>{const o=t.clientX,s=t.clientY;document.onmousemove=l=>{const h=l.clientX-o,u=l.clientY-s;this.transformX=this.oTransformX+h,this.transformY=this.oTransformY+u,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=o=>{const s=-o.wheelDelta||o.deltaY||o.detail;t(s)}}throttle(t,o){let s=null;return(...l)=>{s||setTimeout(()=>{s=null,t.apply(this,l)},o)}}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.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}var y=e.defineComponent({name:"DImagePreview",props:N,emits:[],setup(i){let t=null;const o=e.ref(0),s=e.computed(()=>i.previewUrlList[o.value]);function l(){const d=document.querySelector(".devui-image-preview-main-image");t=new V(d)}function h(){o.value=i.previewUrlList.findIndex(d=>d===i.url)}function u(){o.value=o.value<=0?i.previewUrlList.length-1:o.value-1}function f(){o.value=o.value>=i.previewUrlList.length-1?0:o.value+1}function v(){a.close()}function b(){t.setZoomIn()}function k(){t.setZoomOut()}function P(){t.setRotate()}function Z(){t.setZoomBest()}function T(){t.setZoomOriginal()}function C(d){d.defaultPrevented||(d.code=="Escape"?v():d.code=="ArrowLeft"?u():d.code=="ArrowRight"&&f())}function A(){document.addEventListener("keydown",C,!1)}function $(){document.removeEventListener("keydown",C,!1)}return e.onMounted(()=>{h(),l(),A()}),e.onUnmounted(()=>{$()}),()=>e.createVNode("div",{class:"devui-image-preview"},[e.createVNode("img",{class:"devui-image-preview-main-image",src:s.value},null),e.createVNode("button",{class:"devui-image-preview-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:"devui-image-preview-arrow-left",onClick:u},[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:"devui-image-preview-arrow-right",onClick:f},[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:"devui-image-preview-toolbar"},[e.createVNode("button",{onClick:b},[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:k},[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: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("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:u},[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:"devui-image-preview-index"},[o.value+1,e.createTextVNode(":"),i.previewUrlList.length]),e.createVNode("button",{class:"devui-next",onClick:f},[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:Z},[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:T},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])])}});function x(i){return e.createApp(y,i)}class a{static open(t){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),x(t).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var t;(t=this.$body)==null||t.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}n(a,"$body",null),n(a,"$div",null),n(a,"$overflow","");function m(i,t){a.open({url:i,previewUrlList:t})}function g(){a.close()}function L(i){return[...i.querySelectorAll("img")].map(o=>o.getAttribute("src"))}function w(i){i.addEventListener("click",t=>{var s;t.stopPropagation();const o=t.target;if(((s=o==null?void 0:o.nodeName)==null?void 0:s.toLowerCase())==="img"){const l=L(i),h=o.getAttribute("src");m(h,l)}})}var p={mounted(i,t){if(!t.value)return w(i);const{custom:o,disableDefault:s}=t.value;o instanceof Object&&(o.open=()=>{const l=L(i);m(l==null?void 0:l[0],l)},o.close=()=>g()),!s&&w(i)},unmounted(){g()}},M={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(i){i.directive("d-image-preview",p),i.config.globalProperties.$imagePreviewService=a}};r.ImagePreviewDirective=p,r.ImagePreviewService=a,r.default=M,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});
|
package/index.d.ts
ADDED
package/input/index.d.ts
ADDED
package/input/index.es.js
CHANGED
|
@@ -32,27 +32,27 @@ const inputProps = {
|
|
|
32
32
|
type: Boolean,
|
|
33
33
|
default: false
|
|
34
34
|
},
|
|
35
|
-
|
|
35
|
+
modelValue: {
|
|
36
36
|
type: String,
|
|
37
37
|
default: ""
|
|
38
38
|
},
|
|
39
|
-
"
|
|
39
|
+
"update:modelValue": {
|
|
40
40
|
type: Function,
|
|
41
41
|
default: void 0
|
|
42
42
|
},
|
|
43
|
-
|
|
43
|
+
onChange: {
|
|
44
44
|
type: Function,
|
|
45
45
|
default: void 0
|
|
46
46
|
},
|
|
47
|
-
|
|
47
|
+
onKeydown: {
|
|
48
48
|
type: Function,
|
|
49
49
|
default: void 0
|
|
50
50
|
},
|
|
51
|
-
|
|
51
|
+
onFocus: {
|
|
52
52
|
type: Function,
|
|
53
53
|
default: void 0
|
|
54
54
|
},
|
|
55
|
-
|
|
55
|
+
onBlur: {
|
|
56
56
|
type: Function,
|
|
57
57
|
default: void 0
|
|
58
58
|
}
|
|
@@ -76,7 +76,7 @@ var Input = defineComponent({
|
|
|
76
76
|
}
|
|
77
77
|
},
|
|
78
78
|
props: inputProps,
|
|
79
|
-
emits: ["update:
|
|
79
|
+
emits: ["update:modelValue", "focus", "blur", "change", "keydown"],
|
|
80
80
|
setup(props, ctx) {
|
|
81
81
|
const formItem = inject(formItemInjectionKey, {});
|
|
82
82
|
const hasFormItem = Object.keys(formItem).length > 0;
|
|
@@ -96,11 +96,11 @@ var Input = defineComponent({
|
|
|
96
96
|
}, {
|
|
97
97
|
immediate: true
|
|
98
98
|
});
|
|
99
|
-
watch(() => props.
|
|
99
|
+
watch(() => props.modelValue, (value) => {
|
|
100
100
|
value && value.length > 0 && showPreviewIcon.value ? showPwdIcon.value = true : showPwdIcon.value = false;
|
|
101
101
|
});
|
|
102
102
|
const onInput = ($event) => {
|
|
103
|
-
ctx.emit("update:
|
|
103
|
+
ctx.emit("update:modelValue", $event.target.value);
|
|
104
104
|
hasFormItem && formItem.formItemMitt.emit(dFormItemEvents.input);
|
|
105
105
|
}, onFocus = () => {
|
|
106
106
|
ctx.emit("focus");
|
|
@@ -130,7 +130,7 @@ var Input = defineComponent({
|
|
|
130
130
|
},
|
|
131
131
|
render() {
|
|
132
132
|
const {
|
|
133
|
-
|
|
133
|
+
modelValue,
|
|
134
134
|
showPreviewIcon,
|
|
135
135
|
showPwdIcon,
|
|
136
136
|
inputCls,
|
|
@@ -151,7 +151,7 @@ var Input = defineComponent({
|
|
|
151
151
|
}, [withDirectives(createVNode("input", mergeProps({
|
|
152
152
|
dinput: true
|
|
153
153
|
}, {
|
|
154
|
-
"value":
|
|
154
|
+
"value": modelValue,
|
|
155
155
|
"disabled": disabled,
|
|
156
156
|
"type": inputType,
|
|
157
157
|
"maxlength": maxLength,
|
|
@@ -182,7 +182,7 @@ Input.install = function(app) {
|
|
|
182
182
|
var index = {
|
|
183
183
|
title: "Input \u8F93\u5165\u6846",
|
|
184
184
|
category: "\u6570\u636E\u5F55\u5165",
|
|
185
|
-
status: "
|
|
185
|
+
status: "100%",
|
|
186
186
|
install(app) {
|
|
187
187
|
app.use(Input);
|
|
188
188
|
}
|
package/input/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(o,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis!="undefined"?globalThis:o||self,e(o.index={},o.Vue))})(this,function(o,e){"use strict";const
|
|
1
|
+
(function(o,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis!="undefined"?globalThis:o||self,e(o.index={},o.Vue))})(this,function(o,e){"use strict";const F={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},autoFocus:{type:Boolean,default:!1},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},cssClass:{type:String,default:""},error:{type:Boolean,default:!1},size:{type:String,default:""},showPassword:{type:Boolean,default:!1},modelValue:{type:String,default:""},"update:modelValue":{type:Function,default:void 0},onChange:{type:Function,default:void 0},onKeydown:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onBlur:{type:Function,default:void 0}};var b="";const C=Symbol("dFormItem"),c={blur:"d.form.blur",change:"d.form.change",input:"d.form.input"};var i=e.defineComponent({name:"DInput",directives:{focus:{mounted:function(n,u){u.value&&n.focus()}}},props:F,emits:["update:modelValue","focus","blur","change","keydown"],setup(n,u){const d=e.inject(C,{}),l=Object.keys(d).length>0,p=e.computed(()=>`devui-input-${n.size}`),s=e.ref(!1),a=e.ref("text"),f=e.computed(()=>({error:n.error,[n.cssClass]:!0,[p.value]:n.size!==""})),r=e.computed(()=>a.value==="password");return e.watch(()=>n.showPassword,t=>{a.value=t?"password":"text"},{immediate:!0}),e.watch(()=>n.modelValue,t=>{t&&t.length>0&&r.value?s.value=!0:s.value=!1}),{inputCls:f,inputType:a,showPreviewIcon:r,showPwdIcon:s,onInput:t=>{u.emit("update:modelValue",t.target.value),l&&d.formItemMitt.emit(c.input)},onFocus:()=>{u.emit("focus")},onBlur:()=>{u.emit("blur"),l&&d.formItemMitt.emit(c.blur)},onChange:t=>{u.emit("change",t.target.value),l&&d.formItemMitt.emit(c.change)},onKeydown:t=>{u.emit("keydown",t)},onChangeInputType:()=>{a.value=a.value==="password"?"text":"password"}}},render(){const{modelValue:n,showPreviewIcon:u,showPwdIcon:d,inputCls:l,inputType:p,maxLength:s,autoFocus:a,placeholder:f,disabled:r,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g,onChangeInputType:I}=this;return e.createVNode("div",{class:"devui-input__wrap"},[e.withDirectives(e.createVNode("input",e.mergeProps({dinput:!0},{value:n,disabled:r,type:p,maxlength:s,placeholder:f,class:l,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g}),null),[[e.resolveDirective("focus"),a]]),d&&e.createVNode("div",{class:"devui-input__preview",onClick:I},[u?e.createVNode(e.resolveComponent("d-icon"),{name:"preview",size:"12px",key:1},null):e.createVNode(e.resolveComponent("d-icon"),{name:"preview-forbidden",size:"12px",key:2},null)])])}});i.install=function(n){n.component(i.name,i)};var v={title:"Input \u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(n){n.use(i)}};o.Input=i,o.default=v,Object.defineProperty(o,"__esModule",{value:!0}),o[Symbol.toStringTag]="Module"});
|