优化仓库和库区管理功能,将状态字段类型从number改为string,移除编辑表单中的状态选择项,在列表页面将状态标签改为开关组件支持直接切换状态,新增updateWarehouseStatus和updateZoneStatus接口用于批量更新状态,同时在操作列新增日志按钮并集成操作日志对话框组件,在列表中添加修改时间列,优化查询参数将name改为keyword统一搜索字段命名

2026-01-29 11:20:13 +08:00
parent 23cc5b22f8
commit 5864db37d8
9 changed files with 683 additions and 50 deletions
--- a/src/api/assets/location/index.ts
+++ b/src/api/assets/location/index.ts
@@ -0,0 +1,77 @@
+import { newService } from '/@/utils/request';
+
+// 库位查询参数
+export interface LocationQueryParams {
+	keyword?: string;
+	warehouseId?: string;
+	zoneId?: string;
+	status?: string;
+	pageNum?: number;
+	pageSize?: number;
+}
+
+// 库位数据接口
+export interface LocationData {
+	id?: string;
+	locationName: string;
+	locationCode?: string;
+	locationType?: string;
+	warehouseId?: string;
+	zoneId: string;
+	maxCapacity?: number;
+	remark?: string;
+}
+
+// 获取库位列表
+export function listLocations(params?: LocationQueryParams) {
+	return newService({
+		url: '/assets/location/listLocations',
+		method: 'get',
+		params,
+	});
+}
+
+// 获取库位详情
+export function getLocation(id: string) {
+	return newService({
+		url: '/assets/location/getLocation',
+		method: 'get',
+		params: { id },
+	});
+}
+
+// 创建库位
+export function createLocation(data: LocationData) {
+	return newService({
+		url: '/assets/location/createLocation',
+		method: 'post',
+		data,
+	});
+}
+
+// 更新库位
+export function updateLocation(data: LocationData) {
+	return newService({
+		url: '/assets/location/updateLocation',
+		method: 'put',
+		data,
+	});
+}
+
+// 删除库位
+export function deleteLocation(id: string) {
+	return newService({
+		url: '/assets/location/deleteLocation',
+		method: 'delete',
+		params: { id },
+	});
+}
+
+// 更新库位状态
+export function updateLocationStatus(data: { id: string[]; status: string }) {
+	return newService({
+		url: '/assets/location/updateLocationStatus',
+		method: 'put',
+		data,
+	});
+}
--- a/src/api/assets/warehouse/index.ts
+++ b/src/api/assets/warehouse/index.ts
@@ -2,8 +2,8 @@ import { newService } from '/@/utils/request';

 // 仓库查询参数
 export interface WarehouseQueryParams {
-	name?: string;
-	status?: number;
+	keyword?: string;
+	status?: string;
 	pageNum?: number;
 	pageSize?: number;
 }
@@ -16,7 +16,7 @@ export interface WarehouseData {
 	address?: string;
 	contactPerson?: string;
 	contactPhone?: string;
-	status?: number;
+	status?: string;
 	remark?: string;
 }

@@ -64,3 +64,12 @@ export function deleteWarehouse(id: string) {
 		params: { id },
 	});
 }
+
+// 更新仓库状态
+export function updateWarehouseStatus(data: { id: string[]; status: string }) {
+	return newService({
+		url: '/assets/warehouse/updateWarehouseStatus',
+		method: 'put',
+		data,
+	});
+}
--- a/src/api/assets/zone/index.ts
+++ b/src/api/assets/zone/index.ts
@@ -17,7 +17,7 @@ export interface ZoneData {
 	zoneType?: string;
 	warehouseId: string;
 	capacity?: number;
-	status?: number;
+	status?: string;
 	remark?: string;
 }

@@ -65,3 +65,12 @@ export function deleteZone(id: string) {
 		params: { id },
 	});
 }
