这是优化了分页位置的修改

vue/gold-system/src/views/consume/allConsume.vue

@@ -445,6 +445,5 @@ getGoods();
 .pagination {
   display: flex;
   margin-top: 20px;
-  margin-left: 33%;
 }
 </style>

vue/gold-system/src/views/managerecharge/activity.vue

@@ -385,7 +385,7 @@ onMounted(async function () {
         </div>
 
         <!-- 分页 -->
-        <div class="pagination">
+        <div class="pagination" style="margin-top: 20px">
           <el-pagination
             background
             :page-size="getObj.pageSize"

vue/gold-system/src/views/managerecharge/rate.vue

@@ -600,7 +600,6 @@ p {
 
 .pagination {
   margin-top: 20px;
-  margin-left: 33%;
 }
 
 .box-card {

vue/gold-system/src/views/recharge/adminRecharge.vue

@@ -1,18 +1,18 @@
 <script setup>
 import { ref, onMounted, reactive, computed } from "vue";
 import ElementPlus from "element-plus";
-import { ElMessage, ElMessageBox } from 'element-plus'
+import { ElMessage, ElMessageBox } from "element-plus";
 import { AiFillRead } from "vue-icons-plus/ai";
-import axios from 'axios';
-import moment from 'moment';
+import axios from "axios";
+import moment from "moment";
 import API from "../../api/index.js";
 // 变量
 // 用户对象假的
 const admin = ref({
   adminId: 1,
-    name: '赵刚',
-    area: '中国'
-})
+  name: "赵刚",
+  area: "中国",
+});
 
 // 充值明细表格
 const tableData = ref([]);
@@ -37,41 +37,41 @@ const allData = ref([]);
 // 搜索地区列表
 const area = ref([]);
 //标签页默认高亮选项
-const activeName = ref('all')
+const activeName = ref("all");
 // 支付方式选项
 const payWay = [
   {
-        value: '微信',
-        label: '微信',
+    value: "微信",
+    label: "微信",
   },
   {
-        value: '支付宝',
-        label: '支付宝',
+    value: "支付宝",
+    label: "支付宝",
   },
   {
-        value: '银联',
-        label: '银联',
+    value: "银联",
+    label: "银联",
   },
   {
-        value: '信用卡',
-        label: '信用卡',
+    value: "信用卡",
+    label: "信用卡",
   },
   {
-        value: '借记卡',
-        label: '借记卡',
+    value: "借记卡",
+    label: "借记卡",
   },
   {
-        value: '现金充值',
-        label: '现金充值',
+    value: "现金充值",
+    label: "现金充值",
   },
-]
+];
 // 删除==========================================================
 // 删除对象
 const delObj = ref({});
 
 //表格高度
 const tableHeight = computed(function () {
-    return (getObj.value.pageSize + 2) * 60 + 'px';
+  return (getObj.value.pageSize + 2) * 60 + "px";
 });
 
 // 方法
@@ -80,235 +80,299 @@ const tableHeight = computed(function () {
 const get = async function (val) {
   try {
     // 搜索参数页码赋值
-        if (typeof val === 'number') {
+    if (typeof val === "number") {
       getObj.value.pageNum = val;
     }
     // 搜索参数时间赋值
     if (getTime.value != null) {
-            if (getTime.value.startDate != '' && getTime.value.endDate != '') {
+      if (getTime.value.startDate != "" && getTime.value.endDate != "") {
         rechargeVo.value.startDate = getTime.value[0];
         rechargeVo.value.endDate = getTime.value[1];
       }
     } else {
-            rechargeVo.value.startDate = '';
-            rechargeVo.value.endDate = '';
+      rechargeVo.value.startDate = "";
+      rechargeVo.value.endDate = "";
     }
-        console.log('搜索参数', getObj.value);
+    console.log("搜索参数", getObj.value);
     // 发送POST请求
-        const result = await API.post('http://192.168.8.93:10010/recharge/recharge', { ...getObj.value, rechargeVo: { ...rechargeVo.value } });
+    const result = await API.post(
+      "http://192.168.8.93:10010/recharge/recharge",
+      { ...getObj.value, rechargeVo: { ...rechargeVo.value } }
+    );
 
     // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
+    console.log("请求成功", result);
     // 存储表格数据
     tableData.value = result.data.list;
-        console.log('tableData', tableData.value);
+    console.log("tableData", tableData.value);
     // 存储分页总数
     total.value = result.data.total;
-        console.log('total', total.value);
+    console.log("total", total.value);
   } catch (error) {
-        console.log('请求失败', error);
+    console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
-}
+};
 
 // 重置
 const reset = function () {
-    rechargeVo.value.activityId = '';
-    rechargeVo.value.payWay = '';
-    rechargeVo.value.area = '';
-    rechargeVo.value.startDate = '';
-    rechargeVo.value.endDate = '';
+  rechargeVo.value.activityId = "";
+  rechargeVo.value.payWay = "";
+  rechargeVo.value.area = "";
+  rechargeVo.value.startDate = "";
+  rechargeVo.value.endDate = "";
   getTime.value = {};
-}
+};
 // 今天
 const getToday = function () {
   const today = new Date();
-    const startDate = new Date(today.getFullYear(), today.getMonth(), today.getDate());
-    const endDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1);
+  const startDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate()
+  );
+  const endDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate() + 1
+  );
   getTime.value = [startDate, endDate];
-    console.log('getTime', getTime.value);
+  console.log("getTime", getTime.value);
   get();
-}
+};
 // 昨天
 const getYesterday = function () {
   const yesterday = new Date();
   yesterday.setDate(yesterday.getDate() - 1);
-    const startDate = new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate());
-    const endDate = new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate() + 1);
+  const startDate = new Date(
+    yesterday.getFullYear(),
+    yesterday.getMonth(),
+    yesterday.getDate()
+  );
+  const endDate = new Date(
+    yesterday.getFullYear(),
+    yesterday.getMonth(),
+    yesterday.getDate() + 1
+  );
   getTime.value = [startDate, endDate];
