feat(机柜管理): 添加格口操作记录查询功能

在机柜详情页新增格口操作记录标签页，包含查询条件和分页展示功能修改package.json中的zip命令以支持powershell时间戳格式
2026-01-05 17:48:00 +08:00 · 2026-01-05 17:48:00 +08:00 · df58eb2ced
parent 353c032427
commit df58eb2ced
3 changed files with 114 additions and 1 deletions
--- a/package.json
+++ b/package.json
@ -22,7 +22,7 @@
    "lint": "pnpm lint:eslint && pnpm lint:prettier && pnpm lint:stylelint",
    "prepare": "husky install",
    "preinstall": "npx only-allow pnpm",
-    "zip": "7z a -tzip dist/shop-front-end-%date:~0,4%%date:~5,2%%date:~8,2%-%time:~0,2%%time:~3,2%%time:~6,2%.zip .\\dist\\* -xr!*.zip"
+    "zip": "powershell -Command \"$timestamp = (Get-Date).ToString('yyyyMMdd-HHmmss'); 7z a -tzip dist/shop-front-end-$timestamp.zip ./dist/* -xr'!*.zip'\""
  },
  "browserslist": [
    "> 1%",
--- a/src/api/cabinet/cell-operation.ts
+++ b/src/api/cabinet/cell-operation.ts
@ -11,6 +11,15 @@ export interface SearchCabinetCellOperationQuery extends BasePageQuery {
  status?: number;
 }

+export interface SearchCabinetCellOperationDetailQuery extends SearchCabinetCellOperationQuery {
+  /** 机柜ID */
+  cabinetId?: number;
+  /** 地址ID */
+  shopId?: number;
+  /** 格口号 */
+  cellNo?: number;
+}
+
 export interface CabinetCellOperationDTO {
  /** 操作流水号 */
  operationId: number;
@ -61,6 +70,13 @@ export const getCabinetCellOperationList = (params?: SearchCabinetCellOperationQ
  });
 };