+
+// 更新库区状态
+export function updateZoneStatus(data: { id: string[]; status: string }) {
+	return newService({
+		url: '/assets/zone/updateZoneStatus',
+		method: 'put',
+		data,
+	});
+}
--- a/src/views/assets/location/component/editLocation.vue
+++ b/src/views/assets/location/component/editLocation.vue
@@ -0,0 +1,221 @@
+<template>
+	<el-dialog
+		:title="isEdit ? '修改库位' : '新增库位'"
+		v-model="isShowDialog"
+		width="600px"
+		:close-on-click-modal="false"
+		@close="onCancel"
+	>
+		<el-form ref="formRef" :model="ruleForm" :rules="rules" label-width="100px">
+			<el-row :gutter="20">
+				<el-col :span="12">
+					<el-form-item label="库位名称" prop="locationName">
+						<el-input v-model="ruleForm.locationName" placeholder="请输入库位名称" clearable />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12">
+					<el-form-item label="库位编码" prop="locationCode">
+						<el-input v-model="ruleForm.locationCode" placeholder="请输入库位编码" clearable />
+					</el-form-item>
+				</el-col>
+			</el-row>
+			<el-row :gutter="20">
+				<el-col :span="12">
+					<el-form-item label="所属仓库" prop="warehouseId">
+						<el-select v-model="ruleForm.warehouseId" placeholder="请选择仓库" clearable style="width: 100%" @change="onWarehouseChange">
+							<el-option v-for="item in warehouseOptions" :key="item.id" :label="item.warehouseName" :value="item.id" />
+						</el-select>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12">
+					<el-form-item label="所属库区" prop="zoneId">
+						<el-select v-model="ruleForm.zoneId" placeholder="请选择库区" clearable style="width: 100%">
+							<el-option v-for="item in filteredZoneOptions" :key="item.id" :label="item.zoneName" :value="item.id" />
+						</el-select>
+					</el-form-item>
+				</el-col>
+			</el-row>
+			<el-row :gutter="20">
+				<el-col :span="12">
+					<el-form-item label="库位类型" prop="locationType">
+						<el-select v-model="ruleForm.locationType" placeholder="请选择库位类型" clearable style="width: 100%">
+							<el-option label="货架位" value="货架位" />
+							<el-option label="地面位" value="地面位" />
+							<el-option label="托盘位" value="托盘位" />
+							<el-option label="悬挂位" value="悬挂位" />
+						</el-select>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12">
+					<el-form-item label="最大容量" prop="maxCapacity">
+						<el-input-number v-model="ruleForm.maxCapacity" :min="0" placeholder="请输入最大容量" style="width: 100%" />
+					</el-form-item>
+				</el-col>
+			</el-row>
+			<el-row :gutter="20">
+				<el-col :span="24">
+					<el-form-item label="备注" prop="remark">
+						<el-input v-model="ruleForm.remark" type="textarea" :rows="3" placeholder="请输入备注" />
+					</el-form-item>
+				</el-col>
+			</el-row>
+		</el-form>
+		<template #footer>
+			<span class="dialog-footer">
+				<el-button @click="onCancel">取 消</el-button>
+				<el-button type="primary" @click="onSubmit" :loading="submitLoading">{{ isEdit ? '修 改' : '添 加' }}</el-button>
+			</span>
+		</template>
+	</el-dialog>
+</template>
+
+<script lang="ts">
+export default {
+	name: 'editLocation',
+};
+</script>
+
+<script setup lang="ts">
+import { ref, reactive, computed } from 'vue';
+import { ElMessage } from 'element-plus';
+import type { FormInstance, FormRules } from 'element-plus';
+import { createLocation, updateLocation, getLocation } from '/@/api/assets/location';
+
+// 定义props
+const props = defineProps<{
+	warehouseOptions: any[];
+	zoneOptions: any[];
+}>();
+
+// 定义事件
+const emit = defineEmits(['getLocationList']);
+
+// 表单ref
+const formRef = ref<FormInstance>();
+
+// 弹窗状态
+const isShowDialog = ref(false);
+const isEdit = ref(false);
+const submitLoading = ref(false);
+
+// 表单数据
+const ruleForm = reactive({
+	id: '',
+	locationName: '',
+	locationCode: '',
+	locationType: '',
+	warehouseId: '',
+	zoneId: '',
+	maxCapacity: 0,
+	remark: '',
+});
+
+// 根据选中的仓库过滤库区选项
+const filteredZoneOptions = computed(() => {
+	if (!ruleForm.warehouseId) {
+		return props.zoneOptions;
+	}
+	return props.zoneOptions.filter((z: any) => z.warehouseId === ruleForm.warehouseId);
+});
+
+// 仓库选择变化时清空库区选择
+const onWarehouseChange = () => {
+	ruleForm.zoneId = '';
+};
+
+// 表单验证规则
+const rules = reactive<FormRules>({
+	locationName: [{ required: true, message: '请输入库位名称', trigger: 'blur' }],
+	zoneId: [{ required: true, message: '请选择所属库区', trigger: 'change' }],
+});
+
+// 重置表单
+const resetForm = () => {
+	ruleForm.id = '';
+	ruleForm.locationName = '';
+	ruleForm.locationCode = '';
+	ruleForm.locationType = '';
+	ruleForm.warehouseId = '';
+	ruleForm.zoneId = '';
+	ruleForm.maxCapacity = 0;
+	ruleForm.remark = '';
+};
+
+// 打开弹窗
+const openDialog = async (row?: any) => {
+	resetForm();
+	isEdit.value = !!row;
+	
+	if (row) {
+		try {
+			const res: any = await getLocation(row.id);
+			const data = res.data;
+			ruleForm.id = data.id || '';
+			ruleForm.locationName = data.locationName || '';
+			ruleForm.locationCode = data.locationCode || '';
+			ruleForm.locationType = data.locationType || '';
+			ruleForm.warehouseId = data.warehouseId || '';
+			ruleForm.zoneId = data.zoneId || '';
+			ruleForm.maxCapacity = data.maxCapacity || 0;
+			ruleForm.remark = data.remark || '';
+		} catch (error) {
+			console.error('获取库位详情失败:', error);
+		}
+	}
+	
+	isShowDialog.value = true;
+};
+
+// 取消
+const onCancel = () => {
+	isShowDialog.value = false;
+	formRef.value?.resetFields();
+};
+
+// 提交
+const onSubmit = async () => {
+	const form = formRef.value;
+	if (!form) return;
+	
+	form.validate(async (valid: boolean) => {
+		if (valid) {
+			submitLoading.value = true;
+			try {
+				const data = {
+					id: ruleForm.id || undefined,
+					locationName: ruleForm.locationName,
+					locationCode: ruleForm.locationCode,
+					locationType: ruleForm.locationType,
+					warehouseId: ruleForm.warehouseId,
+					zoneId: ruleForm.zoneId,
+					maxCapacity: ruleForm.maxCapacity,
+					remark: ruleForm.remark,
+				};
+				
+				if (isEdit.value) {
+					await updateLocation(data);
+					ElMessage.success('修改成功');
+				} else {
+					await createLocation(data);
+					ElMessage.success('添加成功');
+				}
+				
+				isShowDialog.value = false;
+				emit('getLocationList');
+			} catch (error) {
+				console.error('提交失败:', error);
+			} finally {
+				submitLoading.value = false;
+			}
+		}
+	});
+};
+
+// 暴露方法
+defineExpose({
+	openDialog,
+});
+</script>
+
+<style scoped lang="scss">
+</style>
--- a/src/views/assets/location/index.vue
+++ b/src/views/assets/location/index.vue
@@ -0,0 +1,273 @@
+<template>
+	<div class="assets-location-page">
+		<div class="assets-location-container">
+			<el-card shadow="hover">
+				<div class="assets-location-search mb15">
+					<el-form :inline="true" :model="tableData.param">
+						<el-form-item label="库位名称">
+							<el-input size="default" v-model="tableData.param.keyword" placeholder="请输入库位名称" clearable style="width: 200px" />
+						</el-form-item>
+						<el-form-item label="所属仓库">
+							<el-select size="default" v-model="tableData.param.warehouseId" placeholder="请选择仓库" clearable style="width: 180px" @change="onWarehouseChange">
+								<el-option v-for="item in warehouseOptions" :key="item.id" :label="item.warehouseName" :value="item.id" />
+							</el-select>
+						</el-form-item>
+						<el-form-item label="所属库区">
+							<el-select size="default" v-model="tableData.param.zoneId" placeholder="请选择库区" clearable style="width: 180px">
+								<el-option v-for="item in filteredZoneOptions" :key="item.id" :label="item.zoneName" :value="item.id" />
+							</el-select>
+						</el-form-item>
+						<el-form-item label="状态">
+							<el-select size="default" v-model="tableData.param.status" placeholder="请选择状态" clearable style="width: 120px">
+								<el-option label="启用" value="enabled" />
+								<el-option label="禁用" value="disabled" />
+							</el-select>
+						</el-form-item>
+						<el-form-item>
+							<el-button size="default" type="primary" @click="getLocationList">
+								<el-icon><ele-Search /></el-icon>
+								查询
+							</el-button>
+							<el-button size="default" @click="onResetQuery">
+								<el-icon><ele-Refresh /></el-icon>
+								重置
+							</el-button>
+							<el-button size="default" type="success" @click="onOpenAdd">
+								<el-icon><ele-Plus /></el-icon>
+								新增
+							</el-button>
+						</el-form-item>
+					</el-form>
+				</div>
+				<el-table :data="tableData.data" style="width: 100%" v-loading="tableData.loading" border>
+					<el-table-column type="index" label="序号" width="60" align="center" />
+					<el-table-column prop="locationName" label="库位名称" min-width="150" show-overflow-tooltip />
+					<el-table-column prop="locationCode" label="库位编码" width="120" show-overflow-tooltip />
+					<el-table-column prop="locationType" label="库位类型" width="100" show-overflow-tooltip />
+					<el-table-column prop="warehouseName" label="所属仓库" width="150" show-overflow-tooltip />
+					<el-table-column prop="zoneName" label="所属库区" width="150" show-overflow-tooltip />
+					<el-table-column prop="maxCapacity" label="最大容量" width="100" align="center" />
+					<el-table-column prop="status" label="状态" width="80" align="center">
+						<template #default="scope">
+							<el-switch
+								v-model="scope.row.statusEnabled"
+								inline-prompt
+								active-text="启"
+								inactive-text="停"
+								@change="onStatusChange(scope.row)"
+							/>
+						</template>
+					</el-table-column>
+					<el-table-column prop="createdAt" label="创建时间" width="170" show-overflow-tooltip />
+					<el-table-column prop="updatedAt" label="修改时间" width="170" show-overflow-tooltip />
+					<el-table-column label="操作" width="180" fixed="right" align="center">
+						<template #default="scope">
+							<el-button size="small" text type="primary" @click="onEdit(scope.row)">修改</el-button>
+							<el-button size="small" text type="info" @click="onViewLog(scope.row)">日志</el-button>
+							<el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
+						</template>
+					</el-table-column>
+				</el-table>
+				<!-- 分页 -->
+				<div class="mt15" style="text-align: right">
+					<el-pagination
+						v-model:current-page="tableData.param.pageNum"
+						v-model:page-size="tableData.param.pageSize"
+						:page-sizes="[10, 20, 50, 100]"
+						:total="tableData.total"
+						layout="total, sizes, prev, pager, next, jumper"
+						@size-change="onSizeChange"
+						@current-change="onCurrentChange"
+					/>
+				</div>
+			</el-card>
+		</div>
+		<EditLocation ref="editLocationRef" :warehouseOptions="warehouseOptions" :zoneOptions="zoneOptions" @getLocationList="getLocationList" />
+		<OperationLogDialog ref="operationLogRef" />
+	</div>
+</template>
+
+<script lang="ts">
+export default {
+	name: 'assetsLocation',
+};
+</script>
+
+<script setup lang="ts">
+import { ref, reactive, computed, onMounted } from 'vue';
+import { ElMessage, ElMessageBox } from 'element-plus';
+import { listLocations, deleteLocation, updateLocationStatus } from '/@/api/assets/location';
+import { listWarehouses } from '/@/api/assets/warehouse';
+import { listZones } from '/@/api/assets/zone';
+import EditLocation from './component/editLocation.vue';
+import OperationLogDialog from '/@/views/assets/component/operationLogDialog.vue';
+
+// 表格数据
+const tableData = reactive({
+	data: [] as any[],
+	total: 0,
+	loading: false,
+	param: {
+		keyword: '',
+		warehouseId: '',
+		zoneId: '',
+		status: undefined as string | undefined,
+		pageNum: 1,
+		pageSize: 10,
+	},
+});
+
+// 仓库选项
+const warehouseOptions = ref<any[]>([]);
+// 库区选项
+const zoneOptions = ref<any[]>([]);
+
+// 根据选中的仓库过滤库区选项
+const filteredZoneOptions = computed(() => {
+	if (!tableData.param.warehouseId) {
+		return zoneOptions.value;
+	}
+	return zoneOptions.value.filter((z: any) => z.warehouseId === tableData.param.warehouseId);
+});
+
+// 编辑弹窗ref
+const editLocationRef = ref();
+// 日志弹窗ref
+const operationLogRef = ref();
+
+// 获取仓库列表
+const getWarehouseOptions = async () => {
+	try {
+		const res: any = await listWarehouses({ pageNum: 1, pageSize: 1000 });
+		warehouseOptions.value = res.data?.list || [];
+	} catch (error) {
+		console.error('获取仓库列表失败:', error);
+	}
+};
+
+// 获取库区列表
+const getZoneOptions = async () => {
+	try {
+		const res: any = await listZones({ pageNum: 1, pageSize: 1000 });
+		zoneOptions.value = res.data?.list || [];
+	} catch (error) {
+		console.error('获取库区列表失败:', error);
+	}
+};
+
+// 仓库选择变化时清空库区选择
+const onWarehouseChange = () => {
+	tableData.param.zoneId = '';
+};
+
+// 获取库位列表
+const getLocationList = async () => {
+	tableData.loading = true;
+	try {
+		const res: any = await listLocations(tableData.param);
+		const list = res.data?.list || [];
+		// 回填仓库名称和库区名称
+		const warehouseMap = new Map(warehouseOptions.value.map((w: any) => [w.id, w.warehouseName]));
+		const zoneMap = new Map(zoneOptions.value.map((z: any) => [z.id, z.zoneName]));
+		tableData.data = list.map((item: any) => ({
+			...item,
+			warehouseName: item.warehouseName || warehouseMap.get(item.warehouseId) || '',
+			zoneName: item.zoneName || zoneMap.get(item.zoneId) || '',
+			statusEnabled: item.status === 'enabled',
+		}));
+		tableData.total = res.data?.total || 0;
+	} catch (error) {
+		console.error('获取库位列表失败:', error);
+	} finally {
+		tableData.loading = false;
+	}
+};
+
+// 重置查询
+const onResetQuery = () => {
+	tableData.param.keyword = '';
+	tableData.param.warehouseId = '';
+	tableData.param.zoneId = '';
+	tableData.param.status = undefined;
+	tableData.param.pageNum = 1;
+	getLocationList();
+};
+
+// 打开新增弹窗
+const onOpenAdd = () => {
+	editLocationRef.value.openDialog();
+};
+
+// 打开编辑弹窗
+const onEdit = (row: any) => {
+	editLocationRef.value.openDialog(row);
+};
+
+// 状态切换
+const onStatusChange = async (row: any) => {
+	const newStatus = row.statusEnabled ? 'enabled' : 'disabled';
+	const statusText = row.statusEnabled ? '启用' : '禁用';
+	try {
+		await updateLocationStatus({ id: [row.id], status: newStatus });
+		ElMessage.success(`${statusText}成功`);
+	} catch (error) {
+		console.error('状态更新失败:', error);
+		// 失败时恢复原状态
+		row.statusEnabled = !row.statusEnabled;
+	}
+};
+
+// 查看日志
+const onViewLog = (row: any) => {
+	operationLogRef.value?.openDialog(row.id);
+};
+
+// 删除库位
+const onRowDel = (row: any) => {
+	ElMessageBox.confirm(`确定要删除库位【${row.locationName}】吗？`, '提示', {
+		confirmButtonText: '确定',
+		cancelButtonText: '取消',
+		type: 'warning',
+	}).then(async () => {
+		try {
+			await deleteLocation(row.id);
+			ElMessage.success('删除成功');
+			getLocationList();
+		} catch (error) {
+			console.error('删除失败:', error);
+		}
+	}).catch(() => {});
+};
+
+// 分页大小改变
+const onSizeChange = (size: number) => {
+	tableData.param.pageSize = size;
+	getLocationList();
+};
+
+// 当前页改变
+const onCurrentChange = (page: number) => {
+	tableData.param.pageNum = page;
+	getLocationList();
+};
+
+// 页面加载时获取数据
+onMounted(async () => {
+	await Promise.all([getWarehouseOptions(), getZoneOptions()]);
+	getLocationList();
+});
+</script>
+
+<style scoped lang="scss">
+.assets-location-page {
+	padding: 15px;
+	.assets-location-container {
+		.assets-location-search {
+			.el-form-item {
+				margin-bottom: 10px;
+				margin-right: 16px;
+			}
+		}
+	}
+}
+</style>
--- a/src/views/assets/warehouse/component/editWarehouse.vue
+++ b/src/views/assets/warehouse/component/editWarehouse.vue
@@ -38,16 +38,6 @@
 					</el-form-item>
 				</el-col>
 			</el-row>
