在库位管理中新增容量单位类型和容量单位字段,调整库位状态选项,在仓库和库区管理中新增必填字段验证,移除库区容量列显示

This commit is contained in:
WUSIJIAN
2026-02-27 18:00:43 +08:00
parent 04a79c3032
commit 95b97314a2
6 changed files with 71 additions and 14 deletions

View File

@@ -20,6 +20,9 @@ export interface LocationData {
warehouseId?: string; warehouseId?: string;
zoneId: string; zoneId: string;
maxCapacity?: number; maxCapacity?: number;
capacityUnit?: string;
capacityUnitType: string;
status?: string;
remark?: string; remark?: string;
} }
@@ -76,3 +79,11 @@ export function updateLocationStatus(data: { id: string; status: string }) {
data, data,
}); });
} }
// 获取容量单位类型
export function getCapacityUnitType() {
return newService({
url: '/assets/location/getCapacityUnitType',
method: 'get',
});
}

View File

@@ -51,12 +51,26 @@
<el-select v-model="ruleForm.status" placeholder="请选择状态" clearable style="width: 100%"> <el-select v-model="ruleForm.status" placeholder="请选择状态" clearable style="width: 100%">
<el-option label="空闲" value="idle" /> <el-option label="空闲" value="idle" />
<el-option label="占用" value="occupied" /> <el-option label="占用" value="occupied" />
<el-option label="锁定" value="locked" /> <el-option label="禁用" value="disable" />
<el-option label="维护" value="maintenance" /> <el-option label="预留" value="reserved" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="单位类型" prop="capacityUnitType">
<el-select v-model="ruleForm.capacityUnitType" placeholder="请选择单位类型" clearable style="width: 100%">
<el-option v-for="item in capacityUnitTypeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="容量单位" prop="capacityUnit">
<el-input v-model="ruleForm.capacityUnit" placeholder="请输入容量单位" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="最大容量" prop="maxCapacity"> <el-form-item label="最大容量" prop="maxCapacity">
@@ -91,7 +105,7 @@ export default {
import { ref, reactive, computed } from 'vue'; import { ref, reactive, computed } from 'vue';
import { ElMessage } from 'element-plus'; import { ElMessage } from 'element-plus';
import type { FormInstance, FormRules } from 'element-plus'; import type { FormInstance, FormRules } from 'element-plus';
import { createLocation, updateLocation, getLocation } from '/@/api/assets/location'; import { createLocation, updateLocation, getLocation, getCapacityUnitType } from '/@/api/assets/location';
// 定义props // 定义props
const props = defineProps<{ const props = defineProps<{
@@ -110,6 +124,9 @@ const isShowDialog = ref(false);
const isEdit = ref(false); const isEdit = ref(false);
const submitLoading = ref(false); const submitLoading = ref(false);
// 容量单位类型选项
const capacityUnitTypeOptions = ref<{ label: string; value: string }[]>([]);
// 表单数据 // 表单数据
const ruleForm = reactive({ const ruleForm = reactive({
id: '', id: '',
@@ -119,6 +136,8 @@ const ruleForm = reactive({
warehouseId: '', warehouseId: '',
zoneId: '', zoneId: '',
status: 'idle', status: 'idle',
capacityUnitType: '',
capacityUnit: '',
maxCapacity: 0, maxCapacity: 0,
remark: '', remark: '',
}); });
@@ -140,6 +159,7 @@ const onWarehouseChange = () => {
const rules = reactive<FormRules>({ const rules = reactive<FormRules>({
locationName: [{ required: true, message: '请输入库位名称', trigger: 'blur' }], locationName: [{ required: true, message: '请输入库位名称', trigger: 'blur' }],
zoneId: [{ required: true, message: '请选择所属库区', trigger: 'change' }], zoneId: [{ required: true, message: '请选择所属库区', trigger: 'change' }],
capacityUnitType: [{ required: true, message: '请选择容量单位类型', trigger: 'change' }],
}); });
// 重置表单 // 重置表单
@@ -151,15 +171,35 @@ const resetForm = () => {
ruleForm.warehouseId = ''; ruleForm.warehouseId = '';
ruleForm.zoneId = ''; ruleForm.zoneId = '';
ruleForm.status = 'idle'; ruleForm.status = 'idle';
ruleForm.capacityUnitType = '';
ruleForm.capacityUnit = '';
ruleForm.maxCapacity = 0; ruleForm.maxCapacity = 0;
ruleForm.remark = ''; ruleForm.remark = '';
}; };
// 加载容量单位类型选项
const loadCapacityUnitTypeOptions = async () => {
try {
const res: any = await getCapacityUnitType();
if (res.data?.options && Array.isArray(res.data.options)) {
capacityUnitTypeOptions.value = res.data.options.map((item: any) => ({
label: item.value,
value: item.key,
}));
}
} catch (error) {
console.error('获取容量单位类型失败:', error);
}
};
// 打开弹窗 // 打开弹窗
const openDialog = async (row?: any) => { const openDialog = async (row?: any) => {
resetForm(); resetForm();
isEdit.value = !!row; isEdit.value = !!row;
// 加载容量单位类型选项
await loadCapacityUnitTypeOptions();
if (row) { if (row) {
try { try {
const res: any = await getLocation(row.id); const res: any = await getLocation(row.id);
@@ -171,6 +211,8 @@ const openDialog = async (row?: any) => {
ruleForm.warehouseId = data.warehouseId || ''; ruleForm.warehouseId = data.warehouseId || '';
ruleForm.zoneId = data.zoneId || ''; ruleForm.zoneId = data.zoneId || '';
ruleForm.status = data.status || 'idle'; ruleForm.status = data.status || 'idle';
ruleForm.capacityUnitType = data.capacityUnitType || '';
ruleForm.capacityUnit = data.capacityUnit || '';
ruleForm.maxCapacity = data.maxCapacity || 0; ruleForm.maxCapacity = data.maxCapacity || 0;
ruleForm.remark = data.remark || ''; ruleForm.remark = data.remark || '';
} catch (error) { } catch (error) {
@@ -204,6 +246,8 @@ const onSubmit = async () => {
warehouseId: ruleForm.warehouseId, warehouseId: ruleForm.warehouseId,
zoneId: ruleForm.zoneId, zoneId: ruleForm.zoneId,
status: ruleForm.status, status: ruleForm.status,
capacityUnitType: ruleForm.capacityUnitType,
capacityUnit: ruleForm.capacityUnit,
maxCapacity: ruleForm.maxCapacity, maxCapacity: ruleForm.maxCapacity,
remark: ruleForm.remark, remark: ruleForm.remark,
}; };

View File

@@ -21,8 +21,8 @@
<el-select size="default" v-model="tableData.param.status" placeholder="请选择状态" clearable style="width: 120px"> <el-select size="default" v-model="tableData.param.status" placeholder="请选择状态" clearable style="width: 120px">
<el-option label="空闲" value="idle" /> <el-option label="空闲" value="idle" />
<el-option label="占用" value="occupied" /> <el-option label="占用" value="occupied" />
<el-option label="锁定" value="locked" /> <el-option label="禁用" value="disable" />
<el-option label="维护" value="maintenance" /> <el-option label="预留" value="reserved" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@@ -205,9 +205,9 @@ const getStatusTagType = (status: string) => {
return 'success'; return 'success';
case 'occupied': case 'occupied':
return 'warning'; return 'warning';
case 'locked': case 'disable':
return 'danger'; return 'danger';
case 'maintenance': case 'reserved':
return 'info'; return 'info';
default: default:
return 'info'; return 'info';
@@ -221,10 +221,10 @@ const getStatusText = (status: string) => {
return '空闲'; return '空闲';
case 'occupied': case 'occupied':
return '占用'; return '占用';
case 'locked': case 'disable':
return '锁定'; return '禁用';
case 'maintenance': case 'reserved':
return '维护'; return '预留';
default: default:
return status; return status;
} }

View File

@@ -107,6 +107,7 @@ const validatePhone = (rule: any, value: string, callback: any) => {
// 表单验证规则 // 表单验证规则
const rules = reactive<FormRules>({ const rules = reactive<FormRules>({
warehouseName: [{ required: true, message: '请输入仓库名称', trigger: 'blur' }], warehouseName: [{ required: true, message: '请输入仓库名称', trigger: 'blur' }],
warehouseCode: [{ required: true, message: '请输入仓库编码', trigger: 'blur' }],
contactPhone: [{ validator: validatePhone, trigger: 'blur' }], contactPhone: [{ validator: validatePhone, trigger: 'blur' }],
}); });

View File

@@ -98,6 +98,8 @@ const ruleForm = reactive({
const rules = reactive<FormRules>({ const rules = reactive<FormRules>({
zoneName: [{ required: true, message: '请输入库区名称', trigger: 'blur' }], zoneName: [{ required: true, message: '请输入库区名称', trigger: 'blur' }],
warehouseId: [{ required: true, message: '请选择所属仓库', trigger: 'change' }], warehouseId: [{ required: true, message: '请选择所属仓库', trigger: 'change' }],
zoneCode: [{ required: true, message: '库区编码', trigger: 'blur' }],
zoneType: [{ required: true, message: '库区类型', trigger: 'change' }],
}); });
// 重置表单 // 重置表单

View File

@@ -40,7 +40,6 @@
<el-table-column prop="zoneCode" label="库区编码" width="120" show-overflow-tooltip /> <el-table-column prop="zoneCode" label="库区编码" width="120" show-overflow-tooltip />
<el-table-column prop="zoneType" label="库区类型" width="100" show-overflow-tooltip /> <el-table-column prop="zoneType" label="库区类型" width="100" show-overflow-tooltip />
<el-table-column prop="warehouseName" label="所属仓库" width="150" show-overflow-tooltip /> <el-table-column prop="warehouseName" label="所属仓库" width="150" show-overflow-tooltip />
<el-table-column prop="capacity" label="容量" width="100" align="center" />
<el-table-column prop="status" label="状态" width="80" align="center"> <el-table-column prop="status" label="状态" width="80" align="center">
<template #default="scope"> <template #default="scope">
<el-switch <el-switch
@@ -216,8 +215,8 @@ const onCurrentChange = (page: number) => {
}; };
// 页面加载时获取数据 // 页面加载时获取数据
onMounted(() => { onMounted(async () => {
getWarehouseOptions(); await getWarehouseOptions();
getZoneList(); getZoneList();
}); });
</script> </script>