feat(机柜管理): 添加主板管理功能并更新机柜图片映射

在机柜管理模块中添加了主板管理功能，包括主板列表的查询、编辑和删除操作。同时更新了机柜图片映射，移除了不再使用的图片文件并调整了相关映射配置。

src/api/cabinet/mainboards.ts

@@ -0,0 +1,88 @@
+import { http } from '@/utils/http';
+
+/**
+ * 查询机柜主板信息参数
+ */
+export interface SearchCabinetMainboardQuery extends BasePageQuery {
+  /** 关联柜机ID */
+  cabinetId?: number;
+  /** 锁控板序号 */
+  lockControlNo?: number;
+}
+
+/**
+ * 机柜主板信息
+ */
+export interface CabinetMainboardDTO {
+  /** 主板唯一ID */
+  mainboardId?: number;
+  /** 关联柜机ID */
+  cabinetId: number;
+  /** 锁控板序号 */
+  lockControlNo: number;
+  /** 创建时间 */
+  createTime?: string;
+  /** 更新时间 */
+  updateTime?: string;
+}
+
+/**
+ * 添加机柜主板信息参数
+ */
+export interface AddCabinetMainboardCommand {
+  /** 关联柜机ID */
+  cabinetId: number;
+  /** 锁控板序号 */
+  lockControlNo: number;
+}
+
+/**
+ * 更新机柜主板信息参数
+ */
+export interface UpdateCabinetMainboardCommand {
+  /** 主板唯一ID */
+  mainboardId: number;
+  /** 关联柜机ID */
+  cabinetId?: number;
+  /** 锁控板序号 */
+  lockControlNo?: number;
+}
+
+/**
+ * 获取机柜主板列表
+ * @param params 查询参数
+ */
+export const getMainboardList = (params?: SearchCabinetMainboardQuery) => {
+  return http.request<ResponseData<PageDTO<CabinetMainboardDTO>>>('get', '/cabinet/mainboards', {
+    params
+  });
+};
+
+/**
+ * 添加机柜主板
+ * @param data 主板信息
+ */
+export const addMainboard = (data: AddCabinetMainboardCommand) => {
+  return http.request<ResponseData<void>>('post', '/cabinet/mainboards', {
+    data
+  });
+};
+
+/**
+ * 更新机柜主板信息
+ * @param id 主板ID
+ * @param data 更新数据
+ */
+export const updateMainboard = (id: number, data: UpdateCabinetMainboardCommand) => {
+  return http.request<ResponseData<void>>('put', `/cabinet/mainboards/${id}`, {
+    data
+  });
+};
+
+/**
+ * 删除机柜主板
+ * @param ids 主板ID(多个用逗号分隔)
+ */
+export const deleteMainboard = (ids: string) => {
+  return http.request<ResponseData<void>>('delete', `/cabinet/mainboards/${ids}`);
+};

src/utils/cabinetImgMap.ts

@@ -28,15 +28,11 @@ export const CabinetImgMap = {
     name: "60口机柜",
   },
   8: {
-    img: "cabinet_120_6X20.jpg",
-    name: "120口机柜6X20",
+    img: "cabinet_120.jpg",
+    name: "120口机柜",
   },
   9: {
     img: "cabinet_4.jpg",
     name: "4口机柜",
   },
-  10: {
-    img: "cabinet_120_4X30.jpg",
-    name: "120口机柜4X30",
-  },
 }

src/views/cabinet/smart-cabinet-card/detail.vue

@@ -17,6 +17,7 @@ import AddFill from "@iconify-icons/ri/add-circle-line";
 import Search from "@iconify-icons/ep/search";
 import Refresh from "@iconify-icons/ep/refresh";
 import { getGoodsInfo } from "@/api/shop/goods";
