style: 修改 汇率 消耗详情的代码格式，优化汇率输入错误的提示

feat：消耗明细金币总计（根据筛选）、排序功能
refactor: 重构充值审核，退款审核页面样式、字段 ，目前缺后端接口

src/views/audit/rechargeAudit.vue

@@ -1,46 +1,119 @@
 <script setup>
-import { ref, onMounted, reactive, computed } from 'vue'
-import ElementPlus from 'element-plus'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { AiFillRead } from 'vue-icons-plus/ai'
-import axios from 'axios'
+import {computed, onMounted, reactive, ref, watch} from 'vue'
+import {ElMessage} from 'element-plus'
 import request from '@/util/http'
 import moment from 'moment'
 
-//这是获取用户信息的接口
-const adminData = ref({})
-const getAdminData = async function () {
-  try {
-    const result = await request({
-      url: '/admin/userinfo',
-      data: {}
-    })
-    adminData.value = result
-    console.log('用户信息', adminData.value)
-  } catch (error) {
-    console.log('请求失败', error)
+
+/*
+===================工具方法============================
+*/
+
+// 精网号去空格
+const trimJwCode = () => {
+  if (rechargeVo.value.jwcode) {
+    rechargeVo.value.jwcode = rechargeVo.value.jwcode.replace(/\s/g, '');
   }
 }
 
+/*
+===================数据============================
+*/
+//这是获取用户信息的接口
+const adminData = ref({})
 // 充值明细表格
-const tableData = ref([])
-// 搜索======================================
+const tableData1 = ref([])
+
+// 模拟充值明细表格 // todo 之后换掉，不用模拟数据
+const tableData = ref([
+  {
+    name: '测试',
+    jwcode: 1001,
+    market: "地区1",
+    activity: "活动1",
+    money: 100,  // 充值金额
+    permanentGold: 100, // 永久金币
+
+    freeGold: 50, // 免费金币
+    taskGold: 10, // 任务金币
+    remark: "备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注",//备注
+    reason: "驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由",//驳回理由
+    payMode: "微信",// 支付方式
+    voucher: "https://www.keaitupian.cn/cjpic/frombd/2/253/1659552792/3869332496.jpg",//支付凭证
+    adminName: "提交人姓名", // 提交人姓名
+    auditName: "审核人姓名",// 审核人姓名  // 当前登录人
+    payTime: "2025-6-28 14:31:20",//付款时间
+    createTime: "2025-6-29 14:31:20",//提交时间
+    auditStatus: 0, // 审核状态 （0待审核、1通过、2驳回、3外部传入【默认通过】）
+  },
+  {
+    name: '测试2',
+    jwcode: 1002,
+    market: "地区2",
+    activity: "活动2",
+    money: 200,  // 充值金额
+    permanentGold: 200, // 永久金币
+
+    freeGold: 50, // 免费金币
+    taskGold: 10, // 任务金币
+    remark: "2备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注备注",//备注
+    reason: "2驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由驳回理由",//驳回理由
+    payMode: "2微信",// 支付方式
+    voucher: "https://www.keaitupian.cn/cjpic/frombd/2/253/1659552792/3869332496.jpg",//支付凭证
+    adminName: "提交人姓名", // 提交人姓名
+    auditName: "审核人姓名",// 审核人姓名  // 当前登录人
+    payTime: "3025-6-28 14:31:20",//付款时间
+    createTime: "3025-6-29 14:31:20",//提交时间
+    auditStatus: 1, // 审核状态 （0待审核、1通过、2驳回、3外部传入【默认通过】）
+  },
+])
+/*
+    name: '',
+    jwcode: null,
+    market: "",
+    activity: "",
+    money: null,  // 充值金额
+    permanentGold: null, // 永久金币
+    freeGold: null, // 免费金币
+    taskGold: null, // 任务金币
+    remark: "",//备注
+    reason: "",//拒绝理由
+    payMode: "",// 支付方式
+    voucher: "",//支付凭证
+    /!*  adminId: null, // 提交人id
+      auditId:null,// 审核人id*!/
+    adminName: "", // 提交人姓名
+    auditName: "",// 审核人姓名  // 当前登录人
+    payTime: "",//付款时间
+    createTime: "",//提交时间
+    auditStatus: null, // 审核状态 （0待审核、1通过、2驳回、3外部传入【默认通过】）
+
+    */
+
+// 搜索表单数据
 const rechargeVo = ref({
-  rechargeWay: '客服充值'
+  jwcode: null,//精网号
+  activity: "", //活动名称
+  payMode: "",// 支付方式
+  startTime: "", // 充值时间开始
+  endTime: "", // 充值时间结束
+  market: "",//地区
 })
+
+
 // 搜索对象
 const getObj = ref({
   pageNum: 1,
   pageSize: 50
 })
 //分页总条目
-const total = ref(100)
+const total = ref(50)
 // 搜索对象时间
 const getTime = ref([])
 // 搜索活动列表
 const activity = ref([])
 // 搜索地区列表
-const area = ref([])
+const market = ref([])
 // 驳回弹出框
 const rejectVisible = ref(false)
 // 驳回对象
@@ -50,7 +123,7 @@ const passObj = ref({})
 //标签页默认是待审批
 const activeName = ref('wait')
 // 支付方式选项
-const payWay = [
+const payMode = [
   {
     value: '微信',
     label: '微信'
@@ -74,17 +147,12 @@ const payWay = [
 ]
 // 表单验证ref
 const Ref = ref(null)
-
-// 方法
 // 统计合计数
 const trueGold = ref(0)
 const trueCount = ref(0)
 const trueRGold = ref(0)
 const trueFGold = ref(0)
-// 保留两位小数
-const formattedTrueGold = computed(() => trueGold.value.toFixed(2))
-const formattedTrueRGold = computed(() => trueRGold.value.toFixed(2))
-const formattedTrueFGold = computed(() => trueFGold.value.toFixed(2))
+
 // 待审核条数
 const pendingCount = ref(0)
 // 待审核金币数
@@ -103,46 +171,79 @@ const rejectedCount = ref(0)
 const rejectedGold = ref(0)
 const rejectedRGold = ref(0)
 const rejectedFGold = ref(0)
+
+
+// 新增排序字段和排序方式
+const sortField = ref('')
+const sortOrder = ref('')
+
+// 表单验证
+const rules = reactive({
+  reason: [{required: true, message: '请输入驳回理由', trigger: 'blur'}]
+})
+
+
+/*
+===================方法============================
+*/
+const getAdminData = async function () {
+  try {
+    const result = await request({
+      url: '/admin/userinfo',
+      data: {}
+    })
+    adminData.value = result
+    console.log('用户信息', adminData.value)
+  } catch (error) {
+    console.log('请求失败', error)
+  }
+}
+
 // 搜索方法
 const get = async function (val) {
   try {
-    // 地区赋值
-    if (adminData.value.area === '泰国') {
-      rechargeVo.value.areas = ['泰国', '越南']
-    }
     // 搜索参数页码赋值
     if (typeof val === 'number') {
       getObj.value.pageNum = val
     }
     // 搜索参数时间赋值
     if (getTime.value != null) {
-      if (getTime.value.startDate != '' && getTime.value.endDate != '') {
-        rechargeVo.value.startDate = getTime.value[0]
-        rechargeVo.value.endDate = getTime.value[1]
+      if (getTime.value.startTime != '' && getTime.value.endTime != '') {
+        rechargeVo.value.startTime = getTime.value[0]
+        rechargeVo.value.endTime = getTime.value[1]
       }
     } else {
-      rechargeVo.value.startDate = ''
-      rechargeVo.value.endDate = ''
+      rechargeVo.value.startTime = ''
+      rechargeVo.value.endTime = ''
     }
     rechargeVo.value.sortField = sortField.value
     rechargeVo.value.sortOrder = sortOrder.value
+
     console.log('搜索参数', getObj.value)
+
+    //
     const result = await request({
-      url: '/recharge/recharge',
+      url: '/recharge/recharge', // todo 换接口
       data: {
         pageNum: getObj.value.pageNum,
         pageSize: getObj.value.pageSize,
-        rechargeVo: { ...rechargeVo.value }
+        rechargeVo: { // 这个根据后端换一下
+          ...rechargeVo.value,
+          sortField: sortField.value,
+          sortOrder: sortOrder.value
+        }
       }
     })
+
+
     // 合计数的接口
     // 复制一份rechargeVo.value，去掉排序和状态
-    const rechargeVo1 = { ...rechargeVo.value }
+    const rechargeVo1 = {...rechargeVo.value}
     delete rechargeVo1.sortField
     delete rechargeVo1.sortOrder
-    delete rechargeVo1.status
+    delete rechargeVo1.auditStatus
     const result2 = await request({
-      url: '/recharge/recharge/RechargeA',
+      url: '/recharge/recharge/RechargeA', // todo 换接口
       data: rechargeVo1
     })
     // 统计合计数
@@ -189,6 +290,7 @@ const get = async function (val) {
     console.log('请求失败', error)
   }
 }
+
 // 搜索
 const search = function () {
   trimJwCode();
@@ -197,28 +299,28 @@ const search = function () {
 }
 // 重置
 const reset = function () {
-  delete rechargeVo.value.activityId
+  delete rechargeVo.value.activity
   delete rechargeVo.value.jwcode
-  delete rechargeVo.value.payWay
-  delete rechargeVo.value.area
-  delete rechargeVo.value.startDate
-  delete rechargeVo.value.endDate
+  delete rechargeVo.value.payMode
+  delete rechargeVo.value.market
+  delete rechargeVo.value.startTime
+  delete rechargeVo.value.endTime
   getTime.value = {}
 }
 // 今天
 const getToday = function () {
   const today = new Date()
-  const startDate = new Date(
-    today.getFullYear(),
-    today.getMonth(),
-    today.getDate()
+  const startTime = new Date(
+      today.getFullYear(),
+      today.getMonth(),
+      today.getDate()
   )
-  const endDate = new Date(
-    today.getFullYear(),
-    today.getMonth(),
-    today.getDate() + 1
+  const endTime = new Date(
+      today.getFullYear(),
+      today.getMonth(),
+      today.getDate() + 1
   )
-  getTime.value = [startDate, endDate]
+  getTime.value = [startTime, endTime]
   console.log('getTime', getTime.value)
   get()
 }
@@ -227,14 +329,14 @@ const getYesterday = function () {
   const yesterday = new Date()
   yesterday.setDate(yesterday.getDate() - 1)
   const startDate = new Date(
-    yesterday.getFullYear(),
-    yesterday.getMonth(),
-    yesterday.getDate()
+      yesterday.getFullYear(),
+      yesterday.getMonth(),
+      yesterday.getDate()
   )
   const endDate = new Date(
-    yesterday.getFullYear(),
-    yesterday.getMonth(),
-    yesterday.getDate() + 1
+      yesterday.getFullYear(),
+      yesterday.getMonth(),
+      yesterday.getDate() + 1
   )
   getTime.value = [startDate, endDate]
   console.log('getTime', getTime.value)
@@ -244,14 +346,14 @@ const getYesterday = function () {
 const get7Days = function () {
   const today = new Date()
   const startDate = new Date(
-    today.getFullYear(),
-    today.getMonth(),
-    today.getDate() - 6
+      today.getFullYear(),
+      today.getMonth(),
+      today.getDate() - 6
   )
   const endDate = new Date(
-    today.getFullYear(),
-    today.getMonth(),
-    today.getDate() + 1
+      today.getFullYear(),
+      today.getMonth(),
+      today.getDate() + 1
   )
   getTime.value = [startDate, endDate]
   console.log('getTime', getTime.value)
@@ -259,10 +361,11 @@ const get7Days = function () {
 }
 //待审核充值明细
 const adminWait = async function () {
-  rechargeVo.value.status = 0
+  rechargeVo.value.auditStatus = 0
   getObj.value.pageNum = 1
   await get()
   console.log('adminWait')
+
   trueCount.value = pendingCount.value
   trueGold.value = pendingGold.value
   trueRGold.value = pendingRGold.value
@@ -270,7 +373,7 @@ const adminWait = async function () {
 }
 //已通过充值明细
 const adminPass = async function () {
-  rechargeVo.value.status = 1
+  rechargeVo.value.auditStatus = 1
   getObj.value.pageNum = 1
   await get()
   console.log('adminPass')
@@ -281,7 +384,7 @@ const adminPass = async function () {
 }
 //已驳回充值明细
 const adminReject = async function () {
-  rechargeVo.value.status = 2
+  rechargeVo.value.auditStatus = 2
   getObj.value.pageNum = 1
   await get()
   console.log('adminReject')
@@ -292,6 +395,7 @@ const adminReject = async function () {
 }
 
 const handleClick = function (tab, event) {
+  activeName.value = tab.props.name
   if (tab.props.name === 'wait') {
     adminWait()
   } else if (tab.props.name === 'pass') {
@@ -301,6 +405,17 @@ const handleClick = function (tab, event) {
   }
 }
 
+// watch(activeName, (val) => {
+//   if (val === 'wait') {
+//     adminWait()
+//   } else if (val === 'pass') {
+//     adminPass()
+//   } else if (val === 'reject') {
+//     adminReject()
+//   }
+// })
+
+
 const getActivity = async function () {
   try {
     const result = await request({
@@ -314,14 +429,14 @@ const getActivity = async function () {
   }
 }
 // 地区下拉框
-const getArea = async function () {
+const getMarket = async function () {
   try {
     const result = await request({
-      url: '/recharge/user/search',
+      url: 'http://192.168.8.247:8081/general/market',
       data: {}
     })
-    area.value = result.data
-    console.log('地区', area.value)
+    market.value = result.data
+    console.log('地区', market.value)
   } catch (error) {
     console.log('请求失败', error)
   }
@@ -334,6 +449,7 @@ const handleCurrentChange = function (val) {
   getObj.value.pageNum = val
   get()
 }
+
 // 编辑====================================
 // 通过按钮
 const pass = function (row) {
@@ -341,7 +457,7 @@ const pass = function (row) {
   passObj.value = row
   passObj.value.adminId = adminData.value.adminId
   passObj.value.auditId = row.auditId
-  // passObj.value.status = 1
+  // passObj.value.auditStatus = 1
   passObj.value.rechargeId = row.rechargeId
   passObj.value.detailId = row.detailId
   passObj.value.jwcode = row.jwcode
@@ -351,12 +467,11 @@ const pass = function (row) {
 
   console.log('通过对象', passObj.value)
 }
-
 // 通过确认
 const passConfirm = async function () {
   try {
     // 也许大概应该在点击确认时改变状态
-    passObj.value.status = 1
+    passObj.value.auditStatus = 1
     console.log('通过对象', passObj.value)
     // 发送POST请求
     // passObj.value.flag = 0;
@@ -393,8 +508,8 @@ const reject = function (row) {
   // 驳回初始化
   rejectObj.value.adminId = adminData.value.adminId
   rejectObj.value.auditId = row.auditId
-  rejectObj.value.status = 2
-  rejectObj.value.reson = ''
+  rejectObj.value.auditStatus = 2
+  rejectObj.value.reason = ''
   rejectObj.value.rechargeId = row.rechargeId
   rejectObj.value.detailId = row.detailId
   console.log('驳回对象', rejectObj.value)
@@ -430,21 +545,6 @@ const rejectConfirm = async function () {
   })
 }
 
-// 表单验证
-const rules = reactive({
-  reson: [{ required: true, message: '请输入驳回理由', trigger: 'blur' }]
-})
-
-// 挂载
-onMounted(async function () {
-  await getAdminData()
-  await getActivity()
-  await get()
-  await getArea()
-})
-// 新增排序字段和排序方式
-const sortField = ref('')
-const sortOrder = ref('')
 // 处理排序事件
 const handleSortChange = (column) => {
   console.log('排序字段：', column.prop)
@@ -466,12 +566,59 @@ const handleSortChange = (column) => {
   get()
 }
 
-// 精网号去空格
-const trimJwCode = () => {
-  if (rechargeVo.value.jwcode) {
-    rechargeVo.value.jwcode = rechargeVo.value.jwcode.replace(/\s/g, '');
-  }
-}
+// 预览图片函数
+const previewImage = (imageUrl) => {
+  // 使用 element-plus 的 el-image 组件实现图片预览功能
+  const imageElement = document.createElement('img');
+  imageElement.src = imageUrl;
+  imageElement.style.maxWidth = '80vw';
+  imageElement.style.maxHeight = '80vh';
+
+  const viewer = document.createElement('div');
+  viewer.style.position = 'fixed';
+  viewer.style.top = '0';
+  viewer.style.left = '0';
+  viewer.style.width = '100vw';
+  viewer.style.height = '100vh';
+  viewer.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
+  viewer.style.display = 'flex';
+  viewer.style.justifyContent = 'center';
+  viewer.style.alignItems = 'center';
+  viewer.style.zIndex = '9999';
+  viewer.style.overflow = 'auto';
+
+  viewer.appendChild(imageElement);
+  document.body.appendChild(viewer);
+
+  viewer.addEventListener('click', () => {
+    document.body.removeChild(viewer);
+  });
+};
+
+/*
+===================监听============================
+*/
+
+/*
+===================计算属性============================
+*/
+
+// 保留两位小数
+const formattedTrueGold = computed(() => trueGold.value.toFixed(2))
+const formattedTrueRGold = computed(() => trueRGold.value.toFixed(2))
+const formattedTrueFGold = computed(() => trueFGold.value.toFixed(2))
+
+/*
+===================挂载============================
+*/
+// 挂载
+onMounted(async function () {
+  await getAdminData()
+  await getActivity()
+  await get()
+  await getMarket()
+})
+
 </script>
 
 <template>
@@ -480,26 +627,27 @@ const trimJwCode = () => {
       <el-card style="margin-bottom: 5px">
         <el-row style="margin-bottom: 5px">
           <el-col :span="6">
-              <el-text   size="large">精网号：</el-text>
-              <el-input v-model="rechargeVo.jwcode" placeholder="请输入精网号" style="width: 240px" clearable />
+            <el-text size="large">精网号：</el-text>
+            <el-input v-model="rechargeVo.jwcode" placeholder="请输入精网号" style="width: 240px" clearable/>
           </el-col>
           <el-col :span="6">
-              <el-text   size="large">活动名称：</el-text>
-              <el-select v-model="rechargeVo.activityId" placeholder="请选择活动名称" style="width: 240px" clearable>
-                <el-option v-for="item in activity" :key="item.activityId" :label="item.activityName" :value="item.activityId" />
-              </el-select>
+            <el-text size="large">活动名称：</el-text>
+            <el-select v-model="rechargeVo.activity" placeholder="请选择活动名称" style="width: 240px" clearable>
+              <el-option v-for="item in activity" :key="item.activityId" :label="item.activityName"
+                         :value="item.activityId"/>
+            </el-select>
           </el-col>
           <el-col :span="6">
-              <el-text   size="large">支付方式：</el-text>
-              <el-select v-model="rechargeVo.payWay" placeholder="请选择支付方式" style="width: 240px" clearable>
-                <el-option v-for="item in payWay" :key="item.value" :label="item.label" :value="item.value" />
-              </el-select>
+            <el-text size="large">支付方式：</el-text>
+            <el-select v-model="rechargeVo.payMode" placeholder="请选择支付方式" style="width: 240px" clearable>
+              <el-option v-for="item in payMode" :key="item.value" :label="item.label" :value="item.value"/>
+            </el-select>
           </el-col>
           <el-col :span="6">
-            <div class="head-card-element" v-if="adminData.area == '总部'">
-              <el-text   size="large">所属地区：</el-text>
-              <el-select v-model="rechargeVo.area" placeholder="请选择所属地区" style="width: 240px" clearable>
-                <el-option v-for="item in area" :key="item" :label="item" :value="item" />
+            <div class="head-card-element" v-if="adminData.market == '总部'">
+              <el-text size="large">所属地区：</el-text>
+              <el-select v-model="rechargeVo.market" placeholder="请选择所属地区" style="width: 240px" clearable>
+                <el-option v-for="item in market" :key="item" :label="item" :value="item"/>
               </el-select>
             </div>
           </el-col>
@@ -508,12 +656,12 @@ const trimJwCode = () => {
           <el-col :span="12">
             <div class="time-controls">
               <div class="time-group">
-                <el-text   size="large">添加时间：</el-text>
+                <el-text size="large">充值时间：</el-text>
                 <el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间"
-                  end-placeholder="结束时间" style="width: 400px" />
-                <el-button @click="getToday()" style="margin-left: 10px"> 今 </el-button>
-                <el-button @click="getYesterday()" style="margin-left: 10px"> 昨 </el-button>
-                <el-button @click="get7Days()" style="margin-left: 10px"> 近7天 </el-button>
+                                end-placeholder="结束时间" style="width: 400px"/>
+                <el-button @click="getToday()" style="margin-left: 10px"> 今</el-button>
+                <el-button @click="getYesterday()" style="margin-left: 10px"> 昨</el-button>
+                <el-button @click="get7Days()" style="margin-left: 10px"> 近7天</el-button>
               </div>
             </div>
           </el-col>
@@ -534,50 +682,72 @@ const trimJwCode = () => {
           <el-tab-pane label="已通过" name="pass"></el-tab-pane>
           <el-tab-pane label="已驳回" name="reject"></el-tab-pane>
 
-          <div>
+          <div> <!--todo 改这里 总数的-->
             总条数：{{ trueCount }}条&nbsp;&nbsp;&nbsp;&nbsp;
             总金币数：{{ formattedTrueGold }}金币&nbsp;&nbsp;&nbsp;&nbsp;
             永久金币：{{ formattedTrueRGold }}金币&nbsp;&nbsp;&nbsp;&nbsp;
             免费金币：{{ formattedTrueFGold }}金币
           </div>
         </el-tabs>
+
+        <!--表格-->
         <div style="height: 540px; overflow-y: auto">
-          <el-table :data="tableData" style="width: 100%" height="540px" @sort-change="handleSortChange" :row-style="{ height: '50px' }">
+          <el-table :data="tableData" style="width: 100%" height="540px" @sort-change="handleSortChange"
+                    :row-style="{ height: '50px' }">
             <el-table-column type="index" label="序号" width="100px" fixed="left">
               <template #default="scope">
                 <span>{{ scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize }}</span>
               </template>
             </el-table-column>
-            <el-table-column fixed="left" prop="username" label="姓名" width="150px" />
-            <el-table-column fixed="left" prop="jwcode" label="精网号" width="110px" />
-            <el-table-column prop="area" label="所属地区" width="100px" />
-            <el-table-column prop="refundType" label="活动名称" width="100px" />
-            <el-table-column prop="refundGoods" label="充值金额" width="100px" />
-            <el-table-column prop="rechargeCoin" label="永久金币" width="110px" sortable="custom">
-              <template #default="scope">{{ scope.row.rechargeCoin }}</template>
+            <el-table-column fixed="left" prop="name" label="姓名" width="150px"/>
+            <el-table-column fixed="left" prop="jwcode" label="精网号" width="110px"/>
+            <el-table-column prop="market" label="所属地区" width="100px"/>
+            <el-table-column prop="activity" label="活动名称" width="100px"/>
+            <el-table-column prop="money" label="充值金额" sortable="custom" width="110px"/>
+            <el-table-column prop="permanentGold" label="永久金币" width="110px" sortable="custom">
+              <template #default="scope">{{ scope.row.permanentGold }}</template>
             </el-table-column>
-            <el-table-column prop="freeCoin" label="免费金币" sortable="custom" width="110px">
-              <template #default="scope">{{ scope.row.freeCoin }}</template>
+            <el-table-column prop="freeGold" label="免费金币" sortable="custom" width="110px">
+              <template #default="scope">{{ scope.row.freeGold }}</template>
             </el-table-column>
-            <el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip />
-            <el-table-column prop="freeCoin" label="支付凭证" width="110px" />
-            <el-table-column prop="adminName" label="提交人" width="100px" />
-            <el-table-column prop="status" label="付款时间" width="200px" >
-            <template #default="scope">
+            <el-table-column prop="remark" label="备注" width="200px" show-overflow-tooltip/>
+
+            <el-table-column prop="payMode" label="支付方式" width="110px"/>
+            <el-table-column prop="voucher" label="支付凭证" width="110px">
+              <!-- 支付凭证列，支持点击放大预览 -->
+              <template #default="scope">
+                <div v-if="scope.row.voucher" style="cursor: pointer;" @click="previewImage(scope.row.voucher)">
+                  <img :src="scope.row.voucher" alt="支付凭证" style="width: 80px; height: auto;">
+                </div>
+                <div v-else>--</div>
+              </template>
+            </el-table-column>
+
+
+            <el-table-column prop="adminName" label="提交人" width="100px"/>
+            <!--
+                        字太多就悬停显示
+            -->
+            <el-table-column prop="reason" label="驳回理由" width="200px" show-overflow-tooltip/>
+
+            <el-table-column v-if="activeName!== 'wait'" prop="auditName" label="审核人" width="100px"/>
+            <el-table-column prop="payTime" sortable="custom" label="付款时间" width="200px">
+              <template #default="scope">
                 {{ moment(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }}
               </template>
-              </el-table-column>
+            </el-table-column>
             <el-table-column prop="createTime" sortable="custom" label="提交时间" width="200px">
               <template #default="scope">
                 {{ moment(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }}
               </template>
             </el-table-column>
-            <el-table-column fixed="right" prop="operation" label="操作" width="150px">
+            <el-table-column v-if="activeName === 'wait'"
+                             fixed="right" prop="operation" label="操作" width="150px">
               <template #default="scope">
                 <div class="operation">
                   <el-popconfirm title="确定要通过此条记录吗？" @confirm="passConfirm">
                     <template #reference>
-                      <el-button :disabled="scope.row.status === 1 || scope.row.status === 2
+                      <el-button :disabled="scope.row.auditStatus === 1 || scope.row.auditStatus === 2
                         ? true
                         : false
                         " type="primary" text @click="pass(scope.row)">
@@ -589,7 +759,7 @@ const trimJwCode = () => {
                       <el-button type="primary" size="small" @click="confirm">确定</el-button>
                     </template>
                   </el-popconfirm>
-                  <el-button :disabled="scope.row.status === 1 || scope.row.status === 2
+                  <el-button :disabled="scope.row.auditStatus === 1 || scope.row.auditStatus === 2
                     ? true
                     : false
                     " type="primary" text @click="reject(scope.row)">
@@ -603,8 +773,9 @@ const trimJwCode = () => {
 
         <div class="pagination">
           <el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
-            layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange"
-            @current-change="handleCurrentChange"></el-pagination>
+                         layout="total, sizes, prev, pager, next, jumper" :total="total"
+                         @size-change="handlePageSizeChange"
+                         @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-card>
     </el-col>
@@ -613,15 +784,15 @@ const trimJwCode = () => {
   <el-dialog v-model="rejectVisible" title="驳回理由" width="500" :before-close="closeRejectVisible">
     <template #footer>
       <el-form :model="rejectObj" ref="Ref" :rules="rules" label-width="auto" style="max-width: 600px">
-        <el-form-item prop="reson" label="驳回理由:">
-          <el-input v-model="rejectObj.reson" maxlength="150" show-word-limit style="width: 350px" type="textarea"
-            placeholder="请输入内容" />
+        <el-form-item prop="reason" label="驳回理由:">
+          <el-input v-model="rejectObj.reason" maxlength="150" show-word-limit style="width: 350px" type="textarea"
+                    placeholder="请输入内容"/>
         </el-form-item>
       </el-form>
 
       <div class="dialog-footer">
         <el-button @click="closeRejectVisible()">取消</el-button>
-        <el-button type="primary" @click="rejectConfirm()"> 确定 </el-button>
+        <el-button type="primary" @click="rejectConfirm()"> 确定</el-button>
       </div>
     </template>
   </el-dialog>

src/views/consume/coinConsumeDetail.vue

@@ -5,31 +5,20 @@ import request from '@/util/http'
 
 // 之后整理一下
 
+/*
+====================工具方法==============================
+*/
+
 // 时间格式化
 const formatTime = (val) => val ? dayjs(val).format('YYYY-MM-DD HH:mm:ss') : ''
 
-// 变量
-
+/*
+====================数据=================================
+*/
 //这是获取用户信息的接口
 const adminData = ref({})
-
-const getAdminData = async function () {
-  try {
-    const result = await request({
-      url: '/admin/userinfo',
-      data: {}
-    })
-    adminData.value = result
-    console.log('请求成功', result)
-    console.log('用户信息', adminData.value)
-  } catch (error) {
-    console.log('请求失败', error)
-  }
-}
-
 // 充值明细表格
 const tableData = ref([])
-// 搜索======================================
 
 // 搜索consumeUser 表单
 const consumeUser = ref({
@@ -40,8 +29,12 @@ const consumeUser = ref({
   startTime: '',
   endTime: '',
 
-  goodsName: ""
+  goodsName: '',
+
+
 })
+
+
 // 搜索对象
 const getObj = ref({
   pageNum: 1,
@@ -98,13 +91,35 @@ const totalGold = ref(0)
 const permanentGolds = ref(0)
 const freeGolds = ref(0)
 const taskGolds = ref(0)
+// 查询商品的接口的表单
+const goods = ref([])
 
-// 计算总金币数
-const sumGold = computed(() => permanentGolds.value + freeGolds.value + taskGolds.value)
-// 方法
+const totalGoldSearch = ref({
+  payPlatform: "",
+  market: "",
+  startTime: "",
+  endTime: "",
+  goodsName: ""
+})
+
+/*
+====================方法=================================
+*/
+// 获取登录用户信息
+const getAdminData = async function () {
+  try {
+    const result = await request({
+      url: '/admin/userinfo',
+      data: {}
+    })
+    adminData.value = result
+    console.log('请求成功', result)
+    console.log('用户信息', adminData.value)
+  } catch (error) {
+    console.log('请求失败', error)
+  }
+}
 
-// 搜索=========================================================================================================================================================
-// 搜索方法
 
 const ConsumeSelectBy = async function (val) {
   try {
@@ -135,33 +150,42 @@ const ConsumeSelectBy = async function (val) {
 
     // 发送POST请求
     const result = await request({
-      // url: 'consumeUser/selectBy',
       url: 'http://192.168.8.247:8081/consume/selectBy',
       data: {
         pageNum: getObj.value.pageNum,
         pageSize: getObj.value.pageSize,
-        consumeUser: consumeUser.value
+        consumeUser: {
+          ...consumeUser.value,
+          sortField: sortField.value,
+          sortOrder: sortOrder.value
+        }
       }
     })
 
+    console.log('请求成功2', sortField)
+
     // 合计数的接口
     // 复制一份 detail.value 并移除排序字段和排序方式
     const detailWithoutSort = {...consumeUser.value}
     delete detailWithoutSort.sortField
     delete detailWithoutSort.sortOrder
-// 这个接口不知道传什么
+
+
+    // 赋值
+    totalGoldSearch.value.startTime = consumeUser.value.startTime
+    totalGoldSearch.value.endTime = consumeUser.value.endTime
+    totalGoldSearch.value.payPlatform = consumeUser.value.payPlatform
+    totalGoldSearch.value.market = consumeUser.value.market
+    totalGoldSearch.value.goodsName = consumeUser.value.goodsName
+//
     const resultTotalGold = await request({
       // url: 'http://192.168.8.247:8081/consume/statsGold',
       url: 'http://192.168.8.247:8081/consume/statsGold',
-      // data: {
-      //   pageNum: getObj.value.pageNum,
-      //   pageSize: getObj.value.pageSize,
-      //   consumeUser: consumeUser.value
-      // }
+      data: totalGoldSearch.value
 
     })
 
-    console.log("总计",resultTotalGold)
+    console.log("总计", resultTotalGold)
 
     if (resultTotalGold.code === 200 && resultTotalGold.data) {
       const data = resultTotalGold.data
@@ -182,7 +206,7 @@ const ConsumeSelectBy = async function (val) {
     }
 
     const sumGoldList = tableData.value.map(item => item.sumGold);
-    console.log("sumGold",sumGoldList); // 输出包含所有 sumGold 值的数组
+    console.log("sumGold", sumGoldList); // 输出包含所有 sumGold 值的数组
 
     console.log('@@@@@@@@@@tableDataT', tableDataTotal.value.list)
 
@@ -292,9 +316,7 @@ const get7Days = function () {
   console.log('getTime', getTime.value)
   ConsumeSelectBy()
 }
-
-// 查询商品的接口
-const goods = ref([])
+// 获取商品列表
 const getGoods = async function () {
   try {
     // 发送POST请求
@@ -335,19 +357,18 @@ const getMarket = async function () {
   }
 }
 
-
 // 处理排序事件
 const handleSortChange = (column) => {
   console.log('排序字段：', column.prop)
   console.log('排序方式：', column.order)
   if (column.prop === 'permanentGold') {
-    sortField.value = 'recharge_coin'
+    sortField.value = 'permanentGold'
   } else if (column.prop === 'taskGold') {
-    sortField.value = 'task_coin'
+    sortField.value = 'taskGold'
   } else if (column.prop === 'freeGold') {
-    sortField.value = 'free_coin'
+    sortField.value = 'freeGold'
   } else if (column.prop === 'createTime') {
-    sortField.value = 'create_time'
+    sortField.value = 'createTime'
   }
   sortOrder.value = column.order === 'ascending' ? 'DESC' : 'ASC'
   ConsumeSelectBy()
@@ -388,7 +409,23 @@ const checkNumber = function () {
     })
   }
 }
-// 挂载
+
+/*
+====================计算属性=================================
+*/
+
+// 计算总金币数
+const sumGold = computed(() => permanentGolds.value + freeGolds.value + taskGolds.value)
+
+/*
+====================监听=================================
+*/
+
+/*
+====================挂载=================================
+*/
+
+
 onMounted(async function () {
   await getAdminData()
   await ConsumeSelectBy()
@@ -610,7 +647,7 @@ onMounted(async function () {
               </template>
             </el-table-column>
             <el-table-column
-                prop="taskCold"
+                prop="taskGold"
                 label="任务金币"
                 sortable="“custom”"
                 width="110px"

src/views/managerecharge/rate.vue

@@ -3,32 +3,27 @@ import {onMounted, reactive, ref} from 'vue'
 import {ElMessage, ElMessageBox} from 'element-plus'
 import request from '@/util/http'
 
+/*
+====================工具方法=========================
+*/
+
+/*
+====================数据===================================
+*/
+
 // 查询当前登录的信息
 const adminData = ref({
   adminId: '',
   name: ''
 })
 
-const getAdminData = async function () {
-  try {
-    const result = await request({
-      url: '/admin/userinfo',
-      data: {}
-    })
-    adminData.value = result
-    rateEdit.value.adminId = adminData.value.adminId
-    console.log('请求成功', result)
-  } catch (error) {
-    console.log('请求失败', error)
-  }
-}
-
 // 默认 编辑板块是关的
 const regeEdit = ref(false)
 
 // 表单引用(根据id获取信息后 将内容存到编辑表单)
 const editFormRef = ref(null)
 
+
 //汇率表格数据
 const tableData = ref([])
 
@@ -40,7 +35,92 @@ const getObj = ref({
 
 const total = ref(0)
 
+// 编辑方法 表单
+const rateEdit = ref({
+  id: null,
+  rateName: '',
+  num: null,
+  adminId: null,
+  updateTime: Date.now(),
+})
+//货币条目
+const rateNames = [
+  {
+    value: 'USD',
+    label: 'USD'
+  },
+  {
+    value: 'HKD',
+    label: 'HKD'
+  },
+  {
+    value: 'THB',
+    label: 'THB'
+  },
+  {
+    value: 'VND',
+    label: 'VND'
+  },
+  {
+    value: 'CAD',
+    label: 'CAD'
+  },
+  {
+    value: 'MYR',
+    label: 'MYR'
+  },
+  {
+    value: 'KRW',
+    label: 'KRW'
+  },
+  {
+    value: 'JPY',
+    label: 'JPY'
+  },
+  {
+    value: 'CNY',
+    label: 'CNY'
+  }
+]
+// 汇率校验
+const checkFreeGoldRadio = function (rule, value, callback) {
+  if (value == '0' || value == null || value == '') {
+    callback(new Error('请输入汇率比'))
+  } else if (value < 0 || isNaN(value)) {
+    callback(new Error('请输入正确的格式'))
+  } else {
+    callback()
+  }
+}
+// 定义表单验证规则
+const rules = reactive({
+  rateName: [{required: true, message: '请选择货币名称', trigger: 'blur'}],
+  num: [{validator: checkFreeGoldRadio, trigger: 'blur'}],
+})
+
+// 表单大小
+const formSize = ref('default')
+
+/*
+====================方法=========================
+*/
 
+// 获取当前登录信息
+const getAdminData = async function () {
+  try {
+    const result = await request({
+      url: '/admin/userinfo',
+      data: {}
+    })
+    adminData.value = result
+    rateEdit.value.adminId = adminData.value.adminId
+    console.log('请求成功', result)
+  } catch (error) {
+    console.log('请求失败', error)
+  }
+}
+
+// 获取所有汇率 列表
 const getAllRate = async function (val) {
   try {
     // 搜索参数页码赋值
@@ -72,26 +152,19 @@ const getAllRate = async function (val) {
   }
 }
 
+// 获取分页数据
 const handlePageSizeChange = function (val) {
   getObj.value.pageSize = val
   getAllRate()
 }
 
+// 获取分页数据
 const handleCurrentChange = function (val) {
   getObj.value.pageNum = val
   getAllRate()
 }
 
-// 编辑方法 表单
-const rateEdit = ref({
-  id: null,
-  rateName: '',
-  num: null,
-  adminId: null,
-  updateTime: Date.now(),
-})
-
-//查询已有的数据
+//查询已有的数据（根据id）
 const getEditData = async function (row) {
   try {
     console.log('搜索参数', getObj.value)
@@ -116,7 +189,7 @@ const getEditData = async function (row) {
     console.log('请求失败', error)
   }
 }
-
+// 编辑汇率
 const editRate = async function () {
   try {
     console.log('搜索参数', rateEdit.value)
@@ -132,6 +205,8 @@ const editRate = async function () {
     console.log('请求失败', error)
   }
 }
+
+// 编辑确认
 const edit = () => {
   ElMessageBox.confirm('确认修改？')
       .then(() => {
@@ -149,61 +224,14 @@ const cancelEdit = () => {
 
 }
 
-
+// 关闭编辑弹窗
 const handleEditDialogClose = () => {
   if (editFormRef.value) {
     getAllRate()
   }
 }
 
-
-// 挂载
-onMounted(async function () {
-  await getAllRate()
-  await getAdminData()
-})
-
-
-//货币条目
-const options = [
-  {
-    value: 'USD',
-    label: 'USD'
-  },
-  {
-    value: 'HKD',
-    label: 'HKD'
-  },
-  {
-    value: 'THB',
-    label: 'THB'
-  },
-  {
-    value: 'VND',
-    label: 'VND'
-  },
-  {
-    value: 'CAD',
-    label: 'CAD'
-  },
-  {
-    value: 'MYR',
-    label: 'MYR'
-  },
-  {
-    value: 'KRW',
-    label: 'KRW'
-  },
-  {
-    value: 'JPY',
-    label: 'JPY'
-  },
-  {
-    value: 'CNY',
-    label: 'CNY'
-  }
-]
-
+// 日期格式化
 function formatDate(value) {
   if (!value) return ''
   const date = new Date(value)
@@ -217,51 +245,55 @@ function formatDate(value) {
 }
 
 
-const checkFreeGoldRadio = function (rule, value, callback) {
-  if (value == '0' || value == null || value == '') {
-    callback(new Error('请输入汇率比'))
-  } else if (value < 0 || isNaN(value)) {
-    callback(new Error('请输入正确的格式'))
-  } else {
-    callback()
-  }
-}
-const rules = reactive({
-  rateName: [{required: true, message: '请选择货币名称', trigger: 'blur'}],
-  num: [{validator: checkFreeGoldRadio, trigger: 'blur'}],
-})
 
+// 输入框过滤
 function handleInput(value) {
-  // 初始过滤非数字和小数点字符
-  let validValue = value.replace(/[^\d.]/g, '');
+  // 检查是否使用了中文句号
+  if (value.includes('。') || /[^\d.]/g.test(value)) {
+    ElMessage.warning('请输入正确的符号');
+    // value = value.replace('。', '.');
+  }
+
 
   // 处理多个小数点的情况，保留第一个，移除后续的
-  const parts = validValue.split('.');
+  const parts = value.split('.');
   if (parts.length > 2) {
-    validValue = parts[0] + '.' + parts.slice(1).join('');
-    ElMessage.warning('请输入正确格式');
+    value = parts[0] + '.' + parts.slice(1).join('');
+    ElMessage.warning('只能包含一个小数点');
   }
 
-  // 限制小数点后最多7位
-  const [integerPart, decimalPart = ''] = validValue.split('.');
-  if (decimalPart.length > 7) {
-    validValue = `${integerPart}.${decimalPart.slice(0, 7)}`;
-    ElMessage.warning('最多只能输入7位小数');
+  // 禁止输入负数
+  if (value.startsWith('-')) {
+    ElMessage.warning('不允许输入负数');
+    value = value.substring(1);
   }
 
-  // 最终格式验证
-  const isValidFormat = /^\d+(\.\d{0,7})?$/.test(validValue);
-  if (value && !isValidFormat) {
-    ElMessage.warning('请输入正确的数字格式');
+  // 小数点前没有数字时补0
+  if (value.startsWith('.')) {
+    value = '0' + value;
+    ElMessage.info('已自动补充前导0');
   }
 
   // 更新表单值
-  rateEdit.value.num = validValue;
-  return validValue;
+  rateEdit.value.num = value;
+  return value;
 }
 
-// 表单大小
-const formSize = ref('default')
+/*
+====================监听=========================
+*/
+
+/*
+====================挂载=========================
+*/
+
+// 挂载
+onMounted(async function () {
+  await getAllRate()
+  await getAdminData()
+})
+
+
 </script>
 
 
@@ -362,7 +394,7 @@ const formSize = ref('default')
               style="width: 240px"
           >
             <el-option
-                v-for="item in options"
+                v-for="item in rateNames"
                 :key="item.value"
                 :label="item.label"
                 :value="item.value"