feat(订单管理): 添加柜机筛选功能并优化格口显示

在订单管理页面中新增了柜机筛选功能，用户可以通过左侧的柜机列表筛选订单。同时，在格口开启记录页面中添加了格口ID的显示列，以方便用户查看和管理格口信息。

src/api/shop/order.ts

@@ -3,6 +3,8 @@ import { http } from "@/utils/http";
 export interface OrderQuery extends BasePageQuery {
   /** 订单编号 */
   orderId?: number;
+  /** 柜机id */
+  cabinetId?: number;
   /** 格口id */
   cellId?: number;
   /** 

src/views/cabinet/operation/index.vue

@@ -111,6 +111,7 @@ getList();
     <PureTableBar title="格口开启记录" @refresh="getList">
       <el-table ref="tableRef" v-loading="loading" :data="dataList" row-key="operationId" border>
         <el-table-column label="操作ID" prop="operationId" width="120" />
+        <el-table-column label="格口ID" prop="cellId" width="120" />
         <el-table-column label="操作人" prop="name" width="120" />
         <el-table-column label="手机号" prop="mobile" width="120" />
         <el-table-column label="商品名称" prop="goodsName" width="180" />

src/views/cabinet/smart-cabinet/index.vue

@@ -199,8 +199,7 @@ getList();
             <el-button type="primary" link :icon="useRenderIcon(EditPen)" @click="handleEdit(row)">
               编辑
             </el-button>
-            <el-button type="warning" link :icon="useRenderIcon('fluent:cell-phone-arrow-right-20-regular')"
-              @click="goCellManagement(row)">
+            <el-button type="warning" link :icon="useRenderIcon(EditPen)" @click="goCellManagement(row)">
               格口
             </el-button>
             <el-button type="warning" link :icon="useRenderIcon('ant-design:gateway-outlined')"

src/views/shop/order/index.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
-import { ref, watch } from "vue";
+import { ref, watch, onMounted } from "vue";
 import { PureTableBar } from "@/components/RePureTableBar";
 import { useRenderIcon } from "@/components/ReIcon/src/hooks";
 import { getOrderListApi, exportOrderExcelApi, type OrderDTO, OrderQuery } from "@/api/shop/order";
+import { allCabinets, SmartCabinetDTO } from "@/api/cabinet/smart-cabinet";
 import Search from "@iconify-icons/ep/search";
 import Refresh from "@iconify-icons/ep/refresh";
 import { ElMessage } from "element-plus";
@@ -15,8 +16,10 @@ const route = useRoute();
 
 const formRef = ref();
 const tableRef = ref();
+const cabinets = ref<SmartCabinetDTO[]>([]);
 
 const searchFormParams = ref<OrderQuery>({
+  cabinetId: null,
   orderId: null,
   cellId: null,
   status: null,
@@ -36,6 +39,15 @@ const pagination = ref({
 const loading = ref(false);
 const dataList = ref<OrderDTO[]>([]);
 
+onMounted(async () => {
+  const { data } = await allCabinets();
+  cabinets.value = data;
+  if (data.length > 0) {
+    searchFormParams.value.cabinetId = data[0].cabinetId;
+    getList();
+  }
+});
+
 const getList = async () => {
   try {
     loading.value = true;
@@ -107,7 +119,19 @@ getList();
 </script>
 
 <template>
-  <div class="main">
+  <div class="main flex">
+    <!-- 左侧柜机列表 -->
+    <div class="w-[200px] mr-4 bg-white rounded shadow p-4">
+      <div class="text-lg font-bold mb-4">柜机列表</div>
+      <div class="space-y-2">
+        <div v-for="cabinet in cabinets" :key="cabinet.cabinetId" class="p-2 rounded cursor-pointer hover:bg-gray-100"
+          :class="{ 'bg-blue-50': searchFormParams.cabinetId === cabinet.cabinetId }"
+          @click="searchFormParams.cabinetId = cabinet.cabinetId; onSearch()">
+          {{ cabinet.cabinetName }}
+        </div>
+      </div>
+    </div>
+    <div class="flex-1">
       <el-form ref="formRef" :inline="true" :model="searchFormParams"
         class="search-form bg-bg_color w-[99/100] pl-8 pt-[12px]">
         <!-- <el-form-item label="时间范围：">
@@ -227,6 +251,7 @@ getList();
           @size-change="onSizeChange" @current-change="onCurrentChange" />
       </PureTableBar>
     </div>
+  </div>
 </template>
 
 <style scoped>