-    console.log('getTime', getTime.value);
+  console.log("getTime", getTime.value);
   get();
-}
+};
 // 近7天
 const get7Days = function () {
   const today = new Date();
-    const startDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() - 6);
-    const endDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1);
+  const startDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate() - 6
+  );
+  const endDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate() + 1
+  );
   getTime.value = [startDate, endDate];
-    console.log('getTime', getTime.value);
+  console.log("getTime", getTime.value);
   get();
-}
+};
 //全部充值明细
 const adminAll = function () {
-    console.log('adminAll');
-    rechargeVo.value.status = '';
+  console.log("adminAll");
+  rechargeVo.value.status = "";
   getObj.value.pageNum = 1;
   get();
-}
+};
 //待审核充值明细
 const adminWait = function () {
   rechargeVo.value.status = 0;
   getObj.value.pageNum = 1;
   get();
-    console.log('adminWait');
-}
+  console.log("adminWait");
+};
 //已通过充值明细
 const adminPass = function () {
   rechargeVo.value.status = 1;
   getObj.value.pageNum = 1;
   get();
-    console.log('adminPass');
-}
+  console.log("adminPass");
+};
 //已驳回充值明细
 const adminReject = function () {
   rechargeVo.value.status = 2;
   getObj.value.pageNum = 1;
   get();
-    console.log('adminReject');
-}
+  console.log("adminReject");
+};
 //点击标签页
 const handleClick = function (tab, event) {
-    if (tab.props.name === 'all') {
+  if (tab.props.name === "all") {
     adminAll();
-    } else if (tab.props.name === 'wait') {
+  } else if (tab.props.name === "wait") {
     adminWait();
-    } else if (tab.props.name === 'pass') {
+  } else if (tab.props.name === "pass") {
     adminPass();
-    } else if (tab.props.name === 'reject') {
+  } else if (tab.props.name === "reject") {
     adminReject();
   }
-}
+};
 // 获取活动名称
 const getActivity = async function () {
   try {
     // 发送POST请求
-        const result = await API.post('http://192.168.8.93:10010/recharge/activity/select', {});
+    const result = await API.post(
+      "http://192.168.8.93:10010/recharge/activity/select",
+      {}
+    );
 
     // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
+    console.log("请求成功", result);
     // 存储表格数据
     activity.value = result.data;
-        console.log('activity', activity.value);
+    console.log("activity", activity.value);
   } catch (error) {
-        console.log('请求失败', error);
+    console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
-}
+};
 // 获取地区
 const getArea = async function () {
   try {
     // 发送POST请求
-        const result = await API.post('http://192.168.8.93:10010/recharge/recharge', {});
+    const result = await API.post(
+      "http://192.168.8.93:10010/recharge/recharge",
+      {}
+    );
     // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
+    console.log("请求成功", result);
     // 存储全部数据
     allData.value = result.data;
-        console.log('allData', allData.value);
+    console.log("allData", allData.value);
     // 分离并去重地区列表
-        area.value = [...new Set(allData.value.map(item => item.area))]
-        console.log('地区', area.value);
+    area.value = [...new Set(allData.value.map((item) => item.area))];
+    console.log("地区", area.value);
   } catch (error) {
-        console.log('请求失败', error);
+    console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
-
-}
+};
 // 删除=================================
 // 点击删除按钮
 const del = function (row) {
   delObj.value.rechargeId = row.rechargeId;
-    console.log('delObj1', delObj.value);
-}
+  console.log("delObj1", delObj.value);
+};
 // 确认删除按钮
 const delConfirm = async function () {
   try {
-        console.log('delObj2', delObj.value);
-        const result = await API.post('http://192.168.8.93:10010/recharge/recharge/edit', delObj.value);
-        console.log('删除成功', result);
+    console.log("delObj2", delObj.value);
+    const result = await API.post(
+      "http://192.168.8.93:10010/recharge/recharge/edit",
+      delObj.value
+    );
+    console.log("删除成功", result);
     // 刷新表格数据
     get();
   } catch (error) {
-        console.log('请求失败', error);
+    console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
-}
+};
 
 // 验证跳转输入框的数字是否合法
 const checkNumber = function () {
-    if (typeof parseInt(getObj.value.pageNum) === 'number') {
-        console.log('总共有多少页' + Math.ceil(total.value / getObj.value.pageSize));
-        if ((getObj.value.pageNum > 0) && (getObj.value.pageNum <= Math.ceil(total.value / getObj.value.pageSize))) {
-            console.log('输入的数字合法');
+  if (typeof parseInt(getObj.value.pageNum) === "number") {
+    console.log(
+      "总共有多少页" + Math.ceil(total.value / getObj.value.pageSize)
+    );
+    if (
+      getObj.value.pageNum > 0 &&
+      getObj.value.pageNum <= Math.ceil(total.value / getObj.value.pageSize)
+    ) {
+      console.log("输入的数字合法");
       get();
     } else {
       //提示
       ElMessage({
-                type: 'error',
-                message: '请检查输入内容',
-            })
+        type: "error",
+        message: "请检查输入内容",
+      });
     }
   } else {
     //提示
     ElMessage({
-            type: 'error',
-            message: '请检查输入内容',
-        })
+      type: "error",
+      message: "请检查输入内容",
+    });
   }