+
+export const getCabinetCellOperationPageV2 = (params?: SearchCabinetCellOperationDetailQuery) => {
+  return http.request<ResponseData<PageDTO<CabinetCellOperationDTO>>>('get', '/cabinet/cellOperations/page', {
+    params
+  });
+};
+
 export const addCabinetCellOperation = (data: AddCabinetCellOperationCommand) => {
  return http.request<ResponseData<void>>('post', '/cabinet/cellOperations', {
    data
--- a/src/views/cabinet/smart-cabinet-card/detail.vue
+++ b/src/views/cabinet/smart-cabinet-card/detail.vue
@ -20,6 +20,7 @@ import Search from "@iconify-icons/ep/search";
 import Refresh from "@iconify-icons/ep/refresh";
 import CellFormModal from "@/views/cabinet/cabinet-cell/cell-form-modal.vue";
 import CellEditModal from "@/views/cabinet/cabinet-cell/cell-edit-modal.vue";
+import { getCabinetCellOperationPageV2, type CabinetCellOperationDTO, type SearchCabinetCellOperationDetailQuery } from "@/api/cabinet/cell-operation";
 import { getGoodsInfo } from "@/api/shop/goods";
 import EditCabinetDrawer from "./edit-cabinet-drawer.vue";
 import { CabinetMainboardDTO, deleteMainboard, getMainboardList, updateMainboard } from "@/api/cabinet/mainboards";
@ -85,6 +86,18 @@ const currentCellId = ref<number>();
 const cellFormVisible = ref(false);
 const cellEditVisible = ref(false);

+// 格口操作记录
+const operationList = ref<CabinetCellOperationDTO[]>([]);
+const operationPagination = ref({
+  pageSize: 10,
+  currentPage: 1,
+  total: 0
+});
+const searchOperationParams = ref<SearchCabinetCellOperationDetailQuery>({
+  operationType: null,
+  cellNo: null
+});
+
 const currentPaymentMethods = computed(() => {
  if (typeof shopInfo.value.mode !== 'number') return [];
  const methodValues = modeToPaymentMethodMap[shopInfo.value.mode] || [];
@ -234,6 +247,32 @@ async function fetchMainboardList() {
  }
 }

+async function fetchOperationList() {
+  try {
+    loading.value = true;
+    const { data } = await getCabinetCellOperationPageV2({
+      ...searchOperationParams.value,
+      cabinetId: cabinetId.value,
+      pageSize: operationPagination.value.pageSize,
+      pageNum: operationPagination.value.currentPage
+    });
+    operationList.value = data.rows;
+    operationPagination.value.total = data.total;
+  } finally {
+    loading.value = false;
+  }
+}
+
+function handleOperationSizeChange(val: number) {
+  operationPagination.value.pageSize = val;
+  fetchOperationList();
+}
+
+function handleOperationPageChange(val: number) {
+  operationPagination.value.currentPage = val;
+  fetchOperationList();
+}
+
 function handleMainboardSizeChange(val: number) {
  mainboardPagination.value.pageSize = val;
  fetchMainboardList();
@ -325,6 +364,7 @@ onMounted(() => {
  fetchCabinetDetail();
  fetchCellList();
  fetchMainboardList();
+  fetchOperationList();
 });
 </script>

@ -357,6 +397,7 @@ onMounted(() => {
            <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-tab-pane label="开启记录" name="cellOperations"></el-tab-pane>
          </el-tabs>
        </div>

@ -597,6 +638,53 @@ onMounted(() => {
            layout="total, sizes, prev, pager, next, jumper" :total="mainboardPagination.total"
            @size-change="handleMainboardSizeChange" @current-change="handleMainboardPageChange" class="pagination" />
        </div>
+
+        <div class="operation-details" v-if="activeTab === 'cellOperations'">
+          <el-form :inline="true" :model="searchOperationParams" class="search-form">
+            <el-form-item prop="cellNo">
+              <el-input v-model="searchOperationParams.cellNo" placeholder="请输入格口号" clearable class="!w-[120px]"
+                @keydown.enter.prevent="fetchOperationList" />
+            </el-form-item>
+            <el-form-item prop="operationType">
+              <el-select v-model="searchOperationParams.operationType" placeholder="操作类型" clearable class="!w-[140px]">
+                <el-option label="用户操作" :value="1" />
+                <el-option label="管理员操作" :value="2" />
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" :icon="useRenderIcon(Search)" :loading="loading"
+                @click="fetchOperationList">搜索</el-button>
+              <el-button :icon="useRenderIcon(Refresh)"
+                @click="() => { searchOperationParams.operationType = null; searchOperationParams.cellNo = null; searchOperationParams.status = null; fetchOperationList(); }">重置</el-button>
+            </el-form-item>
+          </el-form>
+          <el-table v-loading="loading" :data="operationList" border row-key="operationId">
+            <el-table-column label="操作ID" prop="operationId" width="100" />
+            <el-table-column label="格口号" prop="cellNo" width="100" />
+            <el-table-column label="操作人" prop="name" width="100" />
+            <el-table-column label="手机号" prop="mobile" width="120" />
+            <el-table-column label="商品名称" prop="goodsName" min-width="120" />
+            <el-table-column label="操作类型" prop="operationType" width="100">
+              <template #default="{ row }">
+                <el-tag :type="row.operationType === 1 ? 'success' : 'warning'">
+                  {{ { 1: '用户', 2: '管理员' }[row.operationType] }}
+                </el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作状态" prop="status" width="100">
+              <template #default="{ row }">
+                <el-tag :type="row.status === 1 ? 'success' : 'danger'">
+                  {{ { 1: '正常', 2: '失败' }[row.status] }}
+                </el-tag>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作时间" prop="createTime" width="160" />
+          </el-table>
+          <el-pagination v-model:current-page="operationPagination.currentPage"
+            v-model:page-size="operationPagination.pageSize" :page-sizes="[10, 20, 50]"
+            layout="total, sizes, prev, pager, next, jumper" :total="operationPagination.total"
+            @size-change="handleOperationSizeChange" @current-change="handleOperationPageChange" class="pagination" />
+        </div>
      </el-card>
      <GatewayConfigModal v-model="gatewayConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
      <ShopConfigModal v-model="shopConfigVisible" :cabinet-id="cabinetId" @refresh="fetchCabinetDetail" />
@ -774,4 +862,13 @@ onMounted(() => {
 .pagination {
  margin-top: 10px;
 }
+
+.operation-details {
+  .search-form {
+    :deep(.el-form-item) {
+      margin-bottom: 12px;
+      margin-right: 12px;
+    }
+  }
+}
 </style>