zartui 2.1.26 → 2.1.27
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/index.js +1 -1
- package/es/multiple-picker/MultiplePickerOptions.js +12 -3
- package/es/multiple-picker/index.js +204 -42
- package/lib/index.js +1 -1
- package/lib/multiple-picker/MultiplePickerOptions.js +12 -3
- package/lib/multiple-picker/index.js +204 -42
- package/lib/zart.js +217 -46
- package/lib/zart.min.js +3 -3
- package/package.json +1 -1
package/es/index.js
CHANGED
|
@@ -76,7 +76,7 @@ import TextEllipsis from './text-ellipsis';
|
|
|
76
76
|
import Timeline from './timeline';
|
|
77
77
|
import Toast from './toast';
|
|
78
78
|
import Uploader from './uploader';
|
|
79
|
-
var version = '2.1.
|
|
79
|
+
var version = '2.1.27';
|
|
80
80
|
function install(Vue) {
|
|
81
81
|
var components = [ActionSheet, Area, Avatar, BackTop, Badge, Button, Calendar, Cascader, Cell, CellGroup, Checkbox, CheckboxGroup, Col, Collapse, CollapseItem, CountDown, DatetimePicker, Dialog, Divider, DropdownItem, DropdownMenu, Empty, Field, FoldDialog, Form, Grid, GridItem, HierarchySelect, Icon, Image, ImagePreview, IndexAnchor, IndexBar, Info, Lazyload, List, Loading, Locale, MediaPicker, MediaPlayer, MultiplePicker, NavBar, NoticeBar, NumberKeyboard, Overlay, PasswordInput, Picker, Popover, Popup, PullRefresh, Radio, RadioGroup, Rate, Row, Search, Signature, Skeleton, Slider, SpeechRecognizer, Step, Stepper, Steps, Sticky, Swipe, SwipeCell, SwipeItem, Switch, SwitchCell, Tab, Tabbar, TabbarItem, Table, Tabs, Tag, TextEllipsis, Timeline, Toast, Uploader];
|
|
82
82
|
components.forEach(function (item) {
|
|
@@ -54,10 +54,19 @@ export default createComponent({
|
|
|
54
54
|
methods: {
|
|
55
55
|
setOptions: function setOptions(options) {
|
|
56
56
|
if (JSON.stringify(options) !== JSON.stringify(this.options)) {
|
|
57
|
+
// 保存当前的 confirmed 状态
|
|
58
|
+
var wasConfirmed = this.confirmed;
|
|
57
59
|
this.options = deepClone(options);
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
60
|
+
|
|
61
|
+
// 如果已经确认过选择,保持 confirmed 状态
|
|
62
|
+
if (wasConfirmed) {
|
|
63
|
+
// options 变化后,currentIndexs 会由父组件通过 setConfirmIndex 重新设置
|
|
64
|
+
// 这里不做任何操作,等待父组件更新
|
|
65
|
+
} else {
|
|
66
|
+
// 未确认时才重置状态
|
|
67
|
+
this.confirmed = false;
|
|
68
|
+
this.setDefaultIndexs();
|
|
69
|
+
}
|
|
61
70
|
}
|
|
62
71
|
},
|
|
63
72
|
setDefaultIndexs: function setDefaultIndexs() {
|
|
@@ -34,6 +34,10 @@ export default createComponent({
|
|
|
34
34
|
return [];
|
|
35
35
|
}
|
|
36
36
|
},
|
|
37
|
+
filteredOptions: {
|
|
38
|
+
type: Array,
|
|
39
|
+
default: null
|
|
40
|
+
},
|
|
37
41
|
toolbarPosition: {
|
|
38
42
|
type: String,
|
|
39
43
|
default: 'bottom'
|
|
@@ -57,6 +61,8 @@ export default createComponent({
|
|
|
57
61
|
}),
|
|
58
62
|
data: function data() {
|
|
59
63
|
return {
|
|
64
|
+
selectedValues: [],
|
|
65
|
+
// 基于值的选中状态,用于支持 options 动态变化
|
|
60
66
|
currentIndexs: [],
|
|
61
67
|
confirmIndexs: null
|
|
62
68
|
};
|
|
@@ -64,29 +70,64 @@ export default createComponent({
|
|
|
64
70
|
watch: {
|
|
65
71
|
options: {
|
|
66
72
|
handler: function handler(newOptions) {
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
73
|
+
var _this = this;
|
|
74
|
+
// 当 options 变化时,基于 selectedValues 重新计算索引
|
|
75
|
+
if (this.selectedValues && this.selectedValues.length > 0) {
|
|
76
|
+
var newIndexs = [];
|
|
77
|
+
newOptions.forEach(function (option, index) {
|
|
78
|
+
var optionValue = _this.getOptionValue(option);
|
|
79
|
+
if (_this.selectedValues.includes(optionValue)) {
|
|
80
|
+
newIndexs.push(index);
|
|
81
|
+
}
|
|
71
82
|
});
|
|
72
|
-
this.
|
|
73
|
-
this.
|
|
83
|
+
this.currentIndexs = newIndexs;
|
|
84
|
+
this.confirmIndexs = newIndexs.length > 0 ? newIndexs : null;
|
|
74
85
|
}
|
|
75
86
|
},
|
|
76
87
|
immediate: false
|
|
77
88
|
},
|
|
89
|
+
filteredOptions: {
|
|
90
|
+
handler: function handler() {
|
|
91
|
+
var _this2 = this;
|
|
92
|
+
// filteredOptions 变化时,需要基于 selectedValues 重新映射到 displayOptions 的索引
|
|
93
|
+
this.$nextTick(function () {
|
|
94
|
+
if (_this2.$refs.pickerOptions) {
|
|
95
|
+
var displayIndexs = [];
|
|
96
|
+
if (_this2.selectedValues && _this2.selectedValues.length > 0) {
|
|
97
|
+
_this2.displayOptions.forEach(function (option, index) {
|
|
98
|
+
var optionValue = _this2.getOptionValue(option);
|
|
99
|
+
if (_this2.selectedValues.includes(optionValue)) {
|
|
100
|
+
displayIndexs.push(index);
|
|
101
|
+
}
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
// 强制更新子组件,即使是空数组也要设置
|
|
105
|
+
_this2.$refs.pickerOptions.confirmed = false;
|
|
106
|
+
_this2.$refs.pickerOptions.setConfirmIndex(displayIndexs);
|
|
107
|
+
}
|
|
108
|
+
});
|
|
109
|
+
},
|
|
110
|
+
immediate: false
|
|
111
|
+
},
|
|
78
112
|
showPicker: {
|
|
79
113
|
handler: function handler(val) {
|
|
80
|
-
var
|
|
114
|
+
var _this3 = this;
|
|
81
115
|
if (val) {
|
|
82
116
|
this.$nextTick(function () {
|
|
83
|
-
if (
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
117
|
+
if (_this3.$refs.pickerOptions) {
|
|
118
|
+
// 基于 selectedValues 计算在 displayOptions 中的索引
|
|
119
|
+
var displayIndexs = [];
|
|
120
|
+
if (_this3.selectedValues && _this3.selectedValues.length > 0) {
|
|
121
|
+
_this3.displayOptions.forEach(function (option, index) {
|
|
122
|
+
var optionValue = _this3.getOptionValue(option);
|
|
123
|
+
if (_this3.selectedValues.includes(optionValue)) {
|
|
124
|
+
displayIndexs.push(index);
|
|
125
|
+
}
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
_this3.$refs.pickerOptions.setConfirmIndex(displayIndexs);
|
|
129
|
+
// 同步 currentIndexs(基于原始 options)
|
|
130
|
+
_this3.currentIndexs = _this3.confirmIndexs || [];
|
|
90
131
|
}
|
|
91
132
|
});
|
|
92
133
|
}
|
|
@@ -95,11 +136,32 @@ export default createComponent({
|
|
|
95
136
|
}
|
|
96
137
|
},
|
|
97
138
|
computed: {
|
|
139
|
+
displayOptions: function displayOptions() {
|
|
140
|
+
return this.filteredOptions || this.options;
|
|
141
|
+
},
|
|
98
142
|
isAllSelected: function isAllSelected() {
|
|
99
|
-
|
|
143
|
+
var _this4 = this;
|
|
144
|
+
// 判断是否全选应该基于当前显示的 displayOptions
|
|
145
|
+
if (this.displayOptions.length === 0) return false;
|
|
146
|
+
var displayValues = this.displayOptions.map(function (opt) {
|
|
147
|
+
return _this4.getOptionValue(opt);
|
|
148
|
+
});
|
|
149
|
+
var selectedDisplayValues = this.selectedValues.filter(function (val) {
|
|
150
|
+
return displayValues.includes(val);
|
|
151
|
+
});
|
|
152
|
+
return selectedDisplayValues.length > 0 && selectedDisplayValues.length === this.displayOptions.length;
|
|
100
153
|
},
|
|
101
154
|
isIndeterminate: function isIndeterminate() {
|
|
102
|
-
|
|
155
|
+
var _this5 = this;
|
|
156
|
+
// 判断半选状态也应该基于当前显示的 displayOptions
|
|
157
|
+
if (this.displayOptions.length === 0) return false;
|
|
158
|
+
var displayValues = this.displayOptions.map(function (opt) {
|
|
159
|
+
return _this5.getOptionValue(opt);
|
|
160
|
+
});
|
|
161
|
+
var selectedDisplayValues = this.selectedValues.filter(function (val) {
|
|
162
|
+
return displayValues.includes(val);
|
|
163
|
+
});
|
|
164
|
+
return selectedDisplayValues.length > 0 && selectedDisplayValues.length < this.displayOptions.length;
|
|
103
165
|
},
|
|
104
166
|
itemPxHeight: function itemPxHeight() {
|
|
105
167
|
return this.itemHeight ? unitToPx(this.itemHeight) : DEFAULT_ITEM_HEIGHT;
|
|
@@ -114,21 +176,56 @@ export default createComponent({
|
|
|
114
176
|
emit: function emit(event) {
|
|
115
177
|
this.$emit(event, this.getOptions());
|
|
116
178
|
},
|
|
179
|
+
getOptionValue: function getOptionValue(option) {
|
|
180
|
+
if (typeof option === 'string' || typeof option === 'number') {
|
|
181
|
+
return option;
|
|
182
|
+
}
|
|
183
|
+
return option[this.valueKey] || JSON.stringify(option);
|
|
184
|
+
},
|
|
117
185
|
getOptions: function getOptions() {
|
|
118
|
-
var
|
|
186
|
+
var _this6 = this;
|
|
119
187
|
var indexs = this.$refs.pickerOptions.currentIndexs;
|
|
120
188
|
var result = [];
|
|
189
|
+
// 从 displayOptions 中获取选中项
|
|
121
190
|
indexs.forEach(function (index) {
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
191
|
+
var displayOption = _this6.displayOptions[index];
|
|
192
|
+
if (displayOption) {
|
|
193
|
+
// 查找在原始 options 中的索引
|
|
194
|
+
var originalIndex = _this6.options.findIndex(function (opt) {
|
|
195
|
+
return _this6.getOptionValue(opt) === _this6.getOptionValue(displayOption);
|
|
196
|
+
});
|
|
197
|
+
result.push(_extends({}, displayOption, {
|
|
198
|
+
initialIndex: originalIndex >= 0 ? originalIndex : index
|
|
199
|
+
}));
|
|
200
|
+
}
|
|
125
201
|
});
|
|
126
202
|
return result;
|
|
127
203
|
},
|
|
128
204
|
onChange: function onChange() {
|
|
205
|
+
var _this7 = this;
|
|
129
206
|
// 同步 currentIndexs 以触发计算属性更新
|
|
130
207
|
if (this.$refs.pickerOptions) {
|
|
131
|
-
|
|
208
|
+
// 实时更新 selectedValues,需要合并而不是覆盖
|
|
209
|
+
var displayOptions = this.getOptions();
|
|
210
|
+
var displayValues = displayOptions.map(function (v) {
|
|
211
|
+
return _this7.getOptionValue(v);
|
|
212
|
+
});
|
|
213
|
+
var displayAllValues = this.displayOptions.map(function (opt) {
|
|
214
|
+
return _this7.getOptionValue(opt);
|
|
215
|
+
});
|
|
216
|
+
|
|
217
|
+
// 移除当前显示列表中的所有值(无论是否选中),然后添加当前选中的值
|
|
218
|
+
this.selectedValues = [].concat(this.selectedValues.filter(function (val) {
|
|
219
|
+
return !displayAllValues.includes(val);
|
|
220
|
+
}), displayValues);
|
|
221
|
+
|
|
222
|
+
// 基于 selectedValues 更新 currentIndexs(用于显示已选数量)
|
|
223
|
+
this.currentIndexs = [];
|
|
224
|
+
this.options.forEach(function (option, index) {
|
|
225
|
+
if (_this7.selectedValues.includes(_this7.getOptionValue(option))) {
|
|
226
|
+
_this7.currentIndexs.push(index);
|
|
227
|
+
}
|
|
228
|
+
});
|
|
132
229
|
}
|
|
133
230
|
this.$emit('change', this.getOptions());
|
|
134
231
|
},
|
|
@@ -137,32 +234,96 @@ export default createComponent({
|
|
|
137
234
|
this.emit('cancel');
|
|
138
235
|
},
|
|
139
236
|
confirm: function confirm() {
|
|
140
|
-
var
|
|
141
|
-
|
|
237
|
+
var _this8 = this;
|
|
238
|
+
// 返回所有已选的数据,而不仅仅是当前显示的
|
|
239
|
+
var allSelectedOptions = [];
|
|
240
|
+
this.selectedValues.forEach(function (value) {
|
|
241
|
+
var option = _this8.options.find(function (opt) {
|
|
242
|
+
return _this8.getOptionValue(opt) === value;
|
|
243
|
+
});
|
|
244
|
+
if (option) {
|
|
245
|
+
var originalIndex = _this8.options.findIndex(function (opt) {
|
|
246
|
+
return _this8.getOptionValue(opt) === value;
|
|
247
|
+
});
|
|
248
|
+
allSelectedOptions.push(_extends({}, option, {
|
|
249
|
+
initialIndex: originalIndex
|
|
250
|
+
}));
|
|
251
|
+
}
|
|
252
|
+
});
|
|
253
|
+
this.confirmIndexs = allSelectedOptions.map(function (v) {
|
|
142
254
|
return v.initialIndex;
|
|
143
255
|
});
|
|
144
|
-
this
|
|
256
|
+
this.$emit('confirm', allSelectedOptions);
|
|
145
257
|
},
|
|
146
258
|
handleSelectAll: function handleSelectAll() {
|
|
147
|
-
var
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
259
|
+
var _this9 = this;
|
|
260
|
+
// 全选应该基于当前显示的 displayOptions,只选中当前搜索结果
|
|
261
|
+
var displayValues = this.displayOptions.map(function (opt) {
|
|
262
|
+
return _this9.getOptionValue(opt);
|
|
263
|
+
});
|
|
264
|
+
if (!this.isAllSelected) {
|
|
265
|
+
// 全选:只选中当前显示的值,清除其他值
|
|
266
|
+
this.selectedValues = displayValues;
|
|
267
|
+
|
|
268
|
+
// 更新 currentIndexs(基于原始 options)
|
|
269
|
+
this.currentIndexs = [];
|
|
270
|
+
this.options.forEach(function (option, index) {
|
|
271
|
+
if (displayValues.includes(_this9.getOptionValue(option))) {
|
|
272
|
+
_this9.currentIndexs.push(index);
|
|
273
|
+
}
|
|
274
|
+
});
|
|
275
|
+
|
|
276
|
+
// 设置子组件索引(基于 displayOptions,全选所有显示项)
|
|
277
|
+
var displayIndexs = this.displayOptions.map(function (_, index) {
|
|
278
|
+
return index;
|
|
279
|
+
});
|
|
280
|
+
if (this.$refs.pickerOptions) {
|
|
281
|
+
this.$refs.pickerOptions.setConfirmIndex(displayIndexs);
|
|
282
|
+
}
|
|
283
|
+
} else {
|
|
284
|
+
// 取消全选:清空所有选中
|
|
285
|
+
this.selectedValues = [];
|
|
286
|
+
this.currentIndexs = [];
|
|
287
|
+
if (this.$refs.pickerOptions) {
|
|
288
|
+
this.$refs.pickerOptions.setConfirmIndex([]);
|
|
289
|
+
}
|
|
153
290
|
}
|
|
154
291
|
},
|
|
155
292
|
onSelectOther: function onSelectOther() {
|
|
156
|
-
var
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
293
|
+
var _this10 = this;
|
|
294
|
+
// 反选应该基于当前显示的 displayOptions,只操作当前搜索结果
|
|
295
|
+
var displayValues = this.displayOptions.map(function (opt) {
|
|
296
|
+
return _this10.getOptionValue(opt);
|
|
297
|
+
});
|
|
298
|
+
|
|
299
|
+
// 计算当前显示项中未选中的值
|
|
300
|
+
var displaySelectedValues = this.selectedValues.filter(function (val) {
|
|
301
|
+
return displayValues.includes(val);
|
|
302
|
+
});
|
|
303
|
+
var displayUnselectedValues = displayValues.filter(function (val) {
|
|
304
|
+
return !displaySelectedValues.includes(val);
|
|
305
|
+
});
|
|
306
|
+
|
|
307
|
+
// 只保留当前显示列表中未选中的项(反选逻辑)
|
|
308
|
+
this.selectedValues = displayUnselectedValues;
|
|
309
|
+
|
|
310
|
+
// 更新 currentIndexs(基于原始 options)
|
|
311
|
+
this.currentIndexs = [];
|
|
312
|
+
this.options.forEach(function (option, index) {
|
|
313
|
+
if (displayUnselectedValues.includes(_this10.getOptionValue(option))) {
|
|
314
|
+
_this10.currentIndexs.push(index);
|
|
315
|
+
}
|
|
316
|
+
});
|
|
317
|
+
|
|
318
|
+
// 映射到 displayOptions 的索引(反选后的状态)
|
|
319
|
+
var displayIndexs = [];
|
|
320
|
+
this.displayOptions.forEach(function (option, index) {
|
|
321
|
+
if (displayUnselectedValues.includes(_this10.getOptionValue(option))) {
|
|
322
|
+
displayIndexs.push(index);
|
|
161
323
|
}
|
|
162
324
|
});
|
|
163
|
-
this.currentIndexs = newIndexs;
|
|
164
325
|
if (this.$refs.pickerOptions) {
|
|
165
|
-
this.$refs.pickerOptions.setConfirmIndex(
|
|
326
|
+
this.$refs.pickerOptions.setConfirmIndex(displayIndexs);
|
|
166
327
|
}
|
|
167
328
|
},
|
|
168
329
|
genTitle: function genTitle() {
|
|
@@ -276,18 +437,19 @@ export default createComponent({
|
|
|
276
437
|
}, [this.genOptionItems()]);
|
|
277
438
|
},
|
|
278
439
|
genOptionItems: function genOptionItems() {
|
|
279
|
-
var
|
|
440
|
+
var _this11 = this;
|
|
280
441
|
var h = this.$createElement;
|
|
281
442
|
var formatOptions = [];
|
|
282
|
-
|
|
283
|
-
|
|
443
|
+
var sourceOptions = this.displayOptions;
|
|
444
|
+
if (sourceOptions && sourceOptions[0] && typeof sourceOptions[0] !== 'object') {
|
|
445
|
+
formatOptions = sourceOptions.map(function (v) {
|
|
284
446
|
return {
|
|
285
447
|
value: v,
|
|
286
448
|
text: v
|
|
287
449
|
};
|
|
288
450
|
});
|
|
289
451
|
} else {
|
|
290
|
-
formatOptions =
|
|
452
|
+
formatOptions = sourceOptions;
|
|
291
453
|
}
|
|
292
454
|
return h(MultiplePickerOptions, {
|
|
293
455
|
"ref": "pickerOptions",
|
|
@@ -305,7 +467,7 @@ export default createComponent({
|
|
|
305
467
|
},
|
|
306
468
|
"on": {
|
|
307
469
|
"change": function change() {
|
|
308
|
-
|
|
470
|
+
_this11.onChange();
|
|
309
471
|
}
|
|
310
472
|
}
|
|
311
473
|
});
|
package/lib/index.js
CHANGED
|
@@ -161,7 +161,7 @@ var _toast = _interopRequireDefault(require("./toast"));
|
|
|
161
161
|
exports.Toast = _toast.default;
|
|
162
162
|
var _uploader = _interopRequireDefault(require("./uploader"));
|
|
163
163
|
exports.Uploader = _uploader.default;
|
|
164
|
-
var version = exports.version = '2.1.
|
|
164
|
+
var version = exports.version = '2.1.27';
|
|
165
165
|
function install(Vue) {
|
|
166
166
|
var components = [_actionSheet.default, _area.default, _avatar.default, _backTop.default, _badge.default, _button.default, _calendar.default, _cascader.default, _cell.default, _cellGroup.default, _checkbox.default, _checkboxGroup.default, _col.default, _collapse.default, _collapseItem.default, _countDown.default, _datetimePicker.default, _dialog.default, _divider.default, _dropdownItem.default, _dropdownMenu.default, _empty.default, _field.default, _foldDialog.default, _form.default, _grid.default, _gridItem.default, _hierarchySelect.default, _icon.default, _image.default, _imagePreview.default, _indexAnchor.default, _indexBar.default, _info.default, _lazyload.default, _list.default, _loading.default, _locale.default, _mediaPicker.default, _mediaPlayer.default, _multiplePicker.default, _navBar.default, _noticeBar.default, _numberKeyboard.default, _overlay.default, _passwordInput.default, _picker.default, _popover.default, _popup.default, _pullRefresh.default, _radio.default, _radioGroup.default, _rate.default, _row.default, _search.default, _signature.default, _skeleton.default, _slider.default, _speechRecognizer.default, _step.default, _stepper.default, _steps.default, _sticky.default, _swipe.default, _swipeCell.default, _swipeItem.default, _switch.default, _switchCell.default, _tab.default, _tabbar.default, _tabbarItem.default, _table.default, _tabs.default, _tag.default, _textEllipsis.default, _timeline.default, _toast.default, _uploader.default];
|
|
167
167
|
components.forEach(function (item) {
|
|
@@ -59,10 +59,19 @@ var _default2 = exports.default = createComponent({
|
|
|
59
59
|
methods: {
|
|
60
60
|
setOptions: function setOptions(options) {
|
|
61
61
|
if (JSON.stringify(options) !== JSON.stringify(this.options)) {
|
|
62
|
+
// 保存当前的 confirmed 状态
|
|
63
|
+
var wasConfirmed = this.confirmed;
|
|
62
64
|
this.options = (0, _deepClone.deepClone)(options);
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
65
|
+
|
|
66
|
+
// 如果已经确认过选择,保持 confirmed 状态
|
|
67
|
+
if (wasConfirmed) {
|
|
68
|
+
// options 变化后,currentIndexs 会由父组件通过 setConfirmIndex 重新设置
|
|
69
|
+
// 这里不做任何操作,等待父组件更新
|
|
70
|
+
} else {
|
|
71
|
+
// 未确认时才重置状态
|
|
72
|
+
this.confirmed = false;
|
|
73
|
+
this.setDefaultIndexs();
|
|
74
|
+
}
|
|
66
75
|
}
|
|
67
76
|
},
|
|
68
77
|
setDefaultIndexs: function setDefaultIndexs() {
|