From c8c05ee78562e6424a5308c8f421348dd9b5cc52 Mon Sep 17 00:00:00 2001
From: wxy <14293288+zysysys@user.noreply.gitee.com>
Date: Tue, 27 Aug 2024 20:10:21 +0800
Subject: [PATCH] =?UTF-8?q?```refactor(money-detail):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E8=A1=A8=E6=A0=BC=E5=B8=83=E5=B1=80=E5=B9=B6=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E5=88=86=E9=A1=B5=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

调整表格样式，以提升视觉效果和可读性。添加分页组件以支持大量数据的管理。
```
---
 src/views/money/detail/index.vue | 44 +++++++++++++++++++++-----------
 1 file changed, 29 insertions(+), 15 deletions(-)

diff --git a/src/views/money/detail/index.vue b/src/views/money/detail/index.vue
index 9080663..8728890 100644
--- a/src/views/money/detail/index.vue
+++ b/src/views/money/detail/index.vue
@@ -1,52 +1,67 @@
 <template>
-  <div>
-    <h1>充值明细</h1>
+  <div style="padding: 20px;">
+    <h1 style="text-align: center; margin-bottom: 30px;">充值明细</h1>
     <el-divider></el-divider>
     <el-table
       :data="listDate"
-      style="width: 150%">
+      style="width: 100%; border-collapse: collapse;">
       <el-table-column
         label="序号"
-        width="180">
+        width="300"
+        style="border: 1px solid #ccc; padding: 10px; text-align: center;">
         <template slot-scope="scope">
-          <span style="margin-left: 10px">{{ scope.row.id }}</span>
+          {{ scope.row.id }}
         </template>
       </el-table-column>
       <el-table-column
         label="充值编号"
-        width="180">
+        width="300"
+        style="border: 1px solid #ccc; padding: 10px; text-align: center;">
         <template slot-scope="scope">
-          <span style="margin-left: 10px">{{ scope.row.outTradeNo }}</span>
+          {{ scope.row.outTradeNo }}
         </template>
       </el-table-column>
       <el-table-column
         label="充值金额"
-        width="180">
+        width="300"
+        style="border: 1px solid #ccc; padding: 10px; text-align: center;">
         <template slot-scope="scope">
-          <span style="margin-left: 10px">{{ scope.row.totalAmount }}</span>
+          {{ scope.row.totalAmount }}
         </template>
       </el-table-column>
       <el-table-column
         label="充值类型"
-        width="180">
+        width="300"
+        style="border: 1px solid #ccc; padding: 10px; text-align: center;">
         <template slot-scope="scope">
-          <span style="margin-left: 10px">{{ scope.row.productCode }}</span>
+          {{ scope.row.productCode }}
         </template>
       </el-table-column>
       <el-table-column
         label="充值时间"
-        width="180">
+        width="300"
+        style="border: 1px solid #ccc; padding: 10px; text-align: center;">
         <template slot-scope="scope">
-          <span style="margin-left: 10px">{{ scope.row.createTime }}</span>
+          {{ scope.row.createTime }}
         </template>
       </el-table-column>
     </el-table>
+    <pagination
+      v-show="total > 0"
+      :limit.sync="queryParams.pageSize"
+      :page.sync="queryParams.pageNum"
+      :total="total"
+      @pagination="getList"
+    />
   </div>
 </template>
 
+
 <script>
 import { userPayinfo } from "@/api/system/user";
+import PanelGroup from "@/views/dashboard/PanelGroup.vue";
 export default {
+  components: {PanelGroup},
   data() {
     return {
       listDate: [],
@@ -66,8 +81,7 @@ export default {
           this.listDate = response.data.rows;
           this.total = response.data.total;
         }
-      );
-    }
+      );}
   }
 }
 </script>