ele-admin-plus 1.1.7-beta.2 → 1.1.7-beta.4
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/es/ele-app/style/common/index.scss +3 -3
- package/es/ele-app/style/overwrite/cascader/index.scss +57 -7
- package/es/ele-app/style/overwrite/css-var.scss +2 -0
- package/es/ele-app/style/overwrite/index.js +1 -0
- package/es/ele-app/style/overwrite/index.scss +1 -0
- package/es/ele-app/style/overwrite/input/css-var.scss +31 -0
- package/es/ele-app/style/overwrite/input/index.js +1 -0
- package/es/ele-app/style/overwrite/input/index.scss +456 -0
- package/es/ele-app/style/overwrite/select/index.scss +53 -10
- package/es/ele-basic-select/index.d.ts +10 -4
- package/es/ele-basic-select/index.js +36 -35
- package/es/ele-basic-select/props.d.ts +6 -0
- package/es/ele-basic-select/props.js +7 -1
- package/es/ele-basic-select/style/css-var.scss +9 -0
- package/es/ele-basic-select/style/index.scss +137 -49
- package/es/ele-data-table/style/index.scss +10 -6
- package/es/ele-icon-select/index.d.ts +6 -2
- package/es/ele-icon-select/index.js +4 -1
- package/es/ele-icon-select/props.d.ts +4 -0
- package/es/ele-icon-select/props.js +4 -0
- package/es/ele-icon-select/style/index.scss +4 -0
- package/es/ele-menus/style/index.scss +1 -1
- package/es/ele-split-panel/style/index.scss +7 -6
- package/es/ele-table-select/index.d.ts +10 -6
- package/es/ele-table-select/index.js +3 -1
- package/es/ele-table-select/props.d.ts +4 -0
- package/es/ele-table-select/props.js +4 -0
- package/es/ele-tree-select/index.d.ts +11 -7
- package/es/ele-tree-select/index.js +3 -1
- package/es/ele-tree-select/props.d.ts +4 -0
- package/es/ele-tree-select/props.js +5 -1
- package/es/ele-virtual-table/style/index.scss +8 -4
- package/es/icons/ArrowDown.js +5 -3
- package/es/icons/ArrowRight.js +4 -2
- package/es/icons/CloseOutlined.d.ts +2 -0
- package/es/icons/CloseOutlined.js +40 -0
- package/es/icons/index.d.ts +1 -0
- package/es/icons/index.js +26 -24
- package/es/style/themes/default.scss +74 -1
- package/es/style/themes/theme-util.scss +2 -0
- package/lib/ele-app/style/common/index.scss +3 -3
- package/lib/ele-app/style/overwrite/cascader/index.scss +57 -7
- package/lib/ele-app/style/overwrite/css-var.scss +2 -0
- package/lib/ele-app/style/overwrite/index.cjs +1 -0
- package/lib/ele-app/style/overwrite/index.scss +1 -0
- package/lib/ele-app/style/overwrite/input/css-var.scss +31 -0
- package/lib/ele-app/style/overwrite/input/index.cjs +2 -0
- package/lib/ele-app/style/overwrite/input/index.scss +456 -0
- package/lib/ele-app/style/overwrite/select/index.scss +53 -10
- package/lib/ele-basic-select/index.cjs +35 -34
- package/lib/ele-basic-select/index.d.ts +10 -4
- package/lib/ele-basic-select/props.cjs +7 -1
- package/lib/ele-basic-select/props.d.ts +6 -0
- package/lib/ele-basic-select/style/css-var.scss +9 -0
- package/lib/ele-basic-select/style/index.scss +137 -49
- package/lib/ele-data-table/style/index.scss +10 -6
- package/lib/ele-icon-select/index.cjs +4 -1
- package/lib/ele-icon-select/index.d.ts +6 -2
- package/lib/ele-icon-select/props.cjs +4 -0
- package/lib/ele-icon-select/props.d.ts +4 -0
- package/lib/ele-icon-select/style/index.scss +4 -0
- package/lib/ele-menus/style/index.scss +1 -1
- package/lib/ele-split-panel/style/index.scss +7 -6
- package/lib/ele-table-select/index.cjs +3 -1
- package/lib/ele-table-select/index.d.ts +10 -6
- package/lib/ele-table-select/props.cjs +4 -0
- package/lib/ele-table-select/props.d.ts +4 -0
- package/lib/ele-tree-select/index.cjs +3 -1
- package/lib/ele-tree-select/index.d.ts +11 -7
- package/lib/ele-tree-select/props.cjs +5 -1
- package/lib/ele-tree-select/props.d.ts +4 -0
- package/lib/ele-virtual-table/style/index.scss +8 -4
- package/lib/icons/ArrowDown.cjs +5 -3
- package/lib/icons/ArrowRight.cjs +4 -2
- package/lib/icons/CloseOutlined.cjs +39 -0
- package/lib/icons/CloseOutlined.d.ts +2 -0
- package/lib/icons/index.cjs +2 -0
- package/lib/icons/index.d.ts +1 -0
- package/lib/style/themes/default.scss +74 -1
- package/lib/style/themes/theme-util.scss +2 -0
- package/package.json +1 -4
|
@@ -18,17 +18,20 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
18
18
|
tagType: import("vue").PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, "" | "success" | "warning" | "info" | "danger", unknown> | undefined>;
|
|
19
19
|
automaticDropdown: BooleanConstructor;
|
|
20
20
|
filterable: BooleanConstructor;
|
|
21
|
-
visible: BooleanConstructor;
|
|
21
|
+
visible: BooleanConstructor;
|
|
22
22
|
teleported: BooleanConstructor;
|
|
23
23
|
persistent: BooleanConstructor;
|
|
24
24
|
placement: import("vue").PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
|
|
25
25
|
transition: {
|
|
26
|
-
type: StringConstructor;
|
|
26
|
+
type: StringConstructor;
|
|
27
27
|
default: string;
|
|
28
28
|
};
|
|
29
29
|
popperOptions: import("vue").PropType<Partial<import("element-plus").Options> | undefined>;
|
|
30
30
|
popperClass: StringConstructor;
|
|
31
31
|
popperWidth: (StringConstructor | NumberConstructor)[];
|
|
32
|
+
selectClass: StringConstructor;
|
|
33
|
+
selectStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
34
|
+
inputStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
32
35
|
}, {
|
|
33
36
|
tooltipRef: import("vue").Ref<EleTooltipInstance>;
|
|
34
37
|
inputRef: import("vue").Ref<ElInputInstance>;
|
|
@@ -74,17 +77,20 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
74
77
|
tagType: import("vue").PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, "" | "success" | "warning" | "info" | "danger", unknown> | undefined>;
|
|
75
78
|
automaticDropdown: BooleanConstructor;
|
|
76
79
|
filterable: BooleanConstructor;
|
|
77
|
-
visible: BooleanConstructor;
|
|
80
|
+
visible: BooleanConstructor;
|
|
78
81
|
teleported: BooleanConstructor;
|
|
79
82
|
persistent: BooleanConstructor;
|
|
80
83
|
placement: import("vue").PropType<import("element-plus/es/utils/index").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
|
|
81
84
|
transition: {
|
|
82
|
-
type: StringConstructor;
|
|
85
|
+
type: StringConstructor;
|
|
83
86
|
default: string;
|
|
84
87
|
};
|
|
85
88
|
popperOptions: import("vue").PropType<Partial<import("element-plus").Options> | undefined>;
|
|
86
89
|
popperClass: StringConstructor;
|
|
87
90
|
popperWidth: (StringConstructor | NumberConstructor)[];
|
|
91
|
+
selectClass: StringConstructor;
|
|
92
|
+
selectStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
93
|
+
inputStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
88
94
|
}>> & {
|
|
89
95
|
onFocus?: ((_e: FocusEvent) => any) | undefined;
|
|
90
96
|
onBlur?: ((_e: FocusEvent) => any) | undefined;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import { defineComponent, ref, computed, watch, resolveComponent, openBlock, createBlock, withCtx, createElementBlock, renderSlot, createCommentVNode, createElementVNode, normalizeClass, createVNode, createSlots, withModifiers, Fragment, renderList, createTextVNode, toDisplayString } from "vue";
|
|
2
|
-
import { CircleClose, ArrowDown } from "@element-plus/icons-vue";
|
|
1
|
+
import { defineComponent, ref, computed, watch, resolveComponent, openBlock, createBlock, withCtx, createElementBlock, renderSlot, createCommentVNode, createElementVNode, normalizeClass, normalizeStyle, createVNode, createSlots, withModifiers, Fragment, renderList, createTextVNode, toDisplayString } from "vue";
|
|
3
2
|
import { ElInput, ElIcon, ElTag } from "element-plus";
|
|
4
3
|
import { useLicense } from "../ele-config-provider/receiver";
|
|
5
4
|
import EleTooltip from "../ele-tooltip/index";
|
|
5
|
+
import { CloseOutlined, ArrowDown } from "../icons";
|
|
6
6
|
import { basicSelectProps, basicSelectEmits } from "./props";
|
|
7
7
|
const _sfc_main = defineComponent({
|
|
8
8
|
name: "EleBasicSelect",
|
|
9
9
|
components: {
|
|
10
|
-
CircleClose,
|
|
11
|
-
ArrowDown,
|
|
12
10
|
ElInput,
|
|
13
11
|
ElIcon,
|
|
14
12
|
ElTag,
|
|
15
|
-
EleTooltip
|
|
13
|
+
EleTooltip,
|
|
14
|
+
CloseOutlined,
|
|
15
|
+
ArrowDown
|
|
16
16
|
},
|
|
17
17
|
props: basicSelectProps,
|
|
18
18
|
emits: basicSelectEmits,
|
|
@@ -157,13 +157,12 @@ const _export_sfc = (sfc, props) => {
|
|
|
157
157
|
}
|
|
158
158
|
return target;
|
|
159
159
|
};
|
|
160
|
-
const _hoisted_1 = {
|
|
161
|
-
const _hoisted_2 = {
|
|
160
|
+
const _hoisted_1 = {
|
|
162
161
|
key: 0,
|
|
163
162
|
class: "ele-select-tags"
|
|
164
163
|
};
|
|
165
164
|
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
166
|
-
const
|
|
165
|
+
const _component_CloseOutlined = resolveComponent("CloseOutlined");
|
|
167
166
|
const _component_ElIcon = resolveComponent("ElIcon");
|
|
168
167
|
const _component_ArrowDown = resolveComponent("ArrowDown");
|
|
169
168
|
const _component_ElInput = resolveComponent("ElInput");
|
|
@@ -199,6 +198,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
199
198
|
createElementVNode("div", {
|
|
200
199
|
class: normalizeClass([
|
|
201
200
|
"ele-select",
|
|
201
|
+
_ctx.selectClass,
|
|
202
202
|
{ "is-empty": _ctx.isEmpty },
|
|
203
203
|
{ "is-multiple": _ctx.multiple },
|
|
204
204
|
{ "is-disabled": _ctx.disabled },
|
|
@@ -206,7 +206,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
206
206
|
{ "is-small": _ctx.size === "small" },
|
|
207
207
|
{ "is-large": _ctx.size === "large" },
|
|
208
208
|
{ "is-opened": _ctx.visible }
|
|
209
|
-
])
|
|
209
|
+
]),
|
|
210
|
+
style: normalizeStyle(_ctx.selectStyle)
|
|
210
211
|
}, [
|
|
211
212
|
createVNode(_component_ElInput, {
|
|
212
213
|
ref: "inputRef",
|
|
@@ -216,33 +217,32 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
216
217
|
modelValue: _ctx.inputValue,
|
|
217
218
|
placeholder: _ctx.filterable && _ctx.multiple && _ctx.visible ? "" : _ctx.inputPlaceholder,
|
|
218
219
|
readonly: !_ctx.filterable || !_ctx.visible || _ctx.multiple,
|
|
220
|
+
style: normalizeStyle(_ctx.inputStyle),
|
|
219
221
|
"onUpdate:modelValue": _ctx.updateInputValue,
|
|
220
222
|
onFocus: _ctx.onInputFocus,
|
|
221
223
|
onBlur: _ctx.onInputBlur
|
|
222
224
|
}, createSlots({
|
|
223
225
|
suffix: withCtx(() => [
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
})
|
|
245
|
-
])
|
|
226
|
+
_ctx.clearable && !_ctx.disabled && !_ctx.isEmpty ? (openBlock(), createBlock(_component_ElIcon, {
|
|
227
|
+
key: 0,
|
|
228
|
+
class: "ele-select-clear el-input__icon",
|
|
229
|
+
onClick: withModifiers(_ctx.onClear, ["stop"])
|
|
230
|
+
}, {
|
|
231
|
+
default: withCtx(() => [
|
|
232
|
+
renderSlot(_ctx.$slots, "clearIcon", {}, () => [
|
|
233
|
+
createVNode(_component_CloseOutlined)
|
|
234
|
+
])
|
|
235
|
+
]),
|
|
236
|
+
_: 3
|
|
237
|
+
}, 8, ["onClick"])) : createCommentVNode("", true),
|
|
238
|
+
createVNode(_component_ElIcon, { class: "ele-select-arrow el-input__icon" }, {
|
|
239
|
+
default: withCtx(() => [
|
|
240
|
+
renderSlot(_ctx.$slots, "suffixIcon", { visible: _ctx.visible }, () => [
|
|
241
|
+
createVNode(_component_ArrowDown)
|
|
242
|
+
])
|
|
243
|
+
]),
|
|
244
|
+
_: 3
|
|
245
|
+
})
|
|
246
246
|
]),
|
|
247
247
|
_: 2
|
|
248
248
|
}, [
|
|
@@ -253,8 +253,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
253
253
|
]),
|
|
254
254
|
key: "0"
|
|
255
255
|
} : void 0
|
|
256
|
-
]), 1032, ["size", "disabled", "modelValue", "placeholder", "readonly", "onUpdate:modelValue", "onFocus", "onBlur"]),
|
|
257
|
-
_ctx.multiple ? (openBlock(), createElementBlock("div",
|
|
256
|
+
]), 1032, ["size", "disabled", "modelValue", "placeholder", "readonly", "style", "onUpdate:modelValue", "onFocus", "onBlur"]),
|
|
257
|
+
_ctx.multiple ? (openBlock(), createElementBlock("div", _hoisted_1, [
|
|
258
258
|
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.currentTags, (item, index2) => {
|
|
259
259
|
return openBlock(), createBlock(_component_ElTag, {
|
|
260
260
|
key: index2 + "-" + item.value,
|
|
@@ -300,16 +300,17 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
300
300
|
default: withCtx(() => [
|
|
301
301
|
createVNode(_component_ElInput, {
|
|
302
302
|
ref: "searchRef",
|
|
303
|
+
size: _ctx.size,
|
|
303
304
|
validateEvent: false,
|
|
304
305
|
modelValue: _ctx.searchValue,
|
|
305
306
|
placeholder: _ctx.inputPlaceholder,
|
|
306
307
|
"onUpdate:modelValue": _ctx.updateSearchValue
|
|
307
|
-
}, null, 8, ["modelValue", "placeholder", "onUpdate:modelValue"])
|
|
308
|
+
}, null, 8, ["size", "modelValue", "placeholder", "onUpdate:modelValue"])
|
|
308
309
|
]),
|
|
309
310
|
_: 1
|
|
310
311
|
}, 8, ["size"])) : createCommentVNode("", true)
|
|
311
312
|
])) : createCommentVNode("", true)
|
|
312
|
-
],
|
|
313
|
+
], 6)
|
|
313
314
|
]),
|
|
314
315
|
_: 3
|
|
315
316
|
}, 8, ["visible", "disabled", "placement", "teleported", "width", "popperClass", "popperOptions", "transition", "gpuAcceleration", "onUpdate:visible"]);
|
|
@@ -52,6 +52,12 @@ export declare const basicSelectProps: {
|
|
|
52
52
|
popperClass: StringConstructor;
|
|
53
53
|
/** 下拉框宽度 */
|
|
54
54
|
popperWidth: (StringConstructor | NumberConstructor)[];
|
|
55
|
+
/** 自定义类名 */
|
|
56
|
+
selectClass: StringConstructor;
|
|
57
|
+
/** 自定义样式 */
|
|
58
|
+
selectStyle: PropType<Partial<import("vue").CSSProperties>>;
|
|
59
|
+
/** 自定义输入框样式 */
|
|
60
|
+
inputStyle: PropType<Partial<import("vue").CSSProperties>>;
|
|
55
61
|
};
|
|
56
62
|
export type BasicSelectProps = ExtractPropTypes<typeof basicSelectProps>;
|
|
57
63
|
/**
|
|
@@ -48,7 +48,13 @@ const basicSelectProps = {
|
|
|
48
48
|
/** 下拉框类名 */
|
|
49
49
|
popperClass: String,
|
|
50
50
|
/** 下拉框宽度 */
|
|
51
|
-
popperWidth: [Number, String]
|
|
51
|
+
popperWidth: [Number, String],
|
|
52
|
+
/** 自定义类名 */
|
|
53
|
+
selectClass: String,
|
|
54
|
+
/** 自定义样式 */
|
|
55
|
+
selectStyle: Object,
|
|
56
|
+
/** 自定义输入框样式 */
|
|
57
|
+
inputStyle: Object
|
|
52
58
|
};
|
|
53
59
|
const basicSelectEmits = {
|
|
54
60
|
/** 更新下拉框显示状态 */
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
@use '../../style/themes/default.scss' as *;
|
|
2
2
|
@use '../../style/util.scss' as *;
|
|
3
|
+
@use './css-var.scss' as *;
|
|
4
|
+
|
|
5
|
+
@include set-basic-select-var($ele);
|
|
3
6
|
|
|
4
7
|
.ele-select {
|
|
5
8
|
width: 100%;
|
|
@@ -7,57 +10,91 @@
|
|
|
7
10
|
cursor: pointer;
|
|
8
11
|
|
|
9
12
|
& > .el-input,
|
|
10
|
-
& > .el-input .el-input__wrapper,
|
|
11
|
-
& > .el-input .el-input__inner {
|
|
13
|
+
& > .el-input > .el-input__wrapper,
|
|
14
|
+
& > .el-input > .el-input__wrapper > .el-input__inner {
|
|
12
15
|
cursor: inherit;
|
|
13
16
|
}
|
|
14
17
|
|
|
15
|
-
.el-input__prefix-inner {
|
|
16
|
-
color: elVar('input', 'text-color');
|
|
17
|
-
}
|
|
18
|
-
|
|
19
18
|
&.is-filterable {
|
|
20
19
|
cursor: text;
|
|
21
20
|
}
|
|
22
21
|
|
|
23
|
-
/*
|
|
24
|
-
.
|
|
25
|
-
|
|
26
|
-
|
|
22
|
+
/* 输入框 */
|
|
23
|
+
& > .el-input > .el-input__wrapper {
|
|
24
|
+
border: eleVar('input', 'border');
|
|
25
|
+
background: eleVar('input', 'bg');
|
|
26
|
+
transition: all $ele-transition;
|
|
27
|
+
box-sizing: border-box;
|
|
28
|
+
position: relative;
|
|
29
|
+
box-shadow: none;
|
|
27
30
|
}
|
|
28
31
|
|
|
29
|
-
.
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
32
|
+
&:hover > .el-input > .el-input__wrapper {
|
|
33
|
+
border: eleVar('input', 'hover-border');
|
|
34
|
+
background: eleVar('input', 'hover-bg');
|
|
35
|
+
box-shadow: eleVar('input', 'hover-shadow');
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
& > .el-input > .el-input__wrapper.is-focus,
|
|
39
|
+
&.is-opened > .el-input > .el-input__wrapper {
|
|
40
|
+
border: eleVar('input', 'focus-border');
|
|
41
|
+
background: eleVar('input', 'focus-bg');
|
|
42
|
+
box-shadow: eleVar('input', 'focus-shadow');
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/* 图标 */
|
|
46
|
+
& > .el-input > .el-input__wrapper .el-input__icon {
|
|
47
|
+
color: eleVar('input', 'icon-color');
|
|
48
|
+
font-size: eleVar('input', 'icon-size');
|
|
49
|
+
transition: all $ele-transition;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
& > .el-input .el-input__prefix-inner .el-input__icon {
|
|
53
|
+
margin-right: eleVar('input', 'icon-space');
|
|
34
54
|
}
|
|
35
55
|
|
|
36
|
-
.
|
|
37
|
-
|
|
56
|
+
& > .el-input .el-input__suffix-inner .el-input__icon {
|
|
57
|
+
margin-left: eleVar('input', 'icon-space');
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
/* 箭头和清空图标 */
|
|
61
|
+
& > .el-input .el-input__icon.ele-select-clear,
|
|
62
|
+
& > .el-input .el-input__icon.ele-select-arrow {
|
|
63
|
+
margin: eleVar('input', 'clear-margin');
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
& > .el-input .el-input__icon.ele-select-clear {
|
|
67
|
+
color: elVar('bg-color', 'overlay');
|
|
68
|
+
font-size: eleVar('input', 'clear-size');
|
|
69
|
+
background: eleVar('input', 'clear-color');
|
|
70
|
+
border-radius: 50%;
|
|
38
71
|
cursor: pointer;
|
|
72
|
+
|
|
73
|
+
&:hover {
|
|
74
|
+
background: eleVar('input', 'clear-hover-color');
|
|
75
|
+
}
|
|
39
76
|
}
|
|
40
77
|
|
|
41
78
|
.ele-select-clear,
|
|
42
|
-
&:hover .ele-select-clear + .ele-select-arrow
|
|
79
|
+
&:hover .ele-select-clear + .ele-select-arrow,
|
|
80
|
+
&:hover .ele-select-clear + .ele-select-arrow + .el-input__validateIcon {
|
|
43
81
|
display: none;
|
|
44
82
|
}
|
|
45
83
|
|
|
46
84
|
&:hover .ele-select-clear {
|
|
47
|
-
display:
|
|
85
|
+
display: flex;
|
|
48
86
|
}
|
|
49
87
|
|
|
50
|
-
|
|
51
|
-
|
|
88
|
+
.ele-select-arrow > svg > path {
|
|
89
|
+
transition: d $ele-transition;
|
|
52
90
|
}
|
|
53
91
|
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
box-shadow: 0 0 0 1px elVar('input', 'hover-border-color') inset;
|
|
92
|
+
&.is-opened .ele-select-arrow > svg > path {
|
|
93
|
+
#{'d'}: path('M10 31 24 17 38 31');
|
|
57
94
|
}
|
|
58
95
|
|
|
59
|
-
|
|
60
|
-
|
|
96
|
+
.ele-select-arrow > svg > path {
|
|
97
|
+
stroke-width: 4;
|
|
61
98
|
}
|
|
62
99
|
|
|
63
100
|
/* 多选 */
|
|
@@ -73,20 +110,12 @@
|
|
|
73
110
|
width: 100%;
|
|
74
111
|
height: 100%;
|
|
75
112
|
|
|
76
|
-
.el-input__wrapper,
|
|
77
|
-
.el-input__inner {
|
|
113
|
+
& > .el-input__wrapper,
|
|
114
|
+
& > .el-input__wrapper > .el-input__inner {
|
|
78
115
|
height: 100%;
|
|
79
116
|
box-sizing: border-box;
|
|
80
117
|
}
|
|
81
118
|
}
|
|
82
|
-
|
|
83
|
-
&.is-small {
|
|
84
|
-
min-height: elVar('component-size', 'small');
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
&.large {
|
|
88
|
-
min-height: elVar('component-size', 'large');
|
|
89
|
-
}
|
|
90
119
|
}
|
|
91
120
|
|
|
92
121
|
/* 多选标签 */
|
|
@@ -96,9 +125,9 @@
|
|
|
96
125
|
min-height: inherit;
|
|
97
126
|
box-sizing: border-box;
|
|
98
127
|
padding: 2px 0 2px 4px;
|
|
99
|
-
width: calc(100% -
|
|
128
|
+
width: calc(100% - 22px);
|
|
100
129
|
position: relative;
|
|
101
|
-
z-index:
|
|
130
|
+
z-index: 3;
|
|
102
131
|
|
|
103
132
|
& > .el-tag {
|
|
104
133
|
flex-shrink: 0;
|
|
@@ -109,7 +138,7 @@
|
|
|
109
138
|
}
|
|
110
139
|
|
|
111
140
|
&.is-empty .ele-select-tags {
|
|
112
|
-
padding-left:
|
|
141
|
+
padding-left: 8.8px;
|
|
113
142
|
}
|
|
114
143
|
|
|
115
144
|
/* 多选搜索框 */
|
|
@@ -121,11 +150,13 @@
|
|
|
121
150
|
overflow: hidden;
|
|
122
151
|
background: none;
|
|
123
152
|
display: none;
|
|
153
|
+
font-size: 0;
|
|
124
154
|
|
|
125
155
|
& > .el-tag__content {
|
|
126
156
|
width: 100%;
|
|
127
157
|
height: 100%;
|
|
128
158
|
display: block;
|
|
159
|
+
font-size: 0;
|
|
129
160
|
}
|
|
130
161
|
|
|
131
162
|
.el-input {
|
|
@@ -135,9 +166,9 @@
|
|
|
135
166
|
|
|
136
167
|
.el-input__wrapper {
|
|
137
168
|
height: 100%;
|
|
138
|
-
padding
|
|
139
|
-
padding-right: 0;
|
|
169
|
+
padding: 0 0 0 2px;
|
|
140
170
|
box-sizing: border-box;
|
|
171
|
+
border: none;
|
|
141
172
|
box-shadow: none;
|
|
142
173
|
background: none;
|
|
143
174
|
cursor: inherit;
|
|
@@ -156,33 +187,90 @@
|
|
|
156
187
|
|
|
157
188
|
/* 小尺寸 */
|
|
158
189
|
&.is-small {
|
|
159
|
-
|
|
160
|
-
|
|
190
|
+
&.is-multiple {
|
|
191
|
+
min-height: elVar('component-size', 'small');
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
.ele-select-tags {
|
|
195
|
+
width: calc(100% - 20px);
|
|
161
196
|
|
|
162
197
|
& > .el-tag {
|
|
163
|
-
margin
|
|
164
|
-
|
|
165
|
-
height: calc(elVar('component-size') - 4px - 2px);
|
|
198
|
+
margin: 1px 4px 1px 0;
|
|
199
|
+
height: calc(elVar('component-size', 'small') - 4px - 2px);
|
|
166
200
|
}
|
|
167
201
|
}
|
|
168
202
|
|
|
169
203
|
&.is-empty .ele-select-tags {
|
|
170
|
-
padding-left:
|
|
204
|
+
padding-left: 6.8px;
|
|
171
205
|
}
|
|
172
206
|
}
|
|
173
207
|
|
|
174
208
|
/* 大尺寸 */
|
|
175
|
-
&.is-large
|
|
176
|
-
|
|
209
|
+
&.is-large {
|
|
210
|
+
&.is-multiple {
|
|
211
|
+
min-height: elVar('component-size', 'large');
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
.ele-select-tags {
|
|
215
|
+
padding: 4px 0 4px 6px;
|
|
216
|
+
width: calc(100% - 24px);
|
|
217
|
+
|
|
218
|
+
& > .el-tag {
|
|
219
|
+
height: calc(elVar('component-size', 'large') - 8px - 4px);
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
&.is-empty .ele-select-tags {
|
|
224
|
+
padding-left: 10.8px;
|
|
225
|
+
}
|
|
177
226
|
}
|
|
178
227
|
|
|
179
228
|
/* 禁用 */
|
|
180
229
|
&.is-disabled {
|
|
181
230
|
cursor: not-allowed;
|
|
182
231
|
|
|
232
|
+
& > .el-input.is-disabled > .el-input__wrapper {
|
|
233
|
+
border: eleVar('input', 'disabled-border');
|
|
234
|
+
background: eleVar('input', 'disabled-bg');
|
|
235
|
+
box-shadow: none;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
& > .el-input > .el-input__wrapper > .el-input__inner {
|
|
239
|
+
color: eleVar('input', 'disabled-color');
|
|
240
|
+
-webkit-text-fill-color: eleVar('input', 'disabled-color');
|
|
241
|
+
}
|
|
242
|
+
|
|
183
243
|
.ele-select-tags > .el-tag {
|
|
184
244
|
color: elVar('disabled', 'text-color');
|
|
185
245
|
background: hsla(0, 0%, 60%, 0.15);
|
|
186
246
|
}
|
|
187
247
|
}
|
|
188
248
|
}
|
|
249
|
+
|
|
250
|
+
/* 表单验证 */
|
|
251
|
+
.el-form-item.is-error {
|
|
252
|
+
.ele-select > .el-input > .el-input__wrapper {
|
|
253
|
+
border: eleVar('input-error', 'border');
|
|
254
|
+
background: eleVar('input-error', 'bg');
|
|
255
|
+
box-shadow: none;
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
.ele-select:hover > .el-input > .el-input__wrapper {
|
|
259
|
+
border: eleVar('input-error', 'hover-border');
|
|
260
|
+
background: eleVar('input-error', 'hover-bg');
|
|
261
|
+
box-shadow: eleVar('input-error', 'hover-shadow');
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
.ele-select > .el-input > .el-input__wrapper.is-focus,
|
|
265
|
+
.ele-select.is-opened > .el-input > .el-input__wrapper {
|
|
266
|
+
border: eleVar('input-error', 'focus-border');
|
|
267
|
+
background: eleVar('input-error', 'focus-bg');
|
|
268
|
+
box-shadow: eleVar('input-error', 'focus-shadow') !important;
|
|
269
|
+
}
|
|
270
|
+
|
|
271
|
+
.ele-select.is-disabled > .el-input > .el-input__wrapper {
|
|
272
|
+
border: eleVar('input-error', 'disabled-border');
|
|
273
|
+
background: eleVar('input-error', 'disabled-bg');
|
|
274
|
+
box-shadow: none;
|
|
275
|
+
}
|
|
276
|
+
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
@use '../../style/themes/default.scss' as *;
|
|
2
2
|
@use '../../style/util.scss' as *;
|
|
3
3
|
@use './css-var.scss' as *;
|
|
4
|
-
$ele-filter-path: '
|
|
5
|
-
$ele-expand-path: '
|
|
4
|
+
$ele-filter-path: 'M349 838c0 17 14 32 31 32h262c17 0 31-14 31-32V642H349v196ZM880 154H143c-24 0-39 26-27 48l221 376h348l221-376c12-21-3-48-27-48' !default;
|
|
5
|
+
$ele-expand-path: 'M362 811 662 512 362 213' !default;
|
|
6
6
|
|
|
7
7
|
@include set-data-table-var($ele);
|
|
8
8
|
@include table-var-style('body .ele-data-table.el-table');
|
|
@@ -201,9 +201,9 @@ $ele-expand-path: 'M605.08 512.14L338.35 245.27l51.76-51.68 318.41 318.58L390.09
|
|
|
201
201
|
/* 展开按钮 */
|
|
202
202
|
.ele-table-tr > .el-table__cell > .cell {
|
|
203
203
|
& > .el-table__expand-icon {
|
|
204
|
-
font-size:
|
|
204
|
+
font-size: 14px;
|
|
205
205
|
align-items: center;
|
|
206
|
-
justify-content:
|
|
206
|
+
justify-content: center;
|
|
207
207
|
border-radius: eleVar('table', 'icon-radius');
|
|
208
208
|
transition: (color $ele-transition, background-color $ele-transition);
|
|
209
209
|
transform: none;
|
|
@@ -213,6 +213,10 @@ $ele-expand-path: 'M605.08 512.14L338.35 245.27l51.76-51.68 318.41 318.58L390.09
|
|
|
213
213
|
font-size: inherit;
|
|
214
214
|
|
|
215
215
|
&:not(.is-loading) > svg > path {
|
|
216
|
+
fill: none;
|
|
217
|
+
stroke: currentColor;
|
|
218
|
+
stroke-width: 100;
|
|
219
|
+
stroke-linecap: round;
|
|
216
220
|
#{'d'}: path($ele-expand-path);
|
|
217
221
|
}
|
|
218
222
|
}
|
|
@@ -225,14 +229,14 @@ $ele-expand-path: 'M605.08 512.14L338.35 245.27l51.76-51.68 318.41 318.58L390.09
|
|
|
225
229
|
& > .el-table__expand-icon,
|
|
226
230
|
& > .el-table__indent,
|
|
227
231
|
& > .el-table__placeholder {
|
|
228
|
-
height:
|
|
232
|
+
height: 16px;
|
|
229
233
|
display: inline-flex;
|
|
230
234
|
vertical-align: -3px;
|
|
231
235
|
}
|
|
232
236
|
|
|
233
237
|
& > .el-table__expand-icon,
|
|
234
238
|
& > .el-table__placeholder {
|
|
235
|
-
width:
|
|
239
|
+
width: 16px;
|
|
236
240
|
margin: eleVar('table', 'expand-margin');
|
|
237
241
|
}
|
|
238
242
|
|
|
@@ -38,7 +38,9 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
38
38
|
type: (StringConstructor | NumberConstructor)[];
|
|
39
39
|
default: number;
|
|
40
40
|
};
|
|
41
|
-
|
|
41
|
+
selectStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
42
|
+
inputStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
43
|
+
hideOnSingleTab: BooleanConstructor; /** 下拉框类名 */
|
|
42
44
|
emptyProps: import("vue").PropType<import("../ele-app/el").ElEmptyProps>;
|
|
43
45
|
tooltip: {
|
|
44
46
|
type: BooleanConstructor;
|
|
@@ -121,7 +123,9 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
121
123
|
type: (StringConstructor | NumberConstructor)[];
|
|
122
124
|
default: number;
|
|
123
125
|
};
|
|
124
|
-
|
|
126
|
+
selectStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
127
|
+
inputStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
|
|
128
|
+
hideOnSingleTab: BooleanConstructor; /** 下拉框类名 */
|
|
125
129
|
emptyProps: import("vue").PropType<import("../ele-app/el").ElEmptyProps>;
|
|
126
130
|
tooltip: {
|
|
127
131
|
type: BooleanConstructor;
|
|
@@ -216,6 +216,9 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
216
216
|
popperWidth: _ctx.popperWidth,
|
|
217
217
|
popperOptions: _ctx.popperOptions,
|
|
218
218
|
popperClass: _ctx.selectPopperClass,
|
|
219
|
+
selectClass: "is-icon-select",
|
|
220
|
+
selectStyle: _ctx.selectStyle,
|
|
221
|
+
inputStyle: _ctx.inputStyle,
|
|
219
222
|
selectedLabel: _ctx.modelValue,
|
|
220
223
|
visible: _ctx.selectVisible,
|
|
221
224
|
"onUpdate:visible": _ctx.updateVisible,
|
|
@@ -299,7 +302,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
299
302
|
]),
|
|
300
303
|
key: "0"
|
|
301
304
|
} : void 0
|
|
302
|
-
]), 1032, ["value", "disabled", "size", "clearable", "placeholder", "automaticDropdown", "filterable", "teleported", "persistent", "placement", "transition", "popperWidth", "popperOptions", "popperClass", "selectedLabel", "visible", "onUpdate:visible", "onFilterChange", "onClear", "onFocus", "onBlur"]);
|
|
305
|
+
]), 1032, ["value", "disabled", "size", "clearable", "placeholder", "automaticDropdown", "filterable", "teleported", "persistent", "placement", "transition", "popperWidth", "popperOptions", "popperClass", "selectStyle", "inputStyle", "selectedLabel", "visible", "onUpdate:visible", "onFilterChange", "onClear", "onFocus", "onBlur"]);
|
|
303
306
|
}
|
|
304
307
|
const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
|
|
305
308
|
export {
|
|
@@ -58,6 +58,10 @@ export declare const iconSelectProps: {
|
|
|
58
58
|
type: (StringConstructor | NumberConstructor)[];
|
|
59
59
|
default: number;
|
|
60
60
|
};
|
|
61
|
+
/** 自定义样式 */
|
|
62
|
+
selectStyle: PropType<Partial<import("vue").CSSProperties>>;
|
|
63
|
+
/** 自定义样式 */
|
|
64
|
+
inputStyle: PropType<Partial<import("vue").CSSProperties>>;
|
|
61
65
|
/** 顶部选项卡只有一个时隐藏 */
|
|
62
66
|
hideOnSingleTab: BooleanConstructor;
|
|
63
67
|
/** 空组件属性 */
|