vue-devui 1.0.0-rc.0 → 1.0.0-rc.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 +55 -113
- package/alert/index.es.js +28 -30
- package/alert/index.umd.js +1 -1
- package/auto-complete/index.es.js +143 -103
- package/auto-complete/index.umd.js +5 -1
- package/auto-complete/style.css +1 -1
- package/avatar/index.es.js +77 -81
- package/avatar/index.umd.js +1 -1
- package/badge/index.es.js +1 -1
- package/badge/index.umd.js +1 -1
- package/badge/style.css +1 -1
- package/button/index.es.js +43 -43
- package/button/index.umd.js +1 -1
- package/card/index.es.js +3 -6
- package/card/index.umd.js +1 -1
- package/checkbox/index.es.js +5 -11
- package/checkbox/index.umd.js +1 -1
- package/comment/index.es.js +2 -5
- package/comment/index.umd.js +1 -1
- package/countdown/index.es.js +5 -7
- package/countdown/index.umd.js +1 -1
- package/editable-select/index.es.js +124 -168
- package/editable-select/index.umd.js +1 -1
- package/fullscreen/index.es.js +13 -16
- package/fullscreen/index.umd.js +1 -1
- package/grid/index.es.js +30 -36
- package/grid/index.umd.js +1 -1
- package/icon/index.es.js +39 -57
- package/icon/index.umd.js +1 -1
- package/image-preview/index.es.js +21 -20
- package/image-preview/index.umd.js +1 -1
- package/input/index.es.js +2 -5
- package/input/index.umd.js +1 -1
- package/layout/index.es.js +6 -21
- package/layout/index.umd.js +1 -1
- package/loading/index.es.js +20 -12
- package/loading/index.umd.js +1 -1
- package/modal/index.es.js +135 -122
- package/modal/index.umd.js +1 -1
- package/modal/style.css +1 -1
- package/notification/index.es.js +38 -40
- package/notification/index.umd.js +1 -1
- package/nuxt/components/DropdownPropsKey.js +3 -0
- package/nuxt/components/PanelBody.js +3 -0
- package/nuxt/components/PanelFooter.js +3 -0
- package/nuxt/components/PanelHeader.js +3 -0
- package/nuxt/components/Timeline.js +3 -0
- package/nuxt/components/TimelineItem.js +3 -0
- package/nuxt/components/alertProps.js +3 -0
- package/nuxt/components/autoCompleteProps.js +3 -0
- package/nuxt/components/avatarProps.js +3 -0
- package/nuxt/components/cardProps.js +3 -0
- package/nuxt/components/checkboxGroupInjectionKey.js +3 -0
- package/nuxt/components/checkboxGroupProps.js +3 -0
- package/nuxt/components/checkboxProps.js +3 -0
- package/nuxt/components/colProps.js +3 -0
- package/nuxt/components/colPropsBaseClass.js +3 -0
- package/nuxt/components/colPropsBaseStyle.js +3 -0
- package/nuxt/components/commentProps.js +3 -0
- package/nuxt/components/countdownProps.js +3 -0
- package/nuxt/components/editableSelectProps.js +3 -0
- package/nuxt/components/fullscreenProps.js +3 -0
- package/nuxt/components/iconProps.js +2 -0
- package/nuxt/components/imagePreviewProps.js +3 -0
- package/nuxt/components/inputProps.js +3 -0
- package/nuxt/components/paginationProps.js +3 -0
- package/nuxt/components/panelProps.js +3 -0
- package/nuxt/components/progressProps.js +3 -0
- package/nuxt/components/rateProps.js +3 -0
- package/nuxt/components/readTipProps.js +3 -0
- package/nuxt/components/resultProps.js +3 -0
- package/nuxt/components/rowProps.js +3 -0
- package/nuxt/components/screenSizes.js +3 -0
- package/nuxt/components/searchProps.js +3 -0
- package/nuxt/components/skeletonProps.js +3 -0
- package/nuxt/components/splitterProps.js +3 -0
- package/nuxt/components/statisticProps.js +3 -0
- package/nuxt/components/switchProps.js +3 -0
- package/nuxt/components/tagInputProps.js +3 -0
- package/nuxt/components/tagProps.js +3 -0
- package/nuxt/components/textareaProps.js +3 -0
- package/nuxt/components/timeAxisProps.js +3 -0
- package/overlay/index.es.js +49 -42
- package/overlay/index.umd.js +1 -1
- package/overlay/style.css +1 -1
- package/package.json +8 -43
- package/pagination/index.es.js +24 -25
- package/pagination/index.umd.js +1 -1
- package/panel/index.es.js +45 -32
- package/panel/index.umd.js +1 -1
- package/popover/index.es.js +51 -44
- package/popover/index.umd.js +12 -12
- package/popover/style.css +1 -1
- package/progress/index.es.js +34 -36
- package/progress/index.umd.js +3 -3
- package/progress/style.css +1 -1
- package/radio/index.es.js +11 -11
- package/radio/index.umd.js +1 -1
- package/radio/style.css +1 -1
- package/rate/index.es.js +4 -7
- package/rate/index.umd.js +1 -1
- package/read-tip/index.es.js +8 -8
- package/read-tip/index.umd.js +1 -1
- package/result/index.es.js +40 -58
- package/result/index.umd.js +1 -1
- package/ripple/index.es.js +47 -42
- package/ripple/index.umd.js +1 -1
- package/search/index.es.js +13 -16
- package/search/index.umd.js +8 -8
- package/skeleton/index.es.js +20 -23
- package/skeleton/index.umd.js +1 -1
- package/slider/index.es.js +60 -59
- package/slider/index.umd.js +1 -1
- package/splitter/index.es.js +223 -171
- package/splitter/index.umd.js +13 -13
- package/splitter/style.css +1 -1
- package/statistic/index.es.js +7 -18
- package/statistic/index.umd.js +1 -1
- package/status/index.es.js +1 -4
- package/status/index.umd.js +1 -1
- package/status/style.css +1 -1
- package/style.css +1 -1
- package/switch/index.es.js +3 -6
- package/switch/index.umd.js +1 -1
- package/tag/index.es.js +15 -18
- package/tag/index.umd.js +1 -1
- package/tag/style.css +1 -1
- package/tag-input/index.es.js +7 -8
- package/tag-input/index.umd.js +1 -1
- package/textarea/index.es.js +2 -5
- package/textarea/index.umd.js +1 -1
- package/{accordion → timeline}/index.d.ts +0 -0
- package/{time-axis → timeline}/index.es.js +64 -83
- package/timeline/index.umd.js +1 -0
- package/{anchor → timeline}/package.json +1 -1
- package/timeline/style.css +1 -0
- package/upload/index.es.js +98 -97
- package/upload/index.umd.js +1 -1
- package/vue-devui.es.js +12477 -24991
- package/vue-devui.umd.js +24 -20
- package/accordion/index.es.js +0 -720
- package/accordion/index.umd.js +0 -1
- package/accordion/package.json +0 -7
- package/accordion/style.css +0 -1
- package/anchor/index.d.ts +0 -7
- package/anchor/index.es.js +0 -263
- package/anchor/index.umd.js +0 -1
- package/anchor/style.css +0 -1
- package/back-top/index.d.ts +0 -7
- package/back-top/index.es.js +0 -128
- package/back-top/index.umd.js +0 -1
- package/back-top/package.json +0 -7
- package/back-top/style.css +0 -1
- package/breadcrumb/index.d.ts +0 -7
- package/breadcrumb/index.es.js +0 -127
- package/breadcrumb/index.umd.js +0 -1
- package/breadcrumb/package.json +0 -7
- package/breadcrumb/style.css +0 -1
- package/carousel/index.d.ts +0 -7
- package/carousel/index.es.js +0 -329
- package/carousel/index.umd.js +0 -1
- package/carousel/package.json +0 -7
- package/carousel/style.css +0 -1
- package/cascader/index.d.ts +0 -7
- package/cascader/index.es.js +0 -5963
- package/cascader/index.umd.js +0 -27
- package/cascader/package.json +0 -7
- package/cascader/style.css +0 -1
- package/color-picker/index.d.ts +0 -7
- package/color-picker/index.es.js +0 -8187
- package/color-picker/index.umd.js +0 -27
- package/color-picker/package.json +0 -7
- package/color-picker/style.css +0 -1
- package/date-picker/index.d.ts +0 -7
- package/date-picker/index.es.js +0 -1171
- package/date-picker/index.umd.js +0 -1
- package/date-picker/package.json +0 -7
- package/date-picker/style.css +0 -1
- package/dragdrop/index.d.ts +0 -7
- package/dragdrop/index.es.js +0 -157
- package/dragdrop/index.umd.js +0 -1
- package/dragdrop/package.json +0 -7
- package/drawer/index.d.ts +0 -7
- package/drawer/index.es.js +0 -234
- package/drawer/index.umd.js +0 -1
- package/drawer/package.json +0 -7
- package/drawer/style.css +0 -1
- package/dropdown/index.d.ts +0 -7
- package/dropdown/index.es.js +0 -638
- package/dropdown/index.umd.js +0 -1
- package/dropdown/package.json +0 -7
- package/dropdown/style.css +0 -1
- package/form/index.d.ts +0 -7
- package/form/index.es.js +0 -7865
- package/form/index.umd.js +0 -27
- package/form/package.json +0 -7
- package/form/style.css +0 -1
- package/gantt/index.d.ts +0 -7
- package/gantt/index.es.js +0 -523
- package/gantt/index.umd.js +0 -1
- package/gantt/package.json +0 -7
- package/gantt/style.css +0 -1
- package/input-icon/index.d.ts +0 -7
- package/input-icon/index.es.js +0 -331
- package/input-icon/index.umd.js +0 -1
- package/input-icon/package.json +0 -7
- package/input-icon/style.css +0 -1
- package/input-number/index.d.ts +0 -7
- package/input-number/index.es.js +0 -240
- package/input-number/index.umd.js +0 -1
- package/input-number/package.json +0 -7
- package/input-number/style.css +0 -1
- package/list/index.d.ts +0 -7
- package/list/index.es.js +0 -39
- package/list/index.umd.js +0 -1
- package/list/package.json +0 -7
- package/list/style.css +0 -1
- package/nav-sprite/index.d.ts +0 -7
- package/nav-sprite/index.es.js +0 -68
- package/nav-sprite/index.umd.js +0 -1
- package/nav-sprite/package.json +0 -7
- package/nuxt/components/Accordion.js +0 -3
- package/nuxt/components/Anchor.js +0 -3
- package/nuxt/components/BackTop.js +0 -3
- package/nuxt/components/Breadcrumb.js +0 -3
- package/nuxt/components/Carousel.js +0 -3
- package/nuxt/components/CarouselItem.js +0 -3
- package/nuxt/components/Cascader.js +0 -3
- package/nuxt/components/ColorPicker.js +0 -3
- package/nuxt/components/Column.js +0 -3
- package/nuxt/components/DatePicker.js +0 -3
- package/nuxt/components/Drawer.js +0 -3
- package/nuxt/components/DrawerService.js +0 -3
- package/nuxt/components/Dropdown.js +0 -3
- package/nuxt/components/DropdownMenu.js +0 -3
- package/nuxt/components/Form.js +0 -3
- package/nuxt/components/FormControl.js +0 -3
- package/nuxt/components/FormItem.js +0 -3
- package/nuxt/components/FormLabel.js +0 -3
- package/nuxt/components/FormOperation.js +0 -3
- package/nuxt/components/Gantt.js +0 -3
- package/nuxt/components/InputIcon.js +0 -3
- package/nuxt/components/InputNumber.js +0 -3
- package/nuxt/components/List.js +0 -3
- package/nuxt/components/ListItem.js +0 -3
- package/nuxt/components/NavSprite.js +0 -2
- package/nuxt/components/QuadrantDiagram.js +0 -3
- package/nuxt/components/Select.js +0 -3
- package/nuxt/components/StepsGuide.js +0 -3
- package/nuxt/components/StickSlider.js +0 -3
- package/nuxt/components/Sticky.js +0 -2
- package/nuxt/components/Table.js +0 -3
- package/nuxt/components/Tabs.js +0 -3
- package/nuxt/components/TimeAxis.js +0 -3
- package/nuxt/components/TimeAxisItem.js +0 -3
- package/nuxt/components/TimePicker.js +0 -3
- package/nuxt/components/Tooltip.js +0 -3
- package/nuxt/components/Transfer.js +0 -3
- package/nuxt/components/Tree.js +0 -3
- package/nuxt/components/TreeSelect.js +0 -3
- package/nuxt/components/dropdownMenuProps.js +0 -3
- package/nuxt/components/tooltipProps.js +0 -3
- package/quadrant-diagram/index.d.ts +0 -7
- package/quadrant-diagram/index.es.js +0 -5728
- package/quadrant-diagram/index.umd.js +0 -27
- package/quadrant-diagram/package.json +0 -7
- package/quadrant-diagram/style.css +0 -1
- package/select/index.d.ts +0 -7
- package/select/index.es.js +0 -706
- package/select/index.umd.js +0 -1
- package/select/package.json +0 -7
- package/select/style.css +0 -1
- package/steps-guide/index.d.ts +0 -7
- package/steps-guide/index.es.js +0 -239
- package/steps-guide/index.umd.js +0 -1
- package/steps-guide/package.json +0 -7
- package/steps-guide/style.css +0 -1
- package/sticky/index.d.ts +0 -7
- package/sticky/index.es.js +0 -197
- package/sticky/index.umd.js +0 -1
- package/sticky/package.json +0 -7
- package/table/index.d.ts +0 -7
- package/table/index.es.js +0 -1969
- package/table/index.umd.js +0 -1
- package/table/package.json +0 -7
- package/table/style.css +0 -1
- package/tabs/index.d.ts +0 -7
- package/tabs/index.es.js +0 -194
- package/tabs/index.umd.js +0 -1
- package/tabs/package.json +0 -7
- package/tabs/style.css +0 -1
- package/time-axis/index.d.ts +0 -7
- package/time-axis/index.umd.js +0 -1
- package/time-axis/package.json +0 -7
- package/time-axis/style.css +0 -1
- package/time-picker/index.d.ts +0 -7
- package/time-picker/index.es.js +0 -1237
- package/time-picker/index.umd.js +0 -1
- package/time-picker/package.json +0 -7
- package/time-picker/style.css +0 -1
- package/tooltip/index.d.ts +0 -7
- package/tooltip/index.es.js +0 -5828
- package/tooltip/index.umd.js +0 -27
- package/tooltip/package.json +0 -7
- package/tooltip/style.css +0 -1
- package/transfer/index.d.ts +0 -7
- package/transfer/index.es.js +0 -7608
- package/transfer/index.umd.js +0 -27
- package/transfer/package.json +0 -7
- package/transfer/style.css +0 -1
- package/tree/index.d.ts +0 -7
- package/tree/index.es.js +0 -6490
- package/tree/index.umd.js +0 -27
- package/tree/package.json +0 -7
- package/tree/style.css +0 -1
- package/tree-select/index.d.ts +0 -7
- package/tree-select/index.es.js +0 -623
- package/tree-select/index.umd.js +0 -1
- package/tree-select/package.json +0 -7
- package/tree-select/style.css +0 -1
package/switch/index.es.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { defineComponent, renderSlot, useSlots, createVNode } from "vue";
|
|
2
|
-
var _switch = "";
|
|
3
2
|
const switchProps = {
|
|
4
3
|
size: {
|
|
5
4
|
type: String,
|
|
@@ -30,6 +29,7 @@ const switchProps = {
|
|
|
30
29
|
default: void 0
|
|
31
30
|
}
|
|
32
31
|
};
|
|
32
|
+
var _switch = "";
|
|
33
33
|
var Switch = defineComponent({
|
|
34
34
|
name: "DSwitch",
|
|
35
35
|
props: switchProps,
|
|
@@ -86,15 +86,12 @@ var Switch = defineComponent({
|
|
|
86
86
|
}, [checked ? checkedContent : uncheckedContent])]), createVNode("small", null, null)]);
|
|
87
87
|
}
|
|
88
88
|
});
|
|
89
|
-
Switch.install = function(app) {
|
|
90
|
-
app.component(Switch.name, Switch);
|
|
91
|
-
};
|
|
92
89
|
var index = {
|
|
93
90
|
title: "Switch \u5F00\u5173",
|
|
94
91
|
category: "\u6570\u636E\u5F55\u5165",
|
|
95
92
|
status: "100%",
|
|
96
93
|
install(app) {
|
|
97
|
-
app.
|
|
94
|
+
app.component(Switch.name, Switch);
|
|
98
95
|
}
|
|
99
96
|
};
|
|
100
|
-
export { Switch, index as default };
|
|
97
|
+
export { Switch, index as default, switchProps };
|
package/switch/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
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";
|
|
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 r={size:{type:String,default:"middle"},color:{type:String,default:void 0},checked:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},beforeChange:{type:Function,default:void 0},change:{type:Function,default:void 0},"onUpdate:checked":{type:Function,default:void 0}};var g="",i=e.defineComponent({name:"DSwitch",props:r,emits:["change","update:checked"],setup(t,o){const d=()=>{if(t.disabled)return Promise.resolve(!1);if(t.beforeChange){const c=t.beforeChange(!t.checked);return typeof c=="boolean"?Promise.resolve(c):c}return Promise.resolve(!0)};return{toggle:()=>{d().then(c=>{!c||(o.emit("update:checked",!t.checked),o.emit("change",!t.checked))})}}},render(){const{size:t,checked:o,disabled:d,color:s,toggle:c}=this,u={"devui-switch":!0,[`devui-switch-${t}`]:t!=="","devui-checked":o,"devui-disabled":d},a=[`background: ${o&&!d?s:""}`,`border-color: ${o&&!d?s:""}`],h=e.renderSlot(e.useSlots(),"checkedContent"),f=e.renderSlot(e.useSlots(),"uncheckedContent");return e.createVNode("span",{class:u,style:a,onClick:c},[e.createVNode("span",{class:"devui-switch-inner-wrapper"},[e.createVNode("div",{class:"devui-switch-inner"},[o?h:f])]),e.createVNode("small",null,null)])}}),l={title:"Switch \u5F00\u5173",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(t){t.component(i.name,i)}};n.Switch=i,n.default=l,n.switchProps=r,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});
|
package/tag/index.es.js
CHANGED
|
@@ -24,17 +24,17 @@ const tagProps = {
|
|
|
24
24
|
function useClass(props) {
|
|
25
25
|
return computed(() => {
|
|
26
26
|
const { type, color, deletable } = props;
|
|
27
|
-
return `devui-tag devui-tag-${type || (color ? "colorful" : "") || "default"}
|
|
27
|
+
return `devui-tag-item devui-tag-${type || (color ? "colorful" : "") || "default"}${deletable ? " devui-tag-deletable" : ""}`;
|
|
28
28
|
});
|
|
29
29
|
}
|
|
30
30
|
function useColor(props) {
|
|
31
31
|
return computed(() => {
|
|
32
32
|
const { color, type } = props;
|
|
33
33
|
const typeMap = {
|
|
34
|
-
primary: "#5e7ce0",
|
|
35
|
-
success: "#50d4ab",
|
|
36
|
-
warning: "#fac20a",
|
|
37
|
-
danger: "#f66f6a"
|
|
34
|
+
primary: "var(--devui-primary, #5e7ce0)",
|
|
35
|
+
success: "var(--devui-success, #50d4ab)",
|
|
36
|
+
warning: "var(--devui-warning, #fac20a)",
|
|
37
|
+
danger: "var(--devui-danger, #f66f6a)"
|
|
38
38
|
};
|
|
39
39
|
const colorMap = {
|
|
40
40
|
"blue-w98": "#3383ff",
|
|
@@ -47,8 +47,9 @@ function useColor(props) {
|
|
|
47
47
|
"pink-w98": "#f3689a",
|
|
48
48
|
"purple-w98": "#a97af8"
|
|
49
49
|
};
|
|
50
|
-
if (!color && type)
|
|
50
|
+
if (!color && type) {
|
|
51
51
|
return typeMap[type];
|
|
52
|
+
}
|
|
52
53
|
const themeColor = colorMap[color] || color;
|
|
53
54
|
return themeColor;
|
|
54
55
|
});
|
|
@@ -74,12 +75,12 @@ var Tag = defineComponent({
|
|
|
74
75
|
const tagTitle = titleContent.value || "";
|
|
75
76
|
const isDefaultTag = () => !type.value && !color.value;
|
|
76
77
|
const isShow = ref(true);
|
|
77
|
-
const handleClick = () => {
|
|
78
|
-
emit("click");
|
|
78
|
+
const handleClick = (e) => {
|
|
79
|
+
emit("click", e);
|
|
79
80
|
};
|
|
80
|
-
const handleDelete = () => {
|
|
81
|
+
const handleDelete = (e) => {
|
|
81
82
|
isShow.value = false;
|
|
82
|
-
emit("tagDelete");
|
|
83
|
+
emit("tagDelete", e);
|
|
83
84
|
};
|
|
84
85
|
const closeIconEl = () => {
|
|
85
86
|
return deletable.value ? createVNode("a", {
|
|
@@ -96,7 +97,6 @@ var Tag = defineComponent({
|
|
|
96
97
|
}, null)]) : null;
|
|
97
98
|
};
|
|
98
99
|
const unWatch = watch(checked, (newVal) => {
|
|
99
|
-
console.log("checkedChange");
|
|
100
100
|
emit("checkedChange", newVal);
|
|
101
101
|
});
|
|
102
102
|
onUnmounted(() => unWatch());
|
|
@@ -110,22 +110,19 @@ var Tag = defineComponent({
|
|
|
110
110
|
"style": {
|
|
111
111
|
display: "block",
|
|
112
112
|
color: checked.value ? "#fff" : themeColor.value,
|
|
113
|
-
backgroundColor: checked.value ? themeColor.value : !color.value ? "" : "#
|
|
113
|
+
backgroundColor: checked.value ? themeColor.value : !color.value ? "" : "var(--devui-base-bg, #ffffff)"
|
|
114
114
|
},
|
|
115
115
|
"title": tagTitle
|
|
116
116
|
}, [(_a = slots.default) == null ? void 0 : _a.call(slots), closeIconEl()])]), [[vShow, isShow.value]]);
|
|
117
117
|
};
|
|
118
118
|
}
|
|
119
119
|
});
|
|
120
|
-
Tag.install = function(app) {
|
|
121
|
-
app.component(Tag.name, Tag);
|
|
122
|
-
};
|
|
123
120
|
var index = {
|
|
124
121
|
title: "Tag \u6807\u7B7E",
|
|
125
122
|
category: "\u6570\u636E\u5C55\u793A",
|
|
126
|
-
status: "
|
|
123
|
+
status: "100%",
|
|
127
124
|
install(app) {
|
|
128
|
-
app.
|
|
125
|
+
app.component(Tag.name, Tag);
|
|
129
126
|
}
|
|
130
127
|
};
|
|
131
|
-
export { Tag, index as default };
|
|
128
|
+
export { Tag, index as default, tagProps };
|
package/tag/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(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";const f={type:{type:String,default:""},color:{type:String,default:""},titleContent:{type:String,default:""},checked:{type:Boolean,default:!1},deletable:{type:Boolean,default:!1}};function p(a){return e.computed(()=>{const{type:o,color:n,deletable:c}=a;return`devui-tag-item devui-tag-${o||(n?"colorful":"")||"default"}${c?" devui-tag-deletable":""}`})}function g(a){return e.computed(()=>{const{color:o,type:n}=a,c={primary:"var(--devui-primary, #5e7ce0)",success:"var(--devui-success, #50d4ab)",warning:"var(--devui-warning, #fac20a)",danger:"var(--devui-danger, #f66f6a)"},r={"blue-w98":"#3383ff","aqua-w98":"#39afcc","olivine-w98":"#2fa898","green-w98":"#4eb15e","yellow-w98":"#b08d1a","orange-w98":"#d47f35","red-w98":"#f66f6a","pink-w98":"#f3689a","purple-w98":"#a97af8"};return!o&&n?c[n]:r[o]||o})}var D="",d=e.defineComponent({name:"DTag",props:f,emits:["click","tagDelete","checkedChange"],setup(a,{slots:o,emit:n}){const{type:c,color:r,checked:u,titleContent:m,deletable:y}=e.toRefs(a),h=p(a),i=g(a),C=m.value||"",b=()=>!c.value&&!r.value,s=e.ref(!0),w=l=>{n("click",l)},k=l=>{s.value=!1,n("tagDelete",l)},T=()=>y.value?e.createVNode("a",{class:"remove-button",onClick:k},[b()?e.createVNode(e.resolveComponent("d-icon"),{size:"12px",name:"error-o",color:"#adb0b8"},null):e.createVNode(e.resolveComponent("d-icon"),{size:"12px",name:"close",color:i.value},null)]):null,S=e.watch(u,l=>{n("checkedChange",l)});return e.onUnmounted(()=>S()),()=>{var l;return s.value&&e.withDirectives(e.createVNode("div",{class:"devui-tag",onClick:w},[e.createVNode("span",{class:h.value,style:{display:"block",color:u.value?"#fff":i.value,backgroundColor:u.value?i.value:r.value?"var(--devui-base-bg, #ffffff)":""},title:C},[(l=o.default)==null?void 0:l.call(o),T()])]),[[e.vShow,s.value]])}}}),v={title:"Tag \u6807\u7B7E",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(a){a.component(d.name,d)}};t.Tag=d,t.default=v,t.tagProps=f,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
|
package/tag/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";.devui-tag{display:inline-block;margin:4px}.devui-tag .devui-tag{padding:0 8px;min-height:20px;
|
|
1
|
+
@charset "UTF-8";.devui-tag{display:inline-block;margin:4px}.devui-tag .devui-tag-item{display:block;position:relative;padding:0 8px;min-height:20px;border:1px solid;border-radius:var(--devui-border-radius, 2px);font-size:var(--devui-font-size, 12px);line-height:20px;cursor:default}.devui-tag .devui-tag-item.devui-tag-default{border:0;color:var(--devui-text, #252b3a);background-color:var(--devui-default-bg, #f3f6f8)}.devui-tag .devui-tag-item.devui-tag-primary{color:var(--devui-primary, #5e7ce0);background-color:var(--devui-primary-bg, #f2f5fc)}.devui-tag .devui-tag-item.devui-tag-success{color:var(--devui-success, #50d4ab);background-color:var(--devui-success-bg, #edfff9)}.devui-tag .devui-tag-item.devui-tag-warning{color:var(--devui-warning, #fac20a);background-color:var(--devui-warning-bg, #fff3e8)}.devui-tag .devui-tag-item.devui-tag-danger{color:var(--devui-danger, #f66f6a);background-color:var(--devui-danger-bg, #ffeeed)}.devui-tag .devui-tag-item.devui-tag-colorful{background-color:#fff}.devui-tag .devui-tag-item.devui-tag-deletable{padding-right:32px}.devui-tag .remove-button{display:inline-block;margin-left:12px;font-size:var(--devui-font-size-icon, 16px);cursor:pointer;width:12px;height:12px;line-height:12px;border-radius:50%;text-align:center;position:absolute;top:50%;transform:translateY(-50%)}.devui-tag .remove-button i{vertical-align:0}
|
package/tag-input/index.es.js
CHANGED
|
@@ -32,7 +32,6 @@ var removeBtnSvg = createVNode("svg", mergeProps({
|
|
|
32
32
|
"d": "M8.86785321,3.13214679 C9.02624037,3.29053395 9.02624037,3.54733027 8.86785321,3.70571743 L6.573,6 L8.86785321,8.29428257 C9.02624037,8.45266973 9.02624037,8.70946605 8.86785321,8.86785321 C8.70946605,9.02624037 8.45266973,9.02624037 8.29428257,8.86785321 L6,6.573 L3.70571743,8.86785321 C3.54733027,9.02624037 3.29053395,9.02624037 3.13214679,8.86785321 C2.97375963,8.70946605 2.97375963,8.45266973 3.13214679,8.29428257 L5.427,6 L3.13214679,3.70571743 C2.97375963,3.54733027 2.97375963,3.29053395 3.13214679,3.13214679 C3.29053395,2.97375963 3.54733027,2.97375963 3.70571743,3.13214679 L6,5.427 L8.29428257,3.13214679 C8.45266973,2.97375963 8.70946605,2.97375963 8.86785321,3.13214679 Z",
|
|
33
33
|
"fill-rule": "nonzero"
|
|
34
34
|
}, null)])]);
|
|
35
|
-
var tagInput = "";
|
|
36
35
|
const tagInputProps = {
|
|
37
36
|
tags: {
|
|
38
37
|
type: Array,
|
|
@@ -91,6 +90,7 @@ const tagInputProps = {
|
|
|
91
90
|
default: false
|
|
92
91
|
}
|
|
93
92
|
};
|
|
93
|
+
var tagInput = "";
|
|
94
94
|
const KEYS_MAP = {
|
|
95
95
|
tab: "Tab",
|
|
96
96
|
down: "ArrowDown",
|
|
@@ -152,8 +152,9 @@ var TagInput = defineComponent({
|
|
|
152
152
|
let res = {
|
|
153
153
|
[props.displayProperty]: tagInputVal.value
|
|
154
154
|
};
|
|
155
|
-
if (tagInputVal.value === "" && mergedSuggestions.value.length === 0)
|
|
155
|
+
if (tagInputVal.value === "" && mergedSuggestions.value.length === 0) {
|
|
156
156
|
return false;
|
|
157
|
+
}
|
|
157
158
|
if (props.tags.findIndex((item) => item[props.displayProperty] === tagInputVal.value) > -1) {
|
|
158
159
|
tagInputVal.value = "";
|
|
159
160
|
return false;
|
|
@@ -177,8 +178,9 @@ var TagInput = defineComponent({
|
|
|
177
178
|
case KEYS_MAP.tab:
|
|
178
179
|
case KEYS_MAP.enter:
|
|
179
180
|
case KEYS_MAP.space:
|
|
180
|
-
if (!props.isAddBySpace && KEYS_MAP.space)
|
|
181
|
+
if (!props.isAddBySpace && KEYS_MAP.space) {
|
|
181
182
|
return;
|
|
183
|
+
}
|
|
182
184
|
handleEnter();
|
|
183
185
|
break;
|
|
184
186
|
case KEYS_MAP.down:
|
|
@@ -315,15 +317,12 @@ var TagInput = defineComponent({
|
|
|
315
317
|
})])])]);
|
|
316
318
|
}
|
|
317
319
|
});
|
|
318
|
-
TagInput.install = function(app) {
|
|
319
|
-
app.component(TagInput.name, TagInput);
|
|
320
|
-
};
|
|
321
320
|
var index = {
|
|
322
321
|
title: "TagInput \u6807\u7B7E\u8F93\u5165\u6846",
|
|
323
322
|
category: "\u6570\u636E\u5F55\u5165",
|
|
324
323
|
status: "100%",
|
|
325
324
|
install(app) {
|
|
326
|
-
app.
|
|
325
|
+
app.component(TagInput.name, TagInput);
|
|
327
326
|
}
|
|
328
327
|
};
|
|
329
|
-
export { TagInput, index as default };
|
|
328
|
+
export { TagInput, index as default, tagInputProps };
|
package/tag-input/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var K=Object.defineProperty;var
|
|
1
|
+
var K=Object.defineProperty;var E=Object.getOwnPropertySymbols;var O=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var F=(u,e,o)=>e in u?K(u,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):u[e]=o,P=(u,e)=>{for(var o in e||(e={}))O.call(e,o)&&F(u,o,e[o]);if(E)for(var o of E(e))R.call(e,o)&&F(u,o,e[o]);return u};(function(u,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(u=typeof globalThis!="undefined"?globalThis:u||self,e(u.index={},u.Vue))})(this,function(u,e){"use strict";var o=e.createVNode("svg",e.mergeProps({width:"12px",height:"12px",viewBox:"0 0 12 12",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},{"xmlns:xlink":"http://www.w3.org/1999/xlink"}),[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M8.86785321,3.13214679 C9.02624037,3.29053395 9.02624037,3.54733027 8.86785321,3.70571743 L6.573,6 L8.86785321,8.29428257 C9.02624037,8.45266973 9.02624037,8.70946605 8.86785321,8.86785321 C8.70946605,9.02624037 8.45266973,9.02624037 8.29428257,8.86785321 L6,6.573 L3.70571743,8.86785321 C3.54733027,9.02624037 3.29053395,9.02624037 3.13214679,8.86785321 C2.97375963,8.70946605 2.97375963,8.45266973 3.13214679,8.29428257 L5.427,6 L3.13214679,3.70571743 C2.97375963,3.54733027 2.97375963,3.29053395 3.13214679,3.13214679 C3.29053395,2.97375963 3.54733027,2.97375963 3.70571743,3.13214679 L6,5.427 L8.29428257,3.13214679 C8.45266973,2.97375963 8.70946605,2.97375963 8.86785321,3.13214679 Z","fill-rule":"nonzero"},null)])]);const A={tags:{type:Array,default:()=>[]},displayProperty:{type:String,default:"name"},placeholder:{type:String,default:""},minLength:{type:Number,default:3},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},maxTags:{type:Number,default:Number.MAX_SAFE_INTEGER},maxTagsText:{type:String,default:"\u5DF2\u8FBE\u5230\u6700\u5927\u4E2A\u6570\uFF1A"},spellcheck:{type:Boolean,default:!0},suggestionList:{type:Array,default:()=>[]},disabled:{type:Boolean,default:!1},isAddBySpace:{type:Boolean,default:!0},disabledText:{type:String,default:""},noData:{type:String,default:""},caseSensitivity:{type:Boolean,default:!1}};var j="";const p={tab:"Tab",down:"ArrowDown",up:"ArrowUp",enter:"Enter",space:" "};var b=e.defineComponent({name:"DTagInput",props:A,emits:["update:tags","update:suggestionList","valueChange"],setup(t,d){const g=(n,a)=>{const s=Object.assign({},a);return delete s.__index,n.concat(s)},m=(n,a)=>{const s=n.slice();return s.splice(a,1),s},l=e.ref(""),x=n=>{const a=n.target.value||"";l.value=a.trim()},i=e.computed(()=>{let n=t.suggestionList.map((a,s)=>P({__index:s},a));return l.value===""?n:n=t.caseSensitivity?n.filter(a=>a[t.displayProperty].indexOf(l.value)!==-1):n.filter(a=>a[t.displayProperty].toLowerCase().indexOf(l.value.toLowerCase())!==-1)}),r=e.ref(0);e.watch(i,()=>{r.value=0});const y=(n=!1)=>{if(n){r.value<i.value.length-1?r.value++:r.value=0;return}r.value>0?r.value--:r.value=i.value.length-1},h=e.ref(null),f=e.ref(!1),S=()=>{f.value=!0},L=()=>{f.value=!1},N=()=>{let n={[t.displayProperty]:l.value};if(l.value===""&&i.value.length===0)return!1;if(t.tags.findIndex(s=>s[t.displayProperty]===l.value)>-1||i.value.length===0&&(l.value.length<t.minLength||l.value.length>t.maxLength))return l.value="",!1;if(i.value.length){const s=i.value[r.value];n=s,d.emit("update:suggestionList",m(t.suggestionList,s.__index))}const a=g(t.tags,n);d.emit("valueChange",t.tags,a),d.emit("update:tags",a),i.value.length===0&&(l.value="")},C=n=>{switch(n.key){case p.tab:case p.enter:case p.space:if(!t.isAddBySpace&&p.space)return;N();break;case p.down:y(!0);break;case p.up:y();break}},V=(n,a)=>{n.preventDefault(),d.emit("update:suggestionList",g(t.suggestionList,t.tags[a]));const s=m(t.tags,a);d.emit("valueChange",t.tags,s),d.emit("update:tags",s),e.nextTick(()=>{var c;(c=h.value)==null||c.focus()})},B=(n,a)=>{n.preventDefault();const s=i.value[a],c=g(t.tags,s),k=m(t.suggestionList,s.__index);d.emit("valueChange",t.tags,c),d.emit("update:tags",c),d.emit("update:suggestionList",k)},w=e.computed(()=>t.maxTags<=t.tags.length),I=e.computed(()=>!t.disabled&&!w.value&&f.value);return{tagInputRef:h,tagInputVal:l,isInputBoxFocus:f,onInput:x,onInputFocus:S,onInputBlur:L,removeTag:V,onSuggestionItemClick:B,onInputKeydown:C,isShowSuggestion:I,mergedSuggestions:i,selectIndex:r,isTagsLimit:w}},render(){const{tagInputVal:t,isInputBoxFocus:d,disabled:g,disabledText:m,isTagsLimit:l,maxTagsText:x,displayProperty:i,tags:r,onInputKeydown:y,onInputFocus:h,onInputBlur:f,onInput:S,onSuggestionItemClick:L,removeTag:N,placeholder:C,spellcheck:V,isShowSuggestion:B,noData:w,mergedSuggestions:I,selectIndex:n,maxTags:a}=this,s={"devui-tags":!0,"devui-form-control":!0,"devui-dropdown-origin":!0,"devui-dropdown-origin-open":d,"devui-disabled":g},c={input:!0,"devui-input":!0,"invalid-tag":!1},k=[`display:${g?"none":"block"};`],M=e.createVNode("li",{class:"devui-suggestion-item devui-disabled"},[w]);return e.createVNode("div",{class:"devui-tags-host",tabindex:"-1"},[e.createVNode("div",{class:s,style:["box-shadow: none;"]},[e.createVNode("ul",{class:"devui-tag-list",title:g?m:""},[r.map((v,T)=>e.createVNode("li",{class:"devui-tag-item"},[e.createVNode("span",null,[v[i]]),!g&&e.createVNode("a",{class:"remove-button",onMousedown:_=>N(_,T)},[o])]))]),e.createVNode("input",{type:"text",ref:"tagInputRef",value:t,class:c,style:k,onKeydown:y,onFocus:h,onBlur:f,onInput:v=>S(v),placeholder:l?`${x} ${a}`:C,spellcheck:V,disabled:l},null)]),B?e.createVNode("div",{class:"devui-tags-autocomplete devui-dropdown-menu"},[e.createVNode("ul",{class:"devui-suggestion-list"},[I.length===0?M:I.map((v,T)=>e.createVNode("li",{class:{"devui-suggestion-item":!0,selected:T===n},onMousedown:_=>{L(_,T)}},[v[i]]))])]):""])}}),D={title:"TagInput \u6807\u7B7E\u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(t){t.component(b.name,b)}};u.TagInput=b,u.default=D,u.tagInputProps=A,Object.defineProperty(u,"__esModule",{value:!0}),u[Symbol.toStringTag]="Module"});
|
package/textarea/index.es.js
CHANGED
|
@@ -118,15 +118,12 @@ var Textarea = defineComponent({
|
|
|
118
118
|
}, [curValueRef.length, !(maxLength != null ? maxLength : false) ? "" : " / " + maxLength])]);
|
|
119
119
|
}
|
|
120
120
|
});
|
|
121
|
-
Textarea.install = function(app) {
|
|
122
|
-
app.component(Textarea.name, Textarea);
|
|
123
|
-
};
|
|
124
121
|
var index = {
|
|
125
122
|
title: "Textarea \u591A\u884C\u6587\u672C\u6846",
|
|
126
123
|
category: "\u6570\u636E\u5F55\u5165",
|
|
127
124
|
status: "100%",
|
|
128
125
|
install(app) {
|
|
129
|
-
app.
|
|
126
|
+
app.component(Textarea.name, Textarea);
|
|
130
127
|
}
|
|
131
128
|
};
|
|
132
|
-
export { Textarea, index as default };
|
|
129
|
+
export { Textarea, index as default, textareaProps };
|
package/textarea/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(t,a){typeof exports=="object"&&typeof module!="undefined"?a(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],a):(t=typeof globalThis!="undefined"?globalThis:t||self,a(t.index={},t.Vue))})(this,function(t,a){"use strict";const d={id:{type:String,default:void 0},autofocus:{type:Boolean,default:!1},showCount:{type:Boolean,default:!1},placeholder:{type:String,default:void 0},value:{type:String,default:""},maxLength:{type:[String,Number],default:void 0},disabled:{type:Boolean,default:!1},error:{type:Boolean,default:!1},cssClass:{type:String,default:""},resize:{type:String,default:"none"}};var C="",l=a.defineComponent({name:"DTextarea",props:d,emits:["update:value","focus","blur","change","keydown"],setup(o,u){const s={error:o.error,[o.cssClass]:!0},n=a.ref(o.value);return{textareaCls:s,onInput:e=>{const r=e.target.value;n.value=r,u.emit("update:value",r)},onFocus:e=>{u.emit("focus",e)},onBlur:e=>{u.emit("blur",e)},onChange:e=>{u.emit("change",e.target.value)},onKeydown:e=>{u.emit("keydown",e)},curValueRef:n,autofocus:o.autofocus}},render(){const{id:o,placeholder:u,disabled:s,maxLength:n,resize:i,textareaCls:f,onInput:c,onFocus:p,onBlur:y,onChange:e,onKeydown:r,showCount:m,autofocus:v,curValueRef:g}=this;return a.createVNode("div",{class:"devui-textarea-wrap"},[a.createVNode("textarea",a.mergeProps({DTextarea:!0},{id:o,value:g,autofocus:v,placeholder:u,disabled:s,maxlength:n,style:{resize:i},class:f,onInput:c,onFocus:p,onBlur:y,onChange:e,onKeydown:r}),null),m&&a.createVNode("div",{class:"devui-textarea-show-count"},[g.length,(n!=null?n:!1)?" / "+n:""])])}}),h={title:"Textarea \u591A\u884C\u6587\u672C\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(o){o.component(l.name,l)}};t.Textarea=l,t.default=h,t.textareaProps=d,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
|
|
File without changes
|
|
@@ -1,20 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
3
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
4
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
5
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
6
|
-
var __spreadValues = (a, b) => {
|
|
7
|
-
for (var prop in b || (b = {}))
|
|
8
|
-
if (__hasOwnProp.call(b, prop))
|
|
9
|
-
__defNormalProp(a, prop, b[prop]);
|
|
10
|
-
if (__getOwnPropSymbols)
|
|
11
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
12
|
-
if (__propIsEnum.call(b, prop))
|
|
13
|
-
__defNormalProp(a, prop, b[prop]);
|
|
14
|
-
}
|
|
15
|
-
return a;
|
|
16
|
-
};
|
|
17
|
-
import { defineComponent, createVNode, inject, createTextVNode, provide, ref, reactive, onMounted, watch, toRef, nextTick, Fragment } from "vue";
|
|
1
|
+
import { defineComponent, toRefs, createVNode, inject, createTextVNode, provide, ref, reactive, onMounted, watch, toRef, nextTick, Fragment } from "vue";
|
|
18
2
|
const timeAxisProps = {
|
|
19
3
|
direction: {
|
|
20
4
|
type: String,
|
|
@@ -33,50 +17,51 @@ const timeAxisProps = {
|
|
|
33
17
|
default: "left"
|
|
34
18
|
}
|
|
35
19
|
};
|
|
20
|
+
const iconProps = {
|
|
21
|
+
name: {
|
|
22
|
+
type: String,
|
|
23
|
+
default: "",
|
|
24
|
+
required: true
|
|
25
|
+
},
|
|
26
|
+
size: {
|
|
27
|
+
type: String,
|
|
28
|
+
default: "inherit"
|
|
29
|
+
},
|
|
30
|
+
color: {
|
|
31
|
+
type: String,
|
|
32
|
+
default: "inherit"
|
|
33
|
+
},
|
|
34
|
+
classPrefix: {
|
|
35
|
+
type: String,
|
|
36
|
+
default: "icon"
|
|
37
|
+
}
|
|
38
|
+
};
|
|
36
39
|
var DIcon = defineComponent({
|
|
37
40
|
name: "DIcon",
|
|
38
|
-
props:
|
|
39
|
-
name: {
|
|
40
|
-
type: String,
|
|
41
|
-
required: true
|
|
42
|
-
},
|
|
43
|
-
size: {
|
|
44
|
-
type: String,
|
|
45
|
-
default: "inherit"
|
|
46
|
-
},
|
|
47
|
-
color: {
|
|
48
|
-
type: String,
|
|
49
|
-
default: "inherit"
|
|
50
|
-
},
|
|
51
|
-
classPrefix: {
|
|
52
|
-
type: String,
|
|
53
|
-
default: "icon"
|
|
54
|
-
}
|
|
55
|
-
},
|
|
41
|
+
props: iconProps,
|
|
56
42
|
setup(props) {
|
|
57
|
-
return __spreadValues({}, props);
|
|
58
|
-
},
|
|
59
|
-
render() {
|
|
60
43
|
const {
|
|
61
44
|
name,
|
|
62
45
|
size,
|
|
63
46
|
color,
|
|
64
47
|
classPrefix
|
|
65
|
-
} =
|
|
66
|
-
return
|
|
67
|
-
"
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
"
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
48
|
+
} = toRefs(props);
|
|
49
|
+
return () => {
|
|
50
|
+
return /^((https?):)?\/\//.test(name.value) ? createVNode("img", {
|
|
51
|
+
"src": name.value,
|
|
52
|
+
"alt": name.value.split("/")[name.value.split("/").length - 1],
|
|
53
|
+
"style": {
|
|
54
|
+
width: size.value,
|
|
55
|
+
verticalAlign: "text-bottom"
|
|
56
|
+
}
|
|
57
|
+
}, null) : createVNode("i", {
|
|
58
|
+
"class": `${classPrefix.value} ${classPrefix.value}-${name.value}`,
|
|
59
|
+
"style": {
|
|
60
|
+
fontSize: size.value,
|
|
61
|
+
color: color.value
|
|
62
|
+
}
|
|
63
|
+
}, null);
|
|
64
|
+
};
|
|
80
65
|
}
|
|
81
66
|
});
|
|
82
67
|
const timeAxisItemProps = {
|
|
@@ -105,16 +90,16 @@ const timeAxisItemProps = {
|
|
|
105
90
|
default: "primary"
|
|
106
91
|
}
|
|
107
92
|
};
|
|
108
|
-
var
|
|
109
|
-
name: "
|
|
93
|
+
var TimelineItem = defineComponent({
|
|
94
|
+
name: "DTimelineItem",
|
|
110
95
|
components: {
|
|
111
96
|
DIcon
|
|
112
97
|
},
|
|
113
98
|
props: timeAxisItemProps,
|
|
114
99
|
emits: [],
|
|
115
100
|
setup(props, ctx) {
|
|
116
|
-
const
|
|
117
|
-
const itemClass = "devui-
|
|
101
|
+
const timeAxis = inject("timeAxis");
|
|
102
|
+
const itemClass = "devui-timeline-item";
|
|
118
103
|
const renderTime = () => {
|
|
119
104
|
var _a, _b;
|
|
120
105
|
return createVNode("div", {
|
|
@@ -131,7 +116,7 @@ var TimeAxisItem = defineComponent({
|
|
|
131
116
|
if (types.includes(props.position)) {
|
|
132
117
|
return renderContent();
|
|
133
118
|
} else {
|
|
134
|
-
if (
|
|
119
|
+
if (timeAxis.props.direction === "horizontal") {
|
|
135
120
|
return renderTime();
|
|
136
121
|
} else {
|
|
137
122
|
return props.timePosition === "left" ? renderTime() : "";
|
|
@@ -171,7 +156,7 @@ var TimeAxisItem = defineComponent({
|
|
|
171
156
|
"class": `${itemClass}-data-left ${itemClass}-data-top`
|
|
172
157
|
}, [renderPosition(["top", "left"])]), createVNode("div", {
|
|
173
158
|
"class": `${itemClass}-axis`
|
|
174
|
-
}, [renderDot(),
|
|
159
|
+
}, [renderDot(), timeAxis.props.direction === "vertical" && props.timePosition === "bottom" ? renderTime() : "", createVNode("div", {
|
|
175
160
|
"class": `${itemClass}-line ${itemClass}-line-style-${props.lineStyle}`,
|
|
176
161
|
"style": {
|
|
177
162
|
borderColor: props.lineColor
|
|
@@ -184,11 +169,11 @@ var TimeAxisItem = defineComponent({
|
|
|
184
169
|
};
|
|
185
170
|
}
|
|
186
171
|
});
|
|
187
|
-
var
|
|
188
|
-
var
|
|
189
|
-
name: "
|
|
172
|
+
var timeline = "";
|
|
173
|
+
var Timeline = defineComponent({
|
|
174
|
+
name: "DTimeline",
|
|
190
175
|
components: {
|
|
191
|
-
|
|
176
|
+
TimelineItem
|
|
192
177
|
},
|
|
193
178
|
props: timeAxisProps,
|
|
194
179
|
emits: [],
|
|
@@ -197,7 +182,7 @@ var TimeAxis = defineComponent({
|
|
|
197
182
|
ctx,
|
|
198
183
|
props
|
|
199
184
|
});
|
|
200
|
-
const
|
|
185
|
+
const timeAxis = ref();
|
|
201
186
|
const style = reactive({
|
|
202
187
|
marginLeft: "0px",
|
|
203
188
|
height: "auto"
|
|
@@ -208,11 +193,11 @@ var TimeAxis = defineComponent({
|
|
|
208
193
|
if (props.direction === "horizontal") {
|
|
209
194
|
nextTick(() => {
|
|
210
195
|
var _a;
|
|
211
|
-
const
|
|
196
|
+
const element = timeAxis.value;
|
|
212
197
|
if (props.center) {
|
|
213
|
-
style.marginLeft = (((_a =
|
|
198
|
+
style.marginLeft = (((_a = element == null ? void 0 : element.firstElementChild) == null ? void 0 : _a.clientWidth) || 0) / 2 + "px";
|
|
214
199
|
}
|
|
215
|
-
style.height = Math.max(...Array.from(
|
|
200
|
+
style.height = Math.max(...Array.from(element == null ? void 0 : element.querySelectorAll(".devui-timeline-item-data-top")).map((el) => el.clientHeight), ...Array.from(element == null ? void 0 : element.querySelectorAll(".devui-timeline-item-data-bottom")).map((el) => el.clientHeight)) * 2 + Math.max(...Array.from(element == null ? void 0 : element.querySelectorAll(".devui-timeline-item-axis")).map((el) => el.clientHeight)) + "px";
|
|
216
201
|
});
|
|
217
202
|
}
|
|
218
203
|
};
|
|
@@ -252,18 +237,20 @@ var TimeAxis = defineComponent({
|
|
|
252
237
|
}, null);
|
|
253
238
|
}
|
|
254
239
|
if (props.direction === "horizontal") {
|
|
255
|
-
if (((_e = item.props) == null ? void 0 : _e.position) === "top" || ((_f = item.props) == null ? void 0 : _f.position) === "bottom")
|
|
240
|
+
if (((_e = item.props) == null ? void 0 : _e.position) === "top" || ((_f = item.props) == null ? void 0 : _f.position) === "bottom") {
|
|
256
241
|
return item;
|
|
242
|
+
}
|
|
257
243
|
if (props.mode === "alternative") {
|
|
258
|
-
return renderItemPosition(item, index2 % 2
|
|
244
|
+
return renderItemPosition(item, index2 % 2 === 0 ? "bottom" : "top");
|
|
259
245
|
} else {
|
|
260
246
|
return renderItemPosition(item, "bottom");
|
|
261
247
|
}
|
|
262
248
|
} else {
|
|
263
|
-
if (((_g = item.props) == null ? void 0 : _g.position) === "left" || ((_h = item.props) == null ? void 0 : _h.position) === "right")
|
|
249
|
+
if (((_g = item.props) == null ? void 0 : _g.position) === "left" || ((_h = item.props) == null ? void 0 : _h.position) === "right") {
|
|
264
250
|
return item;
|
|
251
|
+
}
|
|
265
252
|
if (props.mode === "alternative") {
|
|
266
|
-
return renderItemPosition(item, index2 % 2
|
|
253
|
+
return renderItemPosition(item, index2 % 2 === 0 ? "left" : "right");
|
|
267
254
|
} else {
|
|
268
255
|
return renderItemPosition(item, "right");
|
|
269
256
|
}
|
|
@@ -274,26 +261,20 @@ var TimeAxis = defineComponent({
|
|
|
274
261
|
return props.direction === "horizontal" ? "horizontal" : "vertical";
|
|
275
262
|
};
|
|
276
263
|
return createVNode("div", {
|
|
277
|
-
"class": `devui-
|
|
278
|
-
"ref":
|
|
264
|
+
"class": `devui-timeline devui-timeline-${getDirection()} ${props.center ? "devui-timeline-" + getDirection() + "-center" : ""} `,
|
|
265
|
+
"ref": timeAxis,
|
|
279
266
|
"style": style
|
|
280
267
|
}, [renderItem()]);
|
|
281
268
|
};
|
|
282
269
|
}
|
|
283
270
|
});
|
|
284
|
-
TimeAxis.install = function(app) {
|
|
285
|
-
app.component(TimeAxis.name, TimeAxis);
|
|
286
|
-
};
|
|
287
|
-
TimeAxisItem.install = function(app) {
|
|
288
|
-
app.component(TimeAxisItem.name, TimeAxisItem);
|
|
289
|
-
};
|
|
290
271
|
var index = {
|
|
291
|
-
title: "
|
|
272
|
+
title: "Timeline \u65F6\u95F4\u8F74",
|
|
292
273
|
category: "\u6570\u636E\u5C55\u793A",
|
|
293
274
|
status: "100%",
|
|
294
275
|
install(app) {
|
|
295
|
-
app.
|
|
296
|
-
app.
|
|
276
|
+
app.component(Timeline.name, Timeline);
|
|
277
|
+
app.component(TimelineItem.name, TimelineItem);
|
|
297
278
|
}
|
|
298
279
|
};
|
|
299
|
-
export {
|
|
280
|
+
export { Timeline, TimelineItem, index as default, timeAxisProps };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
(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 h={direction:{type:String,default:"vertical"},center:{type:Boolean,default:!1},mode:{type:String,default:"normal"},timePosition:{type:String,default:"left"}},b={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var I=e.defineComponent({name:"DIcon",props:b,setup(t){const{name:l,size:u,color:i,classPrefix:c}=e.toRefs(t);return()=>/^((https?):)?\/\//.test(l.value)?e.createVNode("img",{src:l.value,alt:l.value.split("/")[l.value.split("/").length-1],style:{width:u.value,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${c.value} ${c.value}-${l.value}`,style:{fontSize:u.value,color:i.value}},null)}});const z={time:{type:String},dotColor:{type:String},lineStyle:{type:String,default:"solid"},lineColor:{type:String},position:{type:String},timePosition:{type:String,default:"left"},type:{type:String,default:"primary"}};var p=e.defineComponent({name:"DTimelineItem",components:{DIcon:I},props:z,emits:[],setup(t,l){const u=e.inject("timeAxis"),i="devui-timeline-item",c=()=>{var o,a;return e.createVNode("div",{class:`${i}-time`},[l.slots.time?(a=(o=l.slots).time)==null?void 0:a.call(o):t.time])},n=()=>{var o,a;return e.createVNode("div",{class:`${i}-content`},[(a=(o=l.slots).default)==null?void 0:a.call(o,t)])},f=o=>o.includes(t.position)?n():u.props.direction==="horizontal"||t.timePosition==="left"?c():"",d=o=>o==="primary"?"":e.createVNode("i",{class:`icon-${o==="success"?"right":o}-o`},null),m=()=>{var o,a;return l.slots.dot?e.createVNode("div",{style:{color:t.dotColor},class:`${i}-dot`},[e.createTextVNode(" "),(a=(o=l.slots).dot)==null?void 0:a.call(o)]):e.createVNode("div",{class:`${i}-dot ${i}-type-${t.type}`,style:{borderColor:t.dotColor}},[d(t.type)])};return()=>e.createVNode("div",{class:i},[e.createVNode("div",{class:`${i}-data-left ${i}-data-top`},[f(["top","left"])]),e.createVNode("div",{class:`${i}-axis`},[m(),u.props.direction==="vertical"&&t.timePosition==="bottom"?c():"",e.createVNode("div",{class:`${i}-line ${i}-line-style-${t.lineStyle}`,style:{borderColor:t.lineColor}},[l.slots.extra?e.createVNode("div",{class:`${i}-line-extra`},[l.slots.extra()]):""])]),e.createVNode("div",{class:`${i}-data-right ${i}-data-bottom`},[f(["right","bottom"])])])}}),q="",y=e.defineComponent({name:"DTimeline",components:{TimelineItem:p},props:h,emits:[],setup(t,l){e.provide("timeAxis",{ctx:l,props:t});const u=e.ref(),i=e.reactive({marginLeft:"0px",height:"auto"}),c=()=>{i.height="auto",i.marginLeft="0px",t.direction==="horizontal"&&e.nextTick(()=>{var f;const n=u.value;t.center&&(i.marginLeft=(((f=n==null?void 0:n.firstElementChild)==null?void 0:f.clientWidth)||0)/2+"px"),i.height=Math.max(...Array.from(n==null?void 0:n.querySelectorAll(".devui-timeline-item-data-top")).map(d=>d.clientHeight),...Array.from(n==null?void 0:n.querySelectorAll(".devui-timeline-item-data-bottom")).map(d=>d.clientHeight))*2+Math.max(...Array.from(n==null?void 0:n.querySelectorAll(".devui-timeline-item-axis")).map(d=>d.clientHeight))+"px"})};return e.onMounted(()=>{c()}),e.watch(e.toRef(t,"direction"),()=>{c()}),()=>{const n=(m,o)=>o?e.createVNode(m,{position:o},null):e.createVNode(m,null,null),f=()=>{var a,S,$;const m=($=(S=(a=l.slots).default)==null?void 0:S.call(a))!=null?$:[];let o;return m.length===1&&m[0].type===e.Fragment?o=m[0].children||[]:o=m,o.map((r,g)=>{var V,N,P,A,v,x,C,T;return g+1===o.length&&!((V=r.props)==null?void 0:V.lineStyle)&&!((N=r.props)==null?void 0:N["line-style"])&&(r=e.createVNode(r,{"line-style":"none"},null)),!((P=r.props)==null?void 0:P.timePosition)&&!((A=r.props)==null?void 0:A["time-position"])&&(r=e.createVNode(r,{"time-position":t.timePosition?t.timePosition:"left"},null)),t.direction==="horizontal"?((v=r.props)==null?void 0:v.position)==="top"||((x=r.props)==null?void 0:x.position)==="bottom"?r:t.mode==="alternative"?n(r,g%2===0?"bottom":"top"):n(r,"bottom"):((C=r.props)==null?void 0:C.position)==="left"||((T=r.props)==null?void 0:T.position)==="right"?r:t.mode==="alternative"?n(r,g%2===0?"left":"right"):n(r,"right")})},d=()=>t.direction==="horizontal"?"horizontal":"vertical";return e.createVNode("div",{class:`devui-timeline devui-timeline-${d()} ${t.center?"devui-timeline-"+d()+"-center":""} `,ref:u,style:i},[f()])}}}),D={title:"Timeline \u65F6\u95F4\u8F74",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.component(y.name,y),t.component(p.name,p)}};s.Timeline=y,s.TimelineItem=p,s.default=D,s.timeAxisProps=h,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.devui-timeline-vertical{display:flex;flex-direction:column;align-items:center;position:relative}.devui-timeline-vertical .devui-timeline-item{display:flex;flex-direction:row;width:100%}.devui-timeline-vertical .devui-timeline-item-axis{display:flex;flex-direction:column;align-items:center;padding:0 12px}.devui-timeline-vertical .devui-timeline-item-line{position:relative;height:calc(100% - 18px);min-height:20px;border-left-width:2px;border-left-color:var(--devui-dividing-line, #dfe1e6)}.devui-timeline-vertical .devui-timeline-item-line-extra{position:absolute;top:50%;transform:translate(-50%,-50%)}.devui-timeline-vertical .devui-timeline-item-line:first-child{display:none}.devui-timeline-vertical .devui-timeline-item-data-left{text-align:end}.devui-timeline-vertical .devui-timeline-item-data-left,.devui-timeline-vertical .devui-timeline-item-data-right{margin-bottom:24px;margin-top:-2px;flex:1}.devui-timeline-vertical .devui-timeline-item-line-style-dashed{border-left-style:dashed}.devui-timeline-vertical .devui-timeline-item-line-style-solid{border-left-style:solid}.devui-timeline-vertical .devui-timeline-item-line-style-dotted{border-left-style:dotted}.devui-timeline-vertical .devui-timeline-item-line-style-none{border-left-style:none}.devui-timeline-vertical .devui-timeline-item .devui-timeline-middle-zone{position:absolute;top:50%;transform:translate(-50%,-50%)}.devui-timeline-horizontal{display:flex;flex-direction:row;align-items:center;position:relative}.devui-timeline-horizontal-center .devui-timeline-item-data-top,.devui-timeline-horizontal-center .devui-timeline-item-data-bottom{text-align:center;padding:0 6px}.devui-timeline-horizontal-center .devui-timeline-item-data-top>div,.devui-timeline-horizontal-center .devui-timeline-item-data-bottom>div{transform:translate(-50%)}.devui-timeline-horizontal .devui-timeline-item{display:flex;flex-direction:column;height:100%}.devui-timeline-horizontal .devui-timeline-item-axis{display:flex;flex-direction:row;align-items:center;padding:12px 0}.devui-timeline-horizontal .devui-timeline-item-line{position:relative;min-width:60px;width:calc(100% - 18px);border-bottom-width:2px;border-bottom-color:var(--devui-dividing-line, #dfe1e6)}.devui-timeline-horizontal .devui-timeline-item-line-extra{position:absolute;left:50%;transform:translate(-50%,-50%)}.devui-timeline-horizontal .devui-timeline-item:first-child .devui-timeline-item-line:first-child{opacity:0}.devui-timeline-horizontal .devui-timeline-item-data-top,.devui-timeline-horizontal .devui-timeline-item-data-bottom{padding-right:12px;flex:1}.devui-timeline-horizontal .devui-timeline-item-line-style-dashed{border-bottom-style:dashed}.devui-timeline-horizontal .devui-timeline-item-line-style-solid{border-bottom-style:solid}.devui-timeline-horizontal .devui-timeline-item-line-style-dotted{border-bottom-style:dotted}.devui-timeline-horizontal .devui-timeline-item-line-style-none{border-bottom-style:none}.devui-timeline-horizontal .devui-timeline-item .devui-timeline-middle-zone{position:absolute;left:50%;transform:translate(-50%,-50%)}.devui-timeline-item-dot,.devui-timeline-item-dot>svg{width:18px;height:18px;flex-shrink:0}.devui-timeline-item-dot>i{font-size:18px;vertical-align:0}.devui-timeline-item-type-primary{border:2px solid var(--devui-placeholder, #8a8e99);border-radius:50%}.devui-timeline-item-type-success i{color:var(--devui-success, #50d4ab)}.devui-timeline-item-type-error i{color:var(--devui-danger, #f66f6a)}.devui-timeline-item-type-warning i{color:var(--devui-warning, #fac20a)}.devui-timeline-item-type-running{line-height:16px;text-align:center;animation:devui-timeline-running 1.5s linear infinite;border:2px solid var(--devui-success, #50d4ab);border-radius:50%}@keyframes devui-timeline-running{0%{transform:rotate(0);color:var(--devui-success, #50d4ab);border-color:var(--devui-success, #50d4ab)}50%{transform:rotate(180deg);color:var(--devui-success, #50d4ab);border-color:var(--devui-success, #50d4ab)}to{transform:rotate(360deg);color:var(--devui-success, #50d4ab);border-color:var(--devui-success, #50d4ab)}}
|