@weitutech/by-components 1.1.200 → 1.1.201
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/lib/by-components.common.js +471 -20
- package/lib/by-components.umd.js +471 -20
- package/lib/by-components.umd.min.js +14 -14
- package/lib/index.css +1 -1
- package/package.json +1 -1
package/lib/by-components.umd.js
CHANGED
|
@@ -74283,6 +74283,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
74283
74283
|
// EXPORTS
|
|
74284
74284
|
__webpack_require__.d(__webpack_exports__, {
|
|
74285
74285
|
ByBatchQuerySelector: function() { return /* reexport */ BatchQuerySelector; },
|
|
74286
|
+
ByCardSelector: function() { return /* reexport */ ByCardSelector; },
|
|
74286
74287
|
ByCardView: function() { return /* reexport */ ByCardView; },
|
|
74287
74288
|
ByCascaderPanel: function() { return /* reexport */ ByCascaderPanel; },
|
|
74288
74289
|
ByCommonInput: function() { return /* reexport */ ByCommonInput; },
|
|
@@ -91069,8 +91070,8 @@ var ByCommonSelector_component = normalizeComponent(
|
|
|
91069
91070
|
)
|
|
91070
91071
|
|
|
91071
91072
|
/* harmony default export */ var ByCommonSelector = (ByCommonSelector_component.exports);
|
|
91072
|
-
;// ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"8cd600e8-vue-loader-template"}!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/batch-query-selector/BatchQuerySelector.vue?vue&type=template&id=
|
|
91073
|
-
var
|
|
91073
|
+
;// ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"8cd600e8-vue-loader-template"}!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/batch-query-selector/BatchQuerySelector.vue?vue&type=template&id=16c8bfda
|
|
91074
|
+
var BatchQuerySelectorvue_type_template_id_16c8bfda_render = function render() {
|
|
91074
91075
|
var _vm = this,
|
|
91075
91076
|
_c = _vm._self._c;
|
|
91076
91077
|
return _c('div', {
|
|
@@ -91109,12 +91110,25 @@ var BatchQuerySelectorvue_type_template_id_bfef502c_render = function render() {
|
|
|
91109
91110
|
}, [_vm._l(_vm.visibleOptions, function (item) {
|
|
91110
91111
|
return _c('el-option', {
|
|
91111
91112
|
key: item[_vm.valueKey],
|
|
91113
|
+
class: {
|
|
91114
|
+
'option-with-desc': _vm.hasDescContent(item)
|
|
91115
|
+
},
|
|
91112
91116
|
attrs: {
|
|
91113
91117
|
"label": item[_vm.labelKey],
|
|
91114
91118
|
"value": item[_vm.valueKey],
|
|
91115
91119
|
"disabled": _vm.isOptionDisabled(item)
|
|
91116
91120
|
}
|
|
91117
|
-
})
|
|
91121
|
+
}, [_vm.hasDescContent(item) ? [_c('span', {
|
|
91122
|
+
staticClass: "option-label",
|
|
91123
|
+
attrs: {
|
|
91124
|
+
"title": String(item[_vm.labelKey])
|
|
91125
|
+
}
|
|
91126
|
+
}, [_vm._v(_vm._s(item[_vm.labelKey]))]), _c('span', {
|
|
91127
|
+
staticClass: "option-desc",
|
|
91128
|
+
attrs: {
|
|
91129
|
+
"title": String(item[_vm.descKey])
|
|
91130
|
+
}
|
|
91131
|
+
}, [_vm._v(_vm._s(item[_vm.descKey]))])] : _vm._e()], 2);
|
|
91118
91132
|
}), _vm.hasMoreOptions ? _c('el-option', {
|
|
91119
91133
|
staticClass: "load-more-option",
|
|
91120
91134
|
attrs: {
|
|
@@ -91228,7 +91242,7 @@ var BatchQuerySelectorvue_type_template_id_bfef502c_render = function render() {
|
|
|
91228
91242
|
}
|
|
91229
91243
|
})])], 1) : _vm._e()], 1)]);
|
|
91230
91244
|
};
|
|
91231
|
-
var
|
|
91245
|
+
var BatchQuerySelectorvue_type_template_id_16c8bfda_staticRenderFns = [];
|
|
91232
91246
|
|
|
91233
91247
|
;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/batch-query-selector/BatchQuerySelector.vue?vue&type=script&lang=js
|
|
91234
91248
|
|
|
@@ -91276,6 +91290,15 @@ var BatchQuerySelectorvue_type_template_id_bfef502c_staticRenderFns = [];
|
|
|
91276
91290
|
type: String,
|
|
91277
91291
|
default: 'name'
|
|
91278
91292
|
},
|
|
91293
|
+
/**
|
|
91294
|
+
* 描述字段名
|
|
91295
|
+
* 配置后,下拉选项会在名称右侧展示该字段对应的描述内容;
|
|
91296
|
+
* 该字段默认不参与搜索匹配,如需让描述参与搜索,请将字段名同时加入 extraSearchKeys
|
|
91297
|
+
*/
|
|
91298
|
+
descKey: {
|
|
91299
|
+
type: String,
|
|
91300
|
+
default: 'desc'
|
|
91301
|
+
},
|
|
91279
91302
|
/**
|
|
91280
91303
|
* 下拉搜索时除 labelKey、valueKey 外额外参与匹配的字段名(不填则与原先一致,仅搜标签与值)
|
|
91281
91304
|
*/
|
|
@@ -91447,6 +91470,12 @@ var BatchQuerySelectorvue_type_template_id_bfef502c_staticRenderFns = [];
|
|
|
91447
91470
|
}
|
|
91448
91471
|
},
|
|
91449
91472
|
methods: {
|
|
91473
|
+
// 判断选项是否有可展示的描述内容
|
|
91474
|
+
hasDescContent(option) {
|
|
91475
|
+
if (!this.descKey) return false;
|
|
91476
|
+
const val = option[this.descKey];
|
|
91477
|
+
return val !== undefined && val !== null && String(val).trim() !== '';
|
|
91478
|
+
},
|
|
91450
91479
|
// 判断选项是否禁用
|
|
91451
91480
|
isOptionDisabled(option) {
|
|
91452
91481
|
// 如果提供了自定义禁用方法,则使用自定义方法判断
|
|
@@ -91660,28 +91689,20 @@ var BatchQuerySelectorvue_type_template_id_bfef502c_staticRenderFns = [];
|
|
|
91660
91689
|
// 获取匹配的完整选项对象
|
|
91661
91690
|
matchedItems = this.optionsList.filter(item => matchedValues.includes(item[this.valueKey]));
|
|
91662
91691
|
} else {
|
|
91663
|
-
//
|
|
91692
|
+
// 默认映射逻辑:ID 和 名称 均采用精确匹配(忽略大小写、忽略首尾空白)
|
|
91664
91693
|
const searchKey = this.inputType === 'id' ? this.valueKey : this.labelKey;
|
|
91665
91694
|
|
|
91666
|
-
//
|
|
91695
|
+
// 从完整的 optionsList 中查找精确命中的项
|
|
91667
91696
|
matchedItems = this.optionsList.filter(item => {
|
|
91668
91697
|
// 排除禁用的选项
|
|
91669
91698
|
if (this.isOptionDisabled(item)) {
|
|
91670
91699
|
return false;
|
|
91671
91700
|
}
|
|
91672
|
-
|
|
91701
|
+
const itemVal = String(item[searchKey]).trim().toLowerCase();
|
|
91702
|
+
return inputValues.some(input => itemVal === String(input).trim().toLowerCase());
|
|
91673
91703
|
});
|
|
91674
91704
|
|
|
91675
|
-
//
|
|
91676
|
-
matchedValues = matchedItems.map(item => item[this.valueKey]);
|
|
91677
|
-
}
|
|
91678
|
-
|
|
91679
|
-
// 如果没有匹配项,尝试进行模糊匹配
|
|
91680
|
-
if (matchedValues.length === 0 && this.inputType === 'name') {
|
|
91681
|
-
matchedItems = this.optionsList.filter(item => {
|
|
91682
|
-
if (this.isOptionDisabled(item)) return false;
|
|
91683
|
-
return inputValues.some(input => String(item[this.labelKey]).toLowerCase().includes(String(input).toLowerCase()));
|
|
91684
|
-
});
|
|
91705
|
+
// 提取值
|
|
91685
91706
|
matchedValues = matchedItems.map(item => item[this.valueKey]);
|
|
91686
91707
|
}
|
|
91687
91708
|
|
|
@@ -91753,8 +91774,8 @@ var BatchQuerySelectorvue_type_template_id_bfef502c_staticRenderFns = [];
|
|
|
91753
91774
|
;
|
|
91754
91775
|
var BatchQuerySelector_component = normalizeComponent(
|
|
91755
91776
|
batch_query_selector_BatchQuerySelectorvue_type_script_lang_js,
|
|
91756
|
-
|
|
91757
|
-
|
|
91777
|
+
BatchQuerySelectorvue_type_template_id_16c8bfda_render,
|
|
91778
|
+
BatchQuerySelectorvue_type_template_id_16c8bfda_staticRenderFns,
|
|
91758
91779
|
false,
|
|
91759
91780
|
null,
|
|
91760
91781
|
null,
|
|
@@ -97699,6 +97720,434 @@ var ByCardView_component = normalizeComponent(
|
|
|
97699
97720
|
)
|
|
97700
97721
|
|
|
97701
97722
|
/* harmony default export */ var ByCardView = (ByCardView_component.exports);
|
|
97723
|
+
;// ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"8cd600e8-vue-loader-template"}!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/card-selector/ByCardSelector.vue?vue&type=template&id=293b51e4
|
|
97724
|
+
var ByCardSelectorvue_type_template_id_293b51e4_render = function render() {
|
|
97725
|
+
var _vm = this,
|
|
97726
|
+
_c = _vm._self._c;
|
|
97727
|
+
return _c('div', {
|
|
97728
|
+
staticClass: "by-card-selector",
|
|
97729
|
+
class: [`by-card-selector--size-${_vm.size}`, `by-card-selector--direction-${_vm.direction}`, {
|
|
97730
|
+
'is-disabled': _vm.disabled,
|
|
97731
|
+
'by-card-selector--no-check': !_vm.showCheckmark
|
|
97732
|
+
}],
|
|
97733
|
+
style: _vm.directionStyle,
|
|
97734
|
+
attrs: {
|
|
97735
|
+
"role": "listbox",
|
|
97736
|
+
"aria-multiselectable": _vm.multiple ? 'true' : 'false'
|
|
97737
|
+
}
|
|
97738
|
+
}, _vm._l(_vm.options, function (item, index) {
|
|
97739
|
+
return _c('div', {
|
|
97740
|
+
key: _vm.optionKey(item, index),
|
|
97741
|
+
staticClass: "by-card-selector__card",
|
|
97742
|
+
class: {
|
|
97743
|
+
'is-selected': _vm.isSelected(item),
|
|
97744
|
+
'is-disabled': _vm.isItemDisabled(item),
|
|
97745
|
+
'is-focusable': !_vm.isItemDisabled(item)
|
|
97746
|
+
},
|
|
97747
|
+
attrs: {
|
|
97748
|
+
"role": "option",
|
|
97749
|
+
"aria-selected": _vm.isSelected(item) ? 'true' : 'false',
|
|
97750
|
+
"aria-disabled": _vm.isItemDisabled(item) ? 'true' : 'false',
|
|
97751
|
+
"tabindex": _vm.cardTabindex(item, index)
|
|
97752
|
+
},
|
|
97753
|
+
on: {
|
|
97754
|
+
"click": function ($event) {
|
|
97755
|
+
return _vm.onCardClick(item, index);
|
|
97756
|
+
},
|
|
97757
|
+
"focus": function ($event) {
|
|
97758
|
+
return _vm.onCardFocus(index);
|
|
97759
|
+
},
|
|
97760
|
+
"keydown": function ($event) {
|
|
97761
|
+
return _vm.onCardKeydown($event, index);
|
|
97762
|
+
}
|
|
97763
|
+
}
|
|
97764
|
+
}, [_vm._t("card", function () {
|
|
97765
|
+
return [_c('div', {
|
|
97766
|
+
staticClass: "by-card-selector__card-inner"
|
|
97767
|
+
}, [_vm.hasIconArea(item) ? _c('div', {
|
|
97768
|
+
staticClass: "by-card-selector__icon-wrap"
|
|
97769
|
+
}, [_vm._t("icon", function () {
|
|
97770
|
+
return [_vm.iconIsImage(item) ? _c('img', {
|
|
97771
|
+
staticClass: "by-card-selector__icon-img",
|
|
97772
|
+
attrs: {
|
|
97773
|
+
"src": _vm.rawIcon(item),
|
|
97774
|
+
"alt": ""
|
|
97775
|
+
}
|
|
97776
|
+
}) : _vm.rawIcon(item) ? _c('i', {
|
|
97777
|
+
class: ['by-card-selector__icon-el', _vm.rawIcon(item)]
|
|
97778
|
+
}) : _c('div', {
|
|
97779
|
+
staticClass: "by-card-selector__icon-placeholder"
|
|
97780
|
+
}, [_c('span', {
|
|
97781
|
+
staticClass: "by-card-selector__icon-placeholder-text"
|
|
97782
|
+
}, [_vm._v(_vm._s(_vm.iconFallbackLetter(item)))])])];
|
|
97783
|
+
}, {
|
|
97784
|
+
"item": item,
|
|
97785
|
+
"index": index
|
|
97786
|
+
})], 2) : _vm._e(), _c('div', {
|
|
97787
|
+
staticClass: "by-card-selector__main"
|
|
97788
|
+
}, [_c('div', {
|
|
97789
|
+
staticClass: "by-card-selector__title-row"
|
|
97790
|
+
}, [_c('span', {
|
|
97791
|
+
staticClass: "by-card-selector__title"
|
|
97792
|
+
}, [_vm._v(_vm._s(_vm.optionLabel(item)))]), _vm.optionTooltip(item) ? _c('el-tooltip', {
|
|
97793
|
+
attrs: {
|
|
97794
|
+
"content": String(_vm.optionTooltip(item)),
|
|
97795
|
+
"placement": "top",
|
|
97796
|
+
"open-delay": 300
|
|
97797
|
+
}
|
|
97798
|
+
}, [_c('span', {
|
|
97799
|
+
staticClass: "by-card-selector__help",
|
|
97800
|
+
on: {
|
|
97801
|
+
"click": function ($event) {
|
|
97802
|
+
$event.stopPropagation();
|
|
97803
|
+
}
|
|
97804
|
+
}
|
|
97805
|
+
}, [_c('i', {
|
|
97806
|
+
staticClass: "el-icon-question"
|
|
97807
|
+
})])]) : _vm._e()], 1), _vm.optionDescription(item) ? _c('p', {
|
|
97808
|
+
staticClass: "by-card-selector__desc"
|
|
97809
|
+
}, [_vm._v(" " + _vm._s(_vm.optionDescription(item)) + " ")]) : _vm._e(), _vm.visibleTags(item).length || _vm.tagOverflowCount(item) > 0 ? _c('div', {
|
|
97810
|
+
staticClass: "by-card-selector__tags"
|
|
97811
|
+
}, [_vm._l(_vm.visibleTags(item), function (tag, ti) {
|
|
97812
|
+
return _c('el-tag', {
|
|
97813
|
+
key: ti,
|
|
97814
|
+
staticClass: "by-card-selector__tag",
|
|
97815
|
+
attrs: {
|
|
97816
|
+
"size": "mini",
|
|
97817
|
+
"type": "info",
|
|
97818
|
+
"effect": "plain"
|
|
97819
|
+
}
|
|
97820
|
+
}, [_vm._v(" " + _vm._s(_vm.formatTag(tag)) + " ")]);
|
|
97821
|
+
}), _vm.tagOverflowCount(item) > 0 ? _c('el-tag', {
|
|
97822
|
+
staticClass: "by-card-selector__tag by-card-selector__tag--more",
|
|
97823
|
+
attrs: {
|
|
97824
|
+
"size": "mini",
|
|
97825
|
+
"type": "info",
|
|
97826
|
+
"effect": "plain"
|
|
97827
|
+
}
|
|
97828
|
+
}, [_vm._v(" +" + _vm._s(_vm.tagOverflowCount(item)) + " ")]) : _vm._e()], 2) : _vm._e()]), _vm.showCheckmark ? _c('div', {
|
|
97829
|
+
staticClass: "by-card-selector__check",
|
|
97830
|
+
attrs: {
|
|
97831
|
+
"aria-hidden": "true"
|
|
97832
|
+
}
|
|
97833
|
+
}, [_vm.isSelected(item) ? _c('i', {
|
|
97834
|
+
staticClass: "el-icon-check by-card-selector__check-icon"
|
|
97835
|
+
}) : _vm._e()]) : _vm._e()])];
|
|
97836
|
+
}, {
|
|
97837
|
+
"item": item,
|
|
97838
|
+
"index": index,
|
|
97839
|
+
"selected": _vm.isSelected(item),
|
|
97840
|
+
"disabled": _vm.isItemDisabled(item)
|
|
97841
|
+
})], 2);
|
|
97842
|
+
}), 0);
|
|
97843
|
+
};
|
|
97844
|
+
var ByCardSelectorvue_type_template_id_293b51e4_staticRenderFns = [];
|
|
97845
|
+
|
|
97846
|
+
;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-82.use[1]!./node_modules/cache-loader/dist/cjs.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/card-selector/ByCardSelector.vue?vue&type=script&lang=js
|
|
97847
|
+
|
|
97848
|
+
|
|
97849
|
+
|
|
97850
|
+
|
|
97851
|
+
|
|
97852
|
+
const DEFAULT_OPTION_PROPS = () => ({
|
|
97853
|
+
value: 'value',
|
|
97854
|
+
label: 'label',
|
|
97855
|
+
description: 'description',
|
|
97856
|
+
icon: 'icon',
|
|
97857
|
+
tooltip: 'tooltip',
|
|
97858
|
+
tags: 'tags'
|
|
97859
|
+
});
|
|
97860
|
+
|
|
97861
|
+
/**
|
|
97862
|
+
* 卡片选择器:单选/多选 + 卡片式布局,行为类似 el-radio-group / el-checkbox-group。
|
|
97863
|
+
*
|
|
97864
|
+
* @example
|
|
97865
|
+
* <by-card-selector v-model="id" :options="list" />
|
|
97866
|
+
* <by-card-selector v-model="ids" :options="list" multiple />
|
|
97867
|
+
*/
|
|
97868
|
+
/* harmony default export */ var ByCardSelectorvue_type_script_lang_js = ({
|
|
97869
|
+
name: 'ByCardSelector',
|
|
97870
|
+
props: {
|
|
97871
|
+
/** v-model:单选为选项 value;多选为 value 数组 */
|
|
97872
|
+
value: {
|
|
97873
|
+
type: [String, Number, Boolean, Object, Array],
|
|
97874
|
+
default: null
|
|
97875
|
+
},
|
|
97876
|
+
options: {
|
|
97877
|
+
type: Array,
|
|
97878
|
+
default: () => []
|
|
97879
|
+
},
|
|
97880
|
+
/** 是否多选 */
|
|
97881
|
+
multiple: {
|
|
97882
|
+
type: Boolean,
|
|
97883
|
+
default: false
|
|
97884
|
+
},
|
|
97885
|
+
/** 排列方向:横向(默认)或纵向;纵向时建议配合 verticalMaxHeight 以产生换列效果 */
|
|
97886
|
+
direction: {
|
|
97887
|
+
type: String,
|
|
97888
|
+
default: 'horizontal',
|
|
97889
|
+
validator: v => ['horizontal', 'vertical'].includes(v)
|
|
97890
|
+
},
|
|
97891
|
+
/** 纵向排列时容器最大高度,便于 flex 换列;仅 direction=vertical 时生效 */
|
|
97892
|
+
verticalMaxHeight: {
|
|
97893
|
+
type: String,
|
|
97894
|
+
default: '320px'
|
|
97895
|
+
},
|
|
97896
|
+
/** 卡片尺寸 */
|
|
97897
|
+
size: {
|
|
97898
|
+
type: String,
|
|
97899
|
+
default: 'default',
|
|
97900
|
+
validator: v => ['large', 'default', 'small'].includes(v)
|
|
97901
|
+
},
|
|
97902
|
+
/** 整组禁用 */
|
|
97903
|
+
disabled: {
|
|
97904
|
+
type: Boolean,
|
|
97905
|
+
default: false
|
|
97906
|
+
},
|
|
97907
|
+
/** 选项字段映射,默认 value / label / description / icon / tooltip / tags */
|
|
97908
|
+
optionProps: {
|
|
97909
|
+
type: Object,
|
|
97910
|
+
default: () => ({})
|
|
97911
|
+
},
|
|
97912
|
+
/** 用于判断禁用的数据字段,默认 disabled;数值类型时 1 为可选,非 1 为不可选;布尔 true 为禁用 */
|
|
97913
|
+
disabledField: {
|
|
97914
|
+
type: String,
|
|
97915
|
+
default: 'disabled'
|
|
97916
|
+
},
|
|
97917
|
+
/** 选项唯一键字段,用于 :key,默认与 value 字段一致 */
|
|
97918
|
+
optionKeyField: {
|
|
97919
|
+
type: String,
|
|
97920
|
+
default: ''
|
|
97921
|
+
},
|
|
97922
|
+
/** 标签最多展示个数,其余以 +N 省略 */
|
|
97923
|
+
maxVisibleTags: {
|
|
97924
|
+
type: Number,
|
|
97925
|
+
default: 3
|
|
97926
|
+
},
|
|
97927
|
+
/** 是否在卡片右侧展示圆形打钩选中指示,默认展示 */
|
|
97928
|
+
showCheckmark: {
|
|
97929
|
+
type: Boolean,
|
|
97930
|
+
default: true
|
|
97931
|
+
}
|
|
97932
|
+
},
|
|
97933
|
+
data() {
|
|
97934
|
+
return {
|
|
97935
|
+
focusedIndex: 0
|
|
97936
|
+
};
|
|
97937
|
+
},
|
|
97938
|
+
computed: {
|
|
97939
|
+
mergedOptionProps() {
|
|
97940
|
+
return {
|
|
97941
|
+
...DEFAULT_OPTION_PROPS(),
|
|
97942
|
+
...this.optionProps
|
|
97943
|
+
};
|
|
97944
|
+
},
|
|
97945
|
+
keyField() {
|
|
97946
|
+
return this.optionKeyField || this.mergedOptionProps.value;
|
|
97947
|
+
},
|
|
97948
|
+
directionStyle() {
|
|
97949
|
+
if (this.direction !== 'vertical') return {};
|
|
97950
|
+
return {
|
|
97951
|
+
maxHeight: this.verticalMaxHeight
|
|
97952
|
+
};
|
|
97953
|
+
}
|
|
97954
|
+
},
|
|
97955
|
+
watch: {
|
|
97956
|
+
options: {
|
|
97957
|
+
handler(list) {
|
|
97958
|
+
if (!Array.isArray(list) || list.length === 0) {
|
|
97959
|
+
this.focusedIndex = 0;
|
|
97960
|
+
return;
|
|
97961
|
+
}
|
|
97962
|
+
if (this.focusedIndex >= list.length) this.focusedIndex = list.length - 1;
|
|
97963
|
+
this.$nextTick(() => this.syncFocusedToFirstEnabled());
|
|
97964
|
+
},
|
|
97965
|
+
deep: true
|
|
97966
|
+
}
|
|
97967
|
+
},
|
|
97968
|
+
methods: {
|
|
97969
|
+
pick(obj, key) {
|
|
97970
|
+
if (obj == null || key == null || key === '') return undefined;
|
|
97971
|
+
return obj[key];
|
|
97972
|
+
},
|
|
97973
|
+
optionKey(item, index) {
|
|
97974
|
+
const v = this.pick(item, this.keyField);
|
|
97975
|
+
if (v !== undefined && v !== null) return v;
|
|
97976
|
+
return index;
|
|
97977
|
+
},
|
|
97978
|
+
optionValue(item) {
|
|
97979
|
+
return this.pick(item, this.mergedOptionProps.value);
|
|
97980
|
+
},
|
|
97981
|
+
optionLabel(item) {
|
|
97982
|
+
const v = this.pick(item, this.mergedOptionProps.label);
|
|
97983
|
+
return v != null && v !== '' ? String(v) : '';
|
|
97984
|
+
},
|
|
97985
|
+
optionDescription(item) {
|
|
97986
|
+
const v = this.pick(item, this.mergedOptionProps.description);
|
|
97987
|
+
return v != null && v !== '' ? String(v) : '';
|
|
97988
|
+
},
|
|
97989
|
+
rawIcon(item) {
|
|
97990
|
+
return this.pick(item, this.mergedOptionProps.icon);
|
|
97991
|
+
},
|
|
97992
|
+
optionTooltip(item) {
|
|
97993
|
+
const v = this.pick(item, this.mergedOptionProps.tooltip);
|
|
97994
|
+
if (v == null || v === '') return '';
|
|
97995
|
+
return v;
|
|
97996
|
+
},
|
|
97997
|
+
rawTags(item) {
|
|
97998
|
+
const raw = this.pick(item, this.mergedOptionProps.tags);
|
|
97999
|
+
if (Array.isArray(raw)) return raw;
|
|
98000
|
+
return [];
|
|
98001
|
+
},
|
|
98002
|
+
iconIsImage(item) {
|
|
98003
|
+
const s = this.rawIcon(item);
|
|
98004
|
+
if (typeof s !== 'string') return false;
|
|
98005
|
+
return /^https?:\/\//i.test(s) || /^data:image\//i.test(s) || /\.(png|jpe?g|gif|webp|svg)(\?|$)/i.test(s);
|
|
98006
|
+
},
|
|
98007
|
+
hasIconArea(item) {
|
|
98008
|
+
return Boolean(this.rawIcon(item)) || Boolean(this.$scopedSlots && this.$scopedSlots.icon);
|
|
98009
|
+
},
|
|
98010
|
+
iconFallbackLetter(item) {
|
|
98011
|
+
const t = this.optionLabel(item);
|
|
98012
|
+
return t ? t.trim().charAt(0).toUpperCase() : '?';
|
|
98013
|
+
},
|
|
98014
|
+
formatTag(tag) {
|
|
98015
|
+
if (tag == null) return '';
|
|
98016
|
+
if (typeof tag === 'string' || typeof tag === 'number') return String(tag);
|
|
98017
|
+
if (typeof tag === 'object' && tag.label != null) return String(tag.label);
|
|
98018
|
+
if (typeof tag === 'object' && tag.text != null) return String(tag.text);
|
|
98019
|
+
return String(tag);
|
|
98020
|
+
},
|
|
98021
|
+
visibleTags(item) {
|
|
98022
|
+
const tags = this.rawTags(item);
|
|
98023
|
+
const max = Math.max(0, this.maxVisibleTags);
|
|
98024
|
+
return tags.slice(0, max);
|
|
98025
|
+
},
|
|
98026
|
+
tagOverflowCount(item) {
|
|
98027
|
+
const tags = this.rawTags(item);
|
|
98028
|
+
const max = Math.max(0, this.maxVisibleTags);
|
|
98029
|
+
return tags.length > max ? tags.length - max : 0;
|
|
98030
|
+
},
|
|
98031
|
+
isItemDisabled(item) {
|
|
98032
|
+
if (this.disabled) return true;
|
|
98033
|
+
const field = this.disabledField;
|
|
98034
|
+
if (!field || !Object.prototype.hasOwnProperty.call(item, field)) return false;
|
|
98035
|
+
const v = item[field];
|
|
98036
|
+
if (typeof v === 'number') return v !== 1;
|
|
98037
|
+
if (typeof v === 'boolean') return v === true;
|
|
98038
|
+
return Boolean(v);
|
|
98039
|
+
},
|
|
98040
|
+
valuesEqual(a, b) {
|
|
98041
|
+
return a === b || Number.isNaN(a) && Number.isNaN(b);
|
|
98042
|
+
},
|
|
98043
|
+
isSelected(item) {
|
|
98044
|
+
const val = this.optionValue(item);
|
|
98045
|
+
if (this.multiple) {
|
|
98046
|
+
const list = Array.isArray(this.value) ? this.value : [];
|
|
98047
|
+
return list.some(v => this.valuesEqual(v, val));
|
|
98048
|
+
}
|
|
98049
|
+
return this.valuesEqual(this.value, val);
|
|
98050
|
+
},
|
|
98051
|
+
cardTabindex(item, index) {
|
|
98052
|
+
if (this.isItemDisabled(item)) return -1;
|
|
98053
|
+
return this.focusedIndex === index ? 0 : -1;
|
|
98054
|
+
},
|
|
98055
|
+
emitChange(next) {
|
|
98056
|
+
this.$emit('input', next);
|
|
98057
|
+
this.$emit('change', next);
|
|
98058
|
+
},
|
|
98059
|
+
toggleItem(item) {
|
|
98060
|
+
if (this.isItemDisabled(item)) return;
|
|
98061
|
+
const val = this.optionValue(item);
|
|
98062
|
+
if (this.multiple) {
|
|
98063
|
+
const list = Array.isArray(this.value) ? [...this.value] : [];
|
|
98064
|
+
const i = list.findIndex(v => this.valuesEqual(v, val));
|
|
98065
|
+
if (i >= 0) list.splice(i, 1);else list.push(val);
|
|
98066
|
+
this.emitChange(list);
|
|
98067
|
+
} else if (!this.valuesEqual(this.value, val)) {
|
|
98068
|
+
this.emitChange(val);
|
|
98069
|
+
}
|
|
98070
|
+
},
|
|
98071
|
+
onCardClick(item, index) {
|
|
98072
|
+
if (!this.isItemDisabled(item)) this.focusedIndex = index;
|
|
98073
|
+
this.toggleItem(item);
|
|
98074
|
+
},
|
|
98075
|
+
onCardFocus(index) {
|
|
98076
|
+
if (!this.isItemDisabled(this.options[index])) this.focusedIndex = index;
|
|
98077
|
+
},
|
|
98078
|
+
enabledOptionIndices() {
|
|
98079
|
+
return this.options.map((it, i) => this.isItemDisabled(it) ? -1 : i).filter(i => i >= 0);
|
|
98080
|
+
},
|
|
98081
|
+
focusCardAtIndex(index) {
|
|
98082
|
+
this.focusedIndex = index;
|
|
98083
|
+
this.$nextTick(() => {
|
|
98084
|
+
const nodes = this.$el && this.$el.querySelectorAll('.by-card-selector__card');
|
|
98085
|
+
const el = nodes && nodes[index];
|
|
98086
|
+
if (el && typeof el.focus === 'function') el.focus();
|
|
98087
|
+
});
|
|
98088
|
+
},
|
|
98089
|
+
moveFocus(delta) {
|
|
98090
|
+
const enabled = this.enabledOptionIndices();
|
|
98091
|
+
if (!enabled.length) return;
|
|
98092
|
+
let pos = enabled.indexOf(this.focusedIndex);
|
|
98093
|
+
if (pos < 0) pos = 0;
|
|
98094
|
+
pos = (pos + delta + enabled.length) % enabled.length;
|
|
98095
|
+
this.focusCardAtIndex(enabled[pos]);
|
|
98096
|
+
},
|
|
98097
|
+
onCardKeydown(e, index) {
|
|
98098
|
+
if (this.disabled || !this.options.length) return;
|
|
98099
|
+
if (this.isItemDisabled(this.options[index])) return;
|
|
98100
|
+
if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {
|
|
98101
|
+
e.preventDefault();
|
|
98102
|
+
this.moveFocus(1);
|
|
98103
|
+
return;
|
|
98104
|
+
}
|
|
98105
|
+
if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {
|
|
98106
|
+
e.preventDefault();
|
|
98107
|
+
this.moveFocus(-1);
|
|
98108
|
+
return;
|
|
98109
|
+
}
|
|
98110
|
+
if (e.key === ' ' || e.key === 'Enter') {
|
|
98111
|
+
e.preventDefault();
|
|
98112
|
+
const item = this.options[this.focusedIndex];
|
|
98113
|
+
if (item && !this.isItemDisabled(item)) this.toggleItem(item);
|
|
98114
|
+
}
|
|
98115
|
+
},
|
|
98116
|
+
syncFocusedToFirstEnabled() {
|
|
98117
|
+
const enabled = this.enabledOptionIndices();
|
|
98118
|
+
if (!enabled.length) {
|
|
98119
|
+
this.focusedIndex = 0;
|
|
98120
|
+
return;
|
|
98121
|
+
}
|
|
98122
|
+
if (enabled.indexOf(this.focusedIndex) < 0) this.focusedIndex = enabled[0];
|
|
98123
|
+
}
|
|
98124
|
+
},
|
|
98125
|
+
created() {
|
|
98126
|
+
this.syncFocusedToFirstEnabled();
|
|
98127
|
+
}
|
|
98128
|
+
});
|
|
98129
|
+
;// ./src/components/card-selector/ByCardSelector.vue?vue&type=script&lang=js
|
|
98130
|
+
/* harmony default export */ var card_selector_ByCardSelectorvue_type_script_lang_js = (ByCardSelectorvue_type_script_lang_js);
|
|
98131
|
+
;// ./src/components/card-selector/ByCardSelector.vue
|
|
98132
|
+
|
|
98133
|
+
|
|
98134
|
+
|
|
98135
|
+
|
|
98136
|
+
|
|
98137
|
+
/* normalize component */
|
|
98138
|
+
;
|
|
98139
|
+
var ByCardSelector_component = normalizeComponent(
|
|
98140
|
+
card_selector_ByCardSelectorvue_type_script_lang_js,
|
|
98141
|
+
ByCardSelectorvue_type_template_id_293b51e4_render,
|
|
98142
|
+
ByCardSelectorvue_type_template_id_293b51e4_staticRenderFns,
|
|
98143
|
+
false,
|
|
98144
|
+
null,
|
|
98145
|
+
null,
|
|
98146
|
+
null
|
|
98147
|
+
|
|
98148
|
+
)
|
|
98149
|
+
|
|
98150
|
+
/* harmony default export */ var ByCardSelector = (ByCardSelector_component.exports);
|
|
97702
98151
|
;// ./src/index.js
|
|
97703
98152
|
|
|
97704
98153
|
|
|
@@ -97724,6 +98173,7 @@ var ByCardView_component = normalizeComponent(
|
|
|
97724
98173
|
|
|
97725
98174
|
|
|
97726
98175
|
|
|
98176
|
+
|
|
97727
98177
|
|
|
97728
98178
|
|
|
97729
98179
|
const components = {
|
|
@@ -97746,7 +98196,8 @@ const components = {
|
|
|
97746
98196
|
ByGridLayout: ByGridLayout,
|
|
97747
98197
|
ByCommonInput: ByCommonInput,
|
|
97748
98198
|
ByTag: ByTag,
|
|
97749
|
-
ByCardView: ByCardView
|
|
98199
|
+
ByCardView: ByCardView,
|
|
98200
|
+
ByCardSelector: ByCardSelector
|
|
97750
98201
|
};
|
|
97751
98202
|
|
|
97752
98203
|
// 设置当前 z-index 起始值
|