vue-devui 1.0.0-beta.15 → 1.0.0-beta.16
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/alert/index.es.js +0 -3
- package/alert/index.umd.js +1 -1
- package/alert/style.css +1 -1
- package/package.json +1 -1
- package/statistic/index.es.js +16 -29
- package/statistic/index.umd.js +1 -1
- package/statistic/style.css +1 -1
- package/style.css +1 -1
- package/tooltip/index.es.js +1 -1
- package/tooltip/index.umd.js +1 -1
- package/tree/index.es.js +979 -17
- package/tree/index.umd.js +1 -1
- package/tree/style.css +1 -1
- package/vue-devui.es.js +200 -46
- package/vue-devui.umd.js +15 -15
package/alert/index.es.js
CHANGED
|
@@ -123,9 +123,6 @@ var Alert = defineComponent({
|
|
|
123
123
|
let dismissTimer = void 0;
|
|
124
124
|
const close = (event) => {
|
|
125
125
|
dismissTimer && clearTimeout(dismissTimer);
|
|
126
|
-
const dom = alertEl.value;
|
|
127
|
-
dom.style.height = `${dom.offsetHeight}px`;
|
|
128
|
-
dom.style.height = `${dom.offsetHeight}px`;
|
|
129
126
|
closing.value = true;
|
|
130
127
|
ctx.emit("close", event);
|
|
131
128
|
};
|
package/alert/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.index={},n.Vue))})(this,function(n,e){"use strict";const u=()=>e.createVNode("svg",{width:"10px",height:"10px",viewBox:"0 0 10 10",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{transform:"translate(-3.000000, -3.000000)","fill-rule":"nonzero"},[e.createVNode("path",{d:"M11.6426,3.19816936 C11.9239974,2.91574512 12.4131626,2.93784891 12.7352108,3.24751057 C13.0571998,3.5572302 13.0901298,4.03723416 12.8087324,4.31965839 L9.14064666,7.99900183 L12.8087324,11.6803416 C13.0645482,11.9370909 13.0605893,12.3571292 12.8158402,12.6640749 L12.7352108,12.7524894 C12.4131626,13.0621511 11.9239974,13.0842548 11.6426,12.8018306 L8,9.14489021 L4.35740003,12.8018306 C4.10158422,13.05858 3.6740594,13.0636532 3.35648225,12.8298003 L3.26478919,12.7524894 C2.94280021,12.4427698 2.90987023,11.9627658 3.19126762,11.6803416 L6.8583349,7.99900183 L3.19126762,4.31965839 C2.93545181,4.06290908 2.93941068,3.64287076 3.18415975,3.3359251 L3.26478919,3.24751057 C3.58683735,2.93784891 4.07600264,2.91574512 4.35740003,3.19816936 L8,6.85411161 L11.6426,3.19816936 Z"},null)])])]),f=t=>e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg",class:`devui-icon ${t.type==="danger"?"devui-icon-error":`devui-icon-${t.type}`}`},[(()=>{switch(t.type){case"success":return e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{"fill-rule":"nonzero",d:"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z"},null),e.createVNode("polygon",{"stroke-width":"0.3","fill-rule":"nonzero",points:"6.82767602 11.5282799 3 7.24668779 3.89864233 6.37912367 6.82767602 9.04910002 12.2964408 4 13 4.64144383"},null)]);case"warning":return e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{class:"devui-icon-warning-outer",d:"M8.96244623,0.57254229 L15.8714442,13.4101975 C16.1549662,13.9370117 15.9538562,14.5918482 15.4222523,14.8728158 C15.2642579,14.9563203 15.0879506,15 14.9088903,15 L1.09089441,15 C0.488410063,15 0,14.5159904 0,13.9189343 C0,13.7414873 0.0440768395,13.5667684 0.128340519,13.4101975 L7.03733844,0.57254229 C7.32086049,0.0457280838 7.98165058,-0.153569987 8.51325441,0.127397589 C8.70423071,0.228333932 8.8605922,0.383286648 8.96244623,0.57254229 Z"},null),e.createVNode("path",{class:"devui-icon-warning-inner","stroke-width":"0.3","fill-rule":"nonzero",d:"M8.87894737,13 L7.08947368,13 L7.08947368,11.2105263 L8.87894737,11.2105263 L8.87894737,13 Z M8.62102372,9.86842105 L7.32800539,9.86842105 L7,4.5 L8.96842105,4.5 L8.62102372,9.86842105 Z"},null)]);case"info":return e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{"fill-rule":"nonzero"},[e.createVNode("path",{class:"devui-icon-info-outer",d:"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z"},null),e.createVNode("path",{class:"devui-icon-info-inner",d:"M9.19008504,7 L8.79402696,13 L7.15622605,13 L6.73158434,7 L9.19008504,7 Z M9,3 L9,5 L7,5 L7,3 L9,3 Z","stroke-width":"0.2"},null)])]);case"danger":return e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{"fill-rule":"nonzero"},[e.createVNode("path",{class:"devui-icon-error-outer",d:"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z"},null),e.createVNode("path",{class:"devui-icon-error-inner",d:"M9,10.6 L9,12.6 L7,12.6 L7,10.6 L9,10.6 Z M9.1,3.1 L8.65924344,9.1 L7.28422786,9.1 L6.9,3.1 L9.1,3.1 Z","stroke-width":"0.2"},null)])]);default:return null}})()]);var w="",l=e.defineComponent({name:"DAlert",props:{type:{type:String,default:"info"},cssClass:{type:String,default:""},closeable:{type:Boolean,default:!0},showIcon:{type:Boolean,default:!0},dismissTime:{type:Number,default:0}},emits:["close"],setup(t,d){const s=e.ref(!1),o=e.ref(!1),h=e.ref();let r;const a=i=>{r&&clearTimeout(r),o.value=!0,d.emit("close",i)},C=()=>{r=void 0,s.value=!0,o.value=!1};return e.onMounted(()=>{t.dismissTime&&(r=window.setTimeout(()=>{a()},t.dismissTime))}),()=>s.value?null:e.createVNode(e.Transition,{name:"devui-alert",onAfterLeave:C},{default:()=>{var i,c;return[e.withDirectives(e.createVNode("div",{ref:h,class:`devui-alert devui-alert-${t.type} ${t.cssClass} ${o.value?"devui-alter-close":""}`},[t.closeable?e.createVNode("div",{class:"devui-close",onClick:a},[e.createVNode(u,null,null)]):null,t.showIcon!==!1&&t.type!=="simple"?e.createVNode("span",{class:"devui-alert-icon"},[e.createVNode(f,{type:t.type},null)]):null,(c=(i=d.slots).default)==null?void 0:c.call(i)]),[[e.vShow,!o.value]])]}})}});l.install=function(t){t.component(l.name,l)};var L={title:"Alert \u8B66\u544A",category:"\u53CD\u9988",status:"100%",install(t){t.use(l)}};n.Alert=l,n.default=L,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});
|
package/alert/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.devui-alert{color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 12px);border:1px solid transparent;padding:8px 16px;line-height:24px;border-radius:var(--devui-border-radius, 2px);word-break:normal;word-wrap:break-word}.devui-alert .devui-close{color:var(--devui-text, #252b3a);opacity:1;line-height:26px;height:24px}.devui-alert .devui-close>svg path{fill:var(--devui-light-text, #ffffff)}.devui-alert .devui-close span{color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 12px);font-weight:bold}.devui-alert.devui-alert-success{background-color:var(--devui-success-bg, #edfff9);border-color:var(--devui-success-line, #50d4ab);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-success .devui-close>svg path{fill:var(--devui-success-line, #50d4ab)}.devui-alert.devui-alert-info{background-color:var(--devui-info-bg, #f2f5fc);border-color:var(--devui-info-line, #5e7ce0);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-info .devui-close>svg path{fill:var(--devui-info-line, #5e7ce0)}.devui-alert.devui-alert-warning{background-color:var(--devui-warning-bg, #fff3e8);border-color:var(--devui-warning-line, #fa9841);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-warning .devui-close>svg path{fill:var(--devui-warning-line, #fa9841)}.devui-alert.devui-alert-danger{background-color:var(--devui-danger-bg, #ffeeed);border-color:var(--devui-danger-line, #f66f6a);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-danger .devui-close>svg path{fill:var(--devui-danger-line, #f66f6a)}.devui-alert.devui-alert-simple{border-color:var(--devui-line, #adb0b8);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-simple .devui-close>svg path{fill:var(--devui-text-weak, #575d6c)}.devui-alert svg.devui-icon{width:16px;height:16px;vertical-align:middle;transform:translateY(-1px)}.devui-alert .devui-icon.devui-icon-success>g path{fill:var(--devui-success-line, #50d4ab)}.devui-alert .devui-icon.devui-icon-success>g polygon{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert .devui-icon.devui-icon-warning>g path.devui-icon-warning-outer{fill:var(--devui-warning-line, #fa9841)}.devui-alert .devui-icon.devui-icon-warning>g path.devui-icon-warning-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert .devui-icon.devui-icon-info>g path.devui-icon-info-outer{fill:var(--devui-info-line, #5e7ce0)}.devui-alert .devui-icon.devui-icon-info>g path.devui-icon-info-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert .devui-icon.devui-icon-error>g path.devui-icon-error-outer{fill:var(--devui-danger-line, #f66f6a)}.devui-alert .devui-icon.devui-icon-error>g path.devui-icon-error-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert-icon{margin-right:4px}.devui-alter-close{
|
|
1
|
+
.devui-alert{color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 12px);border:1px solid transparent;padding:8px 16px;line-height:24px;border-radius:var(--devui-border-radius, 2px);word-break:normal;word-wrap:break-word}.devui-alert .devui-close{color:var(--devui-text, #252b3a);opacity:1;line-height:26px;height:24px}.devui-alert .devui-close>svg path{fill:var(--devui-light-text, #ffffff)}.devui-alert .devui-close span{color:var(--devui-text, #252b3a);font-size:var(--devui-font-size, 12px);font-weight:bold}.devui-alert.devui-alert-success{background-color:var(--devui-success-bg, #edfff9);border-color:var(--devui-success-line, #50d4ab);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-success .devui-close>svg path{fill:var(--devui-success-line, #50d4ab)}.devui-alert.devui-alert-info{background-color:var(--devui-info-bg, #f2f5fc);border-color:var(--devui-info-line, #5e7ce0);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-info .devui-close>svg path{fill:var(--devui-info-line, #5e7ce0)}.devui-alert.devui-alert-warning{background-color:var(--devui-warning-bg, #fff3e8);border-color:var(--devui-warning-line, #fa9841);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-warning .devui-close>svg path{fill:var(--devui-warning-line, #fa9841)}.devui-alert.devui-alert-danger{background-color:var(--devui-danger-bg, #ffeeed);border-color:var(--devui-danger-line, #f66f6a);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-danger .devui-close>svg path{fill:var(--devui-danger-line, #f66f6a)}.devui-alert.devui-alert-simple{border-color:var(--devui-line, #adb0b8);color:var(--devui-text, #252b3a)}.devui-alert.devui-alert-simple .devui-close>svg path{fill:var(--devui-text-weak, #575d6c)}.devui-alert svg.devui-icon{width:16px;height:16px;vertical-align:middle;transform:translateY(-1px)}.devui-alert .devui-icon.devui-icon-success>g path{fill:var(--devui-success-line, #50d4ab)}.devui-alert .devui-icon.devui-icon-success>g polygon{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert .devui-icon.devui-icon-warning>g path.devui-icon-warning-outer{fill:var(--devui-warning-line, #fa9841)}.devui-alert .devui-icon.devui-icon-warning>g path.devui-icon-warning-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert .devui-icon.devui-icon-info>g path.devui-icon-info-outer{fill:var(--devui-info-line, #5e7ce0)}.devui-alert .devui-icon.devui-icon-info>g path.devui-icon-info-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert .devui-icon.devui-icon-error>g path.devui-icon-error-outer{fill:var(--devui-danger-line, #f66f6a)}.devui-alert .devui-icon.devui-icon-error>g path.devui-icon-error-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-alert-icon{margin-right:4px}.devui-alter-close{margin:0;padding-top:0;padding-bottom:0;transform-origin:50% 0;transition:all .3s ease-in-out}.devui-alert-leave-active{animation:alertUpOut .3s ease-in-out;animation-fill-mode:both}@keyframes alertUpOut{0%{transform:scaleY(1);transform-origin:0% 0%;opacity:1}to{transform:scaleY(0);transform-origin:0% 0%;opacity:0}}
|
package/package.json
CHANGED
package/statistic/index.es.js
CHANGED
|
@@ -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, watch, createVNode, mergeProps } from "vue";
|
|
7
|
+
import { defineComponent, ref, computed, onMounted, watch, createVNode, mergeProps, createTextVNode } from "vue";
|
|
8
8
|
const statisticProps = {
|
|
9
9
|
title: {
|
|
10
10
|
type: String,
|
|
@@ -26,14 +26,7 @@ const statisticProps = {
|
|
|
26
26
|
type: String,
|
|
27
27
|
default: ""
|
|
28
28
|
},
|
|
29
|
-
|
|
30
|
-
type: Boolean,
|
|
31
|
-
default: true
|
|
32
|
-
},
|
|
33
|
-
titleStyle: {
|
|
34
|
-
type: Object
|
|
35
|
-
},
|
|
36
|
-
contentStyle: {
|
|
29
|
+
valueStyle: {
|
|
37
30
|
type: Object
|
|
38
31
|
},
|
|
39
32
|
animationDuration: {
|
|
@@ -49,25 +42,17 @@ const statisticProps = {
|
|
|
49
42
|
},
|
|
50
43
|
start: {
|
|
51
44
|
type: Boolean,
|
|
52
|
-
default:
|
|
45
|
+
default: true
|
|
53
46
|
},
|
|
54
47
|
extra: {
|
|
55
48
|
type: String,
|
|
56
49
|
default: ""
|
|
57
|
-
},
|
|
58
|
-
easing: {
|
|
59
|
-
type: String,
|
|
60
|
-
default: "easeOutCubic"
|
|
61
|
-
},
|
|
62
|
-
delay: {
|
|
63
|
-
type: Number,
|
|
64
|
-
default: 0
|
|
65
50
|
}
|
|
66
51
|
};
|
|
67
|
-
const separator = (SeparatorString, groupSeparator
|
|
52
|
+
const separator = (SeparatorString, groupSeparator) => {
|
|
68
53
|
const res = SeparatorString.replace(/\d+/, function(n) {
|
|
69
54
|
return n.replace(/(\d)(?=(\d{3})+$)/g, function($1) {
|
|
70
|
-
return $1 + `${
|
|
55
|
+
return $1 + `${groupSeparator}`;
|
|
71
56
|
});
|
|
72
57
|
});
|
|
73
58
|
return res;
|
|
@@ -77,13 +62,13 @@ const isHasDot = (value) => {
|
|
|
77
62
|
return (value + "").indexOf(".") !== -1;
|
|
78
63
|
}
|
|
79
64
|
};
|
|
80
|
-
const analysisValueType = (value, propsValue, groupSeparator, splitPrecisionNumber
|
|
65
|
+
const analysisValueType = (value, propsValue, groupSeparator, splitPrecisionNumber) => {
|
|
81
66
|
const fixedNumber = propsValue.toString().indexOf(".") !== -1 ? propsValue.toString().length - propsValue.toString().indexOf(".") - 1 : 0;
|
|
82
67
|
if (typeof value === "number") {
|
|
83
68
|
if (isHasDot(value)) {
|
|
84
|
-
return splitPrecisionNumber ? separator(value.toFixed(splitPrecisionNumber).toString(), groupSeparator
|
|
69
|
+
return splitPrecisionNumber ? separator(value.toFixed(splitPrecisionNumber).toString(), groupSeparator) : separator(value.toFixed(fixedNumber).toString(), groupSeparator);
|
|
85
70
|
} else {
|
|
86
|
-
return splitPrecisionNumber ? separator(value.toFixed(splitPrecisionNumber).toString(), groupSeparator
|
|
71
|
+
return splitPrecisionNumber ? separator(value.toFixed(splitPrecisionNumber).toString(), groupSeparator) : separator(value.toString(), groupSeparator);
|
|
87
72
|
}
|
|
88
73
|
} else {
|
|
89
74
|
return value;
|
|
@@ -220,9 +205,9 @@ var Statistic = defineComponent({
|
|
|
220
205
|
to: {
|
|
221
206
|
value: to
|
|
222
207
|
},
|
|
223
|
-
delay:
|
|
208
|
+
delay: 0,
|
|
224
209
|
duration: props.animationDuration,
|
|
225
|
-
easing:
|
|
210
|
+
easing: "easeOutCubic",
|
|
226
211
|
onUpdate: (keys) => {
|
|
227
212
|
innerValue.value = keys.value;
|
|
228
213
|
},
|
|
@@ -234,7 +219,7 @@ var Statistic = defineComponent({
|
|
|
234
219
|
}
|
|
235
220
|
};
|
|
236
221
|
const statisticValue = computed(() => {
|
|
237
|
-
return analysisValueType(innerValue.value, props.value, props.groupSeparator, props.precision
|
|
222
|
+
return analysisValueType(innerValue.value, props.value, props.groupSeparator, props.precision);
|
|
238
223
|
});
|
|
239
224
|
onMounted(() => {
|
|
240
225
|
if (props.animation && props.start) {
|
|
@@ -247,7 +232,7 @@ var Statistic = defineComponent({
|
|
|
247
232
|
}
|
|
248
233
|
});
|
|
249
234
|
return () => {
|
|
250
|
-
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
235
|
+
var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
|
251
236
|
return createVNode("div", mergeProps({
|
|
252
237
|
"class": "devui-statistic"
|
|
253
238
|
}, ctx.attrs), [createVNode("div", {
|
|
@@ -255,14 +240,16 @@ var Statistic = defineComponent({
|
|
|
255
240
|
"style": props.titleStyle
|
|
256
241
|
}, [((_b = (_a2 = ctx.slots).title) == null ? void 0 : _b.call(_a2)) || props.title]), createVNode("div", {
|
|
257
242
|
"class": "devui-statistic-content",
|
|
258
|
-
"style": props.
|
|
243
|
+
"style": props.valueStyle
|
|
259
244
|
}, [props.prefix || ((_d = (_c = ctx.slots).prefix) == null ? void 0 : _d.call(_c)) ? createVNode("span", {
|
|
260
245
|
"class": "devui-statistic-prefix"
|
|
261
246
|
}, [((_f = (_e = ctx.slots).prefix) == null ? void 0 : _f.call(_e)) || props.prefix]) : null, createVNode("span", {
|
|
262
247
|
"class": "devui-statistic--value"
|
|
263
248
|
}, [statisticValue.value]), props.suffix || ((_h = (_g = ctx.slots).suffix) == null ? void 0 : _h.call(_g)) ? createVNode("span", {
|
|
264
249
|
"class": "devui-statistic-suffix"
|
|
265
|
-
}, [((_j = (_i = ctx.slots).suffix) == null ? void 0 : _j.call(_i)) || props.suffix]) : null]), ((_l = (_k = ctx.slots).extra) == null ? void 0 : _l.call(_k))
|
|
250
|
+
}, [((_j = (_i = ctx.slots).suffix) == null ? void 0 : _j.call(_i)) || props.suffix]) : null]), props.extra || ((_l = (_k = ctx.slots).extra) == null ? void 0 : _l.call(_k)) ? createVNode("div", {
|
|
251
|
+
"class": "devui-statistic-extra"
|
|
252
|
+
}, [createTextVNode(" "), ((_n = (_m = ctx.slots).extra) == null ? void 0 : _n.call(_m)) || props.extra]) : null]);
|
|
266
253
|
};
|
|
267
254
|
}
|
|
268
255
|
});
|
package/statistic/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var
|
|
1
|
+
var $=Object.defineProperty;var z=(a,e,f)=>e in a?$(a,e,{enumerable:!0,configurable:!0,writable:!0,value:f}):a[e]=f;var n=(a,e,f)=>(z(a,typeof e!="symbol"?e+"":e,f),f);(function(a,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(a=typeof globalThis!="undefined"?globalThis:a||self,e(a.index={},a.Vue))})(this,function(a,e){"use strict";const f={title:{type:String,default:""},value:{type:[Number,String]},prefix:{type:String},suffix:{type:String},precision:{type:Number},groupSeparator:{type:String,default:""},valueStyle:{type:Object},animationDuration:{type:Number,default:2e3},valueFrom:{type:Number},animation:{type:Boolean,default:!1},start:{type:Boolean,default:!0},extra:{type:String,default:""}},y=(t,i)=>t.replace(/\d+/,function(s){return s.replace(/(\d)(?=(\d{3})+$)/g,function(l){return l+`${i}`})}),C=t=>{if(!isNaN(t))return(t+"").indexOf(".")!==-1},D=(t,i,r,s)=>{const l=i.toString().indexOf(".")!==-1?i.toString().length-i.toString().indexOf(".")-1:0;return typeof t=="number"?C(t)?y(s?t.toFixed(s).toString():t.toFixed(l).toString(),r):y(s?t.toFixed(s).toString():t.toString(),r):t},c=Math.pow,v=Math.sqrt,E=function(t){return 1-c(1-t,3)},A=t=>t,I=function(t){return t===1?1:1-c(2,-10*t)},M=function(t){return t===0?0:t===1?1:t<.5?c(2,20*t-10)/2:(2-c(2,-20*t+10))/2},_=function(t){return t===0?0:c(2,10*t-10)},U=function(t){return t<.5?(1-v(1-c(2*t,2)))/2:(v(1-c(-2*t+2,2))+1)/2};var j=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",easeOutCubic:E,linear:A,easeOutExpo:I,easeInOutExpo:M,easeInExpo:_,easeInOutCirc:U});class q{constructor(i){n(this,"from");n(this,"to");n(this,"duration");n(this,"delay");n(this,"easing");n(this,"onStart");n(this,"onUpdate");n(this,"onFinish");n(this,"startTime");n(this,"started");n(this,"finished");n(this,"timer");n(this,"time");n(this,"elapsed");n(this,"keys");const{from:r,to:s,duration:l,delay:g,easing:S,onStart:u,onUpdate:d,onFinish:h}=i;for(const o in r)s[o]===void 0&&(s[o]=r[o]);for(const o in s)r[o]===void 0&&(r[o]=s[o]);this.from=r,this.to=s,this.duration=l,this.delay=g,this.easing=S,this.onStart=u,this.onUpdate=d,this.onFinish=h,this.startTime=Date.now()+this.delay,this.started=!1,this.finished=!1,this.timer=null,this.keys={}}update(){if(this.time=Date.now(),!(this.time<this.startTime)&&!this.finished){if(this.elapsed===this.duration){this.finished||(this.finished=!0,this.onFinish&&this.onFinish(this.keys));return}this.elapsed=this.time-this.startTime,this.elapsed=this.elapsed>this.duration?this.duration:this.elapsed;for(const i in this.to)this.keys[i]=this.from[i]+(this.to[i]-this.from[i])*j[this.easing](this.elapsed/this.duration);this.started||(this.onStart&&this.onStart(this.keys),this.started=!0),this.onUpdate(this.keys)}}start(){this.startTime=Date.now()+this.delay;const i=()=>{this.update(),this.timer=requestAnimationFrame(i),this.finished&&(cancelAnimationFrame(this.timer),this.timer=null)};i()}stop(){cancelAnimationFrame(this.timer),this.timer=null}}var H="",m=e.defineComponent({name:"DStatistic",inheritAttrs:!1,props:f,setup(t,i){var S;const r=e.ref((S=t.valueFrom)!=null?S:t.value),s=e.ref(null),l=(u=(h=>(h=t.valueFrom)!=null?h:0)(),d=typeof t.value=="number"?t.value:Number(t.value))=>{u!==d&&(s.value=new q({from:{value:u},to:{value:d},delay:0,duration:t.animationDuration,easing:"easeOutCubic",onUpdate:o=>{r.value=o.value},onFinish:()=>{r.value=d}}),s.value.start())},g=e.computed(()=>D(r.value,t.value,t.groupSeparator,t.precision));return e.onMounted(()=>{t.animation&&t.start&&l()}),e.watch(()=>t.start,u=>{u&&!s.value&&l()}),()=>{var u,d,h,o,x,F,p,O,b,N,T,k,V,w;return e.createVNode("div",e.mergeProps({class:"devui-statistic"},i.attrs),[e.createVNode("div",{class:"devui-statistic-title",style:t.titleStyle},[((d=(u=i.slots).title)==null?void 0:d.call(u))||t.title]),e.createVNode("div",{class:"devui-statistic-content",style:t.valueStyle},[t.prefix||((o=(h=i.slots).prefix)==null?void 0:o.call(h))?e.createVNode("span",{class:"devui-statistic-prefix"},[((F=(x=i.slots).prefix)==null?void 0:F.call(x))||t.prefix]):null,e.createVNode("span",{class:"devui-statistic--value"},[g.value]),t.suffix||((O=(p=i.slots).suffix)==null?void 0:O.call(p))?e.createVNode("span",{class:"devui-statistic-suffix"},[((N=(b=i.slots).suffix)==null?void 0:N.call(b))||t.suffix]):null]),t.extra||((k=(T=i.slots).extra)==null?void 0:k.call(T))?e.createVNode("div",{class:"devui-statistic-extra"},[e.createTextVNode(" "),((w=(V=i.slots).extra)==null?void 0:w.call(V))||t.extra]):null])}}});m.install=function(t){t.component(m.name,m)};var B={title:"Statistic \u7EDF\u8BA1\u6570\u503C",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.use(m)}};a.Statistic=m,a.default=B,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});
|
package/statistic/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;line-height:1.5715;list-style:none}.devui-statistic-title{margin-bottom:4px;
|
|
1
|
+
.devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;line-height:1.5715;list-style:none}.devui-statistic-title{margin-bottom:4px;font-size:14px}.devui-statistic-content{font-size:24px;display:flex;align-items:center}.devui-statistic-prefix{margin-right:6px;display:flex;align-items:center}.devui-statistic-suffix{margin-left:6px;display:flex;align-items:center}.devui-statistic--value{display:inline-block}
|