stellar-ui-plus 1.25.8 → 1.25.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.
|
@@ -1,138 +1,138 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "ste-popup",
|
|
3
|
-
"description": "验证码输入",
|
|
4
|
-
"example": "<ste-popup v-model:show='show'></ste-popup>",
|
|
5
|
-
"tutorial": "https://stellar-ui.intecloud.com.cn/?projectName=stellar-ui-plus&menu=%E7%BB%84%E4%BB%B6&active=ste-popup",
|
|
6
|
-
"attributes": [
|
|
7
|
-
{
|
|
8
|
-
"name": "show",
|
|
9
|
-
"description": "是否显示弹出层,使用v-model修饰符来双向绑定",
|
|
10
|
-
"type": "boolean",
|
|
11
|
-
"default": false
|
|
12
|
-
},
|
|
13
|
-
{
|
|
14
|
-
"name": "backgroundColor",
|
|
15
|
-
"description": "内容容器的背景色",
|
|
16
|
-
"type": "string",
|
|
17
|
-
"default": "#ffffff"
|
|
18
|
-
},
|
|
19
|
-
{
|
|
20
|
-
"name": "isMaskClick",
|
|
21
|
-
"description": "是否可以点击遮罩层关闭",
|
|
22
|
-
"type": "boolean",
|
|
23
|
-
"default": true
|
|
24
|
-
},
|
|
25
|
-
{
|
|
26
|
-
"name": "width",
|
|
27
|
-
"description": "内容区宽度",
|
|
28
|
-
"type": "string | number",
|
|
29
|
-
"default": "auto"
|
|
30
|
-
},
|
|
31
|
-
{
|
|
32
|
-
"name": "height",
|
|
33
|
-
"description": "内容区高度",
|
|
34
|
-
"type": "string | number",
|
|
35
|
-
"default": "auto"
|
|
36
|
-
},
|
|
37
|
-
{
|
|
38
|
-
"name": "position",
|
|
39
|
-
"description": "弹出位置",
|
|
40
|
-
"type": "string",
|
|
41
|
-
"values": [
|
|
42
|
-
{
|
|
43
|
-
"name": "center",
|
|
44
|
-
"description": "中"
|
|
45
|
-
},
|
|
46
|
-
{
|
|
47
|
-
"name": "top",
|
|
48
|
-
"description": "上"
|
|
49
|
-
},
|
|
50
|
-
{
|
|
51
|
-
"name": "bottom",
|
|
52
|
-
"description": "下"
|
|
53
|
-
},
|
|
54
|
-
{
|
|
55
|
-
"name": "left",
|
|
56
|
-
"description": "左"
|
|
57
|
-
},
|
|
58
|
-
{
|
|
59
|
-
"name": "right",
|
|
60
|
-
"description": "右"
|
|
61
|
-
}
|
|
62
|
-
],
|
|
63
|
-
"default": "center"
|
|
64
|
-
},
|
|
65
|
-
{
|
|
66
|
-
"name": "round",
|
|
67
|
-
"description": "是否圆角",
|
|
68
|
-
"type": "boolean",
|
|
69
|
-
"default": false
|
|
70
|
-
},
|
|
71
|
-
{
|
|
72
|
-
"name": "showClose",
|
|
73
|
-
"description": "是否右上角显示关闭图标",
|
|
74
|
-
"type": "boolean",
|
|
75
|
-
"default": true
|
|
76
|
-
},
|
|
77
|
-
{
|
|
78
|
-
"name": "offsetX",
|
|
79
|
-
"description": "根据弹出位置,设置X轴偏移量,单位px 默认 0",
|
|
80
|
-
"type": "string | number "
|
|
81
|
-
},
|
|
82
|
-
{
|
|
83
|
-
"name": "offsetY",
|
|
84
|
-
"description": "根据弹出位置,设置Y轴偏移量,单位px 默认 0",
|
|
85
|
-
"type": "string | number"
|
|
86
|
-
},
|
|
87
|
-
{
|
|
88
|
-
"name": "duration",
|
|
89
|
-
"description": "动画持续时间,单位ms",
|
|
90
|
-
"type": "number",
|
|
91
|
-
"default": 200
|
|
92
|
-
},
|
|
93
|
-
{
|
|
94
|
-
"name": "zIndex",
|
|
95
|
-
"description": "弹窗层级z-index",
|
|
96
|
-
"type": "number",
|
|
97
|
-
"default": 998
|
|
98
|
-
},
|
|
99
|
-
{
|
|
100
|
-
"name": "keepContent",
|
|
101
|
-
"description": "隐藏后是否不销毁弹窗内容元素",
|
|
102
|
-
"type": "boolean",
|
|
103
|
-
"default": true
|
|
104
|
-
},
|
|
105
|
-
{
|
|
106
|
-
"name": "[event]close",
|
|
107
|
-
"description": "弹窗关闭前触发,可用于异步拦截关闭",
|
|
108
|
-
"params": [
|
|
109
|
-
{
|
|
110
|
-
"name": "suspend",
|
|
111
|
-
"description": "开启等待的回调函数"
|
|
112
|
-
},
|
|
113
|
-
{
|
|
114
|
-
"name": "next",
|
|
115
|
-
"description": "执行后续关闭操作的回调函数"
|
|
116
|
-
},
|
|
117
|
-
{
|
|
118
|
-
"name": "stop",
|
|
119
|
-
"description": "阻止后续关闭操作的回调函数"
|
|
120
|
-
}
|
|
121
|
-
]
|
|
122
|
-
},
|
|
123
|
-
{
|
|
124
|
-
"name": "[event]open-after",
|
|
125
|
-
"description": "弹窗打开动画执行完毕事件",
|
|
126
|
-
"params": []
|
|
127
|
-
},
|
|
128
|
-
{
|
|
129
|
-
"name": "[event]clickMask",
|
|
130
|
-
"description": "点击遮罩时触发",
|
|
131
|
-
"params": []
|
|
132
|
-
},
|
|
133
|
-
{
|
|
134
|
-
"name": "[slot]default",
|
|
135
|
-
"description": "内容部分插槽"
|
|
136
|
-
}
|
|
137
|
-
]
|
|
138
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "ste-popup",
|
|
3
|
+
"description": "验证码输入",
|
|
4
|
+
"example": "<ste-popup v-model:show='show'></ste-popup>",
|
|
5
|
+
"tutorial": "https://stellar-ui.intecloud.com.cn/?projectName=stellar-ui-plus&menu=%E7%BB%84%E4%BB%B6&active=ste-popup",
|
|
6
|
+
"attributes": [
|
|
7
|
+
{
|
|
8
|
+
"name": "show",
|
|
9
|
+
"description": "是否显示弹出层,使用v-model修饰符来双向绑定",
|
|
10
|
+
"type": "boolean",
|
|
11
|
+
"default": false
|
|
12
|
+
},
|
|
13
|
+
{
|
|
14
|
+
"name": "backgroundColor",
|
|
15
|
+
"description": "内容容器的背景色",
|
|
16
|
+
"type": "string",
|
|
17
|
+
"default": "#ffffff"
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"name": "isMaskClick",
|
|
21
|
+
"description": "是否可以点击遮罩层关闭",
|
|
22
|
+
"type": "boolean",
|
|
23
|
+
"default": true
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
"name": "width",
|
|
27
|
+
"description": "内容区宽度",
|
|
28
|
+
"type": "string | number",
|
|
29
|
+
"default": "auto"
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
"name": "height",
|
|
33
|
+
"description": "内容区高度",
|
|
34
|
+
"type": "string | number",
|
|
35
|
+
"default": "auto"
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"name": "position",
|
|
39
|
+
"description": "弹出位置",
|
|
40
|
+
"type": "string",
|
|
41
|
+
"values": [
|
|
42
|
+
{
|
|
43
|
+
"name": "center",
|
|
44
|
+
"description": "中"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"name": "top",
|
|
48
|
+
"description": "上"
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
"name": "bottom",
|
|
52
|
+
"description": "下"
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
"name": "left",
|
|
56
|
+
"description": "左"
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
"name": "right",
|
|
60
|
+
"description": "右"
|
|
61
|
+
}
|
|
62
|
+
],
|
|
63
|
+
"default": "center"
|
|
64
|
+
},
|
|
65
|
+
{
|
|
66
|
+
"name": "round",
|
|
67
|
+
"description": "是否圆角",
|
|
68
|
+
"type": "boolean",
|
|
69
|
+
"default": false
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
"name": "showClose",
|
|
73
|
+
"description": "是否右上角显示关闭图标",
|
|
74
|
+
"type": "boolean",
|
|
75
|
+
"default": true
|
|
76
|
+
},
|
|
77
|
+
{
|
|
78
|
+
"name": "offsetX",
|
|
79
|
+
"description": "根据弹出位置,设置X轴偏移量,单位px 默认 0",
|
|
80
|
+
"type": "string | number "
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
"name": "offsetY",
|
|
84
|
+
"description": "根据弹出位置,设置Y轴偏移量,单位px 默认 0",
|
|
85
|
+
"type": "string | number"
|
|
86
|
+
},
|
|
87
|
+
{
|
|
88
|
+
"name": "duration",
|
|
89
|
+
"description": "动画持续时间,单位ms",
|
|
90
|
+
"type": "number",
|
|
91
|
+
"default": 200
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
"name": "zIndex",
|
|
95
|
+
"description": "弹窗层级z-index",
|
|
96
|
+
"type": "number",
|
|
97
|
+
"default": 998
|
|
98
|
+
},
|
|
99
|
+
{
|
|
100
|
+
"name": "keepContent",
|
|
101
|
+
"description": "隐藏后是否不销毁弹窗内容元素",
|
|
102
|
+
"type": "boolean",
|
|
103
|
+
"default": true
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
"name": "[event]close",
|
|
107
|
+
"description": "弹窗关闭前触发,可用于异步拦截关闭",
|
|
108
|
+
"params": [
|
|
109
|
+
{
|
|
110
|
+
"name": "suspend",
|
|
111
|
+
"description": "开启等待的回调函数"
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
"name": "next",
|
|
115
|
+
"description": "执行后续关闭操作的回调函数"
|
|
116
|
+
},
|
|
117
|
+
{
|
|
118
|
+
"name": "stop",
|
|
119
|
+
"description": "阻止后续关闭操作的回调函数"
|
|
120
|
+
}
|
|
121
|
+
]
|
|
122
|
+
},
|
|
123
|
+
{
|
|
124
|
+
"name": "[event]open-after",
|
|
125
|
+
"description": "弹窗打开动画执行完毕事件",
|
|
126
|
+
"params": []
|
|
127
|
+
},
|
|
128
|
+
{
|
|
129
|
+
"name": "[event]clickMask",
|
|
130
|
+
"description": "点击遮罩时触发",
|
|
131
|
+
"params": []
|
|
132
|
+
},
|
|
133
|
+
{
|
|
134
|
+
"name": "[slot]default",
|
|
135
|
+
"description": "内容部分插槽"
|
|
136
|
+
}
|
|
137
|
+
]
|
|
138
|
+
}
|
|
@@ -31,6 +31,13 @@ const emits = defineEmits<{
|
|
|
31
31
|
(e: 'update:modelValue', selectedValue: string | number | number[]): void;
|
|
32
32
|
}>();
|
|
33
33
|
|
|
34
|
+
const viewloading = ref(false);
|
|
35
|
+
|
|
36
|
+
const initOptions = (values = selectedValue.value) => {
|
|
37
|
+
const { options } = getDateOptions(values, props.mode as DateMode, props.minDate, props.maxDate);
|
|
38
|
+
setDataOptions(options);
|
|
39
|
+
};
|
|
40
|
+
|
|
34
41
|
watch(
|
|
35
42
|
() => props.modelValue,
|
|
36
43
|
v => {
|
|
@@ -43,17 +50,27 @@ watch(
|
|
|
43
50
|
values = value.map(item => Number(item));
|
|
44
51
|
}
|
|
45
52
|
setSelectValue(values as number[]);
|
|
53
|
+
// modelValue外部变化时,同步刷新dataOptions与selectedIndex,
|
|
54
|
+
// 避免打开下拉时picker仍停留在旧值位置。
|
|
55
|
+
viewloading.value = true;
|
|
56
|
+
initOptions(values);
|
|
57
|
+
nextTick(() => {
|
|
58
|
+
const indexs: number[] = [];
|
|
59
|
+
const _values = getNowDate(values, props.mode as DateMode);
|
|
60
|
+
dataOptions.value.forEach((item, index) => {
|
|
61
|
+
let i = item.map(({ value }) => value).indexOf(_values[index]);
|
|
62
|
+
if (i === -1) {
|
|
63
|
+
i = _values[index] > item[item.length - 1].value ? item.length - 1 : 0;
|
|
64
|
+
}
|
|
65
|
+
indexs.push(i);
|
|
66
|
+
});
|
|
67
|
+
setSelectIndex(indexs);
|
|
68
|
+
viewloading.value = false;
|
|
69
|
+
});
|
|
46
70
|
},
|
|
47
71
|
{ immediate: true }
|
|
48
72
|
);
|
|
49
73
|
|
|
50
|
-
const initOptions = (values = selectedValue.value) => {
|
|
51
|
-
const { options } = getDateOptions(values, props.mode as DateMode, props.minDate, props.maxDate);
|
|
52
|
-
setDataOptions(options);
|
|
53
|
-
};
|
|
54
|
-
|
|
55
|
-
const viewloading = ref(false);
|
|
56
|
-
|
|
57
74
|
const initSelectIndex = (values = selectedValue.value) => {
|
|
58
75
|
viewloading.value = true;
|
|
59
76
|
nextTick(() => {
|
|
@@ -91,9 +108,6 @@ watch([() => props.minDate, () => props.maxDate], () => {
|
|
|
91
108
|
initOptions();
|
|
92
109
|
initSelectIndex();
|
|
93
110
|
});
|
|
94
|
-
|
|
95
|
-
initOptions();
|
|
96
|
-
initSelectIndex();
|
|
97
111
|
</script>
|
|
98
112
|
<template>
|
|
99
113
|
<picker-view v-if="!viewloading" style="height: 450rpx; width: 100%" indicator-style="height: 43px" immediate-change :value="selectedIndex" @change="onChange">
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
## API
|
|
2
|
+
|
|
3
|
+
### Props
|
|
4
|
+
| 属性名 | 说明 | 类型 | 默认值 | 可选值 | 支持版本 |
|
|
5
|
+
| ----- | ----- | --- | ------- | ------ | -------- |
|
|
6
|
+
| `modelValue` | 绑定的值,支持v-model双向绑定 | `string / number / null / undefined` | - | - | - |
|
|
7
|
+
| `list` | 选项数据,每个选项支持 disabled 属性设置单项禁止选择 | `SelectOption[]` | `[]` | - | - |
|
|
8
|
+
| `placeholder` | 占位符 | `string` | `请选择` | - | - |
|
|
9
|
+
| `labelKey` | 选项标签Key | `string` | `label` | - | - |
|
|
10
|
+
| `valueKey` | 选项值Key | `string` | `value` | - | - |
|
|
11
|
+
| `disabled` | 禁用状态 | `boolean` | `false` | - | - |
|
|
12
|
+
| `maskClose` | 点击遮罩层是否关闭弹窗 | `boolean` | `true` | - | - |
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
### Events
|
|
16
|
+
| 事件名 | 说明 | 事件参数 | 支持版本 |
|
|
17
|
+
| ----- | ----- | ------- | -------- |
|
|
18
|
+
| `update:modelValue` | 选中值改变时触发 | `value`:选中的值 | - |
|
|
19
|
+
| `change` | 选中值改变时触发 | `value`:选中的值<br/>`option`:选中的选项对象 | - |
|
|
20
|
+
|
|
21
|
+
|
package/index.ts
CHANGED
|
@@ -120,6 +120,8 @@ import steSearchBox from "./components/ste-search-box/ste-search-box.vue"
|
|
|
120
120
|
export const SteSearchBox = steSearchBox
|
|
121
121
|
import steSelect from "./components/ste-select/ste-select.vue"
|
|
122
122
|
export const SteSelect = steSelect
|
|
123
|
+
import steSelectOrder from "./components/ste-select-order/ste-select-order.vue"
|
|
124
|
+
export const SteSelectOrder = steSelectOrder
|
|
123
125
|
import steSelectSeat from "./components/ste-select-seat/ste-select-seat.vue"
|
|
124
126
|
export const SteSelectSeat = steSelectSeat
|
|
125
127
|
import steSignature from "./components/ste-signature/ste-signature.vue"
|
package/package.json
CHANGED
package/types/components.d.ts
CHANGED
|
@@ -59,6 +59,7 @@ import steScrollToItem from "../components/ste-scroll-to-item/ste-scroll-to-item
|
|
|
59
59
|
import steSearch from "../components/ste-search/ste-search.vue"
|
|
60
60
|
import steSearchBox from "../components/ste-search-box/ste-search-box.vue"
|
|
61
61
|
import steSelect from "../components/ste-select/ste-select.vue"
|
|
62
|
+
import steSelectOrder from "../components/ste-select-order/ste-select-order.vue"
|
|
62
63
|
import steSelectSeat from "../components/ste-select-seat/ste-select-seat.vue"
|
|
63
64
|
import steSignature from "../components/ste-signature/ste-signature.vue"
|
|
64
65
|
import steSimpleCalendar from "../components/ste-simple-calendar/ste-simple-calendar.vue"
|
|
@@ -155,6 +156,7 @@ import steWatermark from "../components/ste-watermark/ste-watermark.vue"
|
|
|
155
156
|
SteSearch: typeof steSearch;
|
|
156
157
|
SteSearchBox: typeof steSearchBox;
|
|
157
158
|
SteSelect: typeof steSelect;
|
|
159
|
+
SteSelectOrder: typeof steSelectOrder;
|
|
158
160
|
SteSelectSeat: typeof steSelectSeat;
|
|
159
161
|
SteSignature: typeof steSignature;
|
|
160
162
|
SteSimpleCalendar: typeof steSimpleCalendar;
|
package/types/refComponents.d.ts
CHANGED
|
@@ -59,6 +59,7 @@ import steScrollToItem from "../components/ste-scroll-to-item/ste-scroll-to-item
|
|
|
59
59
|
import steSearch from "../components/ste-search/ste-search.vue"
|
|
60
60
|
import steSearchBox from "../components/ste-search-box/ste-search-box.vue"
|
|
61
61
|
import steSelect from "../components/ste-select/ste-select.vue"
|
|
62
|
+
import steSelectOrder from "../components/ste-select-order/ste-select-order.vue"
|
|
62
63
|
import steSelectSeat from "../components/ste-select-seat/ste-select-seat.vue"
|
|
63
64
|
import steSignature from "../components/ste-signature/ste-signature.vue"
|
|
64
65
|
import steSimpleCalendar from "../components/ste-simple-calendar/ste-simple-calendar.vue"
|
|
@@ -150,6 +151,7 @@ export type RefScrollToItem = InstanceType<typeof steScrollToItem>
|
|
|
150
151
|
export type RefSearch = InstanceType<typeof steSearch>
|
|
151
152
|
export type RefSearchBox = InstanceType<typeof steSearchBox>
|
|
152
153
|
export type RefSelect = InstanceType<typeof steSelect>
|
|
154
|
+
export type RefSelectOrder = InstanceType<typeof steSelectOrder>
|
|
153
155
|
export type RefSelectSeat = InstanceType<typeof steSelectSeat>
|
|
154
156
|
export type RefSignature = InstanceType<typeof steSignature>
|
|
155
157
|
export type RefSimpleCalendar = InstanceType<typeof steSimpleCalendar>
|