-			<el-row :gutter="20">
-				<el-col :span="12">
-					<el-form-item label="状态" prop="status">
-						<el-radio-group v-model="ruleForm.status">
-							<el-radio :value="1">启用</el-radio>
-							<el-radio :value="0">禁用</el-radio>
-						</el-radio-group>
-					</el-form-item>
-				</el-col>
-			</el-row>
 						<el-row :gutter="20">
 				<el-col :span="24">
 					<el-form-item label="备注" prop="remark">
@@ -96,7 +86,6 @@ const ruleForm = reactive({
 	address: '',
 	contactPerson: '',
 	contactPhone: '',
-	status: 1,
 	remark: '',
 });

@@ -113,7 +102,6 @@ const resetForm = () => {
 	ruleForm.address = '';
 	ruleForm.contactPerson = '';
 	ruleForm.contactPhone = '';
-	ruleForm.status = 1;
 	ruleForm.remark = '';
 };

@@ -132,7 +120,6 @@ const openDialog = async (row?: any) => {
 			ruleForm.address = data.address || '';
 			ruleForm.contactPerson = data.contactPerson || '';
 			ruleForm.contactPhone = data.contactPhone || '';
-			ruleForm.status = (data.status === '1' || data.status === 1 || data.status === true) ? 1 : 0;
 			ruleForm.remark = data.remark || '';
 		} catch (error) {
 			console.error('获取仓库详情失败:', error);
@@ -164,7 +151,6 @@ const onSubmit = async () => {
 					address: ruleForm.address,
 					contactPerson: ruleForm.contactPerson,
 					contactPhone: ruleForm.contactPhone,
-					status: ruleForm.status,
 					remark: ruleForm.remark,
 				};
 				
--- a/src/views/assets/warehouse/index.vue
+++ b/src/views/assets/warehouse/index.vue
@@ -9,8 +9,8 @@
 						</el-form-item>
 						<el-form-item label="状态">
 							<el-select size="default" v-model="tableData.param.status" placeholder="请选择状态" clearable style="width: 120px">
-								<el-option label="启用" :value="1" />
-								<el-option label="禁用" :value="0" />
+								<el-option label="启用" value="enabled" />
+								<el-option label="禁用" value="disabled" />
 							</el-select>
 						</el-form-item>
 						<el-form-item>
@@ -36,17 +36,23 @@
 					<el-table-column prop="address" label="仓库地址" min-width="200" show-overflow-tooltip />
 					<el-table-column prop="contactPerson" label="联系人" width="100" show-overflow-tooltip />
 					<el-table-column prop="contactPhone" label="联系电话" width="130" show-overflow-tooltip />
-					<el-table-column prop="status" label="状态" width="100" align="center">
+					<el-table-column prop="status" label="状态" width="80" align="center">
 						<template #default="scope">
-							<el-tag :type="scope.row.status == '1' || scope.row.status === 1 ? 'success' : 'danger'">
-								{{ scope.row.status == '1' || scope.row.status === 1 ? '启用' : '禁用' }}
-							</el-tag>
+							<el-switch
+								v-model="scope.row.statusEnabled"
+								inline-prompt
+								active-text="启"
+								inactive-text="停"
+								@change="onStatusChange(scope.row)"
+							/>
 						</template>
 					</el-table-column>
 					<el-table-column prop="createdAt" label="创建时间" width="170" show-overflow-tooltip />
-					<el-table-column label="操作" width="150" fixed="right" align="center">
+					<el-table-column prop="updatedAt" label="修改时间" width="170" show-overflow-tooltip />
+					<el-table-column label="操作" width="180" fixed="right" align="center">
 						<template #default="scope">
 							<el-button size="small" text type="primary" @click="onEdit(scope.row)">修改</el-button>
+							<el-button size="small" text type="info" @click="onViewLog(scope.row)">日志</el-button>
 							<el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
 						</template>
 					</el-table-column>
@@ -66,6 +72,7 @@
 			</el-card>
 		</div>
 		<EditWarehouse ref="editWarehouseRef" @getWarehouseList="getWarehouseList" />
+		<OperationLogDialog ref="operationLogRef" />
 	</div>
 </template>

@@ -78,8 +85,9 @@ export default {
 <script setup lang="ts">
 import { ref, reactive, onMounted } from 'vue';
 import { ElMessage, ElMessageBox } from 'element-plus';
-import { listWarehouses, deleteWarehouse } from '/@/api/assets/warehouse';
+import { listWarehouses, deleteWarehouse, updateWarehouseStatus } from '/@/api/assets/warehouse';
 import EditWarehouse from './component/editWarehouse.vue';
+import OperationLogDialog from '/@/views/assets/component/operationLogDialog.vue';

 // 表格数据
 const tableData = reactive({
@@ -88,7 +96,7 @@ const tableData = reactive({
 	loading: false,
 	param: {
 		keyword: '',
-		status: undefined as number | undefined,
+		status: undefined as string | undefined,
 		pageNum: 1,
 		pageSize: 10,
 	},
@@ -96,13 +104,20 @@ const tableData = reactive({

 // 编辑弹窗ref
 const editWarehouseRef = ref();
+// 日志弹窗ref
+const operationLogRef = ref();

 // 获取仓库列表
 const getWarehouseList = async () => {
 	tableData.loading = true;
 	try {
 		const res: any = await listWarehouses(tableData.param);
-		tableData.data = res.data?.list || [];
+		const list = res.data?.list || [];
+		// 添加 statusEnabled 字段用于开关组件
+		tableData.data = list.map((item: any) => ({
+			...item,
+			statusEnabled: item.status === 'enabled' || item.status === '1' || item.status === 1,
+		}));
 		tableData.total = res.data?.total || 0;
 	} catch (error) {
 		console.error('获取仓库列表失败:', error);
@@ -129,6 +144,25 @@ const onEdit = (row: any) => {
 	editWarehouseRef.value.openDialog(row);
 };

+// 状态切换
+const onStatusChange = async (row: any) => {
+	const newStatus = row.statusEnabled ? 'enabled' : 'disabled';
+	const statusText = row.statusEnabled ? '启用' : '禁用';
+	try {
+		await updateWarehouseStatus({ id: [row.id], status: newStatus });
+		ElMessage.success(`${statusText}成功`);
+	} catch (error) {
+		console.error('状态更新失败:', error);
+		// 失败时恢复原状态
+		row.statusEnabled = !row.statusEnabled;
+	}
+};
+
+// 查看日志
+const onViewLog = (row: any) => {
+	operationLogRef.value?.openDialog(row.id);
+};
+
 // 删除仓库
 const onRowDel = (row: any) => {
 	ElMessageBox.confirm(`确定要删除仓库【${row.warehouseName}】吗？`, '提示', {
--- a/src/views/assets/zone/component/editZone.vue
+++ b/src/views/assets/zone/component/editZone.vue
@@ -45,14 +45,6 @@
 						<el-input-number v-model="ruleForm.capacity" :min="0" placeholder="请输入容量" style="width: 100%" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12">
-					<el-form-item label="状态" prop="status">
-						<el-radio-group v-model="ruleForm.status">
-							<el-radio :value="1">启用</el-radio>
-							<el-radio :value="0">禁用</el-radio>
-						</el-radio-group>
-					</el-form-item>
-				</el-col>
 			</el-row>
 			<el-row :gutter="20">
 				<el-col :span="24">
@@ -107,7 +99,6 @@ const ruleForm = reactive({
 	zoneType: '',
 	warehouseId: '',
 	capacity: 0,
-	status: 1,
 	remark: '',
 });

@@ -125,7 +116,6 @@ const resetForm = () => {
 	ruleForm.zoneType = '';
 	ruleForm.warehouseId = '';
 	ruleForm.capacity = 0;
-	ruleForm.status = 1;
 	ruleForm.remark = '';
 };

@@ -144,7 +134,6 @@ const openDialog = async (row?: any) => {
 			ruleForm.zoneType = data.zoneType || '';
 			ruleForm.warehouseId = data.warehouseId || '';
 			ruleForm.capacity = data.capacity || 0;
-			ruleForm.status = (data.status === '1' || data.status === 1 || data.status === true) ? 1 : 0;
 			ruleForm.remark = data.remark || '';
 		} catch (error) {
 			console.error('获取库区详情失败:', error);
@@ -176,7 +165,6 @@ const onSubmit = async () => {
 					zoneType: ruleForm.zoneType,
 					warehouseId: ruleForm.warehouseId,
 					capacity: ruleForm.capacity,
-					status: ruleForm.status,
 					remark: ruleForm.remark,
 				};
 				
--- a/src/views/assets/zone/index.vue
+++ b/src/views/assets/zone/index.vue
@@ -14,8 +14,8 @@
 						</el-form-item>
 						<el-form-item label="状态">
 							<el-select size="default" v-model="tableData.param.status" placeholder="请选择状态" clearable style="width: 120px">
-								<el-option label="启用" value="1" />
-								<el-option label="禁用" value="0" />
+								<el-option label="启用" value="enabled" />
+								<el-option label="禁用" value="disabled" />
 							</el-select>
 						</el-form-item>
 						<el-form-item>
@@ -41,17 +41,23 @@
 					<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="capacity" label="容量" width="100" align="center" />
-					<el-table-column prop="status" label="状态" width="100" align="center">
+					<el-table-column prop="status" label="状态" width="80" align="center">
 						<template #default="scope">
-							<el-tag :type="scope.row.status == '1' || scope.row.status === 1 ? 'success' : 'danger'">
-								{{ scope.row.status == '1' || scope.row.status === 1 ? '启用' : '禁用' }}
-							</el-tag>
+							<el-switch
+								v-model="scope.row.statusEnabled"
+								inline-prompt
+								active-text="启"
+								inactive-text="停"
+								@change="onStatusChange(scope.row)"
+							/>
 						</template>
 					</el-table-column>
 					<el-table-column prop="createdAt" label="创建时间" width="170" show-overflow-tooltip />
-					<el-table-column label="操作" width="150" fixed="right" align="center">
+					<el-table-column prop="updatedAt" label="修改时间" width="170" show-overflow-tooltip />
+					<el-table-column label="操作" width="180" fixed="right" align="center">
 						<template #default="scope">
 							<el-button size="small" text type="primary" @click="onEdit(scope.row)">修改</el-button>
+							<el-button size="small" text type="info" @click="onViewLog(scope.row)">日志</el-button>
 							<el-button size="small" text type="danger" @click="onRowDel(scope.row)">删除</el-button>
 						</template>
 					</el-table-column>
@@ -71,6 +77,7 @@
 			</el-card>
 		</div>
 		<EditZone ref="editZoneRef" :warehouseOptions="warehouseOptions" @getZoneList="getZoneList" />
+		<OperationLogDialog ref="operationLogRef" />
 	</div>
 </template>

@@ -83,9 +90,10 @@ export default {
 <script setup lang="ts">
 import { ref, reactive, onMounted } from 'vue';
 import { ElMessage, ElMessageBox } from 'element-plus';
-import { listZones, deleteZone } from '/@/api/assets/zone';
+import { listZones, deleteZone, updateZoneStatus } from '/@/api/assets/zone';
 import { listWarehouses } from '/@/api/assets/warehouse';
 import EditZone from './component/editZone.vue';
+import OperationLogDialog from '/@/views/assets/component/operationLogDialog.vue';

 // 表格数据
 const tableData = reactive({
@@ -106,6 +114,8 @@ const warehouseOptions = ref<any[]>([]);

 // 编辑弹窗ref
 const editZoneRef = ref();
+// 日志弹窗ref
+const operationLogRef = ref();

 // 获取仓库列表
 const getWarehouseOptions = async () => {
@@ -122,7 +132,14 @@ const getZoneList = async () => {
 	tableData.loading = true;
 	try {
 		const res: any = await listZones(tableData.param);
-		tableData.data = res.data?.list || [];
+		const list = res.data?.list || [];
+		// 后端未返回 warehouseName 时，用仓库选项回填展示
+		const warehouseMap = new Map(warehouseOptions.value.map((w: any) => [w.id, w.warehouseName]));
+		tableData.data = list.map((item: any) => ({
+			...item,
+			warehouseName: item.warehouseName || warehouseMap.get(item.warehouseId) || '',
+			statusEnabled: item.status === 'enabled',
+		}));
 		tableData.total = res.data?.total || 0;
 	} catch (error) {
 		console.error('获取库区列表失败:', error);
@@ -150,6 +167,25 @@ const onEdit = (row: any) => {
 	editZoneRef.value.openDialog(row);
 };

+// 状态切换
+const onStatusChange = async (row: any) => {
+	const newStatus = row.statusEnabled ? 'enabled' : 'disabled';
+	const statusText = row.statusEnabled ? '启用' : '禁用';
+	try {
+		await updateZoneStatus({ id: [row.id], status: newStatus });
+		ElMessage.success(`${statusText}成功`);
+	} catch (error) {
+		console.error('状态更新失败:', error);
+		// 失败时恢复原状态
+		row.statusEnabled = !row.statusEnabled;
+	}
+};
+
+// 查看日志
+const onViewLog = (row: any) => {
+	operationLogRef.value?.openDialog(row.id);
+};
+
 // 删除库区
 const onRowDel = (row: any) => {
 	ElMessageBox.confirm(`确定要删除库区【${row.zoneName}】吗？`, '提示', {