工作台

vue/gold-system/package.json

@@ -6,7 +6,8 @@
   "scripts": {
     "dev": "vite",
     "build": "vue-tsc -b && vite build",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "serve": "vite - service serve --host 0.0.0.0 --port 8080"
   },
   "dependencies": {
     "@element-plus/icons-vue": "^2.3.1",

vue/gold-system/src/api/index.js

@@ -0,0 +1,9 @@
+import http from '../util/http.js';
+
+const API={
+    post: function(url,data){
+        return http({url:url,method:'post',data:data})
+    },
+};
+
+export default API;

vue/gold-system/src/assets/css/common.css

@@ -24,6 +24,7 @@
     display: block;
     background-color: grey;
 }
+
 .yellow-dot {
     margin: 7px 5px 0px 0px;
     width: 10px;
@@ -47,3 +48,25 @@
     display: block;
     background-color: #5f8ff5;
 }
+
+.red-triangle {
+    width: 0;
+    height: 0;
+    border-left: 7px solid transparent;
+    border-right: 7px solid transparent;
+    border-bottom: 10px solid red;
+}
+
+.green-triangle {
+    width: 0;
+    height: 0;
+    border-left: 7px solid transparent;
+    border-right: 7px solid transparent;
+    border-top: 10px solid green;
+}
+
+.grey-triangle {
+    width: 10px;
+    height: 5px;
+    background-color: grey;
+}

vue/gold-system/src/router/index.js

@@ -3,8 +3,11 @@ import { createRouter,createWebHashHistory } from 'vue-router';
 const router=createRouter({
     history:createWebHashHistory(),
     routes:[
-        {path:'/',redirect:"/index"},
+        {path:'/login', name:"login", component:()=>import("../views/login.vue")},
+        {path:'/',redirect:"/workspace"},
+        {path:'/test',component:()=>import("../views/z.vue")},
         {
+            meta:{requireAuth:true},
             path:'/index',component:()=>import("../views/index.vue"),
             children:[
                 // 工作台
@@ -39,4 +42,13 @@ const router=createRouter({
     ]
 });
 
+router.beforeEach((to,from,next)=>{
+    const token=localStorage.getItem("token");
+    if(to.name!="login"&&!token){
+        next({name:"login"});    
+    }else{
+        next();
+    }
+})
+
 export default router;

vue/gold-system/src/util/http.js

@@ -0,0 +1,42 @@
+import axios from 'axios';
+
+export default function (options) {
+    //配置每次发送请求都从localStorage中获取名字叫token的数据,
+    //添加到请求头部的Authorization属性中
+    const token = localStorage.getItem('token');
+    //Object.assign用于合并对象的数据
+    options.headers = Object.assign(
+        { token: token },
+        options.headers || {}
+    );
+    //axios()   返回一个promise对象，用于异步请求
+    //options是一个对象，其中包含了许多用于配置请求的参数，
+    //例如请求的url、请求方法（GET、POST等）、请求头等
+    return axios(options)
+        .then(({ status, data, statusText }) => {
+            //该函数在请求成功并返回数据时被调用
+            //status：HTTP状态码，例如200表示请求成功。
+            //data：服务器返回的数据。
+            // statusText：HTTP状态文本，例如"OK"表示请求成功。
+            console.log(data);
+            if (status == 200) {
+                return data;
+            } else {
+                throw new e(statusText);
+            }
+        })
+       .catch(e=>{
+           // 检查是否是因为token过期导致的401错误
+           if (e.response && e.response.status === 401) {
+            // 清除localStorage中的token
+            localStorage.removeItem('token');
+            // 执行重新登录的逻辑，例如跳转到登录页面
+            window.location.href = '/login';
+            // 可以在这里返回一个特定的值或者对象，以便调用者知道需要重新登录
+            return { needsLogin: true };
+        } else {
+            // 其他类型的错误，直接抛出
+            return Promise.reject(e);
+        }
+    });
+}

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

@@ -1,301 +1,347 @@
 <script setup>
-    import { reactive } from 'vue';
-    import { ref,computed,watch } from 'vue'
-    import { ElMessage } from 'element-plus'
-    import { Plus } from '@element-plus/icons-vue'
-    import axios from 'axios'
-    import { ElMessageBox } from 'element-plus'
-
-
-
-    
-
-
+import { reactive } from "vue";
+import { ref, computed, watch } from "vue";
+import { ElMessage } from "element-plus";
+import { Plus } from "@element-plus/icons-vue";
+import axios from "axios";
+import { ElMessageBox } from "element-plus";
+import API from "../../api/index.js";
+
+//这是获取用户信息的接口
+const adminData = ref({});
+const getAdminData = async function () {
+  try {
+    const result = await API.post(
+      "http://192.168.8.93:10070/admin/userinfo",
+      {}
+    );
+    adminData.value = result;
+    addConsume.value.adminId = adminData.value.adminId;
+    console.log("请求成功", result);
+    console.log("用户信息", adminData.value);
+  } catch (error) {
+    console.log("请求失败", error);
+  }
+};
+getAdminData();
 
-// 这是添加充值信息的表单
+// 这是添加消费信息的表单
 const addConsume = ref({
-
- });
-// 这是添加充值信息的接口
+  freeCoin: 0,
+  rechargeCoin: 0,
+  taskCoin: 0,
+  updateType: "消费",
+});
+// 这是添加消费信息的接口
 const add = async function () {
-    try {
-        // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/recharge/add', addConsume.value);
-
-        // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
-        // 存储表格数据
-        console.log('用户信息', user.value);
-    } catch (error) {
-        console.log('请求失败', error);
-        // 在这里可以处理错误逻辑，比如显示错误提示等
-    }
-}
+  try {
+    // 发送POST请求
+    const result = await API.post(
+      "http://192.168.8.147:10030/consume/add",
+      addConsume.value
+    );
+
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    // 存储表格数据
+    console.log("用户信息", user.value);
+  } catch (error) {
+    console.log("请求失败", error);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
 const addBefore = () => {
   Ref.value.validate(async (valid) => {
     if (valid) {
-    ElMessageBox.confirm('确认添加？').then(() => {
-      add();
-      console.log('添加成功');
-      imageUrl.value = '';
-      addConsume.value = {};
-    }).catch(() => {
-      console.log('取消添加');
-    }) } else {
-            //提示
-            ElMessage({
-                type: 'error',
-                message: '请检查输入内容',
-            })
-        }
-    })
-  }
+      ElMessageBox.confirm("确认添加？")
+        .then(() => {
+          add();
+          console.log("添加成功");
+          imageUrl.value = "";
+          addConsume.value = {};
+        })
+        .catch(() => {
+          console.log("取消添加");
+        });
+    } else {
+      //提示
+      ElMessage({
+        type: "error",
+        message: "请检查输入内容",
+      });
+    }
+  });
+};
 
-  // 表单验证
+// 表单验证
 // 开始时间改变时，重新验证结束时间
 const Ref = ref(null);
 const checkEndTime = function (rule, value, callback) {
-    if (value <= new Date()) {
-        callback(new Error('付款时间不能小于当前时间'))
-    } 
-}
+  if (value <= new Date()) {
+    callback(new Error("付款时间不能小于当前时间"));
+  }
+};
 const rules = reactive({
-    homilyId: [{ required: true, message: '请输入精网号', trigger: 'blur' },],
-    refundGoods: [{ required: true, message: '请选择退款商品', trigger: 'blur' },],
-    taskCoin: [{ required: true, message: '请输入任务金币', trigger: 'blur' },],
-    freeCoin: [{ required: true, message: '请输入免费金币', trigger: 'blur' },],
-    rechargeCoin: [{ required: true, message: '请输入免费金币', trigger: 'blur' },],
-    allGold: [{ required: true, message: '请输入消费金币总数', trigger: 'blur' },],
-    
-   
-})
+  jwcode: [{ required: true, message: "请输入精网号", trigger: "blur" }],
+  productId: [{ required: true, message: "请选择消费商品", trigger: "blur" }],
+  taskCoin: [{ required: true, message: "请输入任务金币", trigger: "blur" }],
+  freeCoin: [{ required: true, message: "请输入免费金币", trigger: "blur" }],
+  rechargeCoin: [
+    { required: true, message: "请输入免费金币", trigger: "blur" },
+  ],
+  allGold: [{ required: true, message: "请输入消费金币总数", trigger: "blur" }],
+});
 
 // 查找客户信息的方法
 const user = ref({});
