差柱状图、退款审核

.env.development

@@ -1,7 +1,5 @@
 # VITE_API_BASE='http://54.251.137.151:10704/'
 # VITE_API_BASE='https://hwjb.homilychart.com/gold_htms_dev'
 # VITE_API_BASE='http://54.251.137.151:10704/'
-# VITE_API_BASE='http://192.168.8.225:8080/'
-# VITE_API_BASE='http://192.168.8.94:8080/'
-VITE_API_BASE='http://18.143.76.3/'
+VITE_API_BASE='http://192.168.8.94:8081/'
 

src/router/index.js

@@ -10,7 +10,6 @@ const router = createRouter({
             meta: { requireAuth: true },
             path: '/', component: () => import("../views/home.vue"),
             children: [
-
                 // 工作台
                 { path: '/workspace/:area?', name: "workspace", component: () => import("../views/workspace/index.vue") },
                 // 充值审核

src/views/audit/rechargeAudit.vue

@@ -9,6 +9,9 @@ import moment from 'moment'
 
 const adminData = ref({})
 const Ref = ref(null)
+const rechargeVo = ref({
+  
+})
 const getAdminData = async function () {
   try {
     const result = await request({

src/views/audit/refundAudit.vue

@@ -140,7 +140,7 @@ const searchForm = ref({
   endDate: ''
 })
 
-const checkTab = ref(1) // 能否不用STATUS常量，1是待审批，2是已通过，3是驳回，参数status需要Integer
+const checkTab = ref('pending') // 能否不用STATUS常量，1是待审批，2是已通过，3是驳回，参数status需要Integer
 const dateRange = ref([])
 
 const pagination = ref({
@@ -190,11 +190,7 @@ const getProducts = async () => {
 // 查地区
 const getAreas = async () => {
   try {
-<<<<<<< HEAD
-    const result = await request({ url: '' })
-=======
     const result = await request({ url: 'http://192.168.8.247:8081/general/market' })
->>>>>>> milestone-20250623-金币前端
     areaOptions.value = result.data || []
   } catch (error) {
     console.error('获取地区列表失败', error)

src/views/home.vue

@@ -70,9 +70,9 @@ const message = function () {
 // 挂载
 onMounted(async function () {
   // 获取用户信息
-  getAdminData()
+  //getAdminData()
   // 获取地区
-  getAreas()
+  //getAreas()
 })
 // 处理地区点击事件，直接在组件内更新当前地区，包老师改的，直接传参
 const changeDataByArea = (item) => {
@@ -199,7 +199,7 @@ const handleClose = (key, keyPath) => {
                 <span style="margin-left: 10px">{{ adminData.name }}</span>
               </template>
               <el-menu-item @click="message()">查看个人信息</el-menu-item>
-              <el-menu-item index="1-2" @click="logout">退出登录</el-menu-item>
+              <el-menu-item index="1-2" >退出登录</el-menu-item>
             </el-sub-menu>
           </el-menu>
         </el-header>

src/views/managerecharge/rate.vue

@@ -2,7 +2,269 @@
 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([])
+
+//搜索对象
+const getObj = ref({
+  pageNum: 1,
+  pageSize: 10
+})
+
+const total = ref(0)
+
+
+const getAllRate = async function (val) {
+  try {
+    // 搜索参数页码赋值
+    if (typeof val === 'number') {
+      getObj.value.pageNum = val;
+    }
+
+    // 发送POST请求
+    const result = await request({
+      url: 'http://192.168.9.21:8081/rate/selectAll',
+      method: 'POST',
+      data: {
+        pageNum: getObj.value.pageNum,
+        pageSize: getObj.value.pageSize,
+      }
+    });
+
+    // 将响应结果存储到响应式数据中
+    console.log('这是汇率列表 请求成功', result);
+
+    // 存储表格数据
+    tableData.value = result.data.list;
+    // 存储分页总条目
+    total.value = result.data.total;
+
+  } catch (error) {
+    console.log('请求失败', error);
+    ElMessage.error('请求失败');
+  }
+}
+
+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(),
+})
+
+//查询已有的数据
+const getEditData = async function (row) {
+  try {
+    console.log('搜索参数', getObj.value)
+    // 发送POST请求
+    const result = await request({
+      url: 'http://192.168.9.21:8081/rate/selectById',
+      data: {id: row.id}
+    })
+
+    // 将响应结果存储到响应式数据中
+    console.log('根据id查 请求成功', result)
+    // 存储表格数据
+    // rateEdit.value = result.data
+    // 只赋部分的
+    rateEdit.value.id = row.id
+    rateEdit.value.rateName = row.rateName
+    rateEdit.value.num = row.num
+    console.log('根据id获取的数据', rateEdit.value)
+    rateEdit.value.adminId = adminData.value.adminId
+
+  } catch (error) {
+    console.log('请求失败', error)
+  }
+}
+
+const editRate = async function () {
+  try {
+    console.log('搜索参数', rateEdit.value)
+    // 发送POST请求
+    const result = await request({
+      url: 'http://192.168.9.21:8081/rate/update',
+      data: rateEdit.value
+    })
+    // 将响应结果存储到响应式数据中
+    console.log('请求成功', result)
+    await getAllRate()
+  } catch (error) {
+    console.log('请求失败', error)
+  }
+}
+const edit = () => {
+  ElMessageBox.confirm('确认修改？')
+      .then(() => {
+        editRate()
+        regeEdit.value = false
+      })
+      .catch(() => {
+        regeEdit.value = false
+      })
+}
+
+// 关闭编辑弹窗时重置表单
+const cancelEdit = () => {
+  regeEdit.value = false
+
+}
+
+
+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)
+  const year = date.getFullYear()
+  const month = (date.getMonth() + 1).toString().padStart(2, '0')
+  const day = date.getDate().toString().padStart(2, '0')
+  const hours = date.getHours().toString().padStart(2, '0')
+  const minutes = date.getMinutes().toString().padStart(2, '0')
+  const seconds = date.getSeconds().toString().padStart(2, '0')
+  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+}
+
+
+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, '');
+
+  // 处理多个小数点的情况，保留第一个，移除后续的
+  const parts = validValue.split('.');
+  if (parts.length > 2) {
+    validValue = 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位小数');
+  }
+
+  // 最终格式验证
+  const isValidFormat = /^\d+(\.\d{0,7})?$/.test(validValue);
+  if (value && !isValidFormat) {
+    ElMessage.warning('请输入正确的数字格式');
+  }
+
+  // 更新表单值
+  rateEdit.value.num = validValue;
+  return validValue;
+}
+
+// 表单大小
+const formSize = ref('default')
 </script>
+
+
 <template>
   <!-- 这是主页面 -->
   <el-row>

src/views/permissions/index.vue

@@ -1,10 +1,6 @@
 <script setup>
 import { ref, onMounted, reactive, computed } from 'vue'
-import ElementPlus from 'element-plus'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import axios from 'axios'
-import moment from 'moment'
-import { ta } from 'element-plus/es/locales.mjs'
+import { ElMessage } from 'element-plus'
 import { UserFilled } from '@element-plus/icons-vue'
 import _ from 'lodash'
 import request from '@/util/http'

src/views/permissions/permission.vue

@@ -4,12 +4,11 @@ import ElementPlus from 'element-plus'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import axios from 'axios'
 import moment from 'moment'
-import { ta } from 'element-plus/es/locales.mjs'
 import { UserFilled } from '@element-plus/icons-vue'
 import _ from 'lodash'
 import request from '@/util/http'
 
-// 客户明细表格
+// 客户明细表格   什么表格？？？？？？？
 const tableData = ref([])
 // 搜索===========================================
 //分页总条目
@@ -33,16 +32,16 @@ const postiton = ref([])
 const permissionAddObj = ref({})
 // 新增用户权限对象，机器码要实现存储多个，addMachineIdInput方法实现
 const addAdmin = ref({
-    account: '',
-    name: '',
-    market: '',
-    permission: '',
-    postiton: '',
-    machineId: '', // 初始机器码输入框
-    machineIds: [], // 动态添加的机器码输入框
-    remark: ''
+  account: '',
+  name: '',
+  market: '',
+  permission: [],
+  postiton: '',
+  machineId: '', // 初始机器码输入框
+  machineIds: [], // 动态添加的机器码输入框
+  remark: ''
 })
-const addMachineIdInput = function () {
+const addMachineIdInput = function () {  //  为啥>=1？？？？？？？？？？？？？？
   if (addAdmin.value.machineIds.length >= 1) {
     ElMessage.warning('设备数量已达上限')
     return
@@ -65,7 +64,7 @@ const get = async function (val) {
     console.log('搜索参数', getObj.value)
     // 发送POST请求
     const result = await request({
-      url: '/admin/search',
+      url: '/permission/getPermission',
       data: {
         ...getObj.value,
         admin: { ...admin.value }
@@ -93,14 +92,14 @@ const search = function () {
 // 重置
 const reset = function () {
   admin.value = {}
-//   addAdmin.value = {}//用在新增表单的重置方法，但现在采用Ref.value.resetFields()方法，不需要reset
+  //   addAdmin.value = {}//用在新增表单的重置方法，但现在采用Ref.value.resetFields()方法，不需要reset
 }
 
 // 获取地区
 const getArea = async function () {
   try {
     const result = await request({
-      url: '/admin/market',
+      url: '/permission/getmarket',
       data: {}
     })
     market.value = result.data
@@ -113,7 +112,7 @@ const getArea = async function () {
 const getStore = async function () {
   try {
     const result = await request({
-      url: '/admin/postiton',
+      url: '/permission/getposition',
       data: {}
     })
     postiton.value = result.data
@@ -123,32 +122,6 @@ const getStore = async function () {
   }
 }
 
-// 验证跳转输入框的数字是否合法
-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)
-    ) {
-      getObj.value.pageNum = parseInt(getObj.value.pageNum)
-      console.log('输入的数字合法')
-      get()
-    } else {
-      //提示
-      ElMessage({
-        type: 'error',
-        message: '请检查输入内容'
-      })
-    }
-  } else {
-    //提示
-    ElMessage({
-      type: 'error',
-      message: '请检查输入内容'
-    })
-  }
-}
 
 // 打开新增用户权限弹窗
 const openPermissionAddVisible = function () {
@@ -156,9 +129,9 @@ const openPermissionAddVisible = function () {
 }
 // 关闭新增用户权限弹窗，并刷新表单
 const closePermissionAddVisible = function () {
-    // reset() ，下面这个方法还可以重置表单验证（请输入...），reset只能重置输入，修改reset方法
-    // 重置表单数据，当我们在新增表单点击添加后会弹出一个文本框，再点击取消，弹出的文本框应该是不显示出来的
-    addAdmin.value = {
+  // reset() ，下面这个方法还可以重置表单验证（请输入...），reset只能重置输入，修改reset方法
+  // 重置表单数据，当我们在新增表单点击添加后会弹出一个文本框，再点击取消，弹出的文本框应该是不显示出来的
+  addAdmin.value = {
     account: '',
     name: '',
     market: '',
@@ -170,7 +143,7 @@ const closePermissionAddVisible = function () {
   };
   permissionAddVisible.value = false;
   // 清除表单验证状态
-    Ref.value.resetFields();
+  Ref.value.resetFields();
 
 }
 // 新增用户权限初始化
@@ -178,68 +151,7 @@ const permissionAddInit = function () {
   permissionAddObj.value = {}
   openPermissionAddVisible()
 }
-// 通过精网号查询没有权限的用户
-const getAdminByJwcodeWithoutPermission = async function () {
-  try {
-    const result = await request({
-      url: '/admin/selectNo',
-      data: permissionAddObj.value
-    })
-    if (result.code == 200) {
-      permissionAddObj.value = result.data[0]
-      ElMessage.success('精网号查询成功')
-    } else {
-      ElMessage.error(result.msg)
-    }
-    console.log('精网号查询没有权限的用户', permissionAddObj.value)
-  } catch (error) {
-    console.log('请求失败', error)
-    // 在这里可以处理错误逻辑，比如显示错误提示等
-  }
-}
-// 新增用户权限提交
-// const permissionAdd = async function () {
-//   try {
-//     if (
-//       permissionAddObj.value.account == "" ||
-//       permissionAddObj.value.account == null ||
-//       permissionAddObj.value.name == "" ||
-//       permissionAddObj.value.name == null
-//     ) {
-//       ElMessage.error("请选择要添加权限的用户");
-//       return;
-//     }
-//     if (
-//       permissionAddObj.value.permisson == "" ||
-//       permissionAddObj.value.permission == null
-//     ) {
-//       ElMessage.error("请选择权限");
-//       return;
-//     }
-//     console.log("新增用户权限提交", permissionAddObj.value);
-
-//     const result = await request(
-//       {
-// url: "/admin/update",
-//       data: permissionAddObj.value}
-//     );
-
-//     // 将响应结果存储到响应式数据中
-//     console.log("请求成功", result);
-
-//     ElMessage.success("添加成功");
-
-//     get();
-
-//     closePermissionAddVisible();
-//   } catch (error) {
-//     console.log("新增用户权限失败", error);
-//     // 在这里可以处理错误逻辑，比如显示错误提示等
-
-//     ElMessage.error("新增用户权限失败");
-//     closePermissionAddVisible();
-//   }
-// };
+
 const permissionAdd = async function () {
   Ref.value.validate(async (valid) => {
     console.log('valid', valid)
@@ -248,7 +160,7 @@ const permissionAdd = async function () {
         addAdmin.value.adminFlag = 1
         addAdmin.value.status1 = 1
         const result = await request({
-          url: '/admin/add',
+          url: '/permission/addPermission',
           data: addAdmin.value
         })
 
@@ -278,16 +190,6 @@ const permissionAdd = async function () {
     }
   })
 }
-// 表格添加的条件
-const rules = reactive({
-  account: [{ required: true, message: '请输入OA号', trigger: 'blur' }],
-  name: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
-  postiton: [{ required: true, message: '请输入职称', trigger: 'blur' }],
-  machineId: [{ required: true, message: '请输入机器码', trigger: 'blur' }],
-  market: [{ required: true, message: '请选择所属地区', trigger: 'blur' }],
-  permission: [{ required: true, message: '请选择权限', trigger: 'blur' }]
-})
-// 验证表单
 // 表单验证ref
 const Ref = ref(null)
 // 使用 _.throttle 并设置 trailing 为 false 实现严格节流，只执行一次
@@ -297,44 +199,31 @@ const throttledPermissionAdd = _.throttle(permissionAdd, 5000, {
 // 权限类别
 const permissionList = [
   {
-    label: '总部',
+    label: '管理员',
     value: '1'
   },
   {
-    label: '地区经理',
-    value: '5'
+    label: '总部财务',
+    value: '2'
   },
   {
-    label: '财务',
+    label: '总部客服',
     value: '3'
   },
   {
-    label: '客服',
-    value: '2'
+    label: '地区负责人',
+    value: '4'
+  },
+  {
+    label: '地区财务',
+    value: '5'
+  },
+  {
+    label: '客服专员',
+    value: '6'
   }
 ]
-// 获取地区
-// 获取地区
-const areaList = ref([])
-const getAreas = async function () {
-  try {
-    // 发送POST请求
-    const result = await request({
-      url: '/recharge/user/search',
-      data: {}
-    })
 
-    // 将响应结果存储到响应式数据中
-    console.log('请求成功', result)
-    // 存储地区信息
-    areaList.value = result.data
-    console.log('地区', market.value)
-  } catch (error) {
-    console.log('请求失败', error)
-    // 在这里可以处理错误逻辑，比如显示错误提示等
-  }
-}
-getAreas()
 // 打开编辑用户权限弹窗
 const openPermissionEditVisible = function () {
   permissionEditVisible.value = true
@@ -346,11 +235,13 @@ const closePermissionEditVisible = function () {
 // 编辑用户权限初始化
 const permissionEditInit = function (row) {
   permissionEditObj.value = {}
+  permissionEditObj.value.id = row.id
   permissionEditObj.value.account = row.account
   permissionEditObj.value.name = row.name
   permissionEditObj.value.market = row.market
   permissionEditObj.value.postiton = row.postiton
   permissionEditObj.value.permission = row.permission
+  permissionEditObj.value.roleId = row.roleId
   console.log('编辑用户权限', permissionEditObj.value)
   openPermissionEditVisible()
 }
@@ -358,23 +249,18 @@ const permissionEditInit = function (row) {
 const permissionEdit = async function () {
   try {
     const result = await request({
-      url: '/admin/update',
+      url: '/permission/updateAdminRole',
       data: permissionEditObj.value
     })
-
     // 将响应结果存储到响应式数据中
-    console.log('请求成功', result)
-
+    console.log('请求成功3', result)
     ElMessage.success('编辑用户权限成功')
-
     get()
-
     closePermissionEditVisible()
   } catch (error) {
     console.log('编辑用户权限失败', error)
     // 在这里可以处理错误逻辑，比如显示错误提示等
     ElMessage.error('编辑用户权限失败')
-
     closePermissionEditVisible()
   }
 }
@@ -386,20 +272,17 @@ const del = function (row) {
   delObj.value = {}
   console.log(row, '删除初始化')
   delObj.value.account = row.account
+  delObj.value.id = row.id
 }
 // 删除权限
 const delConfirm = async function () {
   try {
-    delObj.value.permission = '4'
-    console.log(delObj.value)
-
     const result = await request({
-      url: '/admin/update',
+      url: '/permission/deleteAdmin',
       data: delObj.value
     })
-
-    // 将响应结果存储到响应式数据中
-    console.log('请求成功', result)
+    console.log('看看删除对象', delObj.value)
+    console.log('请求成功1', result)
 
     ElMessage.success('删除权限成功')
     delObj.value = {}
@@ -416,21 +299,21 @@ const editStatus = async function (row) {
     console.log(row)
 
     permissionEditObj.value = {}
+    permissionEditObj.value.id = row.id
     permissionEditObj.value.account = row.account
-    permissionEditObj.value.status1 = row.status1
-
+    permissionEditObj.value.adminStatus = row.adminStatus
     console.log('修改用户权限状态', permissionEditObj.value)
 
     const result = await request({
-      url: '/admin/update',
+      url: '/permission/upadatePermission',
       data: permissionEditObj.value
     })
 
     // 将响应结果存储到响应式数据中
-    console.log('请求成功', result)
+    console.log('请求成功2', result)
 
     ElMessage.success(
-      permissionEditObj.value.status1 == 1 ? '启用成功' : '禁用成功'
+      permissionEditObj.value.adminStatus == 1 ? '启用成功' : '禁用成功'
     )
     permissionEditObj.value = {}
     get()
@@ -463,44 +346,19 @@ const handleCurrentChange = function (val) {
         <div class="head-card">
           <div class="head-card-element">
             <el-text class="mx-1" size="large">OA号：</el-text>
-            <el-input
-              v-model="admin.account"
-              style="width: 240px"
-              placeholder="请输入OA号"
-              clearable
-            />
+            <el-input v-model="admin.account" style="width: 240px" placeholder="请输入OA号" clearable />
           </div>
           <div class="head-card-element" style="margin-left: 50px">
             <el-text class="mx-1" size="large">所属地区：</el-text>
-            <el-select
-              v-model="admin.market"
-              placeholder="请选择所属地区"
-              style="width: 240px"
-              clearable
-            >
-              <el-option
-                v-for="item in market"
-                :key="item"
-                :label="item"
-                :value="item"
-              />
+            <el-select v-model="admin.market" placeholder="请选择所属地区" style="width: 240px" clearable>
+              <el-option v-for="item in market" :key="item" :label="item" :value="item" />
             </el-select>
           </div>
 
           <div class="head-card-element" style="margin-left: 50px">
             <el-text class="mx-1" size="large">职位名称：</el-text>
-            <el-select
-              v-model="admin.postiton"
-              placeholder="请选择职位名称"
-              style="width: 240px"
-              clearable
-            >
-              <el-option
-                v-for="item in postiton"
-                :key="item"
-                :label="item"
-                :value="item"
-              />
+            <el-select v-model="admin.postiton" placeholder="请选择职位名称" style="width: 240px" clearable>
+              <el-option v-for="item in postiton" :key="item" :label="item" :value="item" />
             </el-select>
           </div>
 
@@ -512,26 +370,18 @@ const handleCurrentChange = function (val) {
       </el-card>
     </el-col>
   </el-row>
+
   <el-row>
     <el-col>
       <el-card>
-        <!-- 添加 -->
+        <!-- 展示表单 -->
         <div class="add-item">
-          <el-button
-            style="color: #048efb; border: 1px solid #048efb"
-            @click="permissionAddInit()"
-            >新增用户</el-button
-          >
+          <el-button style="color: #048efb; border: 1px solid #048efb" @click="permissionAddInit()">新增用户</el-button>
         </div>
 
         <div>
           <el-table :data="tableData" style="width: 100%">
-            <el-table-column
-              type="index"
-              label="序号"
-              width="100px"
-              fixed="left"
-            >
+            <el-table-column type="index" label="序号" width="100px" fixed="left">
               <template #default="scope">
                 <span>{{
                   scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize
@@ -545,34 +395,24 @@ const handleCurrentChange = function (val) {
             <el-table-column prop="postiton" label="职位" />
             <el-table-column prop="permission" label="部门权限">
               <template #default="scope">
-                <span v-if="scope.row.permission === '1'"> 总部管理员 </span>
-                <span v-if="scope.row.permission === '2'"> 分部财务 </span>
-                <span v-if="scope.row.permission === '3'"> 分部客服 </span>
-                <span v-if="scope.row.permission === '5'"> 分部经理 </span>
+                <span v-if="scope.row.permission === '1'"> 管理员 </span>
+                <span v-if="scope.row.permission === '2'"> 总部财务 </span>
+                <span v-if="scope.row.permission === '3'"> 总部客服 </span>
+                <span v-if="scope.row.permission === '4'"> 地区负责人 </span>
+                <span v-if="scope.row.permission === '5'"> 地区财务 </span>
+                <span v-if="scope.row.permission === '6'"> 客服专员 </span>
               </template>
             </el-table-column>
             <el-table-column prop="remark" label="备注" />
             <el-table-column prop="operation" label="操作" width="200px">
               <template #default="scope">
-                <el-button
-                  type="warning"
-                  text
-                  @click="permissionEditInit(scope.row)"
-                  :disabled="scope.row.status1 === 0"
-                >
+                <el-button type="warning" text @click="permissionEditInit(scope.row)"
+                  :disabled="scope.row.adminStatus === 0">
                   修改权限
                 </el-button>
-                <el-popconfirm
-                  title="确定将此用户删除吗？"
-                  @confirm="delConfirm"
-                >
+                <el-popconfirm title="确定将此用户删除吗？" @confirm="delConfirm">
                   <template #reference>
-                    <el-button
-                      type="danger"
-                      text
-                      @click="del(scope.row)"
-                      :disabled="scope.row.status1 === 0"
-                    >
+                    <el-button type="danger" text @click="del(scope.row)" :disabled="scope.row.adminStatus === 0">
                       删除
                     </el-button>
                   </template>
@@ -585,22 +425,13 @@ const handleCurrentChange = function (val) {
                 </el-popconfirm>
               </template>
             </el-table-column>
-            <el-table-column prop="status1" label="状态">
+            <el-table-column prop="adminStatus" label="状态">
               <template #default="scope">
-                <el-switch
-                  v-model="scope.row.status1"
-                  :active-value="1"
-                  :inactive-value="0"
-                  size="large"
-                  @change="editStatus(scope.row)"
-                  style="
+                <el-switch v-model="scope.row.adminStatus" :active-value="1" :inactive-value="0" size="large"
+                  @change="editStatus(scope.row)" style="
                     --el-switch-on-color: #13ce66;
                     --el-switch-off-color: #ff4949;
-                  "
-                  active-text="启用"
-                  inactive-text="禁用"
-                  inline-prompt
-                />
+                  " active-text="启用" inactive-text="禁用" inline-prompt />
               </template>
             </el-table-column>
           </el-table>
@@ -608,116 +439,57 @@ const handleCurrentChange = function (val) {
 
         <!-- 分页 -->
         <div class="pagination" style="margin-top: 20px">
-          <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>
+          <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>
         </div>
       </el-card>
     </el-col>
   </el-row>
   <!-- 新增用户权限 -->
-  <el-dialog
-    v-model="permissionAddVisible"
-    title="新增用户权限"
-    width="800px"
-    :close-on-click-modal="false"
-  >
+  <el-dialog v-model="permissionAddVisible" title="新增用户权限" width="800px" :close-on-click-modal="false">
     <template #footer>
       <!-- 居中显示 -->
 
-      <el-form
-        ref="Ref"
-        :rules="rules"
-        :model="addAdmin"
-        label-width="auto"
-        style="max-width: 600px; align-items: center"
-      >
-        <el-form-item prop="account" label="OA号:">
-          <el-input
-            v-model="addAdmin.account"
-            placeholder="请输入OA号"
-            style="width: 220px"
-          />
+      <el-form ref="Ref" :model="addAdmin" label-width="auto" style="max-width: 600px; align-items: center">
+        <el-form-item prop="account" label="OA号:" required>
+          <el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px" />
         </el-form-item>
 
-        <el-form-item prop="name" label="用户名:">
-          <el-input
-            v-model="addAdmin.name"
-            placeholder="请输入用户名"
-            style="width: 220px"
-          />
+        <el-form-item prop="name" label="用户名:" required>
+          <el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px" />
         </el-form-item>
 
-        <el-form-item prop="market" label="所属地区:">
-          <el-select
-            v-model="addAdmin.market"
-            placeholder="请选择所属地区"
-            style="width: 220px"
-            @change="() => Ref.value.validateField('market')"
-          >
-            <el-option
-              v-for="item in areaList"
-              :key="item"
-              :label="item"
-              :value="item"
-            ></el-option>
+        <el-form-item prop="market" label="所属地区:"   required>
+          <el-select v-model="addAdmin.market" placeholder="请选择所属地区" style="width: 220px"
+            @change="() => Ref.value.validateField('market')">
+            <el-option v-for="item in market" :key="item" :label="item" :value="item" />
           </el-select>
         </el-form-item>
-        <el-form-item prop="permission" label="权限类别:">
-          <el-select
-            v-model="addAdmin.permission"
-            placeholder="请选择权限"
-            style="width: 220px"
-            @change="() => Ref.value.validateField('permission')"
-          >
-            <el-option
-              v-for="item in permissionList"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            ></el-option>
+        <el-form-item prop="permission" label="权限类别:" required>
+          <el-select v-model="addAdmin.permission" placeholder="请选择权限" style="width: 220px"
+            @change="() => Ref.value.validateField('permission')">
+            <el-option v-for="item in permissionList" :key="item.value" :label="item.label"
+              :value="item.value"></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item prop="postiton" label="职位:">
-          <el-input
-            v-model="addAdmin.postiton"
-            placeholder="请输入职称"
-            style="width: 220px"
-          />
+        <el-form-item prop="postiton" label="职位:" required>
+          <el-input v-model="addAdmin.postiton" placeholder="请输入职称" style="width: 220px" />
         </el-form-item>
-        <el-form-item prop="machineId" label="机器码:">
-        <div style="display: flex; align-items: center; flex-wrap: wrap;">
-          <el-input
-            v-model="addAdmin.machineId"
-            placeholder="请输入机器码"
-            style="width: 220px; margin-right: 10px;"
-          />
-          <el-button type="primary" @click="addMachineIdInput">添加</el-button>
-          <!-- 动态添加的机器码输入框 -->
-          <div v-for="(item, index) in addAdmin.machineIds" :key="index" style="margin-left: 10px;">
-            <el-input
-              v-model="addAdmin.machineIds[index]"
-              placeholder="请输入机器码"
-              style="width: 180px; margin-right: 10px;"
-            />
+        <el-form-item prop="machineId" label="机器码:" required>
+          <div style="display: flex; align-items: center; flex-wrap: wrap;">
+            <el-input v-model="addAdmin.machineId" placeholder="请输入机器码" style="width: 220px; margin-right: 10px;" />
+            <el-button type="primary" @click="addMachineIdInput">添加</el-button>
+            <!-- 动态添加的机器码输入框 -->
+            <div v-for="(item, index) in addAdmin.machineIds" :key="index" style="margin-left: 10px;">
+              <el-input v-model="addAdmin.machineIds[index]" placeholder="请输入机器码"
+                style="width: 180px; margin-right: 10px;" />
+            </div>
           </div>
-        </div>
-      </el-form-item>
+        </el-form-item>
         <el-form-item prop="remark" label="备注">
-          <el-input
-            v-model="addAdmin.remark"
-            style="width: 300px"
-            :rows="2"
-            maxlength="100"
-            show-word-limit
-            type="textarea"
-          />
+          <el-input v-model="addAdmin.remark" style="width: 300px" :rows="2" maxlength="100" show-word-limit
+            type="textarea" />
         </el-form-item>
       </el-form>
 
@@ -729,117 +501,10 @@ const handleCurrentChange = function (val) {
       </div>
     </template>
   </el-dialog>
-  <!-- 这是新增用户权限弹窗
-  <el-dialog
-    v-model="permissionAddVisible"
-    title="新增用户权限"
-    width="800px"
-    :close-on-click-modal="false"
-  >
-    <div style="display: flex; margin: 20px 0px 20px 0px">
-      <span class="permissionVisible" style="margin-right: 10px">精网号:</span>
-      <el-input
-        placeholder="请输入精网号"
-        v-model="permissionAddObj.account"
-        style="width: 240px; margin-right: 10px"
-        clearable
-      ></el-input>
-      <el-button type="primary" @click="getAdminByJwcodeWithoutPermission()"
-        >查询</el-button
-      >
-    </div>
-
-    <el-descriptions
-      class="margin-top"
-      :column="2"
-      :size="size"
-      border
-      label-width="200px"
-    >
-      <el-descriptions-item>
-        <template #label>
-          <div class="permissionVisible">
-            <el-icon>
-              <UserFilled />
-            </el-icon>
-            员工精网号
-          </div>
-        </template>
-        {{ permissionAddObj.account }}
-      </el-descriptions-item>
-      <el-descriptions-item>
-        <template #label>
-          <div class="permissionVisible">
-            <el-icon>
-              <User />
-            </el-icon>
-            员工姓名
-          </div>
-        </template>
-        {{ permissionAddObj.name }}
-      </el-descriptions-item>
-      <el-descriptions-item>
-        <template #label>
-          <div class="permissionVisible">
-            <el-icon :style="iconStyle">
-              <location />
-            </el-icon>
-            所属地区
-          </div>
-        </template>
-        {{ permissionAddObj.market }}
-      </el-descriptions-item>
-      <el-descriptions-item>
-        <template #label>
-          <div class="permissionVisible">
-            <el-icon>
-              <OfficeBuilding />
-            </el-icon>
-            部门
-          </div>
-        </template>
-        {{ permissionAddObj.postiton }}
-      </el-descriptions-item>
-    </el-descriptions>
-
-    <el-divider>
-      <el-icon><star-filled /></el-icon>
-    </el-divider>
-    <div>
-      <span class="permissionVisible" style="margin-right: 20px"
-        >权限设置:</span
-      >
-      <el-radio-group v-model="permissionAddObj.permission">
-        <el-radio value="1" border>总部管理员</el-radio>
-        <el-radio value="5" border>分部经理</el-radio>
-        <el-radio value="2" border>分部财务</el-radio>
-        <el-radio value="3" border>分部客服</el-radio>
-      </el-radio-group>
-    </div>
-    <template #footer>
-      <div>
-        <el-button @click="closePermissionAddVisible()">取消</el-button>
-        <el-button type="primary" @click="throttledPermissionAdd()">
-          提交
-        </el-button>
-      </div>
-    </template>
-  </el-dialog> -->
 
   <!-- 这是编辑用户权限弹窗 -->
-  <el-dialog
-    v-model="permissionEditVisible"
-    title="编辑用户权限"
-    width="800px"
-    :close-on-click-modal="false"
-  >
-    <el-descriptions
-      class="margin-top"
-      :column="2"
-      :size="size"
-      border
-      label-width="200px"
-    >
+  <el-dialog v-model="permissionEditVisible" title="编辑用户权限" width="800px" :close-on-click-modal="false">
+    <el-descriptions class="margin-top" :column="2" border label-width="200px">
       <el-descriptions-item>
         <template #label>
           <div class="permissionVisible">
@@ -865,7 +530,7 @@ const handleCurrentChange = function (val) {
       <el-descriptions-item>
         <template #label>
           <div class="permissionVisible">
-            <el-icon :style="iconStyle">
+            <el-icon>
               <location />
             </el-icon>
             所属地区
@@ -890,20 +555,20 @@ const handleCurrentChange = function (val) {
       <el-icon><star-filled /></el-icon>
     </el-divider>
     <div>
-      <span class="permissionVisible" style="margin-right: 20px"
-        >权限设置:</span
-      >
-      <el-radio-group v-model="permissionEditObj.permission">
-        <el-radio value="1" border>总部管理员</el-radio>
-        <el-radio value="5" border>分部经理</el-radio>
-        <el-radio value="2" border>分部财务</el-radio>
-        <el-radio value="3" border>分部客服</el-radio>
+      <span class="permissionVisible" style="margin-right: 20px">权限设置:</span>
+      <el-radio-group v-model="permissionEditObj.roleId">
+        <el-radio value="1" border>管理员</el-radio>
+        <el-radio value="2" border>总部财务</el-radio>
+        <el-radio value="3" border>总部客服</el-radio>
+        <el-radio value="4" border>地区负责人</el-radio>
+        <el-radio value="5" border>地区财务</el-radio>
+        <el-radio value="6" border>客服专员</el-radio>
       </el-radio-group>
     </div>
     <template #footer>
       <div>
         <el-button @click="closePermissionEditVisible()">取消</el-button>
-        <el-button type="primary" @click="throttledPermissionEdit()">
+        <el-button type="primary" @click="throttledPermissionEdit">
           提交
         </el-button>
       </div>
@@ -912,7 +577,6 @@ const handleCurrentChange = function (val) {
 </template>
 
 <style scoped>
-
 .permissionVisible {
   font-size: 16px;
   font-weight: bold;

src/views/recharge/coinRecharge.vue

@@ -16,950 +16,8 @@
         金币充值明细
       </el-button>
     </el-button-group>
-<<<<<<< HEAD
-
-
-      <!-- 根据activeTab切换显示内容 -->
-   <!-- 新增充值的布局------------------------------------------------------------------- -->
-    <div v-if="activeTab === 'addRecharge'">
-  <!-- <div style="display: flex">
-    <div style="margin-right: 20px">新增充值</div>
-  </div> -->
-
-  <el-form
-    :model="addRecharge"
-    ref="Ref"
-    :rules="rules"
-    label-width="auto"
-    style="max-width: 600px"
-    class="add-form"
-  >
-    <el-form-item prop="jwcode" label="精网号">
-      <el-input v-model="addRecharge.jwcode" style="width: 220px" />
-      <el-button
-        type="primary"
-        @click="getUser(addRecharge.jwcode)"
-        style="margin-left: 20px"
-        >查询</el-button
-      >
-    </el-form-item>
-    <el-form-item prop="activityId" label="活动名称">
-      <el-select
-        v-model="addRecharge.activityId"
-        placeholder="请选择"
-        style="width: 300px"
-        @change="handleActivityChange"
-      >
-        <el-option
-          v-for="item in activity"
-          :key="item.value"
-          :label="item.activityName"
-          :value="item.activityId"
-        />
-      </el-select>
-    </el-form-item>
-    <el-col>
-    <el-form-item prop="paidGold" label="永久金币">
-      <el-input v-model="addRecharge.paidGold" style="width: 100px" />
-      <p style="margin-right: 20px">个</p>
-    </el-form-item>
-    <el-form-item prop="freeGold" label="免费金币">
-      <el-input v-model="addRecharge.freeGold" style="width: 100px" />
-      <p>个</p>
-    </el-form-item>
-  </el-col>
-    <el-form-item label="充值金额">
-      <el-select
-        prop="rechargeGold"
-        v-model="Rate"
-        placeholder="货币名称"
-        style="width: 95px; margin-right: 5px"
-        aria-required="true"
-      >
-        <el-option
-          v-for="item in currency"
-          :key="item.value"
-          :label="item.currency"
-          :value="item.exchangeRate"
-        />
-      </el-select>
-      <el-input prop="addRecharge.rechargeGold" v-model="addRecharge.rechargeGold" style="width: 200px" aria-required="true"/>
-    </el-form-item>
-    <el-form-item prop="payWay" label="收款方式">
-      <el-select
-        v-model="addRecharge.payWay"
-        placeholder="请选择"
-        style="width: 300px"
-      >
-        <el-option
-          v-for="item in options"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-        />
-      </el-select>
-    </el-form-item>
-    <el-form-item prop="rechargeTime" label="交款时间">
-      <!-- 修改 type 属性为 datetime 以支持时分秒选择 -->
-      <el-date-picker
-        v-model="addRecharge.rechargeTime"
-        type="datetime"
-        style="width: 300px"
-      />
-    </el-form-item>
-    <el-form-item
-      prop="rechargeVoucher"
-      label="交款凭证"
-      style="margin-bottom: 5px"
-    >
-      <el-upload
-        action="http://39.101.133.168:8828/hljw/api/aws/upload"
-        class="avatar-uploader"
-        :show-file-list="false"
-        :on-success="handleAvatarSuccess"
-        :before-upload="beforeAvatarUpload"
-        style="width: 100px; height: 115px"
-      >
-        <img
-          v-if="imageUrl"
-          :src="imageUrl"
-          class="avatar"
-          style="width: 100px; height: 115px"
-        />
-        <el-icon
-          v-else
-          class="avatar-uploader-icon"
-          style="width: 100px; height: 100px"
-        >
-          <Plus />
-        </el-icon>
-      </el-upload>
-      <p style="margin-left: 10px; color: rgb(177, 176, 176)">
-        仅支持.jpg .png格式，文件≤2MB
-      </p>
-    </el-form-item>
-    <el-form-item prop="remark" label="备注">
-      <el-input
-        v-model="addRecharge.remark"
-        style="width: 300px"
-        :rows="2"
-        maxlength="100"
-        show-word-limit
-        type="textarea"
-      />
-    </el-form-item>
-    <el-form-item prop="submitter" label="提交人">
-      <el-input
-        style="width: 300px"
-        :value="adminData.name"
-        disabled
-        placeholder="提交人姓名"
-      />
-    </el-form-item>
-    <el-button @click="deleteRecharge" style="margin-left: 280px" type="success"
-      >重置</el-button
-    >
-    <el-button type="primary" @click="addBefore"> 提交 </el-button>
-  </el-form>
-
-  <!-- 客户信息栏 -->
-  <el-card
-    style="width: 1200px; float: right;margin-bottom:20px;margin-top: 10px;"
-    class="customer-info"
-    width="3000px"
-  >
-    <el-form
-      :model="user"
-      label-width="auto"
-      style="max-width: 1200px"
-      label-position="left"
-    >
-      <el-text size="large" style="margin-left: 20px">客户信息</el-text>
-      <el-row style="margin-top: 20px">
-        <el-col :span="10">
-          <el-form-item label="姓名:">
-            <p>{{ user.name }}</p>
-          </el-form-item>
-        </el-col>
-        <el-col :span="14">
-          <el-form-item label="历史金币总数">
-            <!-- 检查 user.totalRechargeGold 是否为有效的数字 -->
-            <p v-if="!isNaN(Number(user.totalRechargeGold))">
-              {{ Number(user.totalRechargeGold / 100) }}
-            </p>
-            <!-- 如果不是有效的数字，显示默认值 -->
-            <p v-else></p>
-          </el-form-item>
-        </el-col>
-        <el-col :span="10">
-          <el-form-item label="精网号">
-            <p>{{ user.jwcode }}</p>
-          </el-form-item>
-        </el-col>
-        <el-col :span="14">
-          <el-form-item label="当前金币总数" style="width: 500px">
-            <span
-              style="color: #2fa1ff; margin-right: 5px"
-              v-if="user.buyJb !== undefined"
-              >{{
-                (user.buyJb + user.free6 + user.free12 + user.coreJb) / 100
-              }}</span
-            >
-            <span
-              style="display: inline; white-space: nowrap; color: #b1b1b1"
-              v-if="user.buyJb !== undefined"
-              >(永久金币:{{ user.buyJb / 100 }};免费金币:{{
-                (user.free6 + user.free12) / 100
-              }};任务金币:{{ user.coreJb / 100 }})</span
-            >
-          </el-form-item>
-        </el-col>
-        <el-col :span="10">
-          <el-form-item label="首次充值日期">
-            <p v-if="user.firstRechargeDate">
-              {{ moment(user.firstRechargeDate).format('YYYY-MM-DD HH:mm:ss') }}
-            </p>
-          </el-form-item>
-        </el-col>
-        <el-col :span="14">
-          <el-form-item label="充值次数">
-            <p style="color: #2fa1ff">{{ user.rechargeTimes }}</p>
-          </el-form-item>
-        </el-col>
-        <!-- <el-col :span="10">
-          <el-form-item label="负责客服">
-            <p>{{ adminData.name }}</p>
-          </el-form-item>
-        </el-col> -->
-        <el-col :span="10">
-          <el-form-item label="消费次数">
-            <p style="color: #2fa1ff">{{ user.spendTimes }}</p>
-          </el-form-item>
-        </el-col>
-        <el-col :span="10">
-          <el-form-item label="所属门店">
-            <p>{{ adminData.area }}</p>
-          </el-form-item>
-        </el-col>
-        <el-col :span="14">
-          <!-- <el-form-item label="待审核">
-            <p style="color: #2fa1ff">
-              {{ user.A }}
-            </p>
-          </el-form-item> -->
-        </el-col>
-      </el-row>
-    </el-form>
-  </el-card>
-
-  <el-dialog
-    v-model="batchRechargeVisible"
-    title="批量充值"
-    width="1800px"
-    style="height: 700px"
-    :close-on-click-modal="false"
-  >
-    <el-row style="margin-bottom: 10px">
-      <!-- <el-button type="primary" @click="addLine()" style="margin-right: 10px">新增一行</el-button> -->
-      <div style="font-weight: bold; font-size: 20px">
-        <span>添加</span>
-        <el-input-number
-          min="1"
-          style="width: 100px"
-          controls-position="right"
-          v-model="addLineObj"
-        ></el-input-number>
-        <span>行</span>
-        <el-button
-          type="primary"
-          @click="throttledAddLines"
-          style="margin-right: 10px"
-          >添加</el-button
-        >
-      </div>
-      <el-button
-        type="warning"
-        @click="batchSettingInit()"
-        style="margin-right: 10px"
-        >批量设置</el-button
-      >
-      <!-- <el-upload :ref="(el) => handleSetUploadRefMap(el)" action="" :http-request="httpExcelRequest" :limit="1" :show-file-list="false"
-        class="uploadExcelContent" :data={} style="margin-right: auto">
-        <el-button type="success" >导入jwcode</el-button>
-      </el-upload> -->
-      <el-button
-        type="danger"
-        plain
-        @click="batchDel()"
-        style="margin-right: 10px; width: 130px"
-        >批量删除</el-button
-      >
-    </el-row>
-    <el-row>
-      <el-table
-        v-loading="loading"
-        :data="batchData"
-        border
-        max-height="540px"
-        style="height: 540px"
-        @selection-change="handleSelectionChangebatch"
-      >
-        <el-table-column type="selection" width="50px" />
-        <el-table-column property="index" label="序号" width="55px">
-          <template #default="scope">
-            <span>{{ scope.$index + 1 }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="jwcode" label="精网号" width="150px">
-          <template #default="scope">
-            <el-input
-              v-if="scope.row.showInput"
-              :class="{ 'is-invalid': scope.row.isInputInvalid }"
-              @blur="validateInput(scope.row)"
-              v-model="scope.row.jwcode"
-              style="width: 110px"
-            />
-            <p v-if="scope.row.isInputInvalid" class="error-message">
-              {{ scope.row.inputErrorMessage }}
-            </p>
-          </template>
-          <!-- <template #default="scope">
-            <el-select-v2 v-if="scope.row.showInput" filterable clearable v-model="scope.row.jwcode"
-              placeholder="请选择精网号" style="widows: 110px;" :options="jwcodeList">
-            <el-select-v2
-              v-if="scope.row.showInput"
-              filterable
-              clearable
-              v-model="scope.row.jwcode"
-              placeholder="请选择精网号"
-              style="widows: 110px"
-              :options="jwcodeList"
-            >
-            </el-select-v2>
-            <span v-else>{{ scope.row.jwcode }}</span>
-          </template> -->
-        </el-table-column>
-        <el-table-column property="activityName" label="活动名称" width="150px">
-          <template #default="scope">
-            <el-select
-              v-if="scope.row.showInput"
-              filterable
-              clearable
-              v-model="scope.row.activityId"
-              placeholder="请选择活动名称"
-              @change="changeActivity(scope.row)"
-            >
-              <el-option
-                v-for="item in activity"
-                :key="item.activityId"
-                :label="item.activityName"
-                :value="item.activityId"
-              >
-              </el-option>
-            </el-select>
-            <span v-else>{{ scope.row.activityName }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="paidGold" label="永久金币" width="110px">
-          <template #default="scope">
-            <el-input
-              v-if="scope.row.showInput"
-              v-model="scope.row.paidGold"
-              style="width: 70px"
-              @change="changePaidGold(scope.row)"
-            />
-            <span v-else>{{ scope.row.paidGold }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="freeGold" label="免费金币" width="110px">
-          <template #default="scope">
-            <el-input
-              v-if="scope.row.showInput"
-              v-model="scope.row.freeGold"
-              style="width: 70px"
-            />
-            <span v-else>{{ scope.row.freeGold }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="rate" label="货币名称">
-          <template #default="scope">
-            <el-select
-              v-if="scope.row.showInput"
-              filterable
-              clearable
-              v-model="scope.row.rate"
-              placeholder="请选择币种"
-              @change="changeRate(scope.row)"
-            >
-              <el-option
-                v-for="item in currency"
-                :key="item.exchangeRate"
-                :label="item.currency"
-                :value="item.exchangeRate"
-              >
-              </el-option>
-            </el-select>
-            <span v-else>{{ scope.row.rate }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column  label="充值金额" width="110px">
-          <template #default="scope">
-            <el-input property="rechargeGold" v-model="scope.row.rechargeGold"></el-input>
-          </template>
-        </el-table-column>
-        <el-table-column property="payWay" label="收款方式" width="130px">
-          <template #default="scope">
-            <el-select
-              v-if="scope.row.showInput"
-              filterable
-              clearable
-              v-model="scope.row.payWay"
-              placeholder="请选择收款方式"
-            >
-              <el-option
-                v-for="item in options"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              >
-              </el-option>
-            </el-select>
-            <span v-else>{{ scope.row.payWay }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="rechargeTime" label="交款时间" width="150px">
-          <template #default="scope">
-            <el-date-picker
-              v-if="scope.row.showInput"
-              type="date"
-              v-model="scope.row.rechargeTime"
-              style="width: 120px"
-              placeholder="请选择交款时间"
-            >
-            </el-date-picker>
-            <span v-else>{{
-              moment(scope.row.rechargeTime).format('YYYY-MM-DD HH:mm:ss')
-            }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="rechargeVoucher" label="充值凭证">
-          <template #default="scope">
-            <el-upload
-              action="http://39.101.133.168:8828/hljw/api/aws/upload"
-              class="avatar-uploader"
-              :show-file-list="false"
-              :on-success="handleBatchAvatarSuccess"
-              v-if="scope.row.showInput"
-              @change="changeVoucher(scope.row)"
-            >
-              <img
-                v-if="scope.row.imageUrl"
-                :src="scope.row.imageUrl"
-                class="avatar"
-              />
-              <el-icon v-else class="avatar-uploader-icon">
-                <Plus />
-              </el-icon>
-            </el-upload>
-            <span v-else>{{ scope.row.rechargeVoucher }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="remark" label="备注" width="130px">
-          <template #default="scope">
-            <el-input
-              type="textarea"
-              v-if="scope.row.showInput"
-              v-model="scope.row.remark"
-              style="max-width: 90px"
-              :rows="1"
-              cols="12"
-            ></el-input>
-            <span v-else>{{ scope.row.remark }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column property="submitter" label="提交人">
-          <el-input :value="adminData.name" disabled />
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          prop="operation"
-          label="操作"
-          width="150px"
-        >
-          <template #default="scope">
-            <div style="display: flex">
-              <el-popconfirm
-                title="确定将此条信息删除吗？"
-                @confirm="delConfirm"
-              >
-                <template #reference>
-                  <el-button type="danger" text @click="del(scope.row)">
-                    删除
-                  </el-button>
-                </template>
-                <template #actions="{ confirm, cancel }">
-                  <el-button size="small" @click="cancel">取消</el-button>
-                  <el-button type="primary" size="small" @click="confirm">
-                    确定
-                  </el-button>
-                </template>
-              </el-popconfirm>
-              <el-popconfirm
-                title="确定将此条信息重置吗？"
-                @confirm="resetConfirm"
-              >
-                <template #reference>
-                  <el-button type="success" text @click="reset(scope.row)">
-                    重置
-                  </el-button>
-                </template>
-                <template #actions="{ confirm, cancel }">
-                  <el-button size="small" @click="cancel">取消</el-button>
-                  <el-button type="primary" size="small" @click="confirm">
-                    确定
-                  </el-button>
-                </template>
-              </el-popconfirm>
-            </div>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-row>
-    <el-row>
-      <div class="batch-btn">
-        <el-button @click="cancelBatch()"> 取消 </el-button>
-        <el-button type="primary" @click="throttledBatchAdd()">
-          提交
-        </el-button>
-      </div>
-    </el-row>
-  </el-dialog>
-
-  <el-dialog
-    v-model="batchSettingVisible"
-    title="批量设置"
-    :close-on-click-modal="false"
-    style="width: 550px"
-  >
-    <el-form label-position="left" label-width="auto">
-      <el-form-item label="活动名称">
-        <el-select
-          v-model="batchSettingObj.activityId"
-          placeholder="请选择活动名称"
-          clearable
-        >
-          <el-option
-            v-for="item in activity"
-            :key="item.activityId"
-            :label="item.activityName"
-            :value="item.activityId"
-          >
-          </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="永久金币">
-        <el-input
-          v-model="batchSettingObj.paidGold"
-          placeholder="请输入永久金币"
-        ></el-input>
-      </el-form-item>
-      <el-form-item label="免费金币">
-        <el-input v-model="batchSettingObj.freeGold"></el-input>
-      </el-form-item>
-      <el-form-item label="充值金额">
-        <div style="display: flex">
-          <el-select
-            v-model="batchSettingObj.rate"
-            placeholder="请选择币种"
-            style="width: 120px; margin-right: 10px"
-            clearable
-          >
-            <el-option
-              v-for="item in currency"
-              :key="item.exchangeRate"
-              :label="item.currency"
-              :value="item.exchangeRate"
-            ></el-option>
-          </el-select>
-          <el-input
-            v-model="batchSettingObj.rechargeGold"
-            placeholder="请输入充值金额"
-          ></el-input>
-        </div>
-      </el-form-item>
-      <el-form-item prop="payWay" label="收款方式">
-        <el-select
-          v-model="batchSettingObj.payWay"
-          placeholder="请选择收款方式"
-          clearable
-        >
-          <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item prop="rechargeTime" label="交款时间">
-        <el-date-picker
-          v-model="batchSettingObj.rechargeTime"
-          type="date"
-          placeholder="请选择交款时间"
-        ></el-date-picker>
-      </el-form-item>
-      <el-form-item prop="rechargeVoucher" label="交款凭证">
-        <el-upload
-          action="http://39.101.133.168:8828/hljw/api/aws/upload"
-          class="avatar-uploader"
-          :show-file-list="false"
-          :on-success="batchSettingHandleAvatarSuccess"
-          :before-upload="beforeAvatarUpload"
-          style="width: 100px; height: 115px"
-        >
-          <img
-            v-if="batchSettingObj.imageUrl"
-            :src="batchSettingObj.imageUrl"
-            class="avatar"
-            style="width: 100px; height: 115px"
-          />
-          <el-icon
-            v-else
-            class="avatar-uploader-icon"
-            style="width: 100px; height: 100px"
-          >
-            <Plus />
-          </el-icon>
-        </el-upload>
-      </el-form-item>
-      <el-form-item prop="remark" label="备注">
-        <el-input
-          type="textarea"
-          v-model="batchSettingObj.remark"
-          placeholder="请输入备注"
-        />
-      </el-form-item>
-    </el-form>
-    <el-button @click="cancelBatchSetting()" style="margin-left: 370px"
-      >取消</el-button
-    >
-    <el-button type="primary" @click="batchSettingConfirm()"> 确认 </el-button>
-  </el-dialog>
-</div>
-<!-- 金币充值明细的布局---------------------------------------------------------- -->
-  <div v-else-if="activeTab === 'detail'">
-    <el-row>
-    <el-col>
-      <el-card style="margin-bottom: 20px;margin-top: 10px">
-        <el-row style="margin-bottom: 10px">
-          <el-col :span="5">
-            <div class="head-card-element">
-              <el-text class="mx-1" size="large">精网号：</el-text>
-              <el-input v-model="rechargeVo.jwcode" placeholder="请输入精网号" style="width: 150px" clearable />
-            </div>
-          </el-col>
-          <el-col :span="6">
-            <div class="head-card-element">
-              <el-text class="mx-1" size="large">活动名称：</el-text>
-              <el-select v-model="rechargeVo.activityId" placeholder="请选择活动名称"  style="width: 180px" 
-                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="6">
-            <div class="head-card-element" v-if="adminData.area == '总部'">
-              <el-text class="mx-1" size="large">所属地区：</el-text>
-              <el-select v-model="rechargeVo.area" placeholder="请选择所属地区" style="width: 180px" clearable>
-                <el-option v-for="item in area" :key="item" :label="item" :value="item" />
-              </el-select>
-            </div>
-          </el-col>
-          
-          <el-col :span="6">
-            <div class="head-card-element">
-              <el-text class="mx-1" size="large">充值类型：</el-text>
-              <el-select v-model="rechargeVo.rechargeWay" placeholder="请选择支付方式" style="width: 180px" clearable>
-                <el-option v-for="item in rechargeWay" :key="item.value" :label="item.label" :value="item.value" />
-              </el-select>
-            </div>
-          </el-col>
-          
-        </el-row>
-        <el-row>
-          <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-button @click="getYesterday()">昨</el-button>
-              <el-button @click="get7Days()">近7天</el-button>
-            <!-- </div>
-          </el-col>
-          <el-col :span="3">
-            <div class="head-card-btn"> -->
-              <el-button type="success" @click="reset()">重置</el-button>
-              <el-button type="primary" @click="search()">查询</el-button>
-              <el-button type="primary" @click="exportExcel()">导出Excel</el-button>
-            </div>
-          </el-col>
-        </el-row>
-      </el-card>
-    </el-col>
-  </el-row>
-  <el-row>
-    <el-col>
-      <el-card>
-        <div>
-          充值金额：{{ trueRGold.toFixed(2) }}新币，永久金币：{{
-            trueRGold.toFixed(2)
-          }}金币，免费金币：{{ trueFGold }}金币
-        </div>
-        <!-- 设置表格容器的高度和滚动样式 -->
-        <div style="height: 520px; overflow-y: auto;margin-top: 10px;">
-          <el-table
-            :data="tableData"
-            style="width: 100%"
-            height="520px"
-            @sort-change="handleSortChange"
-          >
-            <el-table-column
-              type="index"
-              label="序号"
-              width="80px"
-              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="80px"
-            />
-            <el-table-column
-              fixed="left"
-              prop="jwcode"
-              label="精网号"
-              width="80px"
-            />
-            <el-table-column prop="area" label="所属地区" width="100px" />
-            <el-table-column
-              prop="activityName"
-              label="活动名称"
-              width="100px"
-            />
-            <el-table-column prop="" label="货币名称" width="110px" />
-            <el-table-column
-              prop="paidGold"
-              sortable="custom"
-              label="充值金额"
-              width="110px"
-            />
-            <el-table-column
-              prop="paidGold"
-              label="永久金币"
-              sortable="custom"
-              width="110px"
-            />
-            <el-table-column
-              prop="freeGold"
-              label="免费金币"
-              sortable="custom"
-              width="110px"
-            />
-            <el-table-column
-              prop="rechargeWay"
-              label="充值方式"
-              width="100px"
-            />
-            <el-table-column prop="payWay" label="支付方式" width="100px" />
-            <el-table-column
-              prop="remark"
-              label="备注"
-              width="150px"
-              show-overflow-tooltip
-            />
-            
-            <!-- <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"
-                />
-              </template>
-            </el-table-column> -->
-            <el-table-column prop="name" label="提交人" width="100px" />
-            <!-- <el-table-column prop="status" label="状态" width="100px">
-              <template #default="scope">
-                <span v-if="scope.row.status === 1">
-                  <div class="status">
-                    <span class="green-dot"></span>
-                    <span>已通过</span>
-                  </div>
-                </span>
-                <span v-if="scope.row.status === 0">
-                  <div class="status">
-                    <span class="grey-dot"></span>
-                    <span>待审核</span>
-                  </div>
-                </span>
-                <span v-if="scope.row.status === 2">
-                  <div class="status">
-                    <span class="red-dot"></span>
-                    <span>已驳回</span>
-                  </div>
-                </span>
-              </template>
-            </el-table-column>
-            <el-table-column
-              prop="reson"
-              label="驳回理由"
-              width="200px"
-              show-overflow-tooltip
-            /> -->
-            <el-table-column
-              prop="rechargeTime"
-              sortable
-              label="充值时间"
-              width="200px"
-            >
-              <template #default="scope">
-                {{
-                  moment(scope.row.rechargeTime).format('YYYY-MM-DD HH:mm:ss')
-                }}
-              </template>
-            </el-table-column>
-            <!-- <el-table-column
-              prop="createTime"
-              sortable="custom"
-              label="提交时间"
-              width="200px"
-            />
-            <el-table-column
-              fixed="right"
-              prop="operation"
-              label="操作"
-              width="150px"
-            >
-              <template #default="scope">
-                <el-popconfirm
-                  title="确定将此条活动删除吗？"
-                  @confirm="delConfirm"
-                >
-                  <template #reference>
-                    <el-button type="primary" text @click="del(scope.row)">
-                      删除
-                    </el-button>
-                  </template>
-                  <template #actions="{ confirm, cancel }">
-                    <el-button size="small" @click="cancel">取消</el-button>
-                    <el-button type="primary" size="small" @click="confirm">
-                      确定
-                    </el-button>
-                  </template>
-                </el-popconfirm>
-              </template>
-            </el-table-column> -->
-          </el-table>
-        </div>
-
-        <!-- 分页 -->
-        <div class="pagination" style="margin-top: 20px">
-          <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>
-        </div>
-      </el-card>
-    </el-col>
-  </el-row>
-
-  <!-- 编辑弹窗 -->
-  <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-form-item>
-
-        <el-form-item label="免费金币:">
-          <el-radio-group v-model="addObj.freeGold">
-            <el-radio value="0">无赠送</el-radio>
-            <el-radio value="1">有赠送</el-radio>
-          </el-radio-group>
-        </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-form-item>
-
-        <el-form-item label="开始时间:">
-          <el-time-picker v-model="addObj.startTime" />
-        </el-form-item>
-
-        <el-form-item label="结束时间:">
-          <el-time-picker v-model="addObj.endTime" />
-        </el-form-item>
-
-        <el-form-item label="添加人:">
-          <el-input v-model="addObj.adminName" disabled style="width: 220px" />
-        </el-form-item>
-      </el-form>
-
-      <div class="dialog-footer">
-        <el-button @click="closeAddActivityVisible">取消</el-button>
-        <el-button type="primary" @click="closeAddActivityVisible">
-          提交
-        </el-button>
-      </div>
-    </template>
-  </el-dialog>
-
-=======
     <!-- 渲染子路由组件 -->
     <router-view></router-view>
->>>>>>> milestone-20250623-金币前端
   </div>
 </template>
 

src/views/workspace/index.vue

@@ -2,60 +2,70 @@
   <el-col :span="4">
     <el-card class="center-card margin-bottom">数据总览</el-card>
   </el-col>
-  <el-row :span="24">
+  <el-row :gutter="10">
     <!-- 第一个卡片 -->
-    <el-card class="card-item">
-      <template #header>
-        <div class="card-header">
-          <div class="card-title">当前金币余量</div>
-          <div>100&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;较前一日 -100</div>
+    <el-col :span="6">
+      <el-card class="card-item">
+        <template #header>
+          <div class="card-header">
+            <div class="card-title">当前金币余量</div>
+            <div>{{ currentGold }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;较前一日 {{ dailyChange }}</div>
+          </div>
+        </template>
+        <div>
+          <div class="margin-bottom">永久金币：{{ currentPermanent }}</div>
+          <div class="margin-bottom">免费金币：{{ currentFree }}</div>
+          <div class="margin-bottom">[六月到期|{{ currentFreeJune }}]&nbsp;&nbsp;&nbsp;&nbsp;[12月到期|{{ currentFreeDecember }}]</div>
+          <div>任务金币：{{ currentTask }}</div>
         </div>
-      </template>
-      <div>
-        <div class="margin-bottom">永久金币：100</div>
-        <div class="margin-bottom">免费金币：100</div>
-        <div class="margin-bottom">[六月到期|100]&nbsp;&nbsp;&nbsp;&nbsp;[12月到期|100]</div>
-        <div>任务金币：100</div>
-      </div>
-    </el-card>
+      </el-card>
+    </el-col>
+    
     <!-- 第二个卡片 -->
-    <el-card class="card-item">
-      <div class="card-title">全年累计充值金币数</div>
-      <div class="card-title">100</div>
-      <div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
-      <div class="center-card">折合新币累计金额:100</div>
-      <template #footer >
-        <el-col class="margin-bottom center-card">昨日新增：100</el-col>
-        <el-col class="margin-bottom center-card">其中充值：100</el-col>
-      </template>
-    </el-card>
+    <el-col :span="6">
+      <el-card class="card-item">
+        <div class="card-title">全年累计充值金币数</div>
+        <div class="card-title">{{ yearlyRecharge }}</div>
+        <div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
+        <div class="center-card">折合新币累计金额:{{ yearlyMoney }}</div>
+        <template #footer >
+          <el-col class="margin-bottom center-card">昨日新增：{{ recharge }}</el-col>
+          <el-col class="margin-bottom center-card">其中充值：{{ money }}</el-col>
+        </template>
+      </el-card>
+    </el-col>
+    
     <!-- 第三个卡片 -->
-    <el-card class="card-item">
-      <div class="card-title">全年累计消耗金币数</div>
-      <div class="card-title">100</div>
-      <div class="center-card">消费：100</div>
-      <div class="center-card">退款：100</div>
-      <template #footer>
-        <div></div>
-        <div class="margin-bottom center-card">昨日新增消耗：100</div>
-        <div class="margin-bottom center-card">昨日新增消费：100</div>
-        <div class="margin-bottom center-card">昨日新增退款：100</div>
-      </template>
-    </el-card>
+    <el-col :span="6">
+      <el-card class="card-item">
+        <div class="card-title">全年累计消耗金币数</div>
+        <div class="card-title">{{ yearlyReduce }}</div>
+        <div class="center-card">消费：{{ yearlyConsume }}</div>
+        <div class="center-card">退款：{{ yearlyRefund }}</div>
+        <template #footer>
+          <div></div>
+          <div class="margin-bottom center-card">昨日新增消耗：{{ dailyReduce }}</div>
+          <div class="margin-bottom center-card">昨日新增消费：{{ dailyConsume }}</div>
+          <div class="margin-bottom center-card">昨日新增退款：{{ dailyRefund }}</div>
+        </template>
+      </el-card>
+    </el-col>
+    
     <!-- 第四个卡片 -->
-    <el-card class="card-item">
-      <el-col class="card-title">全年累计充值人头数</el-col>
-      <el-col class="card-title">100</el-col>
-      <el-col class="center-card">周同比:？？？</el-col>
-      <el-col class="center-card">日环比</el-col>
-      <template #footer>
-        <el-col class="margin-bottom center-card">昨日充值人数：100</el-col>
-        <el-col class="margin-bottom center-card">其中首充：100</el-col>
-      </template>
-    </el-card>
+    <el-col :span="6">
+      <el-card class="card-item">
+        <el-col class="card-title">全年累计充值人头数</el-col>
+        <el-col class="card-title">{{ yearlyRechargeNum }}</el-col>
+        <el-col class="center-card">周同比:{{ wow }}</el-col>
+        <el-col class="center-card">日环比:{{ daily }}</el-col>
+        <template #footer>
+          <el-col class="margin-bottom center-card">昨日充值人数：{{ rechargeNum }}</el-col>
+          <el-col class="margin-bottom center-card">其中首充：{{ firstRecharge }}</el-col>
+        </template>
+      </el-card>
+    </el-col>
   </el-row>
 
-
   <el-row :gutter="10" style="margin-top: 20px">
     <el-col :span="24">
       <el-card style="width: 100%">
@@ -121,272 +131,140 @@
 
 <script setup>
 import * as echarts from 'echarts'
-import { ref, onMounted, onBeforeUnmount } from 'vue'
+import { ref, onMounted } from 'vue'
 import API from '@/util/http'
 
-const histogramData = ref([])
-const middleCategory = ref([])
-const middleRecharge = ref([])
-const middleFree = ref([])
-const middleTask = ref([])
-const tableData = ref([])
-const area = ref([])
-
-// 变量
-const activeTab = ref('consume')
-const updateType = ref(1)
+// 图表相关
+const activeTab = ref('recharge')
 const timeRange = ref('day')
 const dateRange = ref([])
 const selectedType = ref('all')
+const tableData = ref([])
 
-// ECharts实例
-let rechargeBar = null
-let consumeBar = null
-
-const formatDate = (date) => {
-  const year = date.getFullYear()
-  const month = String(date.getMonth() + 1).padStart(2, '0')
-  const day = String(date.getDate()).padStart(2, '0')
-  return `${year}-${month}-${day}`
-}
-
-// 本周一
-const getWeekStart = (date) => {
-  const day = date.getDay()
-  const diff = date.getDate() - day + (day === 0 ? -6 : 1) // 如果周日，则返回上周一
-  return new Date(date.setDate(diff))
-}
-
-// 本周日
-const getWeekEnd = (date) => {
-  const start = getWeekStart(new Date(date))
-  const end = new Date(start)
-  end.setDate(start.getDate() + 6)
-  return end
-}
-
-// 月份第一天
-const getMonthStart = (date) => {
-  return new Date(date.getFullYear(), date.getMonth(), 1)
-}
-
-// 月份最后一天
-const getMonthEnd = (date) => {
-  return new Date(date.getFullYear(), date.getMonth() + 1, 0)
-}
-
-// 年份第一天
-const getYearStart = (date) => {
-  return new Date(date.getFullYear(), 0, 1)
-}
-
-// 年份最后一天
-const getYearEnd = (date) => {
-  return new Date(date.getFullYear(), 11, 31)
-}
-
-const handleTimeRangeChange = (value) => {
-  const now = new Date()
-  let start, end
-  
-  switch (value) {
-    case 'day': // 今日
-      start = new Date(now)
-      end = new Date(now)
-      break
-    case 'week': // 本周
-      start = getWeekStart(new Date(now))
-      end = getWeekEnd(new Date(now))
-      break
-    case 'month': // 本月
-      start = getMonthStart(now)
-      end = getMonthEnd(now)
-      break
-    case 'year': // 本年
-      start = getYearStart(now)
-      end = getYearEnd(now)
-      break
-    default:
-      start = new Date()
-      end = new Date()
+// 卡片数据
+const currentGold = ref(0)
+const dailyChange = ref(0)
+const currentPermanent = ref(0)
+const currentFree = ref(0)
+const currentFreeJune = ref(0)
+const currentFreeDecember = ref(0)
+const currentTask = ref(0)
+
+const yearlyRecharge = ref(0)
+const yearlyMoney = ref(0)
+const recharge = ref(0)
+const money = ref(0)
+
+const yearlyReduce = ref(0)
+const yearlyConsume = ref(0)
+const yearlyRefund = ref(0)
+const dailyReduce = ref(0)
+const dailyConsume = ref(0)
+const dailyRefund = ref(0)
+
+const yearlyRechargeNum = ref(0)
+const wow = ref(0)
+const daily = ref(0)
+const rechargeNum = ref(0)
+const firstRecharge = ref(0)
+
+// 处理用，因为要加上所有市场的，还有额外计算的(总数 = 永久 + 6月 + 12月 + 免费 + 任务)
+const processData = (data) => {
+  const summary = {
+    currentGold: 0,
+    dailyChange: 0,
+    currentPermanent: 0,
+    currentFreeJune: 0,
+    currentFreeDecember: 0,
+    currentTask: 0,
+    currentFree: 0,
+    recharge: 0,
+    money: 0,
+    yearlyRecharge: 0,
+    yearlyMoney: 0,
+    consumePermanent: 0,
+    consumeFreeJune: 0,
+    consumeFreeDecember: 0,
+    consumeTask: 0,
+    refundPermanent: 0,
+    refundFreeJune: 0,
+    refundFreeDecember: 0,
+    refundTask: 0,
+    dailyReduce: 0,
+    yearlyConsume: 0,
+    yearlyRefund: 0,
+    yearlyReduce: 0,
+    rechargeNum: 0,
+    firstRecharge: 0,
+    wow: 0,
+    daily: 0,
+    yearlyRechargeNum: 0
   }
   
-  dateRange.value = [start, end]
-  loadChart()
-}
-
-const handleDateRangeChange = () => {
-  timeRange.value = ''
-}
-
-// 获取地区数据
-const getAreas = async () => {
-  try {
-    const result = await API({
-      url: 'http://192.168.8.247:8081/general/market',
-      data: {}
-    })
-    middleCategory.value = result.data.map(item => item.name)
-    
-    // 生成表格数据（模拟）
-    tableData.value = result.data.slice(0, 11).map((item, index) => ({
-      rank: index + 1,
-      region: item.name,
-      coinAmount: Math.floor(Math.random() * 1000000) + 500000
-    }))// D老师加的这一段（？？？？？？？？？？？？？？？？）
-  } catch (error) {
-    console.error('获取地区数据失败:', error)
-  }
+  // 遍历市场
+  data.marketCards.forEach(market => {
+    for (const key in summary) {
+      if (market[key] !== undefined && market[key] !== null) { // 还应该卡一个number
+        summary[key] += market[key]
+      }
+    }
+  })
+  
+  // 计算昨日新增消费和退款
+  const yesterdayConsume = summary.consumePermanent + summary.consumeFreeJune + summary.consumeFreeDecember + summary.consumeTask
+  const yesterdayRefund = summary.refundPermanent + summary.refundFreeJune + summary.refundFreeDecember + summary.refundTask
+  
+  // 更新卡片数据
+  currentGold.value = summary.currentGold
+  dailyChange.value = summary.dailyChange
+  currentPermanent.value = summary.currentPermanent
+  currentFree.value = summary.currentFree
+  currentFreeJune.value = summary.currentFreeJune
+  currentFreeDecember.value = summary.currentFreeDecember
+  currentTask.value = summary.currentTask
+  
+  yearlyRecharge.value = summary.yearlyRecharge
+  yearlyMoney.value = summary.yearlyMoney
+  recharge.value = summary.recharge
+  money.value = summary.money
+  
+  yearlyReduce.value = summary.yearlyReduce
+  yearlyConsume.value = summary.yearlyConsume
+  yearlyRefund.value = summary.yearlyRefund
+  dailyReduce.value = summary.dailyReduce
+  dailyConsume.value = yesterdayConsume
+  dailyRefund.value = yesterdayRefund
+  
+  yearlyRechargeNum.value = summary.yearlyRechargeNum
+  wow.value = summary.wow
+  daily.value = summary.daily
+  rechargeNum.value = summary.rechargeNum
+  firstRecharge.value = summary.firstRecharge
 }
 
-const getChartData = async () => {
+const getCardData = async () => {
   try {
-    const params = {
-      updateType: updateType.value
+    const response = await API({ url: '/workbench/getCard', data: {} })
+    // 感谢D老师的检查结构
+    // 检查 API 响应结构
+    if (response && response.data) {
+      // 如果 API 返回 { data: { ... } } 结构
+      processData(response.data)
+    } else if (Array.isArray(response?.marketCards)) {
+      // 实际走的是这里
+      processData(response)
+    } else {
+      console.error('无效的API响应结构:', response)
     }
-    
-    if (dateRange.value && dateRange.value.length === 2) {
-      params.searchStartTime = formatDate(dateRange.value[0])
-      params.searchEndTime = formatDate(dateRange.value[1])
-    }
-    
-    const result = await API({
-      url: '/statistics/getCoinTime',
-      data: params
-    })
-    
-    histogramData.value = result.data || []
-    
-    middleRecharge.value = histogramData.value.map(item => 
-      Math.abs(item.rechargeSumCoin || 0)
-    )
-    middleFree.value = histogramData.value.map(item => 
-      Math.abs(item.freeSumCoin || 0)
-    )
-    middleTask.value = histogramData.value.map(item => 
-      Math.abs(item.taskSumCoin || 0)
-    )
-    
-    updateChart()
   } catch (error) {
-    console.error('请求图表数据失败:', error)
-  }
-}
-
-const updateChart = () => {
-  const option = {
-    tooltip: {
-      trigger: 'axis',
-      axisPointer: { type: 'shadow' },
-      formatter: function (params) {
-        let total = 0
-        let content = `${params[0].name}<br/>`
-        params.forEach((param) => {
-          content += `${param.seriesName}: ${param.value.toLocaleString()}<br/>`
-          total += param.value
-        })
-        content += `总和: ${total.toLocaleString()}`
-        return content
-      }
-    },
-    legend: {
-      right: '2%',
-      orient: 'vertical',
-      itemGap: 10
-    },
-    grid: {
-      left: '3%',
-      right: '10%',
-      bottom: '3%',
-      containLabel: true
-    },
-    xAxis: {
-      type: 'category',
-      data: middleCategory.value,
-      axisLabel: {
-        interval: 0,
-        rotate: 30
-      }
-    },
-    yAxis: {
-      type: 'value',
-      axisLabel: {
-        formatter: (value) => value.toLocaleString()
-      }
-    },
-    series: [
-      {
-        name: '永久金币',
-        color: '#35e383',
-        type: 'bar',
-        stack: 'total',
-        data: middleRecharge.value
-      },
-      {
-        name: '免费金币',
-        color: '#5f8ff5',
-        type: 'bar',
-        stack: 'total',
-        data: middleFree.value
-      },
-      {
-        name: '任务金币',
-        color: '#ffe733',
-        type: 'bar',
-        stack: 'total',
-        data: middleTask.value
-      }
-    ]
-  }
-  
-  if (activeTab.value === 'recharge' && rechargeBar) {
-    rechargeBar.setOption(option)
-    rechargeBar.resize()
-  } else if (consumeBar) {
-    consumeBar.setOption(option)
-    consumeBar.resize()
-  }
-}
-
-const initCharts = () => {
-  const rechargeDom = document.getElementById('recharge')
-  const consumeDom = document.getElementById('consume')
-  
-  if (rechargeDom) {
-    rechargeBar = echarts.init(rechargeDom)
+    console.error('获取卡片数据失败:', error)
   }
-  
-  if (consumeDom) {
-    consumeBar = echarts.init(consumeDom)
-  }
-}
-
-const loadChart = async () => {
-  await getAreas()
-  await getChartData()
 }
 
-// 页面切换
-const handleTabChange = (tab) => {
-  updateType.value = tab === 'recharge' ? 0 : 1
-  loadChart()
-}
-
-const handleResize = () => {
-  if (rechargeBar) rechargeBar.resize()
-  if (consumeBar) consumeBar.resize()
-}
 
+// 组件挂载时获取数据
 onMounted(() => {
-  initCharts()
-  loadChart()
-  window.addEventListener('resize', handleResize)
-})
-
-onBeforeUnmount(() => {
-  if (rechargeBar) rechargeBar.dispose()
-  if (consumeBar) consumeBar.dispose()
-  window.removeEventListener('resize', handleResize)
+  getCardData()
 })
 </script>
 
@@ -402,9 +280,7 @@ onBeforeUnmount(() => {
 }
 
 .card-item {
-  width: 24%;
   height: 260px;
-  margin-right: 10px;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -418,7 +294,15 @@ onBeforeUnmount(() => {
   align-items: center;
 }
 
-.margin-top{
-  margin-top: 5px;
+.rank-card {
+  height: 500px;
 }
+
+.card-large {
+  font-weight: bold;
+  font-size: 16px;
+  text-align: center;
+  margin-bottom: 15px;
+}
+
 </style>