Files
klp-oa/klp-ui/src/components/KLPService/WarehouseSelect/index.vue
砂糖 dabc6657e0 refactor(KLPService): 重构组件目录结构并新增多个表单选择组件
重构KLPService组件目录结构,将原有组件迁移至formItems子目录并新增多个表单选择组件。主要变更包括:
1. 移除CategorySelect组件及相关引用
2. 新增CraftSelect、AmountSelect、VendorSelect等表单组件
3. 优化WarehouseSelect组件支持禁用状态
4. 重构ProductSelect和RawMaterialSelect为卡片式选择器
5. 新增统一导出机制支持按需导入

同时更新相关视图文件以适配新的组件结构,改进代码可维护性和复用性。
2025-12-23 10:23:12 +08:00

122 lines
2.6 KiB
Vue

<template>
<el-select
v-model="selected"
:placeholder="placeholder"
:clearable="clearable"
:disabled="disabled"
:size="size"
filterable
@change="onChange"
style="width: 100%"
>
<el-option
v-for="item in warehouseOptions"
:key="item.warehouseId"
:label="item.warehouseName"
:value="item.warehouseId"
:disabled="item.isEnabled == 0"
>
<span :style="{ paddingLeft: item.level * 20 + 'px' }">
{{ item.warehouseName }}
</span>
</el-option>
</el-select>
</template>
<script>
import { listWarehouse } from '@/api/wms/warehouse';
export default {
name: 'WarehouseSelect',
props: {
value: {
type: [Number, String, null],
default: null
},
placeholder: {
type: String,
default: '请选择仓库'
},
clearable: {
type: Boolean,
default: true
},
disabled: {
type: Boolean,
default: false
},
size: {
type: String,
default: 'mini'
},
showTop: {
type: Boolean,
default: false // 是否显示顶级节点
}
},
data() {
return {
warehouseOptions: [],
selected: this.value
};
},
watch: {
value(val) {
this.selected = val;
}
},
mounted() {
this.loadOptions();
},
methods: {
loadOptions() {
listWarehouse().then(response => {
console.log('仓库API返回数据:', response);
const data = response.data || [];
console.log('处理后的数据:', data);
this.warehouseOptions = this.buildTreeOptions(data);
console.log('构建的树形选项:', this.warehouseOptions);
}).catch(error => {
console.error("加载仓库选项失败:", error);
this.warehouseOptions = [];
});
},
buildTreeOptions(data, parentId = null, level = 0) {
const options = [];
data.forEach(item => {
if (item.parentId === parentId) {
const option = {
warehouseId: item.warehouseId,
warehouseName: item.warehouseName,
level: level,
isEnabled: item.isEnabled,
};
// 递归构建子节点
const children = this.buildTreeOptions(data, item.warehouseId, level + 1);
if (children.length > 0) {
options.push(option);
options.push(...children);
} else {
options.push(option);
}
}
});
return options;
},
onChange(val) {
this.$emit('input', val);
this.$emit('change', val);
}
}
};
</script>
<style scoped>
.el-select {
width: 100%;
}
</style>