-}
+};
 
 // 挂载
 onMounted(async function () {
   await get();
   getActivity();
   await getArea();
-})
-
-
-
+});
 </script>
 
 <template>
   <el-row>
     <el-col>
       <el-card style="margin-bottom: 20px">
-                <el-row style="margin-bottom: 10px;">
+        <el-row style="margin-bottom: 10px">
           <el-col :span="8">
             <div class="head-card-element">
               <el-text class="mx-1" size="large">活动名称：</el-text>
-                            <el-select v-model="rechargeVo.activityId" placeholder="请选择活动名称" size="large"
-                                style="width: 240px" clearable>
-                                <el-option v-for="item in activity" :key="item.activityId" :label="item.activityName"
-                                    :value="item.activityId" />
+              <el-select
+                v-model="rechargeVo.activityId"
+                placeholder="请选择活动名称"
+                size="large"
+                style="width: 240px"
+                clearable
+              >
+                <el-option
+                  v-for="item in activity"
+                  :key="item.activityId"
+                  :label="item.activityName"
+                  :value="item.activityId"
+                />
               </el-select>
             </div>
           </el-col>
           <el-col :span="8">
             <div class="head-card-element">
               <el-text class="mx-1" size="large">支付方式：</el-text>
-                            <el-select v-model="rechargeVo.payWay" placeholder="请选择支付方式" size="large"
-                                style="width: 240px" clearable>
-                                <el-option v-for="item in payWay" :key="item.value" :label="item.label"
-                                    :value="item.value" />
+              <el-select
+                v-model="rechargeVo.payWay"
+                placeholder="请选择支付方式"
+                size="large"
+                style="width: 240px"
+                clearable
+              >
+                <el-option
+                  v-for="item in payWay"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
               </el-select>
             </div>
