Fixed #6485
parent
3845ff8bba
commit
7ddf56dc88
|
@ -30,7 +30,11 @@
|
||||||
{{ label || 'empty' }}
|
{{ label || 'empty' }}
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="display === 'chip'">
|
<template v-else-if="display === 'chip'">
|
||||||
<span v-for="item of chipSelectedItems" :key="getLabelByValue(item)" :class="cx('chipItem')" v-bind="ptm('chipItem')">
|
<template v-if="chipSelectedItems">
|
||||||
|
<span>{{ label }}</span>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<span v-for="item of modelValue" :key="getLabelByValue(item)" :class="cx('chipItem')" v-bind="ptm('chipItem')">
|
||||||
<slot name="chip" :value="item" :removeCallback="(event) => removeOption(event, item)">
|
<slot name="chip" :value="item" :removeCallback="(event) => removeOption(event, item)">
|
||||||
<!-- TODO: removetokenicon and removeTokenIcon deprecated since v4.0. Use chipicon slot and chipIcon prop-->
|
<!-- TODO: removetokenicon and removeTokenIcon deprecated since v4.0. Use chipicon slot and chipIcon prop-->
|
||||||
<Chip :class="cx('pcChip')" :label="getLabelByValue(item)" :removeIcon="chipIcon || removeTokenIcon" removable :unstyled="unstyled" @remove="removeOption($event, item)" :pt="ptm('pcChip')">
|
<Chip :class="cx('pcChip')" :label="getLabelByValue(item)" :removeIcon="chipIcon || removeTokenIcon" removable :unstyled="unstyled" @remove="removeOption($event, item)" :pt="ptm('pcChip')">
|
||||||
|
@ -40,6 +44,7 @@
|
||||||
</Chip>
|
</Chip>
|
||||||
</slot>
|
</slot>
|
||||||
</span>
|
</span>
|
||||||
|
</template>
|
||||||
<template v-if="!modelValue || modelValue.length === 0">{{ placeholder || 'empty' }}</template>
|
<template v-if="!modelValue || modelValue.length === 0">{{ placeholder || 'empty' }}</template>
|
||||||
</template>
|
</template>
|
||||||
</slot>
|
</slot>
|
||||||
|
@ -1059,7 +1064,7 @@ export default {
|
||||||
return label;
|
return label;
|
||||||
},
|
},
|
||||||
chipSelectedItems() {
|
chipSelectedItems() {
|
||||||
return isNotEmpty(this.maxSelectedLabels) && this.modelValue && this.modelValue.length > this.maxSelectedLabels ? this.modelValue.slice(0, this.maxSelectedLabels) : this.modelValue;
|
return isNotEmpty(this.maxSelectedLabels) && this.modelValue && this.modelValue.length > this.maxSelectedLabels;
|
||||||
},
|
},
|
||||||
allSelected() {
|
allSelected() {
|
||||||
return this.selectAll !== null ? this.selectAll : isNotEmpty(this.visibleOptions) && this.visibleOptions.every((option) => this.isOptionGroup(option) || this.isOptionDisabled(option) || this.isSelected(option));
|
return this.selectAll !== null ? this.selectAll : isNotEmpty(this.visibleOptions) && this.visibleOptions.every((option) => this.isOptionGroup(option) || this.isOptionDisabled(option) || this.isSelected(option));
|
||||||
|
|
Loading…
Reference in New Issue