-const getUser = async function (homilyId) {
-    try {
-        // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10020/recharge/user', {homilyId: homilyId});
-
-        // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
-        // 存储表格数据
-        user.value = result.data.data[0];
-        console.log('用户信息', user.value);
- 
-    } catch (error) {
-        console.log('请求失败', error);
-        // 在这里可以处理错误逻辑，比如显示错误提示等
-    }
-}
-
-// 这是查询活动的接口
-const activity = ref([]); 
-const getActivity = async function () {
-    try {
-        // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/activity/select', {});
-
-        // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
-        // 存储表格数据
-        activity.value = result.data.data;
-        console.log('活动信息', activity.value);
-    } catch (error) {
-        console.log('请求失败', error);
-        // 在这里可以处理错误逻辑，比如显示错误提示等
+const getUser = async function (jwcode) {
+  try {
+    // 发送POST请求
+    const result = await API.post("http://192.168.8.93:10020/recharge/user", {
+      jwcode: jwcode,
+    });
+
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    // 存储表格数据
+    user.value = result.data[0];
+    console.log("用户信息", user.value);
+    if (result.data.code === 0) {
+      ElMessage.error(result.data.msg);
+    } else {
+      ElMessage.success(result.data.msg);
     }
-}
-getActivity();
-
-// 这是查询货币的接口
-const currency = ref([]); 
-const getCurrency = async function () {
-    try {
-
-        // 发送POST请求
-        const result = await axios.post('http://192.168.8.174:10010/rates/search',{});
+  } catch (error) {
+    console.log("请求失败", error);
+    ElMessage.error("查询失败，请检查精网号是否正确");
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
 
-        // 将响应结果存储到响应式数据中
-        console.log('货币请求成功', result);
-        // 存储表格数据
-        currency.value = result.data.data;
-        console.log('tableData', currency.value);
-        // 在这里可以根据需求进一步处理成功后的逻辑，比如更新UI显示成功消息等
+// 查询商品的接口
+const goods = ref([]);
+const getGoods = async function () {
+  try {
+    // 发送POST请求
+    const result = await API.post("http://192.168.8.93:10020/product", {});
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    // 存储全部数据
+    goods.value = result.data;
+    console.log("allData", allData.value);
+    console.log("地区", area.value);
+  } catch (error) {
+    console.log("请求失败", error);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
+getGoods();
+
+//这是查询用户金币信息的接口
+const userGold = ref({});
+const getUserGold = async function (jwcode) {
+  try {
+    const result = await API.post(
+      "http://192.168.8.147:10070/statistics/getMess/" + jwcode
+    );
+    console.log("请求成功", result);
+    // 存储全部数据
+    userGold.value = result.data;
+    console.log("userGold", userGold.value);
+  } catch (error) {
+    console.log("请求失败", error);
+  }
+};
 
-    } catch (error) {
-        console.log('请求失败', error);
-        // 在这里可以处理错误逻辑，比如显示错误提示等
-    }
-}
-getCurrency();
+function calculateCoins() {
+  // 保存原始的allGold值
+  const originalAllGold = addConsume.value.allGold;
 
+  // 确保todayTask和todayFree是有效的数字
+  const todayTask =
+    typeof userGold.value.todayTask === "number" ? userGold.value.todayTask : 0;
+  const todayFree =
+    typeof userGold.value.todayFree === "number" ? userGold.value.todayFree : 0;
 
-// 这是添加上传图片的接口
-const imageUrl = ref('')
+  // 根据用户输入的消费金币总数和已有的金币数量进行计算
+  addConsume.value.taskCoin = Math.min(originalAllGold, todayTask);
+  let remainingGold = originalAllGold - addConsume.value.taskCoin;
 
-// 上传图片成功的回调函数
-const handleAvatarSuccess = (response, uploadFile) => {
-  imageUrl.value = URL.createObjectURL(uploadFile.raw);
-  console.log('图片上传成功', response, uploadFile);
-  addConsume.value.rechargeVoucher = 'http://192.168.8.93:10010/upload/' + response.data;
-  console.log('图片名称', addConsume.value.rechargeVoucher);
-};
-// 上传图片之前的校验函数
-const beforeAvatarUpload = (rawFile) => {
-  if (rawFile.type !== 'image/jpeg') {
-    ElMessage.error('Avatar picture must be JPG format!');
-    return false;
-  } else if (rawFile.size / 1024 / 1024 > 2) {
-    ElMessage.error('Avatar picture size can not exceed 2MB!');
-    return false;
-  }
-  return true;
-};
+  addConsume.value.freeCoin = Math.min(remainingGold, todayFree);
+  remainingGold -= addConsume.value.freeCoin;
 
-//充值方式条目
-const options = [
-  {
-    value: '现金充值',
-    label: '现金充值',
-  },
-  {
-    value: '龙鳞卡',
-    label: '龙鳞卡',
-  },
-  {
-    value: '弘粉卡',
-    label: '弘粉卡',
-  },
+  addConsume.value.rechargeCoin = remainingGold; // 剩余的都算作充值金币
 
-]
+  // 恢复allGold的原始值
+  addConsume.value.allGold = originalAllGold;
 
-const calculatedFreeGold = computed(() => {
-  return addConsume.value.paidGold * addConsume.value.activityId;
-});
+  // 确保taskCoin, freeCoin, rechargeCoin不是NaN，如果是，则设置为0
+  if (isNaN(addConsume.value.taskCoin)) addConsume.value.taskCoin = 0;
+  if (isNaN(addConsume.value.freeCoin)) addConsume.value.freeCoin = 0;
+  if (isNaN(addConsume.value.rechargeCoin)) addConsume.value.rechargeCoin = 0;
 
-watch(calculatedFreeGold, (newVal) => {
-  addConsume.value.freeGold = newVal;
-});
+  console.log("计算结果", addConsume.value);
+}
 </script>
 
 <template>
-  <div style="margin-bottom: 20px;">
-    新增消费
-  </div>
-
-  <el-form :model="addConsume" ref="Ref" :rules="rules" label-width="auto" style="max-width: 750px">
-    <el-form-item prop="homilyId" label="精网号">
-      <el-input v-model="addConsume.homilyId" style="width: 220px;" />
-      <el-button type="primary" @click="getUser(addConsume.homilyId)" style="margin-left: 20px;">查询</el-button>
+  <div style="margin-bottom: 20px">新增消费</div>
+
+  <el-form
+    :model="addConsume"
+    ref="Ref"
+    :rules="rules"
+    label-width="auto"
+    style="max-width: 750px"
+    class="form-style"
+  >
+    <el-form-item prop="jwcode" label="精网号">
+      <el-input
+        v-model="addConsume.jwcode"
+        style="width: 220px"
+        @change="getUserGold(addConsume.jwcode)"
+      />
+      <el-button
+        type="primary"
+        @click="getUser(addConsume.jwcode)"
+        style="margin-left: 20px"
+        >查询</el-button
+      >
     </el-form-item>
-    <el-form-item prop="goods" label="商品名称">
-      <el-select v-model="addConsume.goods" placeholder="请选择" style="width: 300px">
+    <el-form-item prop="productId" label="商品名称">
+      <el-select
+        v-model="addConsume.productId"
+        placeholder="请选择"
+        style="width: 300px"
+      >
         <el-option
-        v-for="item in activity"
-        :key="item.value"
-        :label="item.activityName"
-        :value="item.rechargeRatio"
+          v-for="item in goods"
+          :key="item.value"
+          :label="item.name"
+          :value="item.productId"
         />
       </el-select>
     </el-form-item>
     <el-form-item prop="allGold" label="消费金币总数">
-        <el-input v-model="addConsume.paidGold" style="width: 100px;"/>
+      <el-input
+        v-model="addConsume.allGold"
+        style="width: 100px"
+        @change="calculateCoins()"
+      />
     </el-form-item>
-    <el-form-item prop="taskCoin" label="任务金币" style="float: left; ">
-        <el-input disabled v-model="addConsume.taskCoin" style="width: 100px;margin-left: -5px;"/>
-        <p style="margin-right: 0px;">个</p>
+    <div style="display: flex; align-items: center">
+      <el-form-item prop="taskCoin" label="任务金币" style="float: left">
+        <el-input
+          disabled
+          v-model="addConsume.taskCoin"
+          style="width: 100px; margin-left: -5px"
+        />
+        <p style="margin-right: 0px">个</p>
       </el-form-item>
-      <el-form-item prop="freeCoin" label="免费金币" style="float: left;margin-left: -10px;margin-right: -10px;">
-          <el-input disabled v-model="addConsume.freeCoin" style="width: 100px;margin-left: -5px;"/>
-          <p style="margin-right: 0px;">个</p>
+      <el-form-item
+        prop="freeCoin"
+        label="免费金币"
+        style="float: left; margin-left: -20px"
+      >
+        <el-input
+          disabled
+          v-model="addConsume.freeCoin"
+          style="width: 100px; margin-left: -5px"
+        />
+        <p style="margin-right: 0px">个</p>
       </el-form-item>
-      <el-form-item prop="rechargeCoin" label="充值金币" style="margin-left: -20px;">
-          <el-input disabled v-model="addConsume.rechargeCoin" style="width: 100px;margin-left: -5px;"/>
-          <p style="margin-right: 20px;">个</p>
+      <el-form-item
+        prop="rechargeCoin"
+        label="充值金币"
+        style="margin-left: -20px"
+      >
+        <el-input
+          disabled
+          v-model="addConsume.rechargeCoin"
+          style="width: 100px; margin-left: -5px"
+        />
+        <p style="margin-right: 20px">个</p>
       </el-form-item>
+    </div>
     <el-form-item prop="remark" label="备注">
       <el-input
-    v-model="addConsume.remark"
-    style="width: 300px"
-    :rows="2"
-    maxlength="100"
-    show-word-limit
-    type="textarea"
-  />
+        v-model="addConsume.remark"
+        style="width: 300px"
+        :rows="2"
+        maxlength="100"
+        show-word-limit
+        type="textarea"
+      />
     </el-form-item>
     <el-form-item prop="commitName" label="提交人">
-      <el-input style="width: 300px" value="张三" disabled placeholder="提交人姓名"/>
+      <el-input
+        style="width: 300px"
+        :value="adminData.name"
+        disabled
+        placeholder="提交人姓名"
+      />
     </el-form-item>
+    <el-button @click="closeAddActivityVisible" style="margin-left: 280px"
+      >取消</el-button
+    >
+    <el-button type="primary" @click="addBefore"> 提交 </el-button>
   </el-form>
 
-    <el-button @click="closeAddActivityVisible" style="margin-left: 280px;">取消</el-button>
-    <el-button type="primary" @click="addBefore">
-        提交
-    </el-button>
-
-   <!-- 客户信息栏 -->
-   <el-card style="width: 700px;float: right;margin-top: -330px;margin-right: 100px;">
-    <el-form :model="user" label-width="auto" style="max-width: 600px" label-position="left">
-     <el-text size="large" style="margin-left: 20px;">客户信息</el-text>
-      <el-row style="margin-top: 20px;">
+  <!-- 客户信息栏 -->
+  <el-card style="width: 700px; float: right" class="form-style2">
+    <el-form
+      :model="user"
+      label-width="auto"
+      style="max-width: 600px"
+      label-position="left"
+    >
+      <el-text size="large" style="margin-left: 20px">客户信息</el-text>
+      <el-row style="margin-top: 20px">
         <el-col :span="12">
-      <el-form-item label="姓名:" >
-          <p>{{user.name}}</p>
-      </el-form-item>
+          <el-form-item label="姓名:">
+            <p>{{ user.name }}</p>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="历史金币总数"> </el-form-item>
         </el-col>
         <el-col :span="12">
-          <el-form-item label="历史金币总数" >
+          <el-form-item label="精网号">
+            <p>{{ user.jwcode }}</p>
           </el-form-item>
-            </el-col>
+        </el-col>
         <el-col :span="12">
-      <el-form-item label="精网号" >
-        <p>{{user.homilyId}}</p>
-      </el-form-item>
-    </el-col>
-    <el-col :span="12">
-      <el-form-item label="当前金币总数" >
-      </el-form-item>
+          <el-form-item label="当前金币总数"> </el-form-item>
         </el-col>
-    <el-col :span="12">
-      <el-form-item label="首次充值日期">
-      </el-form-item>
-    </el-col>
-    <el-col :span="12">
-      <el-form-item label="充值次数" >
-      </el-form-item>
+        <el-col :span="12">
+          <el-form-item label="首次充值日期"> </el-form-item>
         </el-col>
-    <el-col :span="12">
-      <el-form-item label="负责客服" >
-      </el-form-item>
-    </el-col>
-    <el-col :span="12">
-      <el-form-item label="消费次数" >
-      </el-form-item>
+        <el-col :span="12">
+          <el-form-item label="充值次数"> </el-form-item>
         </el-col>
-    <el-col :span="12">
-      <el-form-item label="所属门店" >
-      </el-form-item>
-    </el-col>
-    <el-col :span="12">
-      <el-form-item label="待审核" >
-      </el-form-item>
+        <el-col :span="12">
+          <el-form-item label="负责客服"> </el-form-item>
         </el-col>
-    </el-row>
-
-     
-
+        <el-col :span="12">
+          <el-form-item label="消费次数"> </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="所属门店"> </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="待审核"> </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
   </el-card>
 </template>
 
 <style scoped>
-  p{
-    margin: 0px;
-  }
-  .el-form-item {
+p {
+  margin: 0px;
+}
+.el-form-item {
   margin-left: 50px;
-
 }
 
 /* 上传图片的格式 */
@@ -307,25 +353,32 @@ watch(calculatedFreeGold, (newVal) => {
 </style>
 
 <style>
-  .avatar-uploader .el-upload {
-    border: 1px dashed var(--el-border-color);
-    border-radius: 6px;
-    cursor: pointer;
-    position: relative;
-    overflow: hidden;
-    transition: var(--el-transition-duration-fast);
-  }
-  
-  .avatar-uploader .el-upload:hover {
-    border-color: var(--el-color-primary);
-  }
+.avatar-uploader .el-upload {
+  border: 1px dashed var(--el-border-color);
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+  transition: var(--el-transition-duration-fast);
+}
 
-  .el-icon.avatar-uploader-icon {
-    font-size: 28px;
-    color: #8c939d;
-    width: 50px;
-    height: 50px;
-    text-align: center;
+.avatar-uploader .el-upload:hover {
+  border-color: var(--el-color-primary);
+}
 
-  }
-  </style>
+.el-icon.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 50px;
+  height: 50px;
+  text-align: center;
+}
+.form-style {
+  margin-top: 50px;
+  max-width: 50%;
+  float: left;
+}
+.form-style2 {
+  max-width: 50%;
+}
+</style>

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

@@ -3,6 +3,7 @@ import { ref, onMounted, reactive, computed } from "vue";
 import ElementPlus from "element-plus";
 import { AiFillRead } from "vue-icons-plus/ai";
 import axios from "axios";
+import API from "../../api/index.js";
 // 变量
 // 充值明细表格
 const tableData = ref([]);
@@ -12,7 +13,7 @@ const detailVo = ref({});
 // 搜索对象
 const getObj = ref({
   pageNum: 1,
-  pageSize: 5,
+  pageSize: 10,
 });
 //分页总条目
 const total = ref(100);
@@ -28,35 +29,36 @@ const area = ref([]);
 //标签页默认高亮选项
 const activeName = ref("all");
 
-// 支付方式选项
-const payWay = [
+// 消费平台选项
+const consumePlatform = [
   {
-    value: "微信",
-    label: "微信",
+    value: "HomilyLink",
+    label: "HomilyLink",
   },
   {
-    value: "支付宝",
-    label: "支付宝",
+    value: "金币系统",
+    label: "金币系统",
   },
   {
-    value: "银联",
-    label: "银联",
+    value: "ERP系统",
+    label: "ERP系统",
   },
   {
-    value: "信用卡",
-    label: "信用卡",
+    value: "金币系统",
+    label: "金币系统",
   },
+];
+const consumeType = [
   {
-    value: "借记卡",
-    label: "借记卡",
+    value: "购买商品",
+    label: "购买商品",
   },
 ];
 
 //表格高度
 const tableHeight = computed(function () {
-  return (getObj.value.pageSize + 2) * 60 + "px";
+  return (getObj.value.pageSize + 1) * 41 + "px";
 });
-
 // 方法
 // 搜索==============================================================
 // 搜索方法
@@ -78,18 +80,18 @@ const get = async function (val) {
     }
     console.log("搜索参数", getObj.value);
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.147:10030/consume/select",
-      { ...getObj.value, detailVo: { ...detailVo.value } }
-    );
+    const result = await API.post("http://192.168.8.93:10050/consume/select", {
+      ...getObj.value,
+      detailVo: { ...detailVo.value },
+    });
 
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    tableData.value = result.data.data.list;
+    tableData.value = result.data.list;
     console.log("tableData", tableData.value);
     // 存储分页总数
-    total.value = result.data.data.total;
+    total.value = result.data.total;
     console.log("total", total.value);
   } catch (error) {
     console.log("请求失败", error);
@@ -98,12 +100,11 @@ const get = async function (val) {
 };
 // 重置
 const reset = function () {
-  detailVo.value.activityId = "";
-  detailVo.value.payWay = "";
-  detailVo.value.area = "";
+  detailVo.value.productName = "";
+  detailVo.value.consumePlatform = "";
+  detailVo.value.consumeType = "";
   detailVo.value.startDate = "";
   detailVo.value.endDate = "";
-  get();
 };
 // 今天
 const getToday = function () {
@@ -157,30 +158,6 @@ const get7Days = function () {
   console.log("getTime", getTime.value);
   get();
 };
-//全部充值明细
-const adminAll = function () {
-  console.log("adminAll");
-  detailVo.value.status = "";
-  get();
-};
-//待审核充值明细
-const adminWait = function () {
-  detailVo.value.status = 0;
-  get();
-  console.log("adminWait");
-};
-//已通过充值明细
-const adminPass = function () {
-  detailVo.value.status = 1;
-  get();
-  console.log("adminPass");
-};
-//已驳回充值明细
-const adminReject = function () {
-  detailVo.value.status = 2;
-  get();
-  console.log("adminReject");
-};
 //点击标签页
 const handleClick = function (tab, event) {
   if (tab.props.name === "all") {
@@ -193,52 +170,59 @@ const handleClick = function (tab, event) {
     adminReject();
   }
 };
-// 获取活动名称
-const getActivity = async function () {
-  try {
-    // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.93:10010/recharge/activity/select",
-      {}
-    );
 
-    // 将响应结果存储到响应式数据中
-    console.log("请求成功", result);
-    // 存储表格数据
-    activity.value = result.data.data;
-    console.log("activity", activity.value);
-  } catch (error) {
-    console.log("请求失败", error);
-    // 在这里可以处理错误逻辑，比如显示错误提示等
+// 挂载
+onMounted(async function () {
+  await get();
+  // getActivity();
+  // await getArea();
+});
+
+// 验证跳转输入框的数字是否合法
+const checkNumber = function () {
+  if (typeof parseInt(getObj.value.pageNum) === "number") {
+    console.log(
+      "总共有多少页" + Math.ceil(total.value / getObj.value.pageSize)
+    );
+    if (
+      getObj.value.pageNum > 0 &&
+      getObj.value.pageNum <= Math.ceil(total.value / getObj.value.pageSize)
+    ) {
+      console.log("输入的数字合法");
+      get();
+    } else {
+      //提示
+      ElMessage({
+        type: "error",
+        message: "请检查输入内容",
+      });
+    }
+  } else {
+    //提示
+    ElMessage({
+      type: "error",
+      message: "请检查输入内容",
+    });
   }
 };
-// 获取地区
-const getArea = async function () {
+// 查询商品的接口
+const goods = ref([]);
+const getGoods = async function () {
   try {
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.93:10010/recharge/recharge",
-      {}
-    );
+    const result = await API.post("http://192.168.8.93:10020/product", {});
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储全部数据
-    allData.value = result.data.data;
+    goods.value = result.data;
     console.log("allData", allData.value);
-    // 分离并去重地区列表
-    area.value = [...new Set(allData.value.map((item) => item.area))];
     console.log("地区", area.value);
   } catch (error) {
     console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
-// 挂载
-onMounted(async function () {
-  await get();
-  getActivity();
-  await getArea();
-});
+getGoods();
 </script>
 
 <template>
@@ -250,16 +234,16 @@ onMounted(async function () {
             <div class="head-card-element">
               <el-text class="mx-1" size="large">商品名称：</el-text>
               <el-select
-                v-model="detailVo.activityId"
+                v-model="detailVo.productName"
                 placeholder="请选择活动名称"
                 size="large"
                 style="width: 240px"
               >
                 <el-option
-                  v-for="item in activity"
+                  v-for="item in goods"
                   :key="item.activityId"
-                  :label="item.activityName"
-                  :value="item.activityId"
+                  :label="item.name"
+                  :value="item.name"
                 />
               </el-select>
             </div>
@@ -268,13 +252,13 @@ onMounted(async function () {
             <div class="head-card-element">
               <el-text class="mx-1" size="large">消费平台：</el-text>
               <el-select
-                v-model="detailVo.payWay"
+                v-model="detailVo.consumePlatform"
                 placeholder="请选择支付方式"
                 size="large"
                 style="width: 240px"
               >
                 <el-option
-                  v-for="item in payWay"
+                  v-for="item in consumePlatform"
                   :key="item.value"
                   :label="item.label"
                   :value="item.value"
@@ -286,16 +270,16 @@ onMounted(async function () {
             <div class="head-card-element">
               <el-text class="mx-1" size="large">消费类型：</el-text>
               <el-select
-                v-model="detailVo.area"
-                placeholder="请选择所属地区"
+                v-model="detailVo.consumeType"
+                placeholder="请选择消费类型"
                 size="large"
                 style="width: 240px"
               >
                 <el-option
-                  v-for="item in area"
+                  v-for="item in consumeType"
                   :key="item"
-                  :label="item"
-                  :value="item"
+                  :label="item.label"
+                  :value="item.value"
                 />
               </el-select>
             </div>
@@ -304,7 +288,7 @@ onMounted(async function () {
         <el-row>
           <el-col :span="21">
             <div class="head-card-element">
-              <el-text class="mx-1" size="large">充值时间：</el-text>
+              <el-text class="mx-1" size="large">消费时间：</el-text>
               <el-date-picker
                 v-model="getTime"
                 type="datetimerange"
@@ -334,12 +318,16 @@ onMounted(async function () {
       <el-card>
         <div>
           <el-table :data="tableData" :height="tableHeight" style="width: 100%">
-            <el-table-column prop="username" label="姓名" width="80px" />
-            <el-table-column prop="homilyId" label="精网号" width="180px" />
+            <el-table-column prop="userName" label="姓名" width="80px" />
+            <el-table-column prop="jwcode" label="精网号" width="180px" />
             <el-table-column prop="area" label="所属地区" width="120px" />
-            <el-table-column prop="goods" label="商品名称" width="200px" />
             <el-table-column
-              prop="consumPlatform"
+              prop="productName"
+              label="商品名称"
+              width="200px"
+            />
+            <el-table-column
+              prop="consumePlatform"
               label="消费平台"
               width="120px"
             />
@@ -352,7 +340,15 @@ onMounted(async function () {
               prop="rechargeTotal"
               label="消费金币总数"
               width="180px"
-            />
+            >
+              <template #default="scope">
+                {{
+                  scope.row.taskCoin +
+                  scope.row.freeCoin +
+                  scope.row.rechargeCoin
+                }}
+              </template>
+            </el-table-column>
             <el-table-column prop="taskCoin" label="任务金币" width="120px" />
             <el-table-column prop="freeCoin" label="免费金币" width="120px" />
             <el-table-column
@@ -366,40 +362,52 @@ onMounted(async function () {
               width="200px"
               show-overflow-tooltip
             />
-            <el-table-column prop="conmmitName" label="提交人" width="120px" />
+            <el-table-column prop="adminName" label="提交人" width="120px" />
             <el-table-column prop="createTime" label="消费时间" width="180px" />
-            <el-table-column prop="operation" label="操作">
-              <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>
 
         <!-- 分页 -->
-        <el-pagination
-          background
-          layout="prev, pager, next"
-          :total="total"
-          :page-size="getObj.pageSize"
-          :current-page="getObj.pageNum"
-          @current-change="get"
-        />
+        <div class="pagination">
+          <el-pagination
+            background
+            :page-size="getObj.pageSize"
+            layout="slot"
+            :total="total"
+          >
+            <div>共{{ total }}条,每页</div>
+            <el-select
+              v-model="getObj.pageSize"
+              class="page-size"
+              @change="get()"
+              style="width: 80px"
+            >
+              <el-option
+                v-for="item in [5, 6, 7, 8, 9, 10]"
+                :key="item"
+                :label="item"
+                :value="item"
+              ></el-option>
+            </el-select>
+            <div>条</div>
+          </el-pagination>
+          <el-pagination
+            background
+            layout="prev, pager, next, slot"
+            :page-size="getObj.pageSize"
+            :total="total"
+            :current-page="getObj.pageNum"
+            @current-change="get"
+          >
+            <div>跳至</div>
+            <el-input
+              v-model="getObj.pageNum"
+              style="width: 40px"
+              @change="checkNumber"
+            />
+            <div>页</div>
+          </el-pagination>
+        </div>
       </el-card>
     </el-col>
   </el-row>
@@ -421,4 +429,9 @@ onMounted(async function () {
 .head-card-btn {
   margin-left: auto;
 }
+.pagination {
+  display: flex;
+  margin-top: 20px;
+  margin-left: 33%;
+}
 </style>

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

@@ -2,29 +2,75 @@
 import { ref, onMounted, reactive, computed } from "vue";
 import { useRouter } from "vue-router";
 import ElementPlus from "element-plus";
-import { VscGlobe } from 'vue-icons-plus/vsc'
+import { VscGlobe } from "vue-icons-plus/vsc";
+import { ElMessage } from "element-plus";
+import axios from "axios";
+import { ElMessageBox } from "element-plus";
+import API from "../api/index.js";
+
+//这是获取用户信息的接口
+const adminData = ref({
+  name: "",
+});
+const getAdminData = async function () {
+  try {
+    const result = await API.post(
+      "http://192.168.8.93:10070/admin/userinfo",
+      {}
+    );
+    adminData.value = result;
+    console.log("请求成功", result);
+    console.log("用户信息", adminData.value);
+  } catch (error) {
+    console.log("请求失败", error);
+  }
+};
+getAdminData();
 
 const router = useRouter();
 
 // 用户对象假的
 const admin = ref({
-    adminId: 1,
-    name:'客服A',
-    area:'新加坡'
-})
+  adminId: 1,
+  name: "客服A",
+  area: "新加坡",
+});
+
+function logout() {
+  localStorage.removeItem("token");
+  router.push("/login");
+  ElMessage.success("退出成功");
+}
 
+// 挂载
+onMounted(async function () {
+  // 获取用户信息
+  getAdminData();
+});
 </script>
 
 <template>
   <div class="common-layout">
     <el-container>
-      <el-aside style="width: 250px;">
+      <el-aside style="width: 250px">
         <div class="logo">
-          <img src="../assets/金币管理系统logo.png" alt="logo" style="width: 30px;height: 30px;" />
-          <div style="font-size: 16px; font-weight: bold;">海外金币管理系统</div>
+          <img
+            src="../assets/金币管理系统logo.png"
+            alt="logo"
+            style="width: 30px; height: 30px"
+          />
+          <div style="font-size: 16px; font-weight: bold">海外金币管理系统</div>
         </div>
-        <el-menu router="true" background-color="#08193d" active-text-color="#ffd04b" text-color="white"
-          class="el-menu-vertical-demo" default-active="2" @open="handleOpen" @close="handleClose">
+        <el-menu
+          router="true"
+          background-color="#08193d"
+          active-text-color="#ffd04b"
+          text-color="white"
+          class="el-menu-vertical-demo"
+          default-active="2"
+          @open="handleOpen"
+          @close="handleClose"
+        >
           <el-menu-item index="/workspace">
             <el-icon>
               <Folder />
@@ -94,20 +140,28 @@ const admin = ref({
             </el-icon>
             客户金币明细
           </el-menu-item>
-
         </el-menu>
       </el-aside>
       <el-container>
         <el-header>
-          <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" :ellipsis="false"
-            @select="handleSelect">
+          <el-menu
+            :default-active="activeIndex"
+            class="el-menu-demo"
+            mode="horizontal"
+            :ellipsis="false"
+            @select="handleSelect"
+          >
             <el-sub-menu index="1" class="admin">
               <template #title>
-                <img style="width: 30px;height: 30px; border-radius: 50%;" src="../assets/金币管理系统logo.png" alt="出错了" />
-                <span style="margin-left: 10px;">{{ admin.name }}</span>
+                <img
+                  style="width: 30px; height: 30px; border-radius: 50%"
+                  src="../assets/金币管理系统logo.png"
+                  alt="出错了"
+                />
+                <span style="margin-left: 10px">{{ adminData.name }}</span>
               </template>
               <el-menu-item index="1-1">查看个人信息</el-menu-item>
-              <el-menu-item index="1-2">退出登录</el-menu-item>
+              <el-menu-item index="1-2" @click="logout">退出登录</el-menu-item>
             </el-sub-menu>
             <el-menu-item index="2">
               <VscGlobe />

vue/gold-system/src/views/login.vue

@@ -0,0 +1,126 @@
+<script setup>
+import { ref, onMounted, reactive, computed } from "vue";
+import { ElMessage } from "element-plus";
+import axios from "axios";
+import { useRouter } from "vue-router";
+import { VscGlobe } from "vue-icons-plus/vsc";
+
+const router = useRouter(); // 获取路由实例
+const form = ref({ name: "", password: "" });
+//调用方法
+const login = async function () {
+  try {
+    const result = await axios.post(
+      "http://192.168.8.93:10070/admin/login",
+      form.value
+    );
+    if (result.data.code == 200) {
+      localStorage.setItem("token", result.data.msg);
+      router.push("/");
+      ElMessage.success("登录成功");
+      console.log("请求成功", result);
+    } else {
+      form.value.password = "";
+      form.value.username = "";
+      ElMessage.error(result.data.msg);
+    }
+  } catch (error) {
+    console.log("请求失败", error);
+    ElMessage.error(result.data.msg);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
+</script>
+<template>
+  <el-row class="login-page">
+    <img
+      :span="12"
+      src="../assets/background.jpg"
+      alt="logo"
+      class="bg"
+      fit="fit"
+    />
+    <el-col :span="6" :offset="3" class="form">
+      <!-- 登录表单 -->
+      <el-form
+        :model="form"
+        size="large"
+        autocomplete="off"
+        @keyup.enter.native="login()"
+      >
+        <el-form-item>
+          <h1 style="color: #409eff">金币系统登录</h1>
+        </el-form-item>
+        <el-form-item prop="username">
+          <el-input
+            v-model="form.username"
+            placeholder="请输入用户名"
+          ></el-input>
+        </el-form-item>
+        <el-form-item prop="password">
+          <el-input
+            v-model="form.password"
+            type="password"
+            placeholder="请输入密码"
+          />
+        </el-form-item>
+        <el-form-item class="flex"> </el-form-item>
+        <!-- 登录按钮 -->
+        <el-form-item>
+          <el-button
+            class="button"
+            type="primary"
+            auto-insert-space
+            @click="login()"
+            >登录</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-col>
+  </el-row>
+</template>
+<style scoped>
+.bg {
+  border-radius: 0 20px 20px 0;
+  height: 100vh;
+  width: 50%;
+  object-fit: cover;
+}
+.background {
+  color: #fffdfd;
+  text-align: center;
+  font-size: 24px;
+  background-color: #08193d;
+}
+.form {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  user-select: none;
+
+  .title {
+    margin: 0 auto;
+  }
+
+  .button {
+    width: 100%;
+  }
+
+  .flex {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+  }
+}
+
+/* .box {
+  padding: 20px;
+  border-radius: 10px;
+  background-color: #fff;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+} */
+</style>

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

@@ -1,16 +1,36 @@
 <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 { ElMessage, ElMessageBox } from "element-plus";
+import axios from "axios";
+import moment from "moment";
+import API from "../../api/index.js";
+
+//这是获取用户信息的接口
+const adminData = ref({});
+const getAdminData = async function () {
+  try {
+    const result = await API.post(
+      "http://192.168.8.93:10070/admin/userinfo",
+      {}
+    );
+    adminData.value = result;
+    addActicity.value.adminId = adminData.value.adminId;
+    console.log("请求成功", result);
+    console.log("用户信息", user.value);
+  } catch (error) {
+    console.log("请求失败", error);
+  }
+};
+getAdminData();
+
 //变量
 // 用户对象假的
 const admin = ref({
-    adminId: 1,
-    name: '赵刚',
-    area: '中国'
-})
+  adminId: 1,
+  name: "赵刚",
+  area: "中国",
+});
 //活动表格数据
 const tableData = ref([]);
 //分页总条目
@@ -21,19 +41,19 @@ const getTime = ref([]);
 const activity = ref({});
 //搜索对象
 const getObj = ref({
-    pageNum: 1,
-    pageSize: 5,
-})
+  pageNum: 1,
+  pageSize: 5,
+});
 // 添加对象
 const addObj = ref({
-    add: '',
-})
+  add: "",
+});
 // 删除
 // 删除对象
 const delObj = ref({});
 //表格高度
 const tableHeight = computed(function () {
-    return (getObj.value.pageSize + 1) * 50 + 'px';
+  return (getObj.value.pageSize + 1) * 50 + "px";
 });
 
 // 表单验证ref
@@ -42,382 +62,462 @@ const Ref = ref(null);
 //方法
 //搜索方法
 const get = async function (val) {
-    try {
-        // 搜索参数页码赋值
-        if (typeof val === 'number') {
-            getObj.value.pageNum = val;
-        }
-        // 搜索参数时间赋值
-        if (getTime.value != null) {
-            if (getTime.value.startDate != '' && getTime.value.endDate != '') {
-                activity.value.startDate = getTime.value[0];
-                activity.value.endDate = getTime.value[1];
-            }
-        } else {
-            activity.value.startDate = '';
-            activity.value.endDate = '';
-        }
-
-        console.log('搜索参数', getObj.value);
-        // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/activity/select', { ...getObj.value, activity: { ...activity.value } });
-
-        // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
-        // 存储表格数据
-        tableData.value = result.data.data.list;
-        console.log('tableData', tableData.value);
-        // 存储分页总条目
-        total.value = result.data.data.total;
-        console.log('total', total.value);
-    } catch (error) {
-        console.log('请求失败', error);
-        // 在这里可以处理错误逻辑，比如显示错误提示等
+  try {
+    // 搜索参数页码赋值
+    if (typeof val === "number") {
+      getObj.value.pageNum = val;
     }
-}
+    // 搜索参数时间赋值
+    if (getTime.value != null) {
+      if (getTime.value.startDate != "" && getTime.value.endDate != "") {
+        activity.value.startDate = getTime.value[0];
+        activity.value.endDate = getTime.value[1];
+      }
+    } else {
+      activity.value.startDate = "";
+      activity.value.endDate = "";
+    }
+
+    console.log("搜索参数", getObj.value);
+    // 发送POST请求
+    const result = await API.post(
+      "http://192.168.8.93:10010/recharge/activity/select",
+      { ...getObj.value, activity: { ...activity.value } }
+    );
+
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    // 存储表格数据
+    tableData.value = result.data.list;
+    console.log("tableData", tableData.value);
+    // 存储分页总条目
+    total.value = result.data.total;
+    console.log("total", total.value);
+  } catch (error) {
+    console.log("请求失败", error);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
 
 // 重置
 const reset = function () {
-    getObj.value = {};
-    getObj.value.pageNum = 1;
-    getObj.value.pageSize = 5;
-    getTime.value = {};
-    activity.value = {};
-}
+  getObj.value = {};
+  getObj.value.pageNum = 1;
+  getObj.value.pageSize = 5;
+  getTime.value = {};
+  activity.value = {};
+};
 //新增活动弹出框
-const addActivityVisible = ref(false)
+const addActivityVisible = ref(false);
 //打开新增活动弹出框
 const openAddActivityVisible = function () {
-    addActivityVisible.value = true
-}
+  addActivityVisible.value = true;
+};
 //关闭新增窗口弹出框
 const closeAddActivityVisible = function () {
-    addActivityVisible.value = false
-}
+  addActivityVisible.value = false;
+};
 //添加活动按钮
 const addActicity = function () {
-    //添加对象初始化操作
-    addObj.value = {};
-    addObj.value.adminId = admin.value.adminId;
-    addObj.value.adminName = admin.value.name;
-    addObj.value.dept = admin.value.area;
-    addObj.value.freeGold = '0';
-    addObj.value.rechargeRatio = 0;
-    addObj.value.startTime = null;
-    addObj.value.endTime = null;
-    openAddActivityVisible();
-}
+  //添加对象初始化操作
+  addObj.value = {};
+  addObj.value.adminId = admin.value.adminId;
+  addObj.value.adminName = admin.value.name;
+  addObj.value.freeGold = "0";
+  addObj.value.rechargeRatio = 0;
+  addObj.value.startTime = null;
+  addObj.value.endTime = null;
+  openAddActivityVisible();
+};
 
 // 添加确认
 const add = async function () {
-    Ref.value.validate(async (valid) => {
-        if (valid) {
-            try {
-                console.log('添加对象', addObj.value);
-                // 发送POST请求
-                const result = await axios.post('http://192.168.8.93:10010/recharge/activity/add', addObj.value);
-
-                // 将响应结果存储到响应式数据中
-                console.log('请求成功', result);
-                // 刷新表格数据
-                get();
-                // 关闭弹出框
-                closeAddActivityVisible();
-                //提示
-                ElMessage({
-                    type: 'success',
-                    message: '活动添加成功！',
-                })
-            } catch (error) {
-                console.log('请求失败', error);
-                // 在这里可以处理错误逻辑，比如显示错误提示等
-            }
-        } else {
-            //提示
-            ElMessage({
-                type: 'error',
-                message: '请检查输入内容',
-            })
-        }
-
-    })
-
-}
-// 删除=========================================================
-// 删除按钮
-const del = function (row) {
-    delObj.value.activityId = row.activityId;
-    console.log('delObj', delObj.value);
-}
-// 删除按钮的气泡弹出框确认按钮
-const delConfirm = async function () {
-    try {
-        console.log('delObj', delObj.value);
+  Ref.value.validate(async (valid) => {
+    console.log("valid", valid);
+    if (valid) {
+      try {
+        console.log("添加对象", addObj.value);
         // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/activity/edit', delObj.value);
+        const result = await API.post(
+          "http://192.168.8.93:10010/recharge/activity/add",
+          addObj.value
+        );
+
         // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
+        console.log("请求成功", result);
         // 刷新表格数据
         get();
-    } catch (error) {
-        console.log('请求失败', error);
+        // 关闭弹出框
+        closeAddActivityVisible();
+        //提示
+        ElMessage({
+          type: "success",
+          message: "活动添加成功！",
+        });
+      } catch (error) {
+        console.log("请求失败", error);
         // 在这里可以处理错误逻辑，比如显示错误提示等
+      }
+    } else {
+      //提示
+      ElMessage({
+        type: "error",
+        message: "请检查输入内容",
+      });
     }
-}
+  });
+};
+// 删除=========================================================
+// 删除按钮
+const del = function (row) {
+  delObj.value.activityId = row.activityId;
+  console.log("delObj", delObj.value);
+};
+// 删除按钮的气泡弹出框确认按钮
+const delConfirm = async function () {
+  try {
+    console.log("delObj", delObj.value);
+    // 发送POST请求
+    const result = await API.post(
+      "http://192.168.8.93:10010/recharge/activity/edit",
+      delObj.value
+    );
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    // 刷新表格数据
+    get();
+  } catch (error) {
+    console.log("请求失败", error);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
 
 // 表单验证
 // 开始时间改变时，重新验证结束时间
 const handleStartTimeChange = () => {
-    Ref.value.validateField('endTime');
+  Ref.value.validateField("endTime");
 };
 const checkFreeGoldRadio = function (rule, value, callback) {
-    if (addObj.value.freeGold == 1) {
-        if (value == '0' || value == null || value == '') {
-            callback(new Error('请输入免费金币兑换比'))
-        }else if(value<0||typeof value!='number') {
-            callback(new Error('请输入正确的格式'));
-        }
+  if (addObj.value.freeGold == 1) {
+    if (value == "0" || value == null || value == "") {
+      callback(new Error("请输入免费金币兑换比"));
+    } else if (value < 0 || isNaN(value)) {
+      callback(new Error("请输入正确的格式"));
     } else {
-        callback()
+      callback();
     }
-}
+  } else {
+    callback();
+  }
+};
 
 const checkStartTime = function (rule, value, callback) {
-    if (value <= new Date()) {
-        callback(new Error('开始时间不能小于当前时间'))
-    } else {
-        callback()
-    }
-}
+  if (value <= new Date()) {
+    callback(new Error("开始时间不能小于当前时间"));
+  } else {
+    callback();
+  }
+};
 
 const checkEndTime = function (rule, value, callback) {
-    if (value <= new Date()) {
-        callback(new Error('结束时间不能小于当前时间'))
-    } else if (value <= addObj.value.startTime) {
-        callback(new Error('结束时间不能小于开始时间'))
-    } else {
-        callback()
-    }
-}
+  if (value <= new Date()) {
+    callback(new Error("结束时间不能小于当前时间"));
+  } else if (value <= addObj.value.startTime) {
+    callback(new Error("结束时间不能小于开始时间"));
+  } else {
+    callback();
+  }
+};
 const rules = reactive({
-    activityName: [{ required: true, message: '请输入活动名称', trigger: 'blur' },],
-    freeGold: [{ required: true, message: '请选择是否赠送免费金币', trigger: 'blur' },],
-    rechargeRatio: [{ validator: checkFreeGoldRadio, trigger: 'blur' },],
-    startTime: [
-        { required: true, message: '请选择开始时间', trigger: 'blur' },
-        { validator: checkStartTime, trigger: 'blur' },
-    ],
-    endTime: [
-        { required: true, message: '请选择结束时间', trigger: 'blur' },
-        { validator: checkEndTime, trigger: 'blur' },
-    ],
-})
+  activityName: [
+    { required: true, message: "请输入活动名称", trigger: "blur" },
+  ],
+  freeGold: [
+    { required: true, message: "请选择是否赠送免费金币", trigger: "blur" },
+  ],
+  rechargeRatio: [{ validator: checkFreeGoldRadio, trigger: "blur" }],
+  startTime: [
+    { required: true, message: "请选择开始时间", trigger: "blur" },
+    { validator: checkStartTime, trigger: "blur" },
+  ],
+  endTime: [
+    { required: true, message: "请选择结束时间", trigger: "blur" },
+    { validator: checkEndTime, trigger: "blur" },
+  ],
+});
 
 // 验证跳转输入框的数字是否合法
 const checkNumber = function () {
-    if (typeof parseInt(getObj.value.pageNum) === 'number') {
-        console.log('总共有多少页' + Math.ceil(total.value / getObj.value.pageSize));
-        if ((getObj.value.pageNum > 0) && (getObj.value.pageNum <= Math.ceil(total.value / getObj.value.pageSize))) {
-            console.log('输入的数字合法');
-            get();
-        } else {
-            //提示
-            ElMessage({
-                type: 'error',
-                message: '请检查输入内容',
-            })
-        }
+  if (typeof parseInt(getObj.value.pageNum) === "number") {
+    console.log(
+      "总共有多少页" + Math.ceil(total.value / getObj.value.pageSize)
+    );
+    if (
+      getObj.value.pageNum > 0 &&
+      getObj.value.pageNum <= Math.ceil(total.value / getObj.value.pageSize)
+    ) {
+      console.log("输入的数字合法");
+      get();
     } else {
-        //提示
-        ElMessage({
-            type: 'error',
-            message: '请检查输入内容',
-        })
+      //提示
+      ElMessage({
+        type: "error",
+        message: "请检查输入内容",
+      });
     }
-}
+  } else {
+    //提示
+    ElMessage({
+      type: "error",
+      message: "请检查输入内容",
+    });
+  }
+};
 
 // 挂载
 onMounted(async function () {
-    get();
-})
-
+  get();
+});
 </script>
 
 <template>
-    <el-row>
-        <el-col>
-            <el-card style="margin-bottom: 20px">
-                <div class="head-card">
-                    <div class="head-card-element">
-                        <el-text class="mx-1" size="large">活动名称：</el-text>
-                        <el-input v-model="activity.activityName" style="width: 240px" placeholder="请输入活动名称"
-                            clearable />
-                    </div>
-                    <div class="head-card-element">
-                        <el-text class="mx-1" size="large">添加时间：</el-text>
-                        <el-date-picker v-model="getTime" type="daterange" range-separator="至" start-placeholder="起始时间"
-                            end-placeholder="结束时间" />
-                    </div>
-                    <div class="head-card-btn">
-                        <el-button @click="reset()">重置</el-button>
-                        <el-button type="primary" @click="get()">查询</el-button>
-                    </div>
-                </div>
-            </el-card>
-        </el-col>
-    </el-row>
-    <el-row>
-        <el-col>
-            <el-card>
-                <div>
-                    <el-button plain @click="addActicity()"
-                        style="color: #048EFB; border:1px solid #048EFB">新增活动</el-button>
-                </div>
-                <div>
-                    <el-table :data="tableData" :height="tableHeight" style="width: 100%">
-                        <el-table-column prop="activityName" label="活动名称" />
-                        <el-table-column prop="startTime" label="开始时间" />
-                        <el-table-column prop="endTime" label="结束时间" />
-                        <el-table-column prop="rechargeRatio" label="免费兑换比">
-                            <template #default="scope">
-                                <span>{{ scope.row.rechargeRatio }}:1</span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column prop="status" label="状态">
-                            <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="red-dot"></span>
-                                        <span>未开始</span>
-                                    </div>
-                                </span>
-                                <span v-if="scope.row.status === 2">
-                                    <div class="status">
-                                        <span class="grey-dot"></span>
-                                        <span>已结束</span>
-                                    </div>
-                                </span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column prop="name" label="添加人" />
-                        <el-table-column prop="createTime" label="添加时间">
-                            <template #default="scope">
-                                {{ moment(scope.row.createTime).format('YYYY-MM-DD HH:mm:ss') }}
-                            </template>
-                        </el-table-column>
-                        <el-table-column prop="operation" label="操作">
-                            <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">
-                    <el-pagination background :page-size="getObj.pageSize" layout="slot" :total="total">
-                        <div>共{{ total }}条,每页 </div>
-                        <el-select v-model="getObj.pageSize" class="page-size" @change="get()" style="width: 80px">
-                            <el-option v-for="item in [5, 6, 7, 8, 9, 10]" :key="item" :label="item"
-                                :value="item"></el-option>
-                        </el-select>
-                        <div> 条</div>
-                    </el-pagination>
-                    <el-pagination background layout="prev, pager, next, slot" :page-size="getObj.pageSize"
-                        :total="total" :current-page="getObj.pageNum" @current-change="get">
-                        <div>跳至</div>
-                        <el-input v-model="getObj.pageNum" style="width: 40px;" @change="checkNumber" />
-                        <div>页</div>
-                    </el-pagination>
-                </div>
-            </el-card>
-        </el-col>
-    </el-row>
-
-    <el-dialog v-model="addActivityVisible" title="新增活动" width="500" :before-close="closeAddActivityVisible">
-        <template #footer>
-
-            <el-form :model="addObj" ref="Ref" :rules="rules" label-width="auto" style="max-width: 600px">
-
-                <el-form-item prop="activityName" label="活动名称:">
-                    <el-input v-model="addObj.activityName" placeholder="请输入活动名称" style="width: 220px;" />
-                </el-form-item>
-
-                <el-form-item prop="freeGold" label="免费金币:">
-                    <el-radio-group v-model="addObj.freeGold">
-                        <el-radio value="0" @change="addObj.rechargeRatio = '0'">无赠送</el-radio>
-                        <el-radio value="1">有赠送</el-radio>
-                    </el-radio-group>
-                </el-form-item>
-
-                <el-form-item prop="rechargeRatio" label="免费金币兑换比:">
-                    <el-input v-model="addObj.rechargeRatio" :disabled="addObj.freeGold === '0' ? true : false"
-                        placeholder="请输入" style="width: 80px;" />：1
-                    <div style="color: grey;">(提示：当前规则每10新币可兑换1免费金币)</div>
-                </el-form-item>
-
-                <el-form-item prop="startTime" label="开始时间:">
-                    <el-date-picker v-model="addObj.startTime" type="date" placeholder="请选择开始时间"
-                        @change="handleStartTimeChange" />
-                </el-form-item>
-
-                <el-form-item prop="endTime" label="结束时间:">
-                    <el-date-picker v-model="addObj.endTime" type="date" placeholder="请选择结束时间" />
-                </el-form-item>
-
-                <el-form-item prop="adminName" 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="add()">
-                    提交
-                </el-button>
-            </div>
-        </template>
-    </el-dialog>
+  <el-row>
+    <el-col>
+      <el-card style="margin-bottom: 20px">
+        <div class="head-card">
+          <div class="head-card-element">
+            <el-text class="mx-1" size="large">活动名称：</el-text>
+            <el-input
+              v-model="activity.activityName"
+              style="width: 240px"
+              placeholder="请输入活动名称"
+              clearable
+            />
+          </div>
+          <div class="head-card-element">
+            <el-text class="mx-1" size="large">添加时间：</el-text>
+            <el-date-picker
+              v-model="getTime"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="起始时间"
+              end-placeholder="结束时间"
+            />
+          </div>
+          <div class="head-card-btn">
+            <el-button @click="reset()">重置</el-button>
+            <el-button type="primary" @click="get()">查询</el-button>
+          </div>
+        </div>
+      </el-card>
+    </el-col>
+  </el-row>
+  <el-row>
+    <el-col>
+      <el-card>
+        <div>
+          <el-button
+            plain
+            @click="addActicity()"
+            style="color: #048efb; border: 1px solid #048efb"
+            >新增活动</el-button
+          >
+        </div>
+        <div>
+          <el-table :data="tableData" :height="tableHeight" style="width: 100%">
+            <el-table-column prop="activityName" label="活动名称" />
+            <el-table-column prop="startTime" label="开始时间" />
+            <el-table-column prop="endTime" label="结束时间" />
+            <el-table-column prop="rechargeRatio" label="免费兑换比">
+              <template #default="scope">
+                <span>{{ scope.row.rechargeRatio }}:1</span>
+              </template>
+            </el-table-column>
+            <el-table-column prop="status" label="状态">
+              <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="red-dot"></span>
+                    <span>未开始</span>
+                  </div>
+                </span>
+                <span v-if="scope.row.status === 2">
+                  <div class="status">
+                    <span class="grey-dot"></span>
+                    <span>已结束</span>
+                  </div>
+                </span>
+              </template>
+            </el-table-column>
+            <el-table-column prop="name" label="添加人" />
+            <el-table-column prop="createTime" label="添加时间">
+              <template #default="scope">
+                {{ moment(scope.row.createTime).format("YYYY-MM-DD HH:mm:ss") }}
+              </template>
+            </el-table-column>
+            <el-table-column prop="operation" label="操作">
+              <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">
+          <el-pagination
+            background
+            :page-size="getObj.pageSize"
+            layout="slot"
+            :total="total"
+          >
+            <div>共{{ total }}条,每页</div>
+            <el-select
+              v-model="getObj.pageSize"
+              class="page-size"
+              @change="get()"
+              style="width: 80px"
+            >
+              <el-option
+                v-for="item in [5, 6, 7, 8, 9, 10]"
+                :key="item"
+                :label="item"
+                :value="item"
+              ></el-option>
+            </el-select>
+            <div>条</div>
+          </el-pagination>
+          <el-pagination
+            background
+            layout="prev, pager, next, slot"
+            :page-size="getObj.pageSize"
+            :total="total"
+            :current-page="getObj.pageNum"
+            @current-change="get"
+          >
+            <div>跳至</div>
+            <el-input
+              v-model="getObj.pageNum"
+              style="width: 40px"
+              @change="checkNumber"
+            />
+            <div>页</div>
+          </el-pagination>
+        </div>
+      </el-card>
+    </el-col>
+  </el-row>
+
+  <el-dialog
+    v-model="addActivityVisible"
+    title="新增活动"
+    width="500"
+    :before-close="closeAddActivityVisible"
+  >
+    <template #footer>
+      <el-form
+        ref="Ref"
+        :model="addObj"
+        :rules="rules"
+        label-width="auto"
+        style="max-width: 600px"
+      >
+        <el-form-item prop="activityName" label="活动名称:">
+          <el-input
+            v-model="addObj.activityName"
+            placeholder="请输入活动名称"
+            style="width: 220px"
+          />
+        </el-form-item>
+
+        <el-form-item prop="freeGold" label="免费金币:">
+          <el-radio-group v-model="addObj.freeGold">
+            <el-radio value="0" @change="addObj.rechargeRatio = '0'"
+              >无赠送</el-radio
+            >
+            <el-radio value="1">有赠送</el-radio>
+          </el-radio-group>
+        </el-form-item>
+
+        <el-form-item prop="rechargeRatio" label="免费金币兑换比:">
+          <el-input
+            v-model="addObj.rechargeRatio"
+            :disabled="addObj.freeGold === '0' ? true : false"
+            placeholder="请输入"
+            style="width: 80px"
+          />：1
+          <div style="color: grey">(提示：当前规则每10新币可兑换1免费金币)</div>
+        </el-form-item>
+
+        <el-form-item prop="startTime" label="开始时间:">
+          <el-date-picker
+            v-model="addObj.startTime"
+            type="date"
+            placeholder="请选择开始时间"
+            @change="handleStartTimeChange"
+          />
+        </el-form-item>
+
+        <el-form-item prop="endTime" label="结束时间:">
+          <el-date-picker
+            v-model="addObj.endTime"
+            type="date"
+            placeholder="请选择结束时间"
+          />
+        </el-form-item>
+
+        <el-form-item label="添加人:">
+          <el-input v-model="adminData.name" disabled style="width: 220px" />
+        </el-form-item>
+      </el-form>
+
+      <div class="dialog-footer">
+        <el-button @click="closeAddActivityVisible">取消</el-button>
+        <el-button type="primary" @click="add()"> 提交 </el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped>
 .pagination {
-    display: flex;
+  display: flex;
 }
 
 .status {
-    display: flex;
+  display: flex;
 }
 
 .head-card {
-    display: flex;
+  display: flex;
 }
 
 .head-card-element {
-    margin-right: 20px;
+  margin-right: 20px;
 }
 
 .head-card-btn {
-    margin-left: auto;
+  margin-left: auto;
 }
 </style>

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

@@ -3,6 +3,29 @@ import { ref, onMounted, computed, reactive } from "vue";
 import { ElMessageBox } from "element-plus";
 import axios from "axios";
 import { createApp } from "vue";
+import moment from "moment";
+import API from "../../api/index.js";
+
+// 查询用户接口
+const adminData = ref({
+  name: "",
+});
+const getAdminData = async function () {
+  try {
+    const result = await API.post(
+      "http://192.168.8.93:10070/admin/userinfo",
+      {}
+    );
+    adminData.value = result;
+    addRate.value.adminId = adminData.value.adminId;
+    editRate.value.adminId = adminData.value.adminId;
+    console.log("请求成功", result);
+    console.log("用户信息", user.value);
+  } catch (error) {
+    console.log("请求失败", error);
+  }
+};
+getAdminData();
 
 const regeAdd = ref(false);
 const regeEdit = ref(false);
@@ -14,12 +37,18 @@ const getObj = ref({
   pageNum: 1,
   pageSize: 5,
 });
+const total = ref(0);
 //分页总条目
-const get = async function () {
+const get = async function (val) {
   try {
+    // 搜索参数页码赋值
+    if (typeof val === "number") {
+      getObj.value.pageNum = val;
+    }
+
     console.log("搜索参数", getObj.value);
     // 发送POST请求
-    const result = await axios.post("http://192.168.8.174:10010/rates/search", {
+    const result = await API.post("http://192.168.8.93:10010/rates/search", {
       ...getObj.value,
       rate: { ...value1.value },
     });
@@ -27,12 +56,12 @@ const get = async function () {
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    tableData.value = result.data.data.list;
+    tableData.value = result.data.list;
     console.log("tableData", tableData.value);
     // 在这里可以根据需求进一步处理成功后的逻辑，比如更新UI显示成功消息等
-    getObj.value.pageNum = result.data.data.pageNum;
-    getObj.value.pageSize = result.data.data.pageSize;
-    getObj.value.total = result.data.data.total;
+    // 存储分页总条目
+    total.value = result.data.total;
+    console.log("total", total.value);
   } catch (error) {
     console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
@@ -40,13 +69,15 @@ const get = async function () {
 };
 
 // 添加方法
-const rateAdd = ref({});
+const rateAdd = ref({
+  adminId: "1",
+});
 const addRate = async function () {
   try {
     console.log("搜索参数", getObj.value);
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.174:10010/rates/add",
+    const result = await API.post(
+      "http://192.168.8.93:10010/rates/add",
       rateAdd.value
     );
 
@@ -92,14 +123,14 @@ const getEditData = async function (row) {
   try {
     console.log("搜索参数", getObj.value);
     // 发送POST请求
-    const result = await axios.post("http://192.168.8.174:10010/rates/search", {
+    const result = await API.post("http://192.168.8.93:10010/rates/search", {
       rate: { rateId: row.rateId },
     });
 
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    rateEdit.value = result.data.data[0];
+    rateEdit.value = result.data[0];
   } catch (error) {
     console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
@@ -109,8 +140,8 @@ const editRate = async function () {
   try {
     console.log("搜索参数", rateEdit.value);
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.174:10010/rates/update",
+    const result = await API.post(
+      "http://192.168.8.93:10010/rates/update",
       rateEdit.value
     );
     // 将响应结果存储到响应式数据中
@@ -136,8 +167,8 @@ const edit = () => {
 const deleteRate = async function (row) {
   try {
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.174:10010/rates/delete/ " + row.rateId
+    const result = await API.post(
+      "http://192.168.8.93:10010/rates/delete/ " + row.rateId
     );
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
@@ -226,7 +257,7 @@ const checkStartTime = function (rule, value, callback) {
 const checkEndTime = function (rule, value, callback) {
   if (value <= new Date()) {
     callback(new Error("结束时间不能小于当前时间"));
-  } else if (value <= addObj.value.startTime) {
+  } else if (value <= rateAdd.value.startTime) {
     callback(new Error("结束时间不能小于开始时间"));
   } else {
     callback();
@@ -245,6 +276,34 @@ const rules = reactive({
     { validator: checkEndTime, trigger: "blur" },
   ],
 });
+
+// 验证跳转输入框的数字是否合法
+const checkNumber = function () {
+  if (typeof parseInt(getObj.value.pageNum) === "number") {
+    console.log(
+      "总共有多少页" + Math.ceil(total.value / getObj.value.pageSize)
+    );
+    if (
+      getObj.value.pageNum > 0 &&
+      getObj.value.pageNum <= Math.ceil(total.value / getObj.value.pageSize)
+    ) {
+      console.log("输入的数字合法");
+      get();
+    } else {
+      //提示
+      ElMessage({
+        type: "error",
+        message: "请检查输入内容",
+      });
+    }
+  } else {
+    //提示
+    ElMessage({
+      type: "error",
+      message: "请检查输入内容",
+    });
+  }
+};
 </script>
 
 <template>
@@ -304,7 +363,11 @@ const rules = reactive({
             style="width: 100%"
           >
             <el-table-column prop="currency" label="货币名称" :span="3" />
-            <el-table-column prop="exchangeRate" label="汇率" :span="3" />
+            <el-table-column prop="exchangeRate" label="汇率" :span="3">
+              <template #default="scope">
+                <p>{{ scope.row.exchangeRate }} ：1新币</p>
+              </template>
+            </el-table-column>
 
             <el-table-column prop="createTime" label="添加时间" :span="5">
               <template #default="scope">
@@ -338,12 +401,42 @@ const rules = reactive({
         <div class="pagination">
           <el-pagination
             background
-            layout="prev, pager, next"
-            v-model:current-page="getObj.pageNum"
-            v-model:page-size="getObj.pageSize"
-            :total="getObj.total"
-            @change="handlePageChange"
-          />
+            :page-size="getObj.pageSize"
+            layout="slot"
+            :total="total"
+          >
+            <div>共{{ total }}条,每页</div>
+            <el-select
+              v-model="getObj.pageSize"
+              class="page-size"
+              @change="get()"
+              style="width: 80px"
+            >
+              <el-option
+                v-for="item in [5, 6, 7, 8, 9, 10]"
+                :key="item"
+                :label="item"
+                :value="item"
+              ></el-option>
+            </el-select>
+            <div>条</div>
+          </el-pagination>
+          <el-pagination
+            background
+            layout="prev, pager, next, slot"
+            :page-size="getObj.pageSize"
+            :total="total"
+            :current-page="getObj.pageNum"
+            @current-change="get"
+          >
+            <div>跳至</div>
+            <el-input
+              v-model="getObj.pageNum"
+              style="width: 40px"
+              @change="checkNumber"
+            />
+            <div>页</div>
+          </el-pagination>
         </div>
       </el-card>
     </el-col>
@@ -382,7 +475,7 @@ const rules = reactive({
           <p>(提示：当前规则每 5 元人民币可兑换 1 新币)</p>
         </el-form-item>
         <el-form-item prop="updateName" label="提交人:">
-          <el-input v-model="rateAdd.updateName" style="width: 240px" />
+          <el-input :value="adminData.name" disabled style="width: 240px" />
         </el-form-item>
         <el-form-item prop="startTime" label="开始时间:">
           <el-date-picker
@@ -446,52 +539,7 @@ const rules = reactive({
           <p>(提示：当前规则每 5 元人民币可兑换 1 新币)</p>
         </el-form-item>
         <el-form-item label="提交人:">
-          <el-input v-model="rateEdit.updateName" style="width: 240px" />
-        </el-form-item>
-        <el-form-item>
-          <div class="dialog-footer">
-            <el-button type="primary" @click="edit">修改</el-button>
-            <el-button @click="regeEdit = false">取消</el-button>
-          </div>
-        </el-form-item>
-      </el-form>
-    </template>
-  </el-dialog>
-
-  <!-- 这是编辑弹窗 -->
-  <el-dialog v-model="regeEdit" title="修改汇率" width="500">
-    <template #footer>
-      <el-form
-        ref="ruleFormRef"
-        style="max-width: 600px"
-        :model="rateEdit"
-        :rules="rules"
-        label-width="auto"
-        class="demo-ruleForm"
-        :size="formSize"
-        status-icon
-      >
-        <el-form-item label="货币名称:">
-          <el-select
-            v-model="rateEdit.currency"
-            placeholder="请选择"
-            style="width: 240px"
-          >
-            <el-option
-              v-for="item in options"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="汇率:">
-          <el-input v-model="rateEdit.exchangeRate" style="width: 120px" />
-          <p class="unit">:1</p>
-          <p>(提示：当前规则每 5 元人民币可兑换 1 新币)</p>
-        </el-form-item>
-        <el-form-item label="提交人:">
-          <el-input v-model="rateEdit.adminName" style="width: 240px" />
+          <el-input disabled :value="adminData.name" style="width: 240px" />
         </el-form-item>
         <el-form-item>
           <div class="dialog-footer">
@@ -549,4 +597,7 @@ p {
 .el-card {
   padding: 0px;
 }
+.pagination {
+  display: flex;
+}
 </style>

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

@@ -5,17 +5,39 @@ import { ElMessage } from "element-plus";
 import { Plus } from "@element-plus/icons-vue";
 import axios from "axios";
 import { ElMessageBox } from "element-plus";
+import API from "../../api/index.js";
+
+const adminData = ref({});
+const getAdminData = async function () {
+  try {
+    const result = await API.post(
+      "http://192.168.8.93:10070/admin/userinfo",
+      {}
+    );
+    adminData.value = result;
+    addRecharge.value.adminId = adminData.value.adminId;
+    console.log("请求成功", result);
+    console.log("用户信息", user.value);
+  } catch (error) {
+    console.log("请求失败", error);
+  }
+};
+getAdminData();
 
 // 这是添加充值信息的表单
 const addRecharge = ref({
   rechargeVoucher: "",
   rechargeWay: "客服充值",
+  adminId: "1",
+  freeGold: 0,
+  rechargeGold: 0,
+  paidGold: 0,
 });
 // 这是添加充值信息的接口
 const add = async function () {
   try {
     // 发送POST请求
-    const result = await axios.post(
+    const result = await API.post(
       "http://192.168.8.93:10010/recharge/recharge/add",
       addRecharge.value
     );
@@ -24,6 +46,8 @@ const add = async function () {
     console.log("请求成功", result);
     // 存储表格数据
     console.log("用户信息", user.value);
+    imageUrl.value = "";
+    addRecharge.value = {};
   } catch (error) {
     console.log("请求失败", error);
     // 在这里可以处理错误逻辑，比如显示错误提示等
@@ -36,8 +60,6 @@ const addBefore = () => {
         .then(() => {
           add();
           console.log("添加成功");
-          imageUrl.value = "";
-          addRecharge.value = {};
         })
         .catch(() => {
           console.log("取消添加");
@@ -58,10 +80,12 @@ const Ref = ref(null);
 const checkEndTime = function (rule, value, callback) {
   if (value <= new Date()) {
     callback(new Error("付款时间不能小于当前时间"));
+  } else {
+    callback();
   }
 };
 const rules = reactive({
-  homilyId: [{ required: true, message: "请输入精网号", trigger: "blur" }],
+  jwcode: [{ required: true, message: "请输入精网号", trigger: "blur" }],
   activityId: [{ required: true, message: "请选择活动名称", trigger: "blur" }],
   paidGold: [{ required: true, message: "请输入充值金币", trigger: "blur" }],
   rechargeGold: [
@@ -76,20 +100,26 @@ const rules = reactive({
 
 // 查找客户信息的方法
 const user = ref({});
-const getUser = async function (homilyId) {
+const getUser = async function (jwcode) {
   try {
     // 发送POST请求
-    const result = await axios.post("http://192.168.8.93:10020/recharge/user", {
-      homilyId: homilyId,
+    const result = await API.post("http://192.168.8.93:10020/recharge/user", {
+      jwcode: jwcode,
     });
 
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    user.value = result.data.data[0];
+    user.value = result.data[0];
     console.log("用户信息", user.value);
+    if (result.data.code === 0) {
+      ElMessage.error(result.data.msg);
+    } else {
+      ElMessage.success(result.data.msg);
+    }
   } catch (error) {
     console.log("请求失败", error);
+    ElMessage.error("查询失败，请检查精网号是否正确");
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
@@ -99,7 +129,7 @@ const activity = ref([]);
 const getActivity = async function () {
   try {
     // 发送POST请求
-    const result = await axios.post(
+    const result = await API.post(
       "http://192.168.8.93:10010/recharge/activity/select",
       {}
     );
@@ -107,7 +137,7 @@ const getActivity = async function () {
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    activity.value = result.data.data;
+    activity.value = result.data;
     console.log("活动信息", activity.value);
   } catch (error) {
     console.log("请求失败", error);
@@ -121,15 +151,12 @@ const currency = ref([]);
 const getCurrency = async function () {
   try {
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.174:10010/rates/search",
-      {}
-    );
+    const result = await API.post("http://192.168.8.93:10010/rates/search", {});
 
     // 将响应结果存储到响应式数据中
     console.log("货币请求成功", result);
     // 存储表格数据
-    currency.value = result.data.data;
+    currency.value = result.data;
     console.log("tableData", currency.value);
     // 在这里可以根据需求进一步处理成功后的逻辑，比如更新UI显示成功消息等
   } catch (error) {
@@ -146,14 +173,13 @@ const imageUrl = ref("");
 const handleAvatarSuccess = (response, uploadFile) => {
   imageUrl.value = URL.createObjectURL(uploadFile.raw);
   console.log("图片上传成功", response, uploadFile);
-  addRecharge.value.rechargeVoucher =
-    "http://192.168.8.93:10010/upload/" + response.data;
+  addRecharge.value.rechargeVoucher = `http://192.168.8.93:10010/upload/${response.data}`;
   console.log("图片名称", addRecharge.value.rechargeVoucher);
 };
 // 上传图片之前的校验函数
 const beforeAvatarUpload = (rawFile) => {
-  if (rawFile.type !== "image/jpeg") {
-    ElMessage.error("Avatar picture must be JPG format!");
+  if (rawFile.type !== "image/jpeg" && rawFile.type !== "image/png") {
+    ElMessage.error("图片格式必须为jpg或png!");
     return false;
   } else if (rawFile.size / 1024 / 1024 > 2) {
     ElMessage.error("Avatar picture size can not exceed 2MB!");
@@ -179,13 +205,15 @@ const options = [
 ];
 
 const calculatedFreeGold = computed(() => {
-  return addRecharge.value.paidGold * addRecharge.value.activityId;
+  return addRecharge.value.paidGold / addRecharge.value.activityId;
 });
 const calculatedRechargeGold = computed(() => {
-  addRecharge.value.paidGold * addRecharge.value.reteId;
+  return addRecharge.value.paidGold * addRecharge.value.rateId;
 });
-watch(calculatedFreeGold, calculatedRechargeGold, (newVal) => {
+watch(calculatedFreeGold, (newVal) => {
   addRecharge.value.freeGold = newVal;
+});
+watch(calculatedRechargeGold, (newVal) => {
   addRecharge.value.rechargeGold = newVal;
 });
 </script>
@@ -199,12 +227,13 @@ watch(calculatedFreeGold, calculatedRechargeGold, (newVal) => {
     :rules="rules"
     label-width="auto"
     style="max-width: 600px"
+    class="add-form"
   >
-    <el-form-item prop="homilyId" label="精网号">
-      <el-input v-model="addRecharge.homilyId" style="width: 220px" />
+    <el-form-item prop="jwcode" label="精网号">
+      <el-input v-model="addRecharge.jwcode" style="width: 220px" />
       <el-button
         type="primary"
-        @click="getUser(addRecharge.homilyId)"
+        @click="getUser(addRecharge.jwcode)"
         style="margin-left: 20px"
         >查询</el-button
       >
@@ -227,12 +256,7 @@ watch(calculatedFreeGold, calculatedRechargeGold, (newVal) => {
       <el-input v-model="addRecharge.paidGold" style="width: 100px" />
       <p style="margin-right: 20px">个</p>
       <p>免费金币</p>
-      <el-input
-        v-model="addRecharge.freeGold"
-        disabled
-        :value="addRecharge.paidGold * addRecharge.activityId"
-        style="width: 100px"
-      />
+      <el-input v-model="addRecharge.freeGold" disabled style="width: 100px" />
       <p>个</p>
     </el-form-item>
     <el-form-item label="充值金额">
@@ -251,7 +275,7 @@ watch(calculatedFreeGold, calculatedRechargeGold, (newVal) => {
       </el-select>
       <el-input
         disabled
-        :value="addRecharge.paidGold * addRecharge.rateId"
+        v-model="addRecharge.rechargeGold"
         style="width: 200px"
       />
     </el-form-item>
@@ -308,22 +332,19 @@ watch(calculatedFreeGold, calculatedRechargeGold, (newVal) => {
     <el-form-item prop="submitter" label="提交人">
       <el-input
         style="width: 300px"
-        value="张三"
+        :value="adminData.name"
         disabled
         placeholder="提交人姓名"
       />
     </el-form-item>
+    <el-button @click="closeAddActivityVisible" style="margin-left: 280px"
+      >取消</el-button
+    >
+    <el-button type="primary" @click="addBefore"> 提交 </el-button>
   </el-form>
 
-  <el-button @click="closeAddActivityVisible" style="margin-left: 280px"
-    >取消</el-button
-  >
-  <el-button type="primary" @click="addBefore"> 提交 </el-button>
-
   <!-- 客户信息栏 -->
-  <el-card
-    style="width: 700px; float: right; margin-top: -470px; margin-right: 100px"
-  >
+  <el-card style="width: 700px; float: right" class="customer-info">
     <el-form
       :model="user"
       label-width="auto"
@@ -342,7 +363,7 @@ watch(calculatedFreeGold, calculatedRechargeGold, (newVal) => {
         </el-col>
         <el-col :span="12">
           <el-form-item label="精网号">
-            <p>{{ user.homilyId }}</p>
+            <p>{{ user.jwcode }}</p>
           </el-form-item>
         </el-col>
         <el-col :span="12">
@@ -408,4 +429,12 @@ p {
   height: 50px;
   text-align: center;
 }
+.add-form {
+  margin-top: 50px;
+  max-width: 50%;
+  float: left;
+}
+.customer-info {
+  max-width: 50%;
+}
 </style>

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

@@ -5,6 +5,7 @@ import { ElMessage, ElMessageBox } from 'element-plus'
 import { AiFillRead } from "vue-icons-plus/ai";
 import axios from 'axios';
 import moment from 'moment';
+import API from "../../api/index.js";
 // 变量
 // 用户对象假的
 const admin = ref({
@@ -59,6 +60,10 @@ const payWay = [
         value: '借记卡',
         label: '借记卡',
     },
+    {
+        value: '现金充值',
+        label: '现金充值',
+    },
 ]
 // 删除==========================================================
 // 删除对象
@@ -90,15 +95,15 @@ const get = async function (val) {
         }
         console.log('搜索参数', getObj.value);
         // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/recharge', { ...getObj.value, rechargeVo: { ...rechargeVo.value } });
+        const result = await API.post('http://192.168.8.93:10010/recharge/recharge', { ...getObj.value, rechargeVo: { ...rechargeVo.value } });
 
         // 将响应结果存储到响应式数据中
         console.log('请求成功', result);
         // 存储表格数据
-        tableData.value = result.data.data.list;
+        tableData.value = result.data.list;
         console.log('tableData', tableData.value);
         // 存储分页总数
-        total.value = result.data.data.total;
+        total.value = result.data.total;
         console.log('total', total.value);
     } catch (error) {
         console.log('请求失败', error);
@@ -183,12 +188,12 @@ const handleClick = function (tab, event) {
 const getActivity = async function () {
     try {
         // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/activity/select', {});
+        const result = await API.post('http://192.168.8.93:10010/recharge/activity/select', {});
 
         // 将响应结果存储到响应式数据中
         console.log('请求成功', result);
         // 存储表格数据
-        activity.value = result.data.data;
+        activity.value = result.data;
         console.log('activity', activity.value);
     } catch (error) {
         console.log('请求失败', error);
@@ -199,11 +204,11 @@ const getActivity = async function () {
 const getArea = async function () {
     try {
         // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/recharge', {});
+        const result = await API.post('http://192.168.8.93:10010/recharge/recharge', {});
         // 将响应结果存储到响应式数据中
         console.log('请求成功', result);
         // 存储全部数据
-        allData.value = result.data.data;
+        allData.value = result.data;
         console.log('allData', allData.value);
         // 分离并去重地区列表
         area.value = [...new Set(allData.value.map(item => item.area))]
@@ -224,7 +229,7 @@ const del = function (row) {
 const delConfirm = async function () {
     try {
         console.log('delObj2', delObj.value);
-        const result = await axios.post('http://192.168.8.93:10010/recharge/recharge/edit', delObj.value);
+        const result = await API.post('http://192.168.8.93:10010/recharge/recharge/edit', delObj.value);
         console.log('删除成功', result);
         // 刷新表格数据
         get();
@@ -382,10 +387,10 @@ onMounted(async function () {
                         <el-table-column prop="createTime" label="提交时间" width="200px" />
                         <el-table-column fixed="right" prop="operation" label="操作" width="150px">
                             <template #default="scope">
-                                <el-popconfirm title="确定将此条活动修改(删除)吗？" @confirm="delConfirm">
+                                <el-popconfirm title="确定将此条活动删除吗？" @confirm="delConfirm">
                                     <template #reference>
                                         <el-button type="primary" text @click="del(scope.row)">
-                                            修改
+                                            删除
                                         </el-button>
                                     </template>
                                     <template #actions="{ confirm, cancel }">

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

@@ -5,6 +5,7 @@ import { ElMessage, ElMessageBox } from 'element-plus'
 import { AiFillRead } from "vue-icons-plus/ai";
 import axios from 'axios';
 import moment from 'moment';
+import API from "../../api/index.js";
 // 变量
 // 充值明细表格
 const tableData = ref([]);
@@ -52,6 +53,10 @@ const payWay = [
         value: '借记卡',
         label: '借记卡',
     },
+    {
+        value: '现金充值',
+        label: '现金充值',
+    },
 ]
 
 //表格高度
@@ -81,15 +86,15 @@ const get = async function (val) {
         }
         console.log('搜索参数', getObj.value);
         // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/recharge', { ...getObj.value, rechargeVo: { ...rechargeVo.value } });
+        const result = await API.post('http://192.168.8.93:10010/recharge/recharge', { ...getObj.value, rechargeVo: { ...rechargeVo.value } });
 
         // 将响应结果存储到响应式数据中
         console.log('请求成功', result);
         // 存储表格数据
-        tableData.value = result.data.data.list;
+        tableData.value = result.data.list;
         console.log('tableData', tableData.value);
         // 存储分页总数
-        total.value = result.data.data.total;
+        total.value = result.data.total;
         console.log('total', total.value);
     } catch (error) {
         console.log('请求失败', error);
@@ -173,12 +178,12 @@ const handleClick = function (tab, event) {
 const getActivity = async function () {
     try {
         // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/activity/select', {});
+        const result = await API.post('http://192.168.8.93:10010/recharge/activity/select', {});
 
         // 将响应结果存储到响应式数据中
         console.log('请求成功', result);
         // 存储表格数据
-        activity.value = result.data.data;
+        activity.value = result.data;
         console.log('activity', activity.value);
     } catch (error) {
         console.log('请求失败', error);
@@ -189,11 +194,11 @@ const getActivity = async function () {
 const getArea = async function () {
     try {
         // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10010/recharge/recharge', {});
+        const result = await API.post('http://192.168.8.93:10010/recharge/recharge', {});
         // 将响应结果存储到响应式数据中
         console.log('请求成功', result);
         // 存储全部数据
-        allData.value = result.data.data;
+        allData.value = result.data;
         console.log('allData', allData.value);
         // 分离并去重地区列表
         area.value = [...new Set(allData.value.map(item => item.area))]

vue/gold-system/src/views/refund/addRefund.vue

@@ -5,15 +5,43 @@ import { ElMessage } from "element-plus";
 import { Plus } from "@element-plus/icons-vue";
 import axios from "axios";
 import { ElMessageBox } from "element-plus";
+import API from "../../api/index.js";
+
+//这是获取用户信息的接口
+const adminData = ref({});
+const getAdminData = async function () {
+  try {
+    const result = await API.post(
+      "http://192.168.8.93:10070/admin/userinfo",
+      {}
+    );
+    adminData.value = result;
+    addRefund.value.adminId = adminData.value.adminId;
+    console.log("请求成功", result);
+    console.log("用户信息", user.value);
+  } catch (error) {
+    console.log("请求失败", error);
+  }
+};
+getAdminData();
 
 // 这是添加充值信息的表单
-const addRefund = ref({});
+const addRefund = ref({
+  adminId: "1",
+  updateType: "退款",
+  allCoin: 0,
+  contactId: "",
+  refundGoods: "",
+  freeCoin: 0,
+  rechargeCoin: 0,
+  taskCoin: 0,
+});
 // 这是添加充值信息的接口
 const add = async function () {
   try {
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.93:10010/recharge/recharge/add",
+    const result = await API.post(
+      "http://192.168.8.174:10040/refund/add",
       addRefund.value
     );
 
@@ -31,10 +59,16 @@ const addBefore = () => {
     if (valid) {
       ElMessageBox.confirm("确认添加？")
         .then(() => {
+          addRefund.value.freeCoin = Number(-addRefund.value.freeCoin);
+          addRefund.value.rechargeCoin = Number(-addRefund.value.rechargeCoin);
+          addRefund.value.taskCoin = Number(-addRefund.value.taskCoin);
           add();
           console.log("添加成功");
-          imageUrl.value = "";
-          addRefund.value = {};
+          addRefund.value.allCoin = 0;
+          (addRefund.value.freeCoin = 0),
+            (addRefund.value.rechargeCoin = 0),
+            (addRefund.value.taskCoin = 0),
+            (addRefund.value = {});
         })
         .catch(() => {
           console.log("取消添加");
@@ -58,7 +92,7 @@ const checkEndTime = function (rule, value, callback) {
   }
 };
 const rules = reactive({
-  homilyId: [{ required: true, message: "请输入精网号", trigger: "blur" }],
+  jwcode: [{ required: true, message: "请输入精网号", trigger: "blur" }],
   refundType: [{ required: true, message: "请选择退款类型", trigger: "blur" }],
   refundGoods: [{ required: true, message: "请选择退款商品", trigger: "blur" }],
   taskCoin: [{ required: true, message: "请输入任务金币", trigger: "blur" }],
@@ -71,54 +105,105 @@ const rules = reactive({
 
 // 查找客户信息的方法
 const user = ref({});
-const getUser = async function (homilyId) {
+const getUser = async function (jwcode) {
   try {
     // 发送POST请求
-    const result = await axios.post("http://192.168.8.93:10020/recharge/user", {
-      homilyId: homilyId,
+    const result = await API.post("http://192.168.8.93:10020/recharge/user", {
+      jwcode: jwcode,
     });
 
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    user.value = result.data.data[0];
+    user.value = result.data[0];
     console.log("用户信息", user.value);
+    if (result.data.code === 0) {
+      ElMessage.error(result.data.msg);
+    } else {
+      ElMessage.success(result.data.msg);
+    }
   } catch (error) {
     console.log("请求失败", error);
+    ElMessage.error("查询失败，请检查精网号是否正确");
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
+const calculatedAllGold = computed(() => {
+  const sum =
+    Number(addRefund.value.freeCoin) +
+    Number(addRefund.value.rechargeCoin) +
+    Number(addRefund.value.taskCoin);
+  return !isNaN(sum) ? sum : 0;
+});
+
+watch(calculatedAllGold, (newVal) => {
+  addRefund.value.allCoin = newVal;
+});
+
+const AAA = computed(() => {
+  return addRefund.value.jwcode;
+});
+
+watch(AAA, (newVal) => {});
+
+// 退款类型选项
+const refundType = [
+  {
+    value: "退款商品",
+    label: "退款商品",
+  },
+  {
+    value: "退款金币",
+    label: "退款金币",
+  },
+];
 
-// 这是查询货币的接口
-const currency = ref([]);
-const getCurrency = async function () {
+// 根据精网号查询商品
+const goods = ref([]);
+const getGoods = async function (jwcode) {
   try {
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.174:10010/rates/search",
-      {}
+    const result = await API.post(
+      "http://192.168.8.147:10030/consume/getDeatil/" + addRefund.value.jwcode
     );
 
     // 将响应结果存储到响应式数据中
-    console.log("货币请求成功", result);
+    console.log("请求成功", result);
     // 存储表格数据
-    currency.value = result.data.data;
-    console.log("tableData", currency.value);
-    // 在这里可以根据需求进一步处理成功后的逻辑，比如更新UI显示成功消息等
+    goods.value = result.data;
+    console.log("用户信息", goods.value);
   } catch (error) {
     console.log("请求失败", error);
+    ElMessage.error("查询失败，请检查精网号是否正确");
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
-getCurrency();
-
-const calculatedFreeGold = computed(() => {
-  return addRefund.value.paidGold * addRefund.value.activityId;
+const calculatedRechargeGoods = computed(() => {
+  return (
+    +addRefund.value.freeCoin +
+    +addRefund.value.rechargeCoin +
+    +addRefund.value.taskCoin
+  );
 });
-
-watch(calculatedFreeGold, (newVal) => {
-  addRefund.value.freeGold = newVal;
+watch(calculatedRechargeGoods, (newVal) => {
+  addRefund.value.allCoin = newVal;
+});
+watch(calculatedRechargeGoods, (newVal) => {
+  addRefund.value.allCoin = newVal;
+  console.log("计算的总金币", newVal);
 });
+
+// 绑定两个数据
+
+const handleSelectionChange = (value) => {
+  const selectedItem = goods.value.find((item) => item.detailId === value);
+  if (selectedItem) {
+    addRefund.value.contactId = selectedItem.detailId;
+    addRefund.value.refundGoods = selectedItem.productName;
+  }
+  console.log("选择的商品", addRefund.value.refundGoods);
+  console.log("选择的商品ID", addRefund.value.contactId); // 打印选中的商品ID
+};
 </script>
 
 <template>
@@ -130,12 +215,17 @@ watch(calculatedFreeGold, (newVal) => {
     :rules="rules"
     label-width="auto"
     style="max-width: 750px"
+    class="form-style"
   >
-    <el-form-item prop="homilyId" label="精网号">
-      <el-input v-model="addRefund.homilyId" style="width: 220px" />
+    <el-form-item prop="jwcode" label="精网号">
+      <el-input
+        v-model="addRefund.jwcode"
+        style="width: 220px"
+        @change="getGoods(addRefund.jwcode)"
+      />
       <el-button
         type="primary"
-        @click="getUser(addRefund.homilyId)"
+        @click="getUser(addRefund.jwcode)"
         style="margin-left: 20px"
         >查询</el-button
       >
@@ -147,58 +237,59 @@ watch(calculatedFreeGold, (newVal) => {
         style="width: 300px"
       >
         <el-option
-          v-for="item in activity"
+          v-for="item in refundType"
           :key="item.value"
-          :label="item.activityName"
-          :value="item.rechargeRatio"
+          :label="item.label"
+          :value="item.value"
         />
       </el-select>
     </el-form-item>
-    <el-form-item prop="refundGoods" label="退款商品">
+    <el-form-item prop="contactId" label="退款商品">
       <el-select
-        v-model="addRefund.refundGoods"
+        v-model="addRefund.contactId"
         placeholder="请选择"
         style="width: 300px"
+        @change="handleSelectionChange"
       >
         <el-option
-          v-for="item in activity"
+          v-for="item in goods"
           :key="item.value"
-          :label="item.activityName"
-          :value="item.rechargeRatio"
+          :label="item.productName"
+          :value="item.detailId"
         />
       </el-select>
     </el-form-item>
-    <el-form-item prop="taskCoin" label="任务金币" style="float: left">
-      <el-input
-        v-model="addRefund.taskCoin"
-        style="width: 100px; margin-left: -5px"
-      />
-      <p style="margin-right: 0px">个</p>
-    </el-form-item>
-    <el-form-item
-      prop="freeCoin"
-      label="免费金币"
-      style="float: left; margin-left: -10px; margin-right: -10px"
-    >
-      <el-input
-        v-model="addRefund.freeCoin"
-        style="width: 100px; margin-left: -5px"
-      />
-      <p style="margin-right: 0px">个</p>
-    </el-form-item>
-    <el-form-item
-      prop="rechargeCoin"
-      label="充值金币"
-      style="margin-left: -20px"
-    >
-      <el-input
-        v-model="addRefund.rechargeCoin"
-        style="width: 100px; margin-left: -5px"
-      />
-      <p style="margin-right: 20px">个</p>
-    </el-form-item>
+    <div style="display: flex; align-items: center">
+      <el-form-item prop="taskCoin" label="任务金币" style="float: left">
+        <el-input v-model="addRefund.taskCoin" style="width: 100px" />
+        <p>个</p>
+      </el-form-item>
+      <el-form-item
+        prop="freeCoin"
+        label="免费金币"
+        style="margin-left: -20px; float: left"
+      >
+        <el-input
+          v-model="addRefund.freeCoin"
+          style="float: left; width: 100px"
+        />
+        <p>个</p>
+      </el-form-item>
+      <el-form-item
+        prop="rechargeCoin"
+        label="充值金币"
+        style="margin-left: -20px"
+      >
+        <el-input
+          v-model="addRefund.rechargeCoin"
+          style="float: left; width: 100px"
+        />
+        <p>个</p>
+      </el-form-item>
+    </div>
     <el-form-item prop="allCoin" label="退款金币总数">
-      <el-input disabled v-model="addRefund.allCoin" style="width: 100px" />
+      <el-input disabled v-model="addRefund.allCoin" style="width: 100px">
+      </el-input>
     </el-form-item>
     <el-form-item prop="remark" label="备注">
       <el-input
@@ -213,22 +304,19 @@ watch(calculatedFreeGold, (newVal) => {
     <el-form-item prop="commitName" label="提交人">
       <el-input
         style="width: 300px"
-        value="张三"
+        :value="adminData.name"
         disabled
         placeholder="提交人姓名"
       />
     </el-form-item>
+    <el-button @click="closeAddActivityVisible" style="margin-left: 280px"
+      >取消</el-button
+    >
+    <el-button type="primary" @click="addBefore"> 提交 </el-button>
   </el-form>
 
-  <el-button @click="closeAddActivityVisible" style="margin-left: 280px"
-    >取消</el-button
-  >
-  <el-button type="primary" @click="addBefore"> 提交 </el-button>
-
   <!-- 客户信息栏 -->
-  <el-card
-    style="width: 700px; float: right; margin-top: -370px; margin-right: 100px"
-  >
+  <el-card style="width: 700px; float: right" class="form-style2">
     <el-form
       :model="user"
       label-width="auto"
@@ -247,7 +335,7 @@ watch(calculatedFreeGold, (newVal) => {
         </el-col>
         <el-col :span="12">
           <el-form-item label="精网号">
-            <p>{{ user.homilyId }}</p>
+            <p>{{ user.jwcode }}</p>
           </el-form-item>
         </el-col>
         <el-col :span="12">
@@ -313,4 +401,12 @@ p {
   height: 50px;
   text-align: center;
 }
+.form-style {
+  margin-top: 50px;
+  max-width: 50%;
+  float: left;
+}
+.form-style2 {
+  max-width: 50%;
+}
 </style>

vue/gold-system/src/views/refund/allRefund.vue

@@ -3,16 +3,18 @@ import { ref, onMounted, reactive, computed } from "vue";
 import ElementPlus from "element-plus";
 import { AiFillRead } from "vue-icons-plus/ai";
 import axios from "axios";
+import moment from "moment";
+import API from "../../api/index.js";
 // 变量
 // 充值明细表格
 const tableData = ref([]);
 // 搜索======================================
-// 搜索rechargeVo
-const rechargeVo = ref({});
+// 搜索detail
+const detail = ref({});
 // 搜索对象
 const getObj = ref({
   pageNum: 1,
-  pageSize: 5,
+  pageSize: 10,
 });
 //分页总条目
 const total = ref(100);
@@ -28,33 +30,21 @@ const area = ref([]);
 //标签页默认高亮选项
 const activeName = ref("all");
 
-// 支付方式选项
-const payWay = [
+// 退款类型
+const consumeType = [
   {
-    value: "微信",
-    label: "微信",
+    value: "退商品",
+    label: "退商品",
   },
   {
-    value: "支付宝",
-    label: "支付宝",
-  },
-  {
-    value: "银联",
-    label: "银联",
-  },
-  {
-    value: "信用卡",
-    label: "信用卡",
-  },
-  {
-    value: "借记卡",
-    label: "借记卡",
+    value: "退金币",
+    label: "退金币",
   },
 ];
 
 //表格高度
 const tableHeight = computed(function () {
-  return (getObj.value.pageSize + 2) * 60 + "px";
+  return (getObj.value.pageSize + 2) * 41 + "px";
 });
 
 // 方法
@@ -69,27 +59,27 @@ const get = async function (val) {
     // 搜索参数时间赋值
     if (getTime.value != null) {
       if (getTime.value.startDate != "" && getTime.value.endDate != "") {
-        rechargeVo.value.startDate = getTime.value[0];
-        rechargeVo.value.endDate = getTime.value[1];
+        detail.value.startDate = getTime.value[0];
+        detail.value.endDate = getTime.value[1];
       }
     } else {
-      rechargeVo.value.startDate = "";
-      rechargeVo.value.endDate = "";
+      detail.value.startDate = "";
+      detail.value.endDate = "";
     }
     console.log("搜索参数", getObj.value);
     // 发送POST请求
-    const result = await axios.post(
-      "http://192.168.8.93:10030/audit/audit/refund",
-      { ...getObj.value, rechargeVo: { ...rechargeVo.value } }
-    );
+    const result = await API.post("http://192.168.8.174:10040/refund/search", {
+      ...getObj.value,
+      detail: { ...detail.value },
+    });
 
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    tableData.value = result.data.data.list;
+    tableData.value = result.data.list;
     console.log("tableData", tableData.value);
     // 存储分页总数
-    total.value = result.data.data.total;
+    total.value = result.data.total;
     console.log("total", total.value);
   } catch (error) {
     console.log("请求失败", error);
@@ -98,11 +88,11 @@ const get = async function (val) {
 };
 // 重置
 const reset = function () {
-  rechargeVo.value.activityId = "";
-  rechargeVo.value.payWay = "";
-  rechargeVo.value.area = "";
-  rechargeVo.value.startDate = "";
-  rechargeVo.value.endDate = "";
+  detail.value.refundGoods = "";
+  detail.value.refundType = "";
+  detail.value.adminArea = "";
+  detail.value.startDate = "";
+  detail.value.endDate = "";
   get();
 };
 // 今天
@@ -160,24 +150,24 @@ const get7Days = function () {
 //全部充值明细
 const adminAll = function () {
   console.log("adminAll");
-  rechargeVo.value.status = "";
+  detail.value.auditStatus = "";
   get();
 };
 //待审核充值明细
 const adminWait = function () {
-  rechargeVo.value.status = 0;
+  detail.value.auditStatus = 0;
   get();
   console.log("adminWait");
 };
 //已通过充值明细
 const adminPass = function () {
-  rechargeVo.value.status = 1;
+  detail.value.auditStatus = 1;
   get();
   console.log("adminPass");
 };
 //已驳回充值明细
 const adminReject = function () {
-  rechargeVo.value.status = 2;
+  detail.value.auditStatus = 2;
   get();
   console.log("adminReject");
 };
@@ -197,7 +187,7 @@ const handleClick = function (tab, event) {
 const getActivity = async function () {
   try {
     // 发送POST请求
-    const result = await axios.post(
+    const result = await API.post(
       "http://192.168.8.93:10010/recharge/activity/select",
       {}
     );
@@ -205,7 +195,7 @@ const getActivity = async function () {
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储表格数据
-    activity.value = result.data.data;
+    activity.value = result.data;
     console.log("activity", activity.value);
   } catch (error) {
     console.log("请求失败", error);
@@ -216,14 +206,14 @@ const getActivity = async function () {
 const getArea = async function () {
   try {
     // 发送POST请求
-    const result = await axios.post(
+    const result = await API.post(
       "http://192.168.8.93:10010/recharge/recharge",
       {}
     );
     // 将响应结果存储到响应式数据中
     console.log("请求成功", result);
     // 存储全部数据
-    allData.value = result.data.data;
+    allData.value = result.data;
     console.log("allData", allData.value);
     // 分离并去重地区列表
     area.value = [...new Set(allData.value.map((item) => item.area))];
@@ -239,6 +229,49 @@ onMounted(async function () {
   getActivity();
   await getArea();
 });
+//删除气泡
+const delObj = ref({});
+const del = function (row) {
+  delObj.value.detailId = row.detailId;
+  console.log("delObj", delObj.value);
+};
+// 删除按钮的气泡弹出框确认按钮
+const delConfirm = async function () {
+  try {
+    console.log("delObj", delObj.value);
+    // 发送POST请求
+    const result = await API.post(
+      "http://192.168.8.174:10040/refund/softDelete?detailId=" +
+        delObj.value.detailId
+    );
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    // 刷新表格数据
+    get();
+  } catch (error) {
+    console.log("请求失败", error);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
+
+// 查询商品的接口
+const goods = ref([]);
+const getGoods = async function () {
+  try {
+    // 发送POST请求
+    const result = await API.post("http://192.168.8.93:10020/product", {});
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    // 存储全部数据
+    goods.value = result.data;
+    console.log("allData", allData.value);
+    console.log("地区", area.value);
+  } catch (error) {
+    console.log("请求失败", error);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
+getGoods();
 </script>
 
 <template>
@@ -248,36 +281,36 @@ onMounted(async function () {
         <el-row style="margin-bottom: 10px">
           <el-col :span="8">
             <div class="head-card-element">
-              <el-text class="mx-1" size="large">活动名称：</el-text>
+              <el-text class="mx-1" size="large">退款类型：</el-text>
               <el-select
-                v-model="rechargeVo.activityId"
-                placeholder="请选择活动名称"
+                v-model="detail.refundType"
+                placeholder="请选择退款类型"
                 size="large"
                 style="width: 240px"
               >
                 <el-option
-                  v-for="item in activity"
+                  v-for="item in consumeType"
                   :key="item.activityId"
-                  :label="item.activityName"
-                  :value="item.activityId"
+                  :label="item.label"
+                  :value="item.value"
                 />
               </el-select>
             </div>
           </el-col>
           <el-col :span="8">
             <div class="head-card-element">
-              <el-text class="mx-1" size="large">支付方式：</el-text>
+              <el-text class="mx-1" size="large">退款商品：</el-text>
               <el-select
-                v-model="rechargeVo.payWay"
+                v-model="detail.refundGoods"
                 placeholder="请选择支付方式"
                 size="large"
                 style="width: 240px"
               >
                 <el-option
-                  v-for="item in payWay"
+                  v-for="item in goods"
                   :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
+                  :label="item.name"
+                  :value="item.name"
                 />
               </el-select>
             </div>
@@ -286,7 +319,7 @@ onMounted(async function () {
             <div class="head-card-element">
               <el-text class="mx-1" size="large">所属地区：</el-text>
               <el-select
-                v-model="rechargeVo.area"
+                v-model="detail.adminArea"
                 placeholder="请选择所属地区"
                 size="large"
                 style="width: 240px"
@@ -304,7 +337,7 @@ onMounted(async function () {
         <el-row>
           <el-col :span="21">
             <div class="head-card-element">
-              <el-text class="mx-1" size="large">充值时间：</el-text>
+              <el-text class="mx-1" size="large">退款时间：</el-text>
               <el-date-picker
                 v-model="getTime"
                 type="datetimerange"
@@ -344,10 +377,15 @@ onMounted(async function () {
           <el-tab-pane label="已驳回" name="reject"></el-tab-pane>
         </el-tabs>
         <div>
-          <el-table :data="tableData" :height="tableHeight" style="width: 100%">
-            <el-table-column prop="name" label="姓名" width="80px" />
-            <el-table-column prop="homilyId" label="精网号" width="180px" />
-            <el-table-column prop="area" label="所属地区" width="120px" />
+          <el-table
+            :data="tableData"
+            v-if="(tableData.detaillFlag = 1)"
+            :height="tableHeight"
+            style="width: 100%"
+          >
+            <el-table-column prop="userName" label="姓名" width="80px" />
+            <el-table-column prop="jwcode" label="精网号" width="180px" />
+            <el-table-column prop="adminArea" label="所属地区" width="120px" />
             <el-table-column prop="refundType" label="退款类型" width="180px" />
             <el-table-column
               prop="refundGoods"
@@ -378,22 +416,22 @@ onMounted(async function () {
               show-overflow-tooltip
             />
             <el-table-column prop="adminName" label="提交人" width="100px" />
-            <el-table-column prop="status" label="审核状态" width="120px">
+            <el-table-column prop="auditStatus" label="审核状态" width="120px">
               <!-- 模板内容 -->
               <template #default="scope">
-                <span v-if="scope.row.status === 1">
+                <span v-if="scope.row.auditStatus == 1">
                   <div class="status">
                     <span class="green-dot"></span>
                     <span>已通过</span>
                   </div>
                 </span>
-                <span v-if="scope.row.status === 0">
+                <span v-if="scope.row.auditStatus == 0">
                   <div class="status">
                     <span class="grey-dot"></span>
                     <span>待审核</span>
                   </div>
                 </span>
-                <span v-if="scope.row.status === 2">
+                <span v-if="scope.row.auditStatus == 2">
                   <div class="status">
                     <span class="red-dot"></span>
                     <span>已驳回</span>
@@ -407,7 +445,11 @@ onMounted(async function () {
               width="200px"
               show-overflow-tooltip
             />
-            <el-table-column prop="createTime" label="提交时间" width="180px" />
+            <el-table-column prop="createTime" label="提交时间" width="180px">
+              <template #default="scope">
+                {{ moment(scope.row.createTime).format("YYYY-MM-DD HH:mm:ss") }}
+              </template>
+            </el-table-column>
             <el-table-column
               prop="operation"
               label="操作"
@@ -426,7 +468,7 @@ onMounted(async function () {
                   </template>
                   <template #actions="{ confirm, cancel }">
                     <el-button size="small" @click="cancel">取消</el-button>
-                    <el-button type="primary" size="small" @click="confirm">
+                    <el-button type="primary" size="small" @click="delConfirm">
                       确定
                     </el-button>
                   </template>

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

@@ -1,203 +1,329 @@
 <script setup>
 import { ref, onMounted, reactive, computed } from "vue";
 import ElementPlus from "element-plus";
-import axios from 'axios';
+import axios from "axios";
+import { ta } from "element-plus/es/locales.mjs";
+import API from "../../api/index.js";
 
 // 充值明细表格
 const tableData = ref([]);
+// 计算用户各金币总数的不分页对象
+const tableAllData = ref([]);
+// 各金币总数
+const rechargeCoin = ref(0);
+const freeCoin = ref(0);
+const taskCoin = ref(0);
 // 搜索===========================================
+//分页总条目
+const total = ref(100);
+// 搜索对象时间
+const getTime = ref([]);
 // 搜索detail
 const detail = ref({});
+// 不分页的搜索对象
+const getAllObj = ref({});
 // 搜索对象
 const getObj = ref({
-    pageNum: 1,
-    pageSize: 5,
+  pageNum: 1,
+  pageSize: 5,
 });
-//分页总条目
-const total = ref(100);
-// 搜索对象时间
-const getTime = ref([]);
+
 // 支付方式选项
 const updateType = [
-    {
-        value: '充值',
-        label: '充值',
-    },
-    {
-        value: '消费',
-        label: '消费',
-    },
-    {
-        value: '退款',
-        label: '退款',
-    },
-]
+  {
+    value: "充值",
+    label: "充值",
+  },
+  {
+    value: "消费",
+    label: "消费",
+  },
+  {
+    value: "退款",
+    label: "退款",
+  },
+];
 
 //表格高度
 const tableHeight = computed(function () {
-    return (getObj.value.pageSize + 2) * 60 + 'px';
+  return getObj.value.pageSize * 50 + "px";
 });
 
-
 // 方法
 // 搜索===========================================================================
 // 搜索方法
 const get = async function (val) {
-    try {
-        // 搜索参数页码赋值 
-        if (typeof val === 'number') {
-            getObj.value.pageNum = val;
-        }
-        // 搜索参数时间赋值
-        if (getTime.value != null) {
-            if (getTime.value.startDate != '' && getTime.value.endDate != '') {
-                detail.value.startDate = getTime.value[0];
-                detail.value.endDate = getTime.value[1];
-            }
-        } else {
-            detail.value.startDate = '';
-            detail.value.endDate = '';
-        }
-        console.log('搜索参数', getObj.value);
-        // 发送POST请求
-        const result = await axios.post('http://192.168.8.93:10040/detail', { ...getObj.value, detail: { ...detail.value } });
-
-        // 将响应结果存储到响应式数据中
-        console.log('请求成功', result);
-        // 存储表格数据
-        tableData.value = result.data.data.list;
-        console.log('tableData', tableData.value);
-        // 存储分页总数
-        total.value = result.data.data.total;
-        console.log('total', total.value);
-    } catch (error) {
-        console.log('请求失败', error);
-        // 在这里可以处理错误逻辑，比如显示错误提示等
+  try {
+    // 搜索参数页码赋值
+    if (typeof val === "number") {
+      getObj.value.pageNum = val;
     }
-}
+    // 搜索参数时间赋值
+    if (getTime.value != null) {
+      if (getTime.value.startDate != "" && getTime.value.endDate != "") {
+        detail.value.startDate = getTime.value[0];
+        detail.value.endDate = getTime.value[1];
+      }
+    } else {
+      detail.value.startDate = "";
+      detail.value.endDate = "";
+    }
+    console.log("搜索参数", getObj.value);
+    // 发送POST请求
+    const result = await API.post("http://192.168.8.93:10040/detail", {
+      ...getObj.value,
+      detail: { ...detail.value },
+    });
+    const result2 = await API.post("http://192.168.8.93:10040/detail", {
+      ...getAllObj.value,
+      detail: { ...detail.value },
+    });
+    // 将响应结果存储到响应式数据中
+    console.log("请求成功", result);
+    console.log("请求成功2", result2);
+    // 存储表格数据
+    tableData.value = result.data.list;
+    console.log("tableData", tableData.value);
+    tableAllData.value = result2.data;
+    console.log("tableAllData", tableAllData.value);
+    // 存储分页总数
+    total.value = result.data.total;
+    console.log("total", total.value);
+    // 计算各金币总数
+    rechargeCoin.value = tableAllData.value.reduce(
+      (pre, cur) => pre + cur.rechargeCoin,
+      0
+    );
+    freeCoin.value = tableAllData.value.reduce(
+      (pre, cur) => pre + cur.freeCoin,
+      0
+    );
+    taskCoin.value = tableAllData.value.reduce(
+      (pre, cur) => pre + cur.taskCoin,
+      0
+    );
+    console.log(
+      "各金币总数",
+      rechargeCoin.value,
+      freeCoin.value,
+      taskCoin.value
+    );
+  } catch (error) {
+    console.log("请求失败", error);
+    // 在这里可以处理错误逻辑，比如显示错误提示等
+  }
+};
 
 // 重置
 const reset = function () {
-    detail.value.jwcode = '';
-    detail.value.updateType = '';
-    detail.value.startDate = '';
-    detail.value.endDate = '';
-    getTime.value = {};
-}
+  detail.value.jwcode = "";
+  detail.value.updateType = "";
+  detail.value.startDate = "";
+  detail.value.endDate = "";
+  getTime.value = {};
+};
 // 今天
 const getToday = function () {
-    const today = new Date();
-    const startDate = new Date(today.getFullYear(), today.getMonth(), today.getDate());
-    const endDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1);
-    getTime.value = [startDate, endDate];
-    console.log('getTime', getTime.value);
-    get();
-}
+  const today = new Date();
+  const startDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate()
+  );
+  const endDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate() + 1
+  );
+  getTime.value = [startDate, endDate];
+  console.log("getTime", getTime.value);
+  get();
+};
 // 昨天
 const getYesterday = function () {
-    const yesterday = new Date();
-    yesterday.setDate(yesterday.getDate() - 1);
-    const startDate = new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate());
-    const endDate = new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate() + 1);
-    getTime.value = [startDate, endDate];
-    console.log('getTime', getTime.value);
-    get();
-}
+  const yesterday = new Date();
+  yesterday.setDate(yesterday.getDate() - 1);
+  const startDate = new Date(
+    yesterday.getFullYear(),
+    yesterday.getMonth(),
+    yesterday.getDate()
+  );
+  const endDate = new Date(
+    yesterday.getFullYear(),
+    yesterday.getMonth(),
+    yesterday.getDate() + 1
+  );
+  getTime.value = [startDate, endDate];
+  console.log("getTime", getTime.value);
+  get();
+};
 // 近7天
 const get7Days = function () {
-    const today = new Date();
-    const startDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() - 6);
-    const endDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1);
-    getTime.value = [startDate, endDate];
-    console.log('getTime', getTime.value);
-    get();
-}
-
+  const today = new Date();
+  const startDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate() - 6
+  );
+  const endDate = new Date(
+    today.getFullYear(),
+    today.getMonth(),
+    today.getDate() + 1
+  );
+  getTime.value = [startDate, endDate];
+  console.log("getTime", getTime.value);
+  get();
+};
 
 // 挂载
 onMounted(async function () {
-    await get();
-})
-
+  await get();
+});
 </script>
 
 <template>
-    <el-row>
-        <el-col>
-            <el-card style="margin-bottom: 20px">
-                <div class="head-card">
-                    <div class="head-card-element">
-                        <el-text class="mx-1" size="large">精网号：</el-text>
-                        <el-input v-model="detail.jwcode" style="width: 240px" placeholder="请输入精网号" clearable />
-                    </div>
-                    <div class="head-card-element">
-                        <el-text class="mx-1" size="large">更新类型：</el-text>
-                        <el-select v-model="detail.updateType" placeholder="请选择更新类型" size="large" style="width: 240px">
-                            <el-option v-for="item in updateType" :key="item.value" :label="item.label"
-                                :value="item.value" />
-                        </el-select>
-                    </div>
-                    <div class="head-card-element">
-                        <el-text class="mx-1" size="large">更新时间：</el-text>
-                        <el-time-picker v-model="getTime" is-range range-separator="至" start-placeholder="起始时间"
-                            end-placeholder="结束时间" />
-                    </div>
-                    <div class="head-card-btn">
-                        <el-button @click="reset()">重置</el-button>
-                        <el-button type="primary" @click="get()">查询</el-button>
-                    </div>
-                </div>
-            </el-card>
-        </el-col>
-    </el-row>
-    <el-row>
-        <el-col>
-            <el-card>
-                <div>
-                    现有金币：免费金币：（），充值金币：（），任务金币：（）
-                </div>
-                <div>
-                    <el-table :data="tableData" style="width: 100%">
-                        <el-table-column prop="name" label="姓名" />
-                        <el-table-column prop="jwcode" label="精网号" />
-                        <el-table-column prop="area" label="所属地区" />
-                        <el-table-column prop="gold" label="更新数量">
-                            <template #default="scope">
-                                <span>{{ scope.row.rechargeCoin + scope.row.freeCoin + scope.row.taskCoin }}</span>
-                            </template>
-                        </el-table-column>
-                        <el-table-column prop="updateType" label="更新类型" />
-                            <el-table-column prop="freeCoin" label="免费金币" />
-                            <el-table-column prop="rechargeCoin" label="充值金币" />
-                            <el-table-column prop="taskCoin" label="任务金币" />
-                            <el-table-column prop="name" label="提交人" />
-                            <el-table-column prop="createTime" label="更新时间" />
-                    </el-table>
-                </div>
-
-                <!-- 分页 -->
-                <el-pagination background layout="prev, pager, next" :total="total" />
-
-            </el-card>
-        </el-col>
-    </el-row>
+  <el-row>
+    <el-col>
+      <el-card style="margin-bottom: 20px">
+        <div class="head-card">
+          <div class="head-card-element">
+            <el-text class="mx-1" size="large">精网号：</el-text>
+            <el-input
+              v-model="detail.jwcode"
+              style="width: 240px"
+              placeholder="请输入精网号"
+              clearable
+            />
+          </div>
+          <div class="head-card-element">
+            <el-text class="mx-1" size="large">更新类型：</el-text>
+            <el-select
+              v-model="detail.updateType"
+              placeholder="请选择更新类型"
+              size="large"
+              style="width: 240px"
+            >
+              <el-option
+                v-for="item in updateType"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </div>
+          <div class="head-card-element">
+            <el-text class="mx-1" size="large">更新时间：</el-text>
+            <el-date-picker
+              v-model="getTime"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="起始时间"
+              end-placeholder="结束时间"
+            />
+          </div>
+          <div class="head-card-btn">
+            <el-button @click="reset()">重置</el-button>
+            <el-button type="primary" @click="get()">查询</el-button>
+          </div>
+        </div>
+      </el-card>
+    </el-col>
+  </el-row>
+  <el-row>
+    <el-col>
+      <el-card>
+        <div>
+          现有金币：免费金币：{{ freeCoin }}，充值金币：{{
+            rechargeCoin
+          }}，任务金币：{{ taskCoin }}
+        </div>
+        <div>
+          <el-table :data="tableData" :height="tableHeight" style="width: 100%">
+            <el-table-column prop="uname" label="姓名" />
+            <el-table-column prop="jwcode" label="精网号" />
+            <el-table-column prop="area" label="所属地区" />
+            <el-table-column prop="gold" label="更新数量">
+              <template #default="scope">
+                <span>{{
+                  scope.row.rechargeCoin +
+                  scope.row.freeCoin +
+                  scope.row.taskCoin
+                }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column prop="updateType" label="更新类型" />
+            <el-table-column prop="freeCoin" label="免费金币" />
+            <el-table-column prop="rechargeCoin" label="充值金币" />
+            <el-table-column prop="taskCoin" label="任务金币" />
+            <el-table-column prop="name" label="提交人" />
+            <el-table-column prop="createTime" label="更新时间" />
+          </el-table>
+        </div>
 
+        <!-- 分页 -->
+        <!-- 分页 -->
+        <div class="pagination">
+          <el-pagination
+            background
+            :page-size="getObj.pageSize"
+            layout="slot"
+            :total="total"
+          >
+            <div>共{{ total }}条,每页</div>
+            <el-select
+              v-model="getObj.pageSize"
+              class="page-size"
+              @change="get()"
+              style="width: 80px"
+            >
+              <el-option
+                v-for="item in [5, 6, 7, 8, 9, 10]"
+                :key="item"
+                :label="item"
+                :value="item"
+              ></el-option>
+            </el-select>
+            <div>条</div>
+          </el-pagination>
+          <el-pagination
+            background
+            layout="prev, pager, next,slot"
+            :page-size="getObj.pageSize"
+            :total="total"
+            :current-page="getObj.pageNum"
+            @current-change="get"
+          >
+            <div>跳至</div>
+            <el-input
+              v-model="getObj.pageNum"
+              style="width: 40px"
+              @change="checkNumber"
+            />
+            <div>页</div>
+          </el-pagination>
+        </div>
+      </el-card>
+    </el-col>
+  </el-row>
 </template>
 
-    <style scoped>
-    .status {
-        display: flex;
-    }
+<style scoped>
+.pagination {
+  display: flex;
+}
+.status {
+  display: flex;
+}
 
-    .head-card {
-        display: flex;
-    }
+.head-card {
+  display: flex;
+}
 
-    .head-card-element {
-        margin-right: 20px;
-    }
+.head-card-element {
+  margin-right: 20px;
+}
 
-    .head-card-btn {
-        margin-left: auto;
-    }
+.head-card-btn {
+  margin-left: auto;
+}
 </style>

vue/gold-system/src/views/z.vue

@@ -0,0 +1,104 @@
+<script setup>
+import { all } from 'axios';
+import * as echarts from 'echarts';
+import { ref, onMounted, reactive, computed } from "vue";
+import { VscInfo } from 'vue-icons-plus/vsc'
+import { Bs1CircleFill, Bs2CircleFill, Bs3CircleFill, Bs4Circle, Bs5Circle, Bs6Circle, Bs7Circle, Bs8Circle } from 'vue-icons-plus/bs'
+import axios from 'axios';
+
+// 变量
+const option4Data = ref([]);
+const a1=ref(1000);
+const a2=ref(2000);
+const a3=ref(3000);
+const a4=ref(4000);
+onMounted(async function () {
+    option4Data.value = [
+        { value: a1.value, name: '1000金币' },
+        { value: a2.value, name: '2000金币' },
+        { value: a3.value, name: '3000金币' },
+        { value: a4.value, name: '4000金币' },
+    ];
+    // 第一个柱状图 基于准备好的dom，初始化echarts实例
+    var rechargeBar = echarts.init(document.getElementById('main'));
+
+    const option = {
+        tooltip: {
+            trigger: 'item'
+        },
+        legend: {
+            bottom: '-2%',
+            left: 'center',
+            orient: 'vertical'
+        },
+        grid: {
+            top: '0%', // 设置图表距离容器顶部的距离为10%，使饼图上移
+        },
+        series: [
+            {
+                name: '全年累计消耗金币数(个)\n10000',
+                type: 'pie',
+                radius: ['80%', '60%'],
+                avoidLabelOverlap: false,
+                label: {
+                    show: true,
+                    position: 'center',
+                    formatter: '{a}',
+                    fontSize: 15,
+                    fontWeight: 'bold'
+                },
+                labelLine: {
+                    show: false
+                },
+                data: option4Data.value,
+                color: ['#57a5ff', '#7f29ff', '#f2d113']
+            }
+        ]
+    };
+    // 使用刚指定的配置项和数据显示图表。
+    rechargeBar.setOption(option);
+})
+
+
+</script>
+
+<template>
+    <div>zzz</div>
+    <div id="main" style="width: 600px;height:400px;"></div>
+</template>
+
+<style scoped>
+.comparedWithYesterday {
+    display: flex;
+}
+
+.ranking-item {
+    margin-bottom: 10px;
+}
+
+.ranking-header {
+    margin-bottom: 10px;
+    display: flex;
+}
+
+.goldCategory {
+    margin-right: 20px;
+    display: flex;
+}
+
+.bar {
+    display: flex;
+}
+
+.pie {
+    display: flex;
+}
+
+.el-row {
+    margin-bottom: 20px;
+}
+
+.el-radio-button {
+    border: 1px solid grey;
+}
+</style>

vue/gold-system/vite.config.ts

@@ -4,4 +4,5 @@ import vue from '@vitejs/plugin-vue'
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [vue()],
+  
 })