-
           </el-col>
           <el-col :span="8">
             <div class="head-card-element">
               <el-text class="mx-1" size="large">所属地区：</el-text>
-                            <el-select v-model="rechargeVo.area" placeholder="请选择所属地区" size="large"
-                                style="width: 240px" clearable>
-                                <el-option v-for="item in area" :key="item" :label="item" :value="item" />
+              <el-select
+                v-model="rechargeVo.area"
+                placeholder="请选择所属地区"
+                size="large"
+                style="width: 240px"
+                clearable
+              >
+                <el-option
+                  v-for="item in area"
+                  :key="item"
+                  :label="item"
+                  :value="item"
+                />
               </el-select>
             </div>
           </el-col>
@@ -317,9 +381,16 @@ onMounted(async function () {
           <el-col :span="21">
             <div class="head-card-element">
               <el-text class="mx-1" size="large">充值时间：</el-text>
-                            <el-date-picker v-model="getTime" type="datetimerange" range-separator="至"
-                                start-placeholder="起始时间" end-placeholder="结束时间" />
-                            <el-button style="margin-left: 10px;" @click="getToday()">今</el-button>
+              <el-date-picker
+                v-model="getTime"
+                type="datetimerange"
+                range-separator="至"
+                start-placeholder="起始时间"
+                end-placeholder="结束时间"
+              />
+              <el-button style="margin-left: 10px" @click="getToday()"
+                >今</el-button
+              >
               <el-button @click="getYesterday()">昨</el-button>
               <el-button @click="get7Days()">近7天</el-button>
             </div>
@@ -337,7 +408,12 @@ onMounted(async function () {
   <el-row>
     <el-col>
       <el-card>
-                <el-tabs v-model="activeName" type="card" class="demo-tabs" @tab-click="handleClick">
+        <el-tabs
+          v-model="activeName"
+          type="card"
+          class="demo-tabs"
+          @tab-click="handleClick"
+        >
           <el-tab-pane label="全部" name="all"></el-tab-pane>
           <el-tab-pane label="待审核" name="wait"></el-tab-pane>
           <el-tab-pane label="已通过" name="pass"></el-tab-pane>
@@ -346,17 +422,40 @@ onMounted(async function () {
         <div>
           <el-table :data="tableData" :height="tableHeight" style="width: 100%">
             <el-table-column prop="username" label="姓名" width="100px" />
-                        <el-table-column prop="jwcode" label="精网号" width="150px" />
+            <el-table-column prop="jwcode" label="精网号" width="130px" />
             <el-table-column prop="area" label="所属地区" width="100px" />
-                        <el-table-column prop="activityName" label="活动名称" width="150px" />
-                        <el-table-column prop="rechargeGold" label="充值金额" width="100px" />
+            <el-table-column
+              prop="activityName"
+              label="活动名称"
+              width="150px"
+            />
+            <el-table-column
+              prop="paidGold"
+              label="充值金额(新币)"
+              width="120px"
+            />
             <el-table-column prop="paidGold" label="充值金币" width="100px" />
             <el-table-column prop="freeGold" label="免费金币" width="100px" />
-                        <el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip />
+            <el-table-column
+              prop="remark"
+              label="备注"
+              width="200px"
+              show-overflow-tooltip
+            />
             <el-table-column prop="payWay" label="支付方式" width="100px" />
-                        <el-table-column prop="rechargeVoucher" label="支付凭证" width="150px">
+            <el-table-column
+              prop="rechargeVoucher"
+              label="支付凭证"
+              width="150px"
+            >
               <template #default="scope">
-                                <el-image :preview-src-list="[scope.row.rechargeVoucher]" preview-teleported="true" :src="scope.row.rechargeVoucher" alt="凭证" style="width: 50px; height: 50px" />
+                <el-image
+                  :preview-src-list="[scope.row.rechargeVoucher]"
+                  preview-teleported="true"
+                  :src="scope.row.rechargeVoucher"
+                  alt="凭证"
+                  style="width: 50px; height: 50px"
+                />
               </template>
             </el-table-column>
             <el-table-column prop="name" label="提交人" width="100px" />
@@ -382,16 +481,31 @@ onMounted(async function () {
                 </span>
               </template>
             </el-table-column>
-                        <el-table-column prop="reson" label="驳回理由" width="200px" show-overflow-tooltip />
+            <el-table-column
+              prop="reson"
+              label="驳回理由"
+              width="200px"
+              show-overflow-tooltip
+            />
             <el-table-column prop="rechargeTime" label="交款时间" width="200px">
               <template #default="scope">
-                                {{ moment(scope.row.rechargeTime).format('YYYY-MM-DD HH:mm:ss') }}
+                {{
+                  moment(scope.row.rechargeTime).format("YYYY-MM-DD HH:mm:ss")
+                }}
               </template>
             </el-table-column>
             <el-table-column prop="createTime" label="提交时间" width="200px" />
-                        <el-table-column fixed="right" prop="operation" label="操作" width="150px">
+            <el-table-column
+              fixed="right"
+              prop="operation"
+              label="操作"
+              width="150px"
+            >
               <template #default="scope">
-                                <el-popconfirm title="确定将此条活动删除吗？" @confirm="delConfirm">
+                <el-popconfirm
+                  title="确定将此条活动删除吗？"
+                  @confirm="delConfirm"
+                >
                   <template #reference>
                     <el-button type="primary" text @click="del(scope.row)">
                       删除
@@ -405,25 +519,48 @@ onMounted(async function () {
                   </template>
                 </el-popconfirm>
               </template>
-
             </el-table-column>
           </el-table>
         </div>
 
         <!-- 分页 -->
-                <div class="pagination">
-                    <el-pagination background :page-size="getObj.pageSize" layout="slot" :total="total">
-                        <div>共{{ total }}条,每页 </div>
-                        <el-select v-model="getObj.pageSize" class="page-size" @change="get()" style="width: 80px">
-                            <el-option v-for="item in [5, 6, 7, 8, 9, 10]" :key="item" :label="item"
-                                :value="item"></el-option>
+        <div class="pagination" style="margin-top: 20px">
+          <el-pagination
+            background
+            :page-size="getObj.pageSize"
+            layout="slot"
+            :total="total"
+          >
+            <div>共{{ total }}条,每页</div>
+            <el-select
+              v-model="getObj.pageSize"
+              class="page-size"
+              @change="get()"
+              style="width: 80px"
+            >
+              <el-option
+                v-for="item in [5, 6, 7, 8, 9, 10]"
+                :key="item"
+                :label="item"
+                :value="item"
+              ></el-option>
             </el-select>
-                        <div> 条</div>
+            <div>条</div>
           </el-pagination>
-                    <el-pagination background layout="prev, pager, next,slot" :page-size="getObj.pageSize"
-                        :total="total" :current-page="getObj.pageNum" @current-change="get">
+          <el-pagination
+            background
+            layout="prev, pager, next,slot"
+            :page-size="getObj.pageSize"
+            :total="total"
+            :current-page="getObj.pageNum"
+            @current-change="get"
+          >
             <div>跳至</div>
-                        <el-input v-model="getObj.pageNum" style="width: 40px;" @change="checkNumber" />
+            <el-input
+              v-model="getObj.pageNum"
+              style="width: 40px"
+              @change="checkNumber"
+            />
             <div>页</div>
           </el-pagination>
         </div>
@@ -432,13 +569,20 @@ onMounted(async function () {
   </el-row>
 
   <!-- 编辑弹窗 -->
-    <el-dialog v-model="editRechargeVisible" title="新增活动" width="500" :before-close="closeEditRechargeVisible">
+  <el-dialog
+    v-model="editRechargeVisible"
+    title="新增活动"
+    width="500"
+    :before-close="closeEditRechargeVisible"
+  >
     <template #footer>
-
       <el-form :model="editObj" label-width="auto" style="max-width: 600px">
-
         <el-form-item label="活动名称:">
-                    <el-input v-model="addObj.activityName" placeholder="请输入活动名称" style="width: 220px;" />
+          <el-input
+            v-model="addObj.activityName"
+            placeholder="请输入活动名称"
+            style="width: 220px"
+          />
         </el-form-item>
 
         <el-form-item label="免费金币:">
@@ -449,8 +593,12 @@ onMounted(async function () {
         </el-form-item>
 
         <el-form-item label="免费金币兑换比:">
-                    <el-input v-model="addObj.rechargeRatio" placeholder="请输入" style="width: 80px;" />：1
-                    <div style="color: grey;">(提示：当前规则每10新币可兑换1免费金币)</div>
+          <el-input
+            v-model="addObj.rechargeRatio"
+            placeholder="请输入"
+            style="width: 80px"
+          />：1
+          <div style="color: grey">(提示：当前规则每10新币可兑换1免费金币)</div>
         </el-form-item>
 
         <el-form-item label="开始时间:">
@@ -462,9 +610,8 @@ onMounted(async function () {
         </el-form-item>
 
         <el-form-item label="添加人:">
-                    <el-input v-model="addObj.adminName" disabled style="width: 220px;" />
+          <el-input v-model="addObj.adminName" disabled style="width: 220px" />
         </el-form-item>
-
       </el-form>
 
       <div class="dialog-footer">
@@ -475,7 +622,6 @@ onMounted(async function () {
       </div>
     </template>
   </el-dialog>
-
 </template>
 
 <style scoped>

vue/gold-system/src/views/recharge/allRecharge.vue

@@ -389,7 +389,7 @@ onMounted(async function () {
         <div>
           <el-table :data="tableData" :height="tableHeight" style="width: 100%">
             <el-table-column prop="username" label="姓名" width="100px" />
-            <el-table-column prop="jwcode" label="精网号" width="150px" />
+            <el-table-column prop="jwcode" label="精网号" width="130px" />
             <el-table-column prop="area" label="所属地区" width="100px" />
             <el-table-column
               prop="activityName"
@@ -397,9 +397,9 @@ onMounted(async function () {
               width="150px"
             />
             <el-table-column
-              prop="rechargeGold"
-              label="充值金额"
-              width="100px"
+              prop="paidGold"
+              label="充值金额(新币)"
+              width="120px"
             />
             <el-table-column
               prop="rechargeWay"
@@ -471,7 +471,7 @@ onMounted(async function () {
         </div>
 
         <!-- 分页 -->
-        <div class="pagination">
+        <div class="pagination" style="margin-top: 20px">
           <el-pagination
             background
             :page-size="getObj.pageSize"

vue/gold-system/src/views/usergold/index.vue

@@ -291,7 +291,7 @@ onMounted(async function () {
 
         <!-- 分页 -->
         <!-- 分页 -->
-        <div class="pagination">
+        <div class="pagination" style="margin-top: 20px">
           <el-pagination
             background
             :page-size="getObj.pageSize"