From 8a3cd9fec9adad297ee46dfdf1d590612c47df4b Mon Sep 17 00:00:00 2001
From: dzq <dzq@ys.com>
Date: Wed, 28 May 2025 10:03:32 +0800
Subject: [PATCH] =?UTF-8?q?refactor(views):=20=E4=BC=98=E5=8C=96=E8=A1=A8?=
 =?UTF-8?q?=E5=8D=95=E5=92=8C=E8=A1=A8=E6=A0=BC=E6=A0=B7=E5=BC=8F=E5=8F=8A?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 移除表单项的冗余label文本，使用placeholder替代
- 统一搜索和重置按钮的间距样式
- 替换PureTableBar为自定义table-container样式
- 调整分页组件样式和默认页大小
- 为表格容器添加统一样式包括阴影、圆角和间距
```

这个提交消息遵循了以下原则：
1. 使用refactor类型，因为主要是代码结构调整和样式优化，不改变功能
2. 添加了scope(views)表明修改范围是视图组件
3. 描述简明扼要，说明了主要修改内容
4. 在正文中使用列表形式列举了主要变更点
5. 保持了中文语言环境下的简洁表达
6. 符合50字符限制且不使用句号结尾的要求
---
 src/views/cabinet/operation/index.vue | 37 ++++++++++++------
 src/views/shop/approval/index.vue     | 55 +++++++++++++++++----------
 src/views/shop/goods/index.vue        |  6 +--
 src/views/shop/order/index.vue        | 51 +++++++++++++++++--------
 src/views/user/ab98/index.vue         |  6 +--
 5 files changed, 101 insertions(+), 54 deletions(-)

diff --git a/src/views/cabinet/operation/index.vue b/src/views/cabinet/operation/index.vue
index 75a46d9..c9c114d 100644
--- a/src/views/cabinet/operation/index.vue
+++ b/src/views/cabinet/operation/index.vue
@@ -83,33 +83,33 @@ getList();
   <div class="main">
     <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="格口ID：" prop="cellId">
+      <el-form-item prop="cellId">
         <el-input @keydown.enter.prevent="onSearch" v-model="searchFormParams.cellId" placeholder="请输入格口ID" clearable
           class="!w-[200px]" />
       </el-form-item>
-      <el-form-item label="操作类型：" prop="operationType">
+      <el-form-item prop="operationType">
         <el-select v-model="searchFormParams.operationType" placeholder="请选择类型" clearable class="!w-[180px]">
           <el-option label="用户操作" :value="1" />
           <el-option label="管理员操作" :value="2" />
         </el-select>
       </el-form-item>
-      <el-form-item label="操作状态：" prop="status">
+      <el-form-item prop="status">
         <el-select v-model="searchFormParams.status" placeholder="请选择状态" clearable class="!w-[180px]">
           <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)" @click="onSearch">
+        <el-button type="primary" :icon="useRenderIcon(Search)" @click="onSearch" class="mr-2">
           搜索
         </el-button>
-        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm">
+        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm" class="mr-2">
           重置
         </el-button>
       </el-form-item>
     </el-form>
 
-    <PureTableBar title="格口开启记录" @refresh="getList">
+    <div class="table-container">
       <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" />
@@ -134,13 +134,28 @@ getList();
       </el-table>
       <el-pagination v-model:current-page="pagination.currentPage" v-model:page-size="pagination.pageSize"
         :page-sizes="[10, 20, 50]" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"
-        @size-change="onSizeChange" @current-change="onCurrentChange" />
-    </PureTableBar>
+        @size-change="onSizeChange" @current-change="onCurrentChange" class="pagination" />
+    </div>
   </div>
 </template>
 
-<style scoped>
-.right-btn {
-  margin: 0;
+<style scoped lang="scss">
+.table-container {
+  margin-top: 8px;
+  background-color: var(--el-bg-color);
+  border-radius: 4px;
+  padding: 16px;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
+  display: flex;
+  flex-direction: column;
+
+  .el-table {
+    flex: 1;
+    overflow: hidden;
+  }
+
+  .pagination {
+    margin-top: 10px;
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/shop/approval/index.vue b/src/views/shop/approval/index.vue
index 8ccf598..c2feefa 100644
--- a/src/views/shop/approval/index.vue
+++ b/src/views/shop/approval/index.vue
@@ -128,40 +128,40 @@ getList();
   <div class="main">
     <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="审批时间：">
+      <el-form-item>
         <el-date-picker v-model="searchFormParams.approvalTime" type="date" placeholder="选择审批时间"
           value-format="YYYY-MM-DD HH:mm:ss" class="!w-[200px]" />
       </el-form-item>
-      <el-form-item label="审批ID：" prop="approvalId">
+      <el-form-item prop="approvalId">
         <el-input @keydown.enter.prevent="onSearch" v-model.number="searchFormParams.approvalId" placeholder="请输入审批ID"
           clearable class="!w-[180px]" />
       </el-form-item>
-      <el-form-item label="订单ID：" prop="orderId">
+      <el-form-item prop="orderId">
         <el-input @keydown.enter.prevent="onSearch" v-model.number="searchFormParams.orderId" placeholder="请输入订单ID"
           clearable class="!w-[180px]" />
       </el-form-item>
-      <el-form-item label="商品ID：" prop="goodsId">
+      <el-form-item prop="goodsId">
         <el-input @keydown.enter.prevent="onSearch" v-model.number="searchFormParams.goodsId" placeholder="请输入商品ID"
           clearable class="!w-[180px]" />
       </el-form-item>
-      <el-form-item label="状态：" prop="status">
-        <el-select v-model="searchFormParams.status" placeholder="请选择状态" clearable class="!w-[180px]">
+      <el-form-item prop="status">
+        <el-select v-model="searchFormParams.status" placeholder="请选择审核状态" clearable class="!w-[180px]">
           <el-option label="待审核" :value="1" />
           <el-option label="已通过" :value="2" />
           <el-option label="已驳回" :value="3" />
         </el-select>
       </el-form-item>
-      <el-form-item label="支付方式：" prop="paymentMethod">
+      <el-form-item prop="paymentMethod">
         <el-select v-model="searchFormParams.paymentMethod" placeholder="请选择支付方式" clearable class="!w-[180px]">
           <el-option label="微信支付" value="wechat" />
           <el-option label="余额支付" value="balance" />
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" :icon="useRenderIcon(Search)" @click="onSearch">
+        <el-button type="primary" :icon="useRenderIcon(Search)" @click="onSearch" class="mr-2">
           搜索
         </el-button>
-        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm">
+        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm" class="mr-2">
           重置
         </el-button>
         <el-button type="success" :loading="exportLoading" :icon="useRenderIcon('vscode-icons:file-type-excel2')"
@@ -171,13 +171,7 @@ getList();
       </el-form-item>
     </el-form>
 
-    <PureTableBar title="退货审批列表" @refresh="getList">
-      <template #buttons>
-        <el-button type="danger" :icon="useRenderIcon(Delete)" :disabled="multipleSelection.length === 0"
-          @click="handleBulkDelete">
-          批量删除
-        </el-button>
-      </template>
+    <div class="table-container">
       <el-table ref="tableRef" v-loading="loading" :data="dataList" row-key="approvalId"
         @selection-change="rows => multipleSelection = rows.map(r => r.approvalId)" border>
         <el-table-column label="审批ID" prop="approvalId" width="80" />
@@ -193,7 +187,7 @@ getList();
                 :preview-src-list="row.coverImg.split(',')" :z-index="9999" :preview-teleported="true"
                 :hide-on-click-modal="true" fit="cover" class="rounded" width="40" height="40" />
             </div>
-            <span v-else>-</span>
+            <span v-else>-\</span>
           </template>
         </el-table-column>
         <el-table-column label="商品价格" prop="goodsPrice" width="90">
@@ -232,7 +226,7 @@ getList();
                 :preview-src-list="row.returnImages.split(',')" :z-index="9999" :preview-teleported="true"
                 :hide-on-click-modal="true" fit="cover" class="rounded" width="40" height="40" />
             </div>
-            <span v-else>-</span>
+            <span v-else>-\</span>
           </template>
         </el-table-column>
         <el-table-column label="操作" width="120" fixed="right">
@@ -253,8 +247,8 @@ getList();
       </el-table>
       <el-pagination v-model:current-page="pagination.currentPage" v-model:page-size="pagination.pageSize"
         :page-sizes="[10, 20, 50]" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"
-        @size-change="handlePaginationChange" @current-change="handlePaginationChange" />
-    </PureTableBar>
+        @size-change="handlePaginationChange" @current-change="handlePaginationChange" class="pagination" />
+    </div>
 
     <!-- 详情弹窗 -->
     <el-dialog v-model="detailVisible" title="审批详情" width="50%">
@@ -279,8 +273,27 @@ getList();
   </div>
 </template>
 
-<style scoped>
+<style scoped lang="scss">
 :deep(.el-image-viewer__wrapper) {
   z-index: 9999 !important;
 }
+
+.table-container {
+  margin-top: 8px;
+  background-color: var(--el-bg-color);
+  border-radius: 4px;
+  padding: 16px;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
+  display: flex;
+  flex-direction: column;
+
+  .el-table {
+    flex: 1;
+    overflow: hidden;
+  }
+
+  .pagination {
+    margin-top: 10px;
+  }
+}
 </style>
\ No newline at end of file
diff --git a/src/views/shop/goods/index.vue b/src/views/shop/goods/index.vue
index 17f4877..3d0b97f 100644
--- a/src/views/shop/goods/index.vue
+++ b/src/views/shop/goods/index.vue
@@ -131,16 +131,16 @@ const handleEdit = (row: GoodsDTO) => {
   <div class="main">
     <el-form ref="formRef" :inline="true" :model="searchFormParams"
       class="search-form bg-bg_color flex w-[99/100] pl-[22px] pt-[12px]">
-      <el-form-item label="商品名称：" prop="goodsName">
+      <el-form-item prop="goodsName">
         <el-input @keydown.enter.prevent="onSearch" v-model="searchFormParams.goodsName" placeholder="请输入商品名称" clearable
           class="!w-[200px]" />
       </el-form-item>
-      <el-form-item label="状态：" prop="status">
+      <!-- <el-form-item label="状态：" prop="status">
         <el-select v-model="searchFormParams.status" placeholder="请选择状态" clearable class="!w-[180px]">
           <el-option label="已上架" :value="1" />
           <el-option label="已下架" :value="2" />
         </el-select>
-      </el-form-item>
+      </el-form-item> -->
       <el-form-item>
         <el-button type="primary" :icon="useRenderIcon(Search)" @click="onSearch">
           搜索
diff --git a/src/views/shop/order/index.vue b/src/views/shop/order/index.vue
index 7d75ee3..1f6ce85 100644
--- a/src/views/shop/order/index.vue
+++ b/src/views/shop/order/index.vue
@@ -31,7 +31,7 @@ const searchFormParams = ref<OrderQuery>({
 });
 
 const pagination = ref({
-  pageSize: 5,
+  pageSize: 8,
   currentPage: 1,
   total: 0
 });
@@ -137,20 +137,20 @@ getList();
         <el-date-picker v-model="searchFormParams.endTime" type="date" placeholder="结束时间"
           value-format="YYYY-MM-DD HH:mm:ss" class="!w-[200px]" />
       </el-form-item> -->
-        <el-form-item label="支付日期：">
+        <el-form-item>
           <el-date-picker v-model="searchFormParams.payTime" type="date" placeholder="支付时间"
             value-format="YYYY-MM-DD HH:mm:ss" class="!w-[200px]" />
         </el-form-item>
-        <el-form-item label="订单编号：" prop="orderId">
+        <el-form-item prop="orderId">
           <el-input @keydown.enter.prevent="onSearch" v-model="searchFormParams.orderId" placeholder="请输入订单编号" clearable
             class="!w-[200px]" />
         </el-form-item>
-        <el-form-item label="格口ID：" prop="cellId">
+        <el-form-item prop="cellId">
           <el-input @keydown.enter.prevent="onSearch" v-model="searchFormParams.cellId" placeholder="请输入格口ID" clearable
             class="!w-[200px]" />
         </el-form-item>
-        <el-form-item label="订单状态：" prop="status">
-          <el-select v-model="searchFormParams.status" placeholder="请选择状态" clearable class="!w-[180px]">
+        <el-form-item prop="status">
+          <el-select v-model="searchFormParams.status" placeholder="请选择订单状态" clearable class="!w-[180px]">
             <el-option label="待付款" :value="1" />
             <el-option label="已付款" :value="2" />
             <el-option label="已发货" :value="3" />
@@ -158,7 +158,7 @@ getList();
             <el-option label="已取消" :value="5" />
           </el-select>
         </el-form-item>
-        <el-form-item label="支付状态：" prop="payStatus">
+        <el-form-item prop="payStatus">
           <el-select v-model="searchFormParams.payStatus" placeholder="请选择支付状态" clearable class="!w-[180px]">
             <el-option label="未支付" :value="1" />
             <el-option label="已支付" :value="2" />
@@ -166,17 +166,17 @@ getList();
             <el-option label="已退款" :value="4" />
           </el-select>
         </el-form-item>
-        <el-form-item label="支付方式：" prop="paymentMethod">
+        <el-form-item prop="paymentMethod">
           <el-select v-model="searchFormParams.paymentMethod" placeholder="请选择支付方式" clearable class="!w-[180px]">
             <el-option label="微信支付" value="wechat" />
             <el-option label="余额支付" value="balance" />
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" :icon="useRenderIcon(Search)" @click="onSearch">
+          <el-button type="primary" :icon="useRenderIcon(Search)" @click="onSearch" style="margin-right: 10px;">
             搜索
           </el-button>
-          <el-button :icon="useRenderIcon(Refresh)" @click="resetForm">
+          <el-button :icon="useRenderIcon(Refresh)" @click="resetForm" style="margin-right: 10px;">
             重置
           </el-button>
           <el-button type="success" :loading="exportLoading" :icon="useRenderIcon('vscode-icons:file-type-excel2')"
@@ -186,10 +186,10 @@ getList();
         </el-form-item>
       </el-form>
 
-      <PureTableBar title="订单列表" @refresh="getList">
+      <div class="table-container">
         <el-table ref="tableRef" v-loading="loading" :data="dataList" row-key="orderId" border>
           <el-table-column label="订单ID" prop="orderId" width="120" />
-          <el-table-column label="商品名称" prop="goodsNames" >
+          <el-table-column label="商品名称" prop="goodsNames">
             <template #default="{ row }">
               <span v-if="row.goodsNames">
                 {{ row.goodsNames.split(',').join(', ') }}
@@ -245,15 +245,34 @@ getList();
         </el-table-column> -->
         </el-table>
         <el-pagination v-model:current-page="pagination.currentPage" v-model:page-size="pagination.pageSize"
-          :page-sizes="[5, 10, 20, 50]" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"
-          @size-change="onSizeChange" @current-change="onCurrentChange" />
-      </PureTableBar>
+          :page-sizes="[8, 10, 20, 50]" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"
+          @size-change="onSizeChange" @current-change="onCurrentChange" class="pagination" />
+      </div>
     </div>
   </div>
 </template>
 
-<style scoped>
+<style scoped lang="scss">
 .right-btn {
   margin: 0;
 }
+
+.table-container {
+  margin-top: 8px;
+  background-color: var(--el-bg-color);
+  border-radius: 4px;
+  padding: 16px;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
+  display: flex;
+  flex-direction: column;
+
+  .el-table {
+    flex: 1;
+    overflow: hidden;
+  }
+
+  .pagination {
+    margin-top: 10px;
+  }
+}
 </style>
\ No newline at end of file
diff --git a/src/views/user/ab98/index.vue b/src/views/user/ab98/index.vue
index 947b46f..dc520ab 100644
--- a/src/views/user/ab98/index.vue
+++ b/src/views/user/ab98/index.vue
@@ -115,12 +115,12 @@ onMounted(() => {
     <div class="float-right w-full">
       <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="搜索：" prop="search">
+        <el-form-item prop="search">
           <el-input v-model="searchFormParams.search" placeholder="请输入姓名/手机号/身份证" clearable class="!w-[300px]"
             @keydown.enter.prevent="onSearch" @change="handleSearchInput" />
         </el-form-item>
-        <el-form-item label="标签：" prop="tagName">
-          <el-select v-model="searchFormParams.tagName" placeholder="请选择" clearable class="!w-[160px]">
+        <el-form-item prop="tagName">
+          <el-select v-model="searchFormParams.tagName" placeholder="请选择用户标签" clearable class="!w-[160px]">
             <el-option v-for="item in tagOptions" :key="item" :label="item" :value="item" />
           </el-select>
         </el-form-item>