vue-devui 1.0.0-rc.6 → 1.0.0-rc.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -0
- package/alert/index.es.js +37 -11
- package/alert/index.umd.js +1 -1
- package/alert/style.css +1 -1
- package/auto-complete/index.es.js +311 -77
- package/auto-complete/index.umd.js +3 -5
- package/auto-complete/style.css +1 -1
- package/avatar/index.es.js +81 -70
- package/avatar/index.umd.js +1 -1
- package/avatar/style.css +1 -1
- package/badge/index.es.js +29 -4
- package/badge/index.umd.js +1 -1
- package/badge/style.css +1 -1
- package/button/index.es.js +5632 -87
- package/button/index.umd.js +27 -1
- package/button/style.css +1 -1
- package/card/index.es.js +56 -29
- package/card/index.umd.js +1 -1
- package/card/style.css +1 -1
- package/checkbox/index.es.js +364 -234
- package/checkbox/index.umd.js +1 -1
- package/checkbox/style.css +1 -1
- package/date-picker/index.es.js +310 -157
- package/date-picker/index.umd.js +1 -1
- package/date-picker/style.css +1 -1
- package/drawer/index.es.js +28 -3
- package/drawer/index.umd.js +1 -1
- package/drawer/style.css +1 -1
- package/dropdown/index.es.js +125 -45
- package/dropdown/index.umd.js +1 -1
- package/dropdown/style.css +1 -1
- package/editable-select/index.es.js +437 -22
- package/editable-select/index.umd.js +1 -1
- package/editable-select/style.css +1 -1
- package/form/index.es.js +490 -605
- package/form/index.umd.js +15 -15
- package/form/style.css +1 -1
- package/fullscreen/index.es.js +29 -5
- package/fullscreen/index.umd.js +1 -1
- package/fullscreen/style.css +1 -1
- package/grid/index.es.js +71 -50
- package/grid/index.umd.js +1 -1
- package/grid/style.css +1 -1
- package/icon/index.es.js +109 -13
- package/icon/index.umd.js +1 -1
- package/icon/style.css +1 -0
- package/image-preview/index.es.js +34 -11
- package/image-preview/index.umd.js +1 -1
- package/image-preview/style.css +1 -1
- package/input/index.es.js +330 -130
- package/input/index.umd.js +1 -1
- package/input/style.css +1 -1
- package/input-number/index.es.js +272 -199
- package/input-number/index.umd.js +1 -1
- package/input-number/style.css +1 -1
- package/layout/index.es.js +34 -6
- package/layout/index.umd.js +1 -1
- package/layout/style.css +1 -1
- package/loading/index.es.js +34 -10
- package/loading/index.umd.js +1 -1
- package/loading/style.css +1 -1
- package/modal/index.es.js +126 -27
- package/modal/index.umd.js +1 -1
- package/modal/style.css +1 -1
- package/notification/index.es.js +125 -25
- package/notification/index.umd.js +1 -1
- package/notification/style.css +1 -1
- package/nuxt/components/ButtonGroup.js +3 -0
- package/nuxt/components/CheckboxButton.js +3 -0
- package/nuxt/components/CheckboxGroup.js +3 -0
- package/nuxt/components/FORM_ITEM_TOKEN.js +3 -0
- package/nuxt/components/FORM_TOKEN.js +3 -0
- package/nuxt/components/Icon.js +1 -0
- package/nuxt/components/LABEL_DATA.js +3 -0
- package/nuxt/components/Option.js +3 -0
- package/nuxt/components/buttonGroupInjectionKey.js +3 -0
- package/nuxt/components/buttonGroupProps.js +3 -0
- package/nuxt/components/formControlProps.js +3 -0
- package/nuxt/components/formItemProps.js +3 -0
- package/nuxt/components/formProps.js +3 -0
- package/nuxt/components/iconProps.js +1 -0
- package/nuxt/components/svgIconProps.js +3 -0
- package/overlay/index.es.js +31 -9
- package/overlay/index.umd.js +1 -1
- package/overlay/style.css +1 -1
- package/package.json +2 -1
- package/pagination/index.es.js +135 -124
- package/pagination/index.umd.js +1 -1
- package/pagination/style.css +1 -1
- package/popover/index.es.js +198 -83
- package/popover/index.umd.js +16 -16
- package/popover/style.css +1 -1
- package/progress/index.es.js +76 -20
- package/progress/index.umd.js +3 -3
- package/progress/style.css +1 -1
- package/radio/index.es.js +161 -140
- package/radio/index.umd.js +1 -1
- package/radio/style.css +1 -1
- package/rate/index.es.js +48 -16
- package/rate/index.umd.js +1 -1
- package/rate/style.css +1 -1
- package/result/index.es.js +108 -12
- package/result/index.umd.js +1 -1
- package/result/style.css +1 -1
- package/search/index.es.js +379 -167
- package/search/index.umd.js +17 -17
- package/search/style.css +1 -1
- package/select/index.es.js +7339 -556
- package/select/index.umd.js +27 -1
- package/select/style.css +1 -1
- package/skeleton/index.es.js +37 -12
- package/skeleton/index.umd.js +1 -1
- package/skeleton/style.css +1 -1
- package/slider/index.es.js +34 -10
- package/slider/index.umd.js +1 -1
- package/slider/style.css +1 -1
- package/splitter/index.es.js +201 -84
- package/splitter/index.umd.js +14 -14
- package/splitter/style.css +1 -1
- package/status/index.es.js +26 -2
- package/status/index.umd.js +1 -1
- package/status/style.css +1 -1
- package/style.css +1 -1
- package/switch/index.es.js +30 -6
- package/switch/index.umd.js +1 -1
- package/switch/style.css +1 -1
- package/table/index.es.js +6808 -585
- package/table/index.umd.js +27 -1
- package/table/style.css +1 -1
- package/tabs/index.es.js +136 -70
- package/tabs/index.umd.js +1 -1
- package/tabs/style.css +1 -1
- package/tag/index.es.js +31 -7
- package/tag/index.umd.js +1 -1
- package/tag/style.css +1 -1
- package/textarea/index.es.js +5631 -80
- package/textarea/index.umd.js +35 -1
- package/textarea/style.css +1 -1
- package/timeline/index.es.js +108 -12
- package/timeline/index.umd.js +1 -1
- package/timeline/style.css +1 -1
- package/tooltip/index.es.js +190 -74
- package/tooltip/index.umd.js +17 -17
- package/tooltip/style.css +1 -1
- package/tree/index.es.js +376 -256
- package/tree/index.umd.js +1 -1
- package/tree/style.css +1 -1
- package/upload/index.es.js +138 -34
- package/upload/index.umd.js +1 -1
- package/upload/style.css +1 -1
- package/vue-devui.es.js +6770 -5769
- package/vue-devui.umd.js +27 -21
- package/comment/index.d.ts +0 -7
- package/comment/index.es.js +0 -84
- package/comment/index.umd.js +0 -1
- package/comment/package.json +0 -7
- package/comment/style.css +0 -1
- package/nuxt/components/Comment.js +0 -3
- package/nuxt/components/FormControl.js +0 -3
- package/nuxt/components/FormLabel.js +0 -3
- package/nuxt/components/ReadTip.js +0 -3
- package/nuxt/components/commentProps.js +0 -3
- package/nuxt/components/readTipProps.js +0 -3
- package/read-tip/index.d.ts +0 -7
- package/read-tip/index.es.js +0 -261
- package/read-tip/index.umd.js +0 -1
- package/read-tip/package.json +0 -7
- package/read-tip/style.css +0 -1
package/rate/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent,
|
|
1
|
+
import { defineComponent, ref, watch, onMounted, createVNode, resolveComponent } from "vue";
|
|
2
2
|
const rateProps = {
|
|
3
3
|
modelValue: {
|
|
4
4
|
type: Number,
|
|
@@ -41,17 +41,40 @@ const rateProps = {
|
|
|
41
41
|
default: void 0
|
|
42
42
|
}
|
|
43
43
|
};
|
|
44
|
+
function createBem(namespace, element, modifier) {
|
|
45
|
+
let cls = namespace;
|
|
46
|
+
if (element) {
|
|
47
|
+
cls += `__${element}`;
|
|
48
|
+
}
|
|
49
|
+
if (modifier) {
|
|
50
|
+
cls += `--${modifier}`;
|
|
51
|
+
}
|
|
52
|
+
return cls;
|
|
53
|
+
}
|
|
54
|
+
function useNamespace(block, needDot = false) {
|
|
55
|
+
const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
|
|
56
|
+
const b = () => createBem(namespace);
|
|
57
|
+
const e = (element) => element ? createBem(namespace, element) : "";
|
|
58
|
+
const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
|
|
59
|
+
const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
|
|
60
|
+
return {
|
|
61
|
+
b,
|
|
62
|
+
e,
|
|
63
|
+
m,
|
|
64
|
+
em
|
|
65
|
+
};
|
|
66
|
+
}
|
|
44
67
|
var rate = "";
|
|
45
68
|
var Rate = defineComponent({
|
|
46
69
|
name: "DRate",
|
|
47
70
|
props: rateProps,
|
|
48
71
|
emits: ["change", "update:modelValue"],
|
|
49
72
|
setup(props, ctx) {
|
|
50
|
-
const totalLevelArray =
|
|
73
|
+
const totalLevelArray = ref([]);
|
|
51
74
|
const chooseValue = ref(0);
|
|
52
75
|
const setChange = (start, end, width) => {
|
|
53
76
|
for (let i = start; i < end; i++) {
|
|
54
|
-
totalLevelArray[i]["width"] = width;
|
|
77
|
+
totalLevelArray.value[i]["width"] = width;
|
|
55
78
|
}
|
|
56
79
|
};
|
|
57
80
|
const initRating = () => {
|
|
@@ -60,18 +83,26 @@ var Rate = defineComponent({
|
|
|
60
83
|
const intCurrentLevel = Math.floor(chooseValue.value);
|
|
61
84
|
setChange(0, intCurrentLevel, "100%");
|
|
62
85
|
if (halfStar > 0) {
|
|
63
|
-
totalLevelArray[intCurrentLevel]["width"] = halfStar * 100 + "%";
|
|
86
|
+
totalLevelArray.value[intCurrentLevel]["width"] = halfStar * 100 + "%";
|
|
64
87
|
setChange(intCurrentLevel + 1, props.count, "0");
|
|
65
88
|
} else {
|
|
66
89
|
setChange(intCurrentLevel, props.count, "0");
|
|
67
90
|
}
|
|
68
91
|
};
|
|
69
|
-
|
|
92
|
+
const initLevelArray = () => {
|
|
93
|
+
totalLevelArray.value = [];
|
|
70
94
|
for (let i = 0; i < props.count; i++) {
|
|
71
|
-
totalLevelArray.push({
|
|
95
|
+
totalLevelArray.value.push({
|
|
72
96
|
width: "0"
|
|
73
97
|
});
|
|
74
98
|
}
|
|
99
|
+
};
|
|
100
|
+
watch([() => props.modelValue, () => props.count], () => {
|
|
101
|
+
initLevelArray();
|
|
102
|
+
initRating();
|
|
103
|
+
});
|
|
104
|
+
onMounted(() => {
|
|
105
|
+
initLevelArray();
|
|
75
106
|
initRating();
|
|
76
107
|
});
|
|
77
108
|
const isSemiSelected = (e) => {
|
|
@@ -127,22 +158,24 @@ var Rate = defineComponent({
|
|
|
127
158
|
selectValue,
|
|
128
159
|
onMouseleave
|
|
129
160
|
} = this;
|
|
161
|
+
const ns = useNamespace("rate");
|
|
130
162
|
return createVNode("div", {
|
|
131
|
-
"class":
|
|
132
|
-
"onMouseleave": onMouseleave
|
|
163
|
+
"class": ns.b(),
|
|
164
|
+
"onMouseleave": onMouseleave,
|
|
165
|
+
"style": `--star-color: ${color}`
|
|
133
166
|
}, [totalLevelArray.map((item, index2) => createVNode("div", {
|
|
134
|
-
"class":
|
|
167
|
+
"class": [ns.m("align"), ns.m("pointer"), read ? ns.m("only-read") : ""],
|
|
135
168
|
"key": index2,
|
|
136
169
|
"onMouseover": (e) => hoverToggle(e, index2),
|
|
137
170
|
"onClick": (e) => selectValue(e, index2)
|
|
138
171
|
}, [icon && !character && createVNode("span", {
|
|
139
|
-
"class": "
|
|
172
|
+
"class": ns.e("color")
|
|
140
173
|
}, [createVNode(resolveComponent("d-icon"), {
|
|
141
174
|
"name": icon
|
|
142
175
|
}, null)]), character && !icon && createVNode("span", {
|
|
143
|
-
"class": "
|
|
176
|
+
"class": ns.e("color")
|
|
144
177
|
}, [character]), !icon && !character && createVNode("span", {
|
|
145
|
-
"class": "
|
|
178
|
+
"class": ns.e("color")
|
|
146
179
|
}, [createVNode("svg", {
|
|
147
180
|
"width": "16px",
|
|
148
181
|
"height": "16px",
|
|
@@ -161,7 +194,7 @@ var Rate = defineComponent({
|
|
|
161
194
|
}, [createVNode("polygon", {
|
|
162
195
|
"points": "8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"
|
|
163
196
|
}, null)])])])]), icon && !character && createVNode("span", {
|
|
164
|
-
"class":
|
|
197
|
+
"class": [ns.e("color-active"), ns.e("active-star"), ns.em("color", type)],
|
|
165
198
|
"style": {
|
|
166
199
|
width: item.width
|
|
167
200
|
}
|
|
@@ -169,15 +202,14 @@ var Rate = defineComponent({
|
|
|
169
202
|
"name": icon,
|
|
170
203
|
"color": color
|
|
171
204
|
}, null)]), character && !icon && createVNode("span", {
|
|
172
|
-
"class":
|
|
205
|
+
"class": [ns.e("color-active"), ns.e("active-star"), ns.em("color", type)],
|
|
173
206
|
"style": {
|
|
174
207
|
color,
|
|
175
208
|
width: item.width
|
|
176
209
|
}
|
|
177
210
|
}, [character]), !character && !icon && createVNode("span", {
|
|
178
|
-
"class":
|
|
211
|
+
"class": [ns.e("color-active"), ns.e("active-star"), !color ? ns.em("color", type) : ns.em("color", "customize")],
|
|
179
212
|
"style": {
|
|
180
|
-
color,
|
|
181
213
|
width: item.width
|
|
182
214
|
}
|
|
183
215
|
}, [createVNode("svg", {
|
package/rate/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(d,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(d=typeof globalThis!="undefined"?globalThis:d||self,e(d.index={},d.Vue))})(this,function(d,e){"use strict";const V={modelValue:{type:Number,default:0},read:{type:Boolean,default:!1},count:{type:Number,default:5},type:{type:String,default:""},color:{type:String,default:""},icon:{type:String,default:""},character:{type:String,default:""},allowHalf:{type:Boolean,default:!1},onChange:{type:Function,default:void 0},onTouched:{type:Function,default:void 0}};function g(o,c,a){let r=o;return c&&(r+=`__${c}`),a&&(r+=`--${a}`),r}function p(o,c=!1){const a=c?`.devui-${o}`:`devui-${o}`;return{b:()=>g(a),e:i=>i?g(a,i):"",m:i=>i?g(a,"",i):"",em:(i,h)=>i&&h?g(a,i,h):""}}var k="",m=e.defineComponent({name:"DRate",props:V,emits:["change","update:modelValue"],setup(o,c){const a=e.ref([]),r=e.ref(0),s=(n,t,v)=>{for(let y=n;y<t;y++)a.value[y].width=v},u=()=>{r.value=o.modelValue;const n=r.value%1,t=Math.floor(r.value);s(0,t,"100%"),n>0?(a.value[t].width=n*100+"%",s(t+1,o.count,"0")):s(t,o.count,"0")},f=()=>{a.value=[];for(let n=0;n<o.count;n++)a.value.push({width:"0"})};e.watch([()=>o.modelValue,()=>o.count],()=>{f(),u()}),e.onMounted(()=>{f(),u()});const i=n=>{const t=n.target;return o.allowHalf&&n.offsetX*2<=t.clientWidth};return{totalLevelArray:a,chooseValue:r,hoverToggle:(n,t)=>{if(o.read)return;s(0,t+1,"100%");const v=i(n)?"50%":"100%";s(t,t+1,v),s(t+1,o.count,"0")},selectValue:(n,t)=>{o.read||(s(0,t,"100%"),i(n)?(s(t,t+1,"50%"),r.value=t-.5):(s(t,t+1,"100%"),r.value=t),s(t+1,o.count,"0"),o.onChange&&o.onChange(r.value+1),o.onTouched&&o.onTouched(),c.emit("update:modelValue",r.value+1))},onMouseleave:()=>{u()}}},render(){const{totalLevelArray:o,icon:c,character:a,read:r,type:s,color:u,hoverToggle:f,selectValue:i,onMouseleave:h}=this,l=p("rate");return e.createVNode("div",{class:l.b(),onMouseleave:h,style:`--star-color: ${u}`},[o.map((w,n)=>e.createVNode("div",{class:[l.m("align"),l.m("pointer"),r?l.m("only-read"):""],key:n,onMouseover:t=>f(t,n),onClick:t=>i(t,n)},[c&&!a&&e.createVNode("span",{class:l.e("color")},[e.createVNode(e.resolveComponent("d-icon"),{name:c},null)]),a&&!c&&e.createVNode("span",{class:l.e("color")},[a]),!c&&!a&&e.createVNode("span",{class:l.e("color")},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",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("g",{fill:"#E3E5E9",id:"Mask"},[e.createVNode("polygon",{points:"8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"},null)])])])]),c&&!a&&e.createVNode("span",{class:[l.e("color-active"),l.e("active-star"),l.em("color",s)],style:{width:w.width}},[e.createVNode(e.resolveComponent("d-icon"),{name:c,color:u},null)]),a&&!c&&e.createVNode("span",{class:[l.e("color-active"),l.e("active-star"),l.em("color",s)],style:{color:u,width:w.width}},[a]),!a&&!c&&e.createVNode("span",{class:[l.e("color-active"),l.e("active-star"),u?l.em("color","customize"):l.em("color",s)],style:{width:w.width}},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",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("g",{id:"Mask"},[e.createVNode("polygon",{points:"8 12.7603585 3.67376208 14.3147912 3.81523437 9.71994835 1 6.0857977 5.41367261 4.80046131 8 1 10.5863274 4.80046131 15 6.0857977 12.1847656 9.71994835 12.3262379 14.3147912"},null)])])])])]))])}}),N={title:"Rate \u8BC4\u5206",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(o){o.component(m.name,m)}};d.Rate=m,d.default=N,d.rateProps=V,Object.defineProperty(d,"__esModule",{value:!0}),d[Symbol.toStringTag]="Module"});
|
package/rate/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.devui-
|
|
1
|
+
.devui-rate--align{font-size:var(--devui-font-size-icon, 16px);margin-right:5px;position:relative;line-height:1}.devui-rate--pointer{cursor:pointer}.devui-rate{display:inline-flex}.devui-rate__color-active{color:#6a81ed;line-height:1.5}.devui-rate__color-active svg g{fill:#6a81ed}.devui-rate__color--success{color:#3dcca6}.devui-rate__color--success svg g{fill:#3dcca6}.devui-rate__color--warning{color:#fac20a}.devui-rate__color--warning svg g{fill:#fac20a}.devui-rate__color--error{color:#f66f6a}.devui-rate__color--error svg g{fill:#f66f6a}.devui-rate__color--customize{color:var(--star-color)}.devui-rate__color--customize svg g{fill:var(--star-color)}.devui-rate__active-star{position:absolute;top:0;left:0;overflow:hidden}.devui-rate__color{color:var(--devui-dividing-line, #dfe1e6);line-height:1.5}.devui-rate__color .icon{color:var(--devui-dividing-line, #dfe1e6)!important}.devui-rate__color svg g{fill:var(--devui-dividing-line, #dfe1e6)}.devui-rate--only-read{cursor:not-allowed}
|
package/result/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent, toRefs, createVNode } from "vue";
|
|
1
|
+
import { defineComponent, toRefs, computed, createVNode, resolveDynamicComponent, mergeProps } from "vue";
|
|
2
2
|
const resultProps = {
|
|
3
3
|
icon: {
|
|
4
4
|
type: String,
|
|
@@ -13,6 +13,10 @@ const resultProps = {
|
|
|
13
13
|
default: ""
|
|
14
14
|
}
|
|
15
15
|
};
|
|
16
|
+
function isUrl(value) {
|
|
17
|
+
return /^((http|https):)?\/\//.test(value);
|
|
18
|
+
}
|
|
19
|
+
const DEFAULT_PREFIX = "icon";
|
|
16
20
|
const iconProps = {
|
|
17
21
|
name: {
|
|
18
22
|
type: String,
|
|
@@ -20,43 +24,135 @@ const iconProps = {
|
|
|
20
24
|
required: true
|
|
21
25
|
},
|
|
22
26
|
size: {
|
|
23
|
-
type: String,
|
|
27
|
+
type: [Number, String],
|
|
24
28
|
default: "inherit"
|
|
25
29
|
},
|
|
26
30
|
color: {
|
|
27
31
|
type: String,
|
|
28
32
|
default: "inherit"
|
|
29
33
|
},
|
|
34
|
+
component: {
|
|
35
|
+
type: Object,
|
|
36
|
+
default: null
|
|
37
|
+
},
|
|
30
38
|
classPrefix: {
|
|
31
39
|
type: String,
|
|
32
|
-
default:
|
|
40
|
+
default: DEFAULT_PREFIX
|
|
33
41
|
}
|
|
34
42
|
};
|
|
43
|
+
const svgIconProps = {
|
|
44
|
+
name: {
|
|
45
|
+
type: String,
|
|
46
|
+
default: "",
|
|
47
|
+
required: true
|
|
48
|
+
},
|
|
49
|
+
color: {
|
|
50
|
+
type: String,
|
|
51
|
+
default: "inherit"
|
|
52
|
+
},
|
|
53
|
+
size: {
|
|
54
|
+
type: [Number, String],
|
|
55
|
+
default: "inherit"
|
|
56
|
+
}
|
|
57
|
+
};
|
|
58
|
+
function createBem(namespace, element, modifier) {
|
|
59
|
+
let cls = namespace;
|
|
60
|
+
if (element) {
|
|
61
|
+
cls += `__${element}`;
|
|
62
|
+
}
|
|
63
|
+
if (modifier) {
|
|
64
|
+
cls += `--${modifier}`;
|
|
65
|
+
}
|
|
66
|
+
return cls;
|
|
67
|
+
}
|
|
68
|
+
function useNamespace(block, needDot = false) {
|
|
69
|
+
const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
|
|
70
|
+
const b = () => createBem(namespace);
|
|
71
|
+
const e = (element) => element ? createBem(namespace, element) : "";
|
|
72
|
+
const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
|
|
73
|
+
const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
|
|
74
|
+
return {
|
|
75
|
+
b,
|
|
76
|
+
e,
|
|
77
|
+
m,
|
|
78
|
+
em
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
var icon = "";
|
|
82
|
+
var svgIcon = defineComponent({
|
|
83
|
+
name: "DSvgIcon",
|
|
84
|
+
props: svgIconProps,
|
|
85
|
+
setup(props) {
|
|
86
|
+
const {
|
|
87
|
+
name,
|
|
88
|
+
color,
|
|
89
|
+
size
|
|
90
|
+
} = toRefs(props);
|
|
91
|
+
const ns = useNamespace("svg-icon");
|
|
92
|
+
const iconName = computed(() => `#icon-${name.value}`);
|
|
93
|
+
const iconSize = computed(() => {
|
|
94
|
+
return typeof size.value === "number" ? `${size.value}px` : size.value;
|
|
95
|
+
});
|
|
96
|
+
const styles = {
|
|
97
|
+
width: iconSize.value,
|
|
98
|
+
height: iconSize.value
|
|
99
|
+
};
|
|
100
|
+
return () => {
|
|
101
|
+
return createVNode("svg", {
|
|
102
|
+
"class": ns.b(),
|
|
103
|
+
"style": styles
|
|
104
|
+
}, [createVNode("use", {
|
|
105
|
+
"xlink:href": iconName.value,
|
|
106
|
+
"fill": color.value
|
|
107
|
+
}, null)]);
|
|
108
|
+
};
|
|
109
|
+
}
|
|
110
|
+
});
|
|
35
111
|
var Icon = defineComponent({
|
|
36
112
|
name: "DIcon",
|
|
37
113
|
props: iconProps,
|
|
38
|
-
setup(props
|
|
114
|
+
setup(props, {
|
|
115
|
+
attrs
|
|
116
|
+
}) {
|
|
39
117
|
const {
|
|
118
|
+
component,
|
|
40
119
|
name,
|
|
41
120
|
size,
|
|
42
121
|
color,
|
|
43
122
|
classPrefix
|
|
44
123
|
} = toRefs(props);
|
|
45
|
-
|
|
46
|
-
|
|
124
|
+
const IconComponent = component.value ? resolveDynamicComponent(component.value) : resolveDynamicComponent(svgIcon);
|
|
125
|
+
const iconSize = computed(() => {
|
|
126
|
+
return typeof size.value === "number" ? `${size.value}px` : size.value;
|
|
127
|
+
});
|
|
128
|
+
const svgIconDom = () => {
|
|
129
|
+
return createVNode(IconComponent, mergeProps({
|
|
130
|
+
"name": name.value,
|
|
131
|
+
"color": color.value,
|
|
132
|
+
"size": iconSize.value
|
|
133
|
+
}, attrs), null);
|
|
134
|
+
};
|
|
135
|
+
const imgIconDom = () => {
|
|
136
|
+
return createVNode("img", mergeProps({
|
|
47
137
|
"src": name.value,
|
|
48
138
|
"alt": name.value.split("/")[name.value.split("/").length - 1],
|
|
49
139
|
"style": {
|
|
50
|
-
width:
|
|
51
|
-
verticalAlign: "text-bottom"
|
|
140
|
+
width: iconSize.value || ""
|
|
52
141
|
}
|
|
53
|
-
},
|
|
54
|
-
|
|
142
|
+
}, attrs), null);
|
|
143
|
+
};
|
|
144
|
+
const fontIconDom = () => {
|
|
145
|
+
const fontIconClass = /^icon-/.test(name.value) ? name.value : `${classPrefix.value}-${name.value}`;
|
|
146
|
+
return createVNode("i", mergeProps({
|
|
147
|
+
"class": [classPrefix.value, fontIconClass],
|
|
55
148
|
"style": {
|
|
56
|
-
fontSize:
|
|
149
|
+
fontSize: iconSize.value,
|
|
57
150
|
color: color.value
|
|
58
151
|
}
|
|
59
|
-
}, null);
|
|
152
|
+
}, attrs), null);
|
|
153
|
+
};
|
|
154
|
+
return () => {
|
|
155
|
+
return component.value ? svgIconDom() : isUrl(name.value) ? imgIconDom() : fontIconDom();
|
|
60
156
|
};
|
|
61
157
|
}
|
|
62
158
|
});
|
package/result/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(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";const f={icon:{type:String,default:"info"},title:{type:String,default:""},desc:{type:String,default:""}};function m(o){return/^((http|https):)?\/\//.test(o)}const v={name:{type:String,default:"",required:!0},size:{type:[Number,String],default:"inherit"},color:{type:String,default:"inherit"},component:{type:Object,default:null},classPrefix:{type:String,default:"icon"}},g={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};function d(o,n,s){let t=o;return n&&(t+=`__${n}`),s&&(t+=`--${s}`),t}function y(o,n=!1){const s=n?`.devui-${o}`:`devui-${o}`;return{b:()=>d(s),e:l=>l?d(s,l):"",m:l=>l?d(s,"",l):"",em:(l,c)=>l&&c?d(s,l,c):""}}var $="",h=e.defineComponent({name:"DSvgIcon",props:g,setup(o){const{name:n,color:s,size:t}=e.toRefs(o),i=y("svg-icon"),a=e.computed(()=>`#icon-${n.value}`),u=e.computed(()=>typeof t.value=="number"?`${t.value}px`:t.value),l={width:u.value,height:u.value};return()=>e.createVNode("svg",{class:i.b(),style:l},[e.createVNode("use",{"xlink:href":a.value,fill:s.value},null)])}}),S=e.defineComponent({name:"DIcon",props:v,setup(o,{attrs:n}){const{component:s,name:t,size:i,color:a,classPrefix:u}=e.toRefs(o),l=s.value?e.resolveDynamicComponent(s.value):e.resolveDynamicComponent(h),c=e.computed(()=>typeof i.value=="number"?`${i.value}px`:i.value),_=()=>e.createVNode(l,e.mergeProps({name:t.value,color:a.value,size:c.value},n),null),D=()=>e.createVNode("img",e.mergeProps({src:t.value,alt:t.value.split("/")[t.value.split("/").length-1],style:{width:c.value||""}},n),null),P=()=>{const V=/^icon-/.test(t.value)?t.value:`${u.value}-${t.value}`;return e.createVNode("i",e.mergeProps({class:[u.value,V],style:{fontSize:c.value,color:a.value}},n),null)};return()=>s.value?_():m(t.value)?D():P()}}),b="",p=e.defineComponent({name:"DResult",props:f,setup(o,n){let s;return function(t){t.success="right-o",t.danger="error-o",t.warning="warning-o",t.info="info-o"}(s||(s={})),()=>{var t,i,a,u;return e.createVNode("div",{class:"devui-result"},[n.slots.icon?e.createVNode("div",null,[(t=n.slots)==null?void 0:t.icon()]):e.createVNode(S,{name:s[o.icon]||"",class:`devui-result__icon-${o.icon}`,size:"64px"},null),e.createVNode("div",{class:"devui-result__title"},[n.slots.title?(i=n.slots)==null?void 0:i.title():o.title]),e.createVNode("div",{class:"devui-result__desc"},[n.slots.desc?(a=n.slots)==null?void 0:a.desc():o.desc]),e.createVNode("div",{class:"devui-result__extra"},[n.slots.extra?(u=n.slots)==null?void 0:u.extra():""])])}}}),N={title:"Result \u7ED3\u679C",category:"\u53CD\u9988",status:"100%",install(o){o.component(p.name,p)}};r.Result=p,r.default=N,r.resultProps=f,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});
|
package/result/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.devui-result{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;box-sizing:border-box;padding:30px}.devui-result__icon-success:before{color:var(--devui-success, #50d4ab)}.devui-result__icon-danger:before{color:var(--devui-danger, #f66f6a)}.devui-result__icon-warning:before{color:var(--devui-warning, #fac20a)}.devui-result__icon-info:before{color:var(--devui-info, #5e7ce0)}.devui-result__title{margin-top:20px;color:var(--devui-text, #252b3a);font-size:var(--devui-font-size-lg, 14px)}.devui-result__desc{margin-top:10px;color:var(--devui-text-weak, #575d6c);font-size:var(--devui-font-size-md, 12px)}.devui-result__extra{margin-top:30px}
|
|
1
|
+
.devui-svg-icon{vertical-align:middle}.devui-result{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;box-sizing:border-box;padding:30px}.devui-result__icon-success:before{color:var(--devui-success, #50d4ab)}.devui-result__icon-danger:before{color:var(--devui-danger, #f66f6a)}.devui-result__icon-warning:before{color:var(--devui-warning, #fac20a)}.devui-result__icon-info:before{color:var(--devui-info, #5e7ce0)}.devui-result__title{margin-top:20px;color:var(--devui-text, #252b3a);font-size:var(--devui-font-size-lg, 14px)}.devui-result__desc{margin-top:10px;color:var(--devui-text-weak, #575d6c);font-size:var(--devui-font-size-md, 12px)}.devui-result__extra{margin-top:30px}
|