diff --git a/src/views/generic-component/AreaSelect.vue b/src/views/generic-component/AreaSelect.vue index 22660c4..2c7a829 100644 --- a/src/views/generic-component/AreaSelect.vue +++ b/src/views/generic-component/AreaSelect.vue @@ -16,7 +16,7 @@ v-for="item in items" :key="item.id" :label="item.code" - :value="returnType === 'object' ? item : item[returnValueKey]" + :value="getOptionValue(item)" > {{ item.code }} {{ item.name }} @@ -33,7 +33,7 @@ export default { props: { value: { type: [String, Number, Boolean, Array, Object], - default: '' + default: () => null }, width: { type: String, @@ -43,18 +43,12 @@ export default { type: String, default: '请选择' }, - disabled: { - type: Boolean, - default: false - }, + disabled: Boolean, clearable: { type: Boolean, default: true }, - multiple: { - type: Boolean, - default: false - }, + multiple: Boolean, filterable: { type: Boolean, default: true @@ -71,26 +65,24 @@ export default { type: Boolean, default: true }, - // 新增:返回类型控制 returnType: { type: String, - default: 'object', // 'object' | 'value' - validator: function(value) { - return ['object', 'value'].includes(value) - } + default: 'object', + validator: value => ['object', 'value'].includes(value) }, - // 新增:当returnType为'value'时,指定返回哪个字段的值 returnValueKey: { type: String, default: 'id' } }, + data() { return { items: [], loading: false } }, + computed: { selectedValue: { get() { @@ -101,77 +93,38 @@ export default { } } }, - watch: { - // 监听returnType变化,重新初始化选中值 - returnType: { - handler() { - this.handleReturnTypeChange() - }, - immediate: true - } - }, + created() { this.initData() }, + methods: { async initData() { this.loading = true try { - const res = await curdArea.queryAreaList({ enabled: this.isEnabled, bexb: this.bexb }) + const res = await curdArea.queryAreaList({ + enabled: this.isEnabled, + bexb: this.bexb + }) this.items = res || [] } catch (error) { this.crud.notify('获取数据失败', CRUD.NOTIFICATION_TYPE.ERROR) this.items = [] - this.loading = false } finally { this.loading = false } }, + getOptionValue(item) { + return this.returnType === 'object' ? item : item[this.returnValueKey] + }, + handleChange(val) { - let emitValue = val - - // 根据返回类型处理数据 - if (this.returnType === 'value' && val) { - if (this.multiple) { - // 多选情况 - emitValue = Array.isArray(val) ? val.map(item => - typeof item === 'object' ? item[this.returnValueKey] : item - ) : [] - } else { - // 单选情况 - emitValue = typeof val === 'object' ? val[this.returnValueKey] : val - } - } - - this.$emit('change', emitValue) + this.$emit('change', val) }, handleClear() { this.$emit('clear') - }, - - // 处理返回类型变化 - handleReturnTypeChange() { - if (this.returnType === 'value') { - // 从对象转换为值 - if (this.multiple) { - const values = Array.isArray(this.value) ? this.value.map(item => typeof item === 'object' ? item[this.returnValueKey] : item) : [] - this.$emit('input', values) - } else { - const value = typeof this.value === 'object' ? this.value[this.returnValueKey] : this.value - this.$emit('input', value) - } - } else { - // 默认对象 - if (this.multiple) { - const objects = Array.isArray(this.value) ? this.value.map(val => this.items.find(item => item[this.returnValueKey] === val) || val) : [] - this.$emit('input', objects) - } else { - const object = this.items.find(item => item[this.returnValueKey] === this.value) || this.value - this.$emit('input', object) - } - } } } }