+import { CabinetMainboardDTO, deleteMainboard, getMainboardList, updateMainboard } from "@/api/cabinet/mainboards";
 
 defineOptions({
   name: "SmartCabinetDetail"
@@ -33,6 +34,13 @@ const cabinetInfo = ref<SmartCabinetDTO>({
 });
 const loading = ref(false);
 const activeTab = ref('cells');
+const mainboardConfigVisible = ref(false);
+const mainboardList = ref<CabinetMainboardDTO[]>([]);
+const mainboardPagination = ref({
+  pageSize: 5,
+  currentPage: 1,
+  total: 0
+});
 const cabinetId = ref<number>(0);
 const gatewayConfigVisible = ref(false);
 const shopConfigVisible = ref(false);
@@ -146,10 +154,73 @@ function handleCellPageChange(val: number) {
   fetchCellList();
 }
 
+async function fetchMainboardList() {
+  try {
+    loading.value = true;
+    const { data } = await getMainboardList({
+      cabinetId: cabinetId.value,
+      pageSize: mainboardPagination.value.pageSize,
+      pageNum: mainboardPagination.value.currentPage
+    });
+    mainboardList.value = data.rows;
+    mainboardPagination.value.total = data.total;
+  } finally {
+    loading.value = false;
+  }
+}
+
+function handleMainboardSizeChange(val: number) {
+  mainboardPagination.value.pageSize = val;
+  fetchMainboardList();
+}
+
+function handleMainboardPageChange(val: number) {
+  mainboardPagination.value.currentPage = val;
+  fetchMainboardList();
+}
+
+async function handleEditMainboard(row: CabinetMainboardDTO) {
+  try {
+    const { value } = await ElMessageBox.prompt(
+      '请输入锁控板序号',
+      '编辑主板',
+      {
+        inputPattern: /^\d+$/,
+        inputValue: row.lockControlNo.toString(),
+        inputErrorMessage: '请输入有效的数字'
+      }
+    );
+    await updateMainboard(row.mainboardId!, {
+      mainboardId: row.mainboardId,
+      lockControlNo: Number(value)
+    });
+    ElMessage.success('主板更新成功');
+    fetchMainboardList();
+  } catch (error) {
+    console.error('操作取消或失败', error);
+  }
+}
+
+async function handleDeleteMainboard(row: CabinetMainboardDTO) {
+  try {
+    await ElMessageBox.confirm(
+      '确认要删除该主板吗？',
+      '警告',
+      { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }
+    );
+    await deleteMainboard(row.mainboardId!.toString());
+    ElMessage.success('主板删除成功');
+    fetchMainboardList();
+  } catch (error) {
+    console.error('操作取消或失败', error);
+  }
+}
+
 onMounted(() => {
   cabinetId.value = Number(route.query.id);
   fetchCabinetDetail();
   fetchCellList();
+  fetchMainboardList();
 });
 </script>
 
@@ -200,6 +271,7 @@ onMounted(() => {
           <el-tabs type="card" v-model="activeTab">
             <el-tab-pane label="格口管理" name="cells"></el-tab-pane>
             <el-tab-pane label="基本信息" name="basic"></el-tab-pane>
+            <el-tab-pane label="主板管理" name="mainboards"></el-tab-pane>
           </el-tabs>
         </div>
 
@@ -208,6 +280,9 @@ onMounted(() => {
           <el-descriptions-item label="主柜名称">{{ cabinetInfo.mainCabinetName || '-' }}</el-descriptions-item>
           <el-descriptions-item label="MQTT服务器ID">{{ cabinetInfo.mqttServerId || '-' }}</el-descriptions-item>
           <el-descriptions-item label="操作员">{{ cabinetInfo.operator || '-' }}</el-descriptions-item>
+          <el-button type="primary" link :icon="useRenderIcon('ep:setting')" @click="mainboardConfigVisible = true">
+            配置主板
+          </el-button>
         </el-descriptions>
 
         <div class="cell-details" v-if="activeTab === 'cells'">
@@ -266,6 +341,27 @@ onMounted(() => {
             :total="cellPagination.total" @size-change="handleCellSizeChange" @current-change="handleCellPageChange"
             class="pagination" />
         </div>
+
+        <div class="mainboard-details" v-if="activeTab === 'mainboards'">
+          <el-table v-loading="loading" :data="mainboardList" border>
+            <el-table-column label="主板ID" prop="mainboardId" width="80" />
+            <el-table-column label="锁控板序号" prop="lockControlNo" width="120" />
+            <el-table-column label="操作" width="150" fixed="right">
+              <template #default="{ row }">
+                <el-button type="primary" link :icon="useRenderIcon(EditPen)" @click="handleEditMainboard(row)">
+                  编辑
+                </el-button>
+                <el-button type="danger" link :icon="useRenderIcon(Delete)" @click="handleDeleteMainboard(row)">
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <el-pagination v-model:current-page="mainboardPagination.currentPage"
+            v-model:page-size="mainboardPagination.pageSize" :page-sizes="[5, 8, 16, 24, 32]"
+            layout="total, sizes, prev, pager, next, jumper" :total="mainboardPagination.total"
+            @size-change="handleMainboardSizeChange" @current-change="handleMainboardPageChange" class="pagination" />
+        </div>
       </el-card>
       <GatewayConfigModal v-model="gatewayConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
       <ShopConfigModal v-model="shopConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />