|
@@ -1,8 +1,9 @@
|
|
|
+import { onMounted, reactive } from 'vue';
|
|
|
<template>
|
|
|
<div class="common-checkbox-selector">
|
|
|
<el-checkbox-group
|
|
|
class="j-checkbox-group"
|
|
|
- :value="value"
|
|
|
+ :value="list"
|
|
|
@input="onIssueStateChange"
|
|
|
>
|
|
|
<el-checkbox-button class="j-checkbox-button" label="全部"
|
|
@@ -14,19 +15,19 @@
|
|
|
:key="index"
|
|
|
:label="setSelectValue(state)"
|
|
|
>
|
|
|
- {{ field ? setSelectValue(state) : state }}
|
|
|
+ {{ field ? state.label : state }}
|
|
|
</el-checkbox-button>
|
|
|
</el-checkbox-group>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-
|
|
|
+import { onMounted, ref } from 'vue'
|
|
|
const props = defineProps({
|
|
|
// 是否单选
|
|
|
- sigle: {
|
|
|
+ single: {
|
|
|
type: Boolean,
|
|
|
- default: true
|
|
|
+ default: false
|
|
|
},
|
|
|
// field: 空代表字符串数组
|
|
|
// 其他: options是对象数组,field是对象数组的某个字段
|
|
@@ -43,12 +44,16 @@ const props = defineProps({
|
|
|
default: () => []
|
|
|
}
|
|
|
})
|
|
|
-function setSelectValue(state) {
|
|
|
- if (props.field === '') {
|
|
|
- return state
|
|
|
+let list = ref([])
|
|
|
+onMounted(() => {
|
|
|
+ if (props.value.length === 1 && props.value[0] === '') {
|
|
|
+ list.value = ['全部']
|
|
|
} else {
|
|
|
- return state[props.field]
|
|
|
+ list.value = props.value
|
|
|
}
|
|
|
+})
|
|
|
+function setSelectValue(state) {
|
|
|
+ return props.field === '' ? state : state[props.field];
|
|
|
}
|
|
|
const emit = defineEmits(['input'])
|
|
|
function onIssueStateChange(value) {
|
|
@@ -57,7 +62,7 @@ function onIssueStateChange(value) {
|
|
|
value = ['全部']
|
|
|
} else {
|
|
|
// 如果是单选,则只取最新一个
|
|
|
- if (props.sigle) {
|
|
|
+ if (props.single) {
|
|
|
const nonAllValues = value.filter((item) => item !== '全部')
|
|
|
value = nonAllValues.length
|
|
|
? [nonAllValues[nonAllValues.length - 1]]
|
|
@@ -68,8 +73,13 @@ function onIssueStateChange(value) {
|
|
|
value = ['全部']
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
+ list.value = value
|
|
|
+ if (value.length === 1 && value[0] === '全部') {
|
|
|
+ emit('input', [])
|
|
|
+ } else {
|
|
|
+ emit('input', value)
|
|
|
}
|
|
|
- emit('input', value)
|
|
|
}
|
|
|
</script>
|
|
|
|