huangqizhen
/
gold-vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

样式

zhangyong/feature-20250815160302-金币优化
lihuilin 2 months ago
parent
109ef878fb
commit
fd50ebbc6f
8 changed files with 578 additions and 674 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 31
      src/views/consume/bean/addBeanConsume.vue
  2. 116
      src/views/consume/gold/addCoinConsume.vue
  3. 8
      src/views/consume/gold/coinConsume.vue
  4. 76
      src/views/consume/gold/coinConsumeDetail.vue
  5. 14
      src/views/recharge/bean/addBeanRecharge.vue
  6. 3
      src/views/recharge/gold/addCoinRecharge.vue
  7. 35
      src/views/recharge/gold/coinRecharge.vue
  8. 111
      src/views/recharge/gold/coinRechargeDetail.vue

31
src/views/consume/bean/addBeanConsume.vue
View File

@ -205,7 +205,6 @@ const throttledHandleConsumeFormt = _.throttle(handleConsumeForm, 5000, {
}) })
</script> </script>
<template> <template>
<div>
<div class="userAndform"> <div class="userAndform">
<div class="left"> <div class="left">
<el-form :model="consumeForm" :rules="rules" ref="formRef" label-width="auto" style="min-width: 420px" <el-form :model="consumeForm" :rules="rules" ref="formRef" label-width="auto" style="min-width: 420px"
@ -287,14 +286,12 @@ const throttledHandleConsumeFormt = _.throttle(handleConsumeForm, 5000, {
</el-card> </el-card>
</div> </div>
</div> </div>
</div>
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss">
.userAndform { .userAndform {
width: 100%;
height: 100%;
width: 80vw;
height: 85vh;
display: flex; display: flex;
align-items: center;
justify-content: center; justify-content: center;
.left { .left {
@ -302,38 +299,28 @@ const throttledHandleConsumeFormt = _.throttle(handleConsumeForm, 5000, {
display: flex; display: flex;
.add-form { .add-form {
width: 100%;
margin-top: 50px;
margin-top: 5vh;
} }
} }
.right { .right {
flex: 1; flex: 1;
margin-left: 50px;
display: flex; display: flex;
.beautiful {
width: 90%;
display: flex;
justify-content: center;
align-items: center;
padding: 0 10px;
.customer-info {
width: 35vw;
height:28vh;
float: right;
margin-top: 5vh;
} }
} }
} }
.customer-info {
width: 700px;
float: right;
margin-right: 300px;
margin-top: 50px;
}
p { p {
margin: 0px; margin: 0px;
} }
.el-form-item { .el-form-item {
margin-left: 50px;
margin-left: 5vw;
} }
</style> </style>

116
src/views/consume/gold/addCoinConsume.vue
View File

@ -1,16 +1,16 @@
<script setup> <script setup>
import {onMounted, reactive, ref, watch} from "vue";
import {ElIcon, ElMessage, ElMessageBox} from "element-plus";
import { onMounted, reactive, ref, watch } from "vue";
import { ElIcon, ElMessage, ElMessageBox } from "element-plus";
import moment from "moment"; import moment from "moment";
import request from "@/util/http.js" import request from "@/util/http.js"
import Cookies from 'js-cookie'; import Cookies from 'js-cookie';
import {useAdminStore} from "@/store/index.js";
import {storeToRefs} from "pinia";
import {WarnTriangleFilled} from "@element-plus/icons-vue";
import { useAdminStore } from "@/store/index.js";
import { storeToRefs } from "pinia";
import { WarnTriangleFilled } from "@element-plus/icons-vue";
import dayjs from "dayjs"; import dayjs from "dayjs";
const adminStore = useAdminStore(); const adminStore = useAdminStore();
const {adminData, menuTree} = storeToRefs(adminStore);
const { adminData, menuTree } = storeToRefs(adminStore);
// 精网号去空格 // 精网号去空格
const trimJwCode = () => { const trimJwCode = () => {
if (addConsume.value.jwcode) { if (addConsume.value.jwcode) {
@ -64,11 +64,11 @@ const addConsume = ref({
const Ref = ref(null) const Ref = ref(null)
const rules = reactive({ const rules = reactive({
jwcode: [ jwcode: [
{required: true, message: "请输入精网号", trigger: "blur"},
{ required: true, message: "请输入精网号", trigger: "blur" },
], ],
goodsName: [{required: true, message: "请选择商品", trigger: "change"}],
goodsName: [{ required: true, message: "请选择商品", trigger: "change" }],
sumGold: [ sumGold: [
{required: true, message: "消耗金币总数不能为空", trigger: "blur"},
{ required: true, message: "消耗金币总数不能为空", trigger: "blur" },
{ {
validator: (rule, value, callback) => { validator: (rule, value, callback) => {
// 允许0开头的小数（如0.1）但不允许单独的0 // 允许0开头的小数（如0.1）但不允许单独的0
@ -173,10 +173,10 @@ function calculateCoins(sumGold) {
console.log("消耗金币计算函数:计算金币", sumGold); console.log("消耗金币计算函数:计算金币", sumGold);
const parsedSumGold = parseFloat(sumGold); const parsedSumGold = parseFloat(sumGold);
if (isNaN(parsedSumGold) || parsedSumGold <= 0 || !user.value.jwcode) { if (isNaN(parsedSumGold) || parsedSumGold <= 0 || !user.value.jwcode) {
return {free: 0, permanent: 0, task: 0};
return { free: 0, permanent: 0, task: 0 };
} }
const {nowFreeGold, nowPermanentGold, nowTaskGold} = user.value;
const { nowFreeGold, nowPermanentGold, nowTaskGold } = user.value;
let remaining = parsedSumGold; let remaining = parsedSumGold;
let freeUsed = 0, permanentUsed = 0, taskUsed = 0; let freeUsed = 0, permanentUsed = 0, taskUsed = 0;
@ -202,7 +202,7 @@ function calculateCoins(sumGold) {
addConsume.value.permanentGold = permanentUsed; addConsume.value.permanentGold = permanentUsed;
addConsume.value.taskGold = taskUsed; addConsume.value.taskGold = taskUsed;
return {free: freeUsed, permanent: permanentUsed, task: taskUsed};
return { free: freeUsed, permanent: permanentUsed, task: taskUsed };
} }
// 用来写的 cookie 的 key // 用来写的 cookie 的 key
@ -419,7 +419,7 @@ const getUser = async function (jwcode) {
// 发送POST请求 // 发送POST请求
const result = await request({ const result = await request({
url: "/user/selectUser", url: "/user/selectUser",
data: {jwcode}
data: { jwcode }
}); });
console.log("请求成功", result); console.log("请求成功", result);
@ -429,15 +429,15 @@ const getUser = async function (jwcode) {
user.value = { user.value = {
...result.data, ...result.data,
// 统一处理所有黄金数值，除以100 // 统一处理所有黄金数值，除以100
nowPermanentGold: result.data.nowPermanentGold ,
nowFreeGold: result.data.nowFreeGold ,
nowSumGold: result.data.nowSumGold ,
nowTaskGold: result.data.nowTaskGold ,
nowFreeJune: result.data.nowFreeJune ,
nowFreeDecember: result.data.nowFreeDecember ,
historySumGold: result.data.historySumGold ,
historyPermanentGold: result.data.historyPermanentGold ,
historyFreeGold: result.data.historyFreeGold ,
nowPermanentGold: result.data.nowPermanentGold,
nowFreeGold: result.data.nowFreeGold,
nowSumGold: result.data.nowSumGold,
nowTaskGold: result.data.nowTaskGold,
nowFreeJune: result.data.nowFreeJune,
nowFreeDecember: result.data.nowFreeDecember,
historySumGold: result.data.historySumGold,
historyPermanentGold: result.data.historyPermanentGold,
historyFreeGold: result.data.historyFreeGold,
historyTaskGold: result.data.historyTaskGold historyTaskGold: result.data.historyTaskGold
}; };
@ -446,7 +446,7 @@ const getUser = async function (jwcode) {
if (addConsume.value.sumGold) { if (addConsume.value.sumGold) {
const parsedSumGold = parseFloat(addConsume.value.sumGold); const parsedSumGold = parseFloat(addConsume.value.sumGold);
if (!isNaN(parsedSumGold) && parsedSumGold > 0) { if (!isNaN(parsedSumGold) && parsedSumGold > 0) {
const {free, permanent, task} = calculateCoins(parsedSumGold);
const { free, permanent, task } = calculateCoins(parsedSumGold);
addConsume.value.freeGold = free; addConsume.value.freeGold = free;
addConsume.value.permanentGold = permanent; addConsume.value.permanentGold = permanent;
addConsume.value.taskGold = task; addConsume.value.taskGold = task;
@ -502,7 +502,7 @@ watch(
(newValue) => { (newValue) => {
const parsedNewValue = parseFloat(newValue); const parsedNewValue = parseFloat(newValue);
if (!isNaN(parsedNewValue) && parsedNewValue > 0) { if (!isNaN(parsedNewValue) && parsedNewValue > 0) {
const {free, permanent, task} = calculateCoins(parsedNewValue);
const { free, permanent, task } = calculateCoins(parsedNewValue);
addConsume.value.freeGold = free; addConsume.value.freeGold = free;
addConsume.value.permanentGold = permanent; addConsume.value.permanentGold = permanent;
addConsume.value.taskGold = task; addConsume.value.taskGold = task;
@ -528,24 +528,24 @@ onMounted(async function () {
<template> <template>
<div class="father1"> <div class="father1">
<div class="left"> <div class="left">
<el-form :model="addConsume" ref="Ref" :rules="rules" style="min-width: 420px;" class="add-form" label-width="auto" label-position="right">
<el-form :model="addConsume" ref="Ref" :rules="rules" style="min-width: 420px;" class="add-form"
label-width="auto" label-position="right">
<el-form-item prop="jwcode" label="精网号" style="margin-top: 50px"> <el-form-item prop="jwcode" label="精网号" style="margin-top: 50px">
<el-input v-model="addConsume.jwcode" style="width: 200px;"/>
<el-input v-model="addConsume.jwcode" style="width: 200px;" />
<el-button type="primary" @click="getUser(addConsume.jwcode)" style="margin-left: 20px">查询 <el-button type="primary" @click="getUser(addConsume.jwcode)" style="margin-left: 20px">查询
</el-button> </el-button>
</el-form-item> </el-form-item>
<el-form-item prop="goodsName" label="商品名称" >
<el-select v-model="addConsume.goodsName" placeholder="请选择商品" style="width: 200px" clearable filterable
>
<el-option v-for="(item, index) in goods" :key="index" :label="item.label" :value="item"/>
<el-form-item prop="goodsName" label="商品名称">
<el-select v-model="addConsume.goodsName" placeholder="请选择商品" style="width: 200px" clearable filterable>
<el-option v-for="(item, index) in goods" :key="index" :label="item.label" :value="item" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item prop="sumGold" label="消耗金币总数"> <el-form-item prop="sumGold" label="消耗金币总数">
<el-input v-model="addConsume.sumGold" style="width: 120px" @input="validateInput()" <el-input v-model="addConsume.sumGold" style="width: 120px" @input="validateInput()"
@change="calculateCoins(addConsume.sumGold)"/>
@change="calculateCoins(addConsume.sumGold)" />
</el-form-item> </el-form-item>
@ -559,18 +559,18 @@ onMounted(async function () {
</el-form-item> </el-form-item>
<el-form-item prop="freeCoin" label="免费金币"> <el-form-item prop="freeCoin" label="免费金币">
<el-input disabled v-model="addConsume.freeGold" style="width: 120px"/>
<el-input disabled v-model="addConsume.freeGold" style="width: 120px" />
<p style="margin-right: 0px">&nbsp;&nbsp;个</p> <p style="margin-right: 0px">&nbsp;&nbsp;个</p>
</el-form-item> </el-form-item>
<el-form-item prop="taskGold" label="任务金币"> <el-form-item prop="taskGold" label="任务金币">
<el-input disabled v-model="addConsume.taskGold" style="width: 120px"/>
<el-input disabled v-model="addConsume.taskGold" style="width: 120px" />
<p style="margin-right: 20px">&nbsp;&nbsp;个</p> <p style="margin-right: 20px">&nbsp;&nbsp;个</p>
</el-form-item> </el-form-item>
<el-form-item prop="remark" label="备注"> <el-form-item prop="remark" label="备注">
<el-input v-model="addConsume.remark" style="width: 250px" :rows="4" maxlength="100"
show-word-limit type="textarea"/>
<el-input v-model="addConsume.remark" style="width: 250px" :rows="4" maxlength="100" show-word-limit
type="textarea" />
</el-form-item> </el-form-item>
<el-button type="success" @click="resetForm()" style="margin-left: 200px;margin-top:10px">重置</el-button> <el-button type="success" @click="resetForm()" style="margin-left: 200px;margin-top:10px">重置</el-button>
@ -578,7 +578,7 @@ onMounted(async function () {
</el-form> </el-form>
</div> </div>
<div class="right">
<div class="right">
<!-- 客户信息栏 --> <!-- 客户信息栏 -->
<el-card v-if="user.jwcode" style="width: 800px; float: right" class="customer-info"> <el-card v-if="user.jwcode" style="width: 800px; float: right" class="customer-info">
<el-form :model="user" label-width="auto" style="max-width: 1000px" label-position="left"> <el-form :model="user" label-width="auto" style="max-width: 1000px" label-position="left">
@ -649,48 +649,43 @@ onMounted(async function () {
</el-card> </el-card>
<el-dialog
v-model="FirstConsumeDialogVisible"
title="操作确认"
:before-close="FirstConsumeDialogVisiblehandleClose"
:close-on-click-modal="false"
width="480px"
>
<el-dialog v-model="FirstConsumeDialogVisible" title="操作确认" :before-close="FirstConsumeDialogVisiblehandleClose"
:close-on-click-modal="false" width="480px">
<!-- 内容整体居中且收窄 --> <!-- 内容整体居中且收窄 -->
<div class="confirm-body"> <div class="confirm-body">
<!-- 用户信息 --> <!-- 用户信息 -->
<div> <div>
<div class="field-label">用户信息</div> <div class="field-label">用户信息</div>
<el-input :model-value="user.jwcode + (user.name ? '【' + user.name + '】' : '')" disabled/>
<el-input :model-value="user.jwcode + (user.name ? '【' + user.name + '】' : '')" disabled />
</div> </div>
<!-- 活动名称 --> <!-- 活动名称 -->
<div class="field"> <div class="field">
<div class="field-label">商品名称</div> <div class="field-label">商品名称</div>
<el-input v-model="addConsume.goodsName.value" disabled/>
<el-input v-model="addConsume.goodsName.value" disabled />
</div> </div>
<!--金币总数 --> <!--金币总数 -->
<div class="field"> <div class="field">
<div class="field-label">金币总数</div> <div class="field-label">金币总数</div>
<el-input v-model="addConsume.sumGold" disabled/>
<el-input v-model="addConsume.sumGold" disabled />
</div> </div>
<!-- 金币详细信息（同一行左右排列） --> <!-- 金币详细信息（同一行左右排列） -->
<el-row :gutter="20" class="coins-row"> <el-row :gutter="20" class="coins-row">
<el-col :span="8"> <el-col :span="8">
<div class="field"> <div class="field">
<div class="field-label">永久金币</div> <div class="field-label">永久金币</div>
<el-input v-model="addConsume.permanentGold" disabled/>
<el-input v-model="addConsume.permanentGold" disabled />
</div> </div>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<div class="field"> <div class="field">
<div class="field-label">免费金币</div> <div class="field-label">免费金币</div>
<el-input v-model="addConsume.freeGold" disabled/>
<el-input v-model="addConsume.freeGold" disabled />
</div> </div>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<div class="field"> <div class="field">
<div class="field-label">任务金币</div> <div class="field-label">任务金币</div>
<el-input v-model="addConsume.taskGold" disabled/>
<el-input v-model="addConsume.taskGold" disabled />
</div> </div>
</el-col> </el-col>
@ -698,7 +693,7 @@ onMounted(async function () {
<div class="field"> <div class="field">
<div class="field-label">备注</div> <div class="field-label">备注</div>
<el-input v-model="addConsume.remark" disabled/>
<el-input v-model="addConsume.remark" disabled />
</div> </div>
</div> </div>
@ -719,36 +714,36 @@ onMounted(async function () {
<!-- 用户信息 --> <!-- 用户信息 -->
<div> <div>
<div class="field-label">用户信息</div> <div class="field-label">用户信息</div>
<el-input :model-value="user.jwcode + (user.name ? '【' + user.name + '】' : '')" disabled/>
<el-input :model-value="user.jwcode + (user.name ? '【' + user.name + '】' : '')" disabled />
</div> </div>
<!-- 活动名称 --> <!-- 活动名称 -->
<div class="field"> <div class="field">
<div class="field-label">商品名称</div> <div class="field-label">商品名称</div>
<el-input v-model="addConsume.goodsName.value" disabled/>
<el-input v-model="addConsume.goodsName.value" disabled />
</div> </div>
<!--金币总数 --> <!--金币总数 -->
<div class="field"> <div class="field">
<div class="field-label">金币总数</div> <div class="field-label">金币总数</div>
<el-input v-model="addConsume.sumGold" disabled/>
<el-input v-model="addConsume.sumGold" disabled />
</div> </div>
<!-- 金币详细信息（同一行左右排列） --> <!-- 金币详细信息（同一行左右排列） -->
<el-row :gutter="20" class="coins-row"> <el-row :gutter="20" class="coins-row">
<el-col :span="8"> <el-col :span="8">
<div class="field"> <div class="field">
<div class="field-label">永久金币</div> <div class="field-label">永久金币</div>
<el-input v-model="addConsume.permanentGold" disabled/>
<el-input v-model="addConsume.permanentGold" disabled />
</div> </div>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<div class="field"> <div class="field">
<div class="field-label">免费金币</div> <div class="field-label">免费金币</div>
<el-input v-model="addConsume.freeGold" disabled/>
<el-input v-model="addConsume.freeGold" disabled />
</div> </div>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<div class="field"> <div class="field">
<div class="field-label">任务金币</div> <div class="field-label">任务金币</div>
<el-input v-model="addConsume.taskGold" disabled/>
<el-input v-model="addConsume.taskGold" disabled />
</div> </div>
</el-col> </el-col>
@ -756,13 +751,13 @@ onMounted(async function () {
<!-- 风险提示 --> <!-- 风险提示 -->
<div style="display: flex; align-items: center; margin-top: 20px;"> <div style="display: flex; align-items: center; margin-top: 20px;">
<el-icon :size="24" color="#FFD700"> <el-icon :size="24" color="#FFD700">
<WarnTriangleFilled/>
<WarnTriangleFilled />
</el-icon> </el-icon>
<p>重复购买风险提示</p> <p>重复购买风险提示</p>
</div> </div>
<!-- 记录 + 虚线分隔 --> <!-- 记录 + 虚线分隔 -->
<div> <div>
<el-divider border-style="dashed"/>
<el-divider border-style="dashed" />
<p>检测到该用户近期有相似消费记录：</p> <p>检测到该用户近期有相似消费记录：</p>
· {{ ReadCookiesTime }} 购买 【{{ addConsume.goodsName.value }}】(操作人: {{ adminData.adminName }}) · {{ ReadCookiesTime }} 购买 【{{ addConsume.goodsName.value }}】(操作人: {{ adminData.adminName }})
</div> </div>
@ -787,7 +782,6 @@ onMounted(async function () {
<style scoped lang="scss"> <style scoped lang="scss">
p { p {
margin: 0px; margin: 0px;
} }
@ -845,15 +839,13 @@ p {
.left { .left {
width: 500px; width: 500px;
float: left; float: left;
align-items: center;
display: flex; display: flex;
align-items: center;
} }
.right { .right {
flex: 1; flex: 1;
height: 50vh;
display: flex; display: flex;
justify-content: center;
align-items: center; align-items: center;
.customer-info { .customer-info {

8
src/views/consume/gold/coinConsume.vue
View File

@ -83,13 +83,13 @@ onMounted(() => {
</script> </script>
<style lang="scss"> <style lang="scss">
.fatherTop { .fatherTop {
width: 100%;
height: 6%;
width: 80vw;
height: 4vh;
float: left; float: left;
} }
.fatherBottom { .fatherBottom {
width: 100%;
height: 90%;
width: 80vw;
height: 85vh;
} }
</style> </style>

76
src/views/consume/gold/coinConsumeDetail.vue
View File

@ -562,77 +562,59 @@ const getMarket = async function () {
</script> </script>
<template> <template>
<el-card style="margin-bottom: 10px;height: 15%;">
<el-row style="margin-bottom: 10px">
<el-col :span="5">
<div class="head-card-element">
<el-text class="mx-1">精网号：</el-text>
<el-input v-model="consumeUser.jwcode" placeholder="请输入精网号" style="width: 150px" clearable />
</div>
</el-col>
<el-col :span="5">
<div class="head-card-element">
<el-text class="mx-1" size="large">商品名称：</el-text>
<el-select v-model="consumeUser.goodsName" placeholder="请选择商品名称" style="width: 180px" clearable filterable >
<!-- 修改 v-for 绑定逻辑 -->
<el-option v-for="(item, index) in goods" :key="index" :label="item.label " :value="item" />
<el-card style="margin-bottom: 0.5vh;">
<div style="width:82vw;margin-bottom: 1vh;">
<el-text>精网号：</el-text>
<el-input v-model="consumeUser.jwcode" placeholder="请输入精网号" style="width: 10vw;margin-right: 1vw;" clearable />
<el-text size="large">商品名称：</el-text>
<el-select v-model="consumeUser.goodsName" placeholder="请选择商品名称" style="width: 10vw;margin-right: 1vw;" clearable
filterable>
<el-option v-for="(item, index) in goods" :key="index" :label="item.label" :value="item" />
</el-select> </el-select>
</div>
</el-col>
<el-col :span="5">
<el-text class="mx-1" size="large">所属地区：</el-text>
<el-text size="large">所属地区：</el-text>
<el-cascader v-model="selectedMarketPath" :options="market" placeholder="请选择所属地区" clearable <el-cascader v-model="selectedMarketPath" :options="market" placeholder="请选择所属地区" clearable
style="width:180px" @change="handleMarketChange" />
</el-col>
<el-col :span="5">
<div class="head-card-element">
<el-text class="mx-1" size="large">消耗平台：</el-text>
<el-select v-model="consumeUser.payPlatform" placeholder="请选择消耗平台" style="width: 180px" clearable>
style="width: 10vw;margin-right: 1vw;" @change="handleMarketChange" />
<el-text size="large">消耗平台：</el-text>
<el-select v-model="consumeUser.payPlatform" placeholder="请选择消耗平台" style="width: 10vw;margin-right: 1vw;"
clearable>
<el-option v-for="item in consumePlatform" :key="item.id" :label="item.label" :value="item.value" /> <el-option v-for="item in consumePlatform" :key="item.id" :label="item.label" :value="item.value" />
</el-select> </el-select>
</div>
</el-col>
<el-col :span="3">
<div class="head-card-element">
<el-checkbox v-model="showEmployeeData" @change="search()">员工数据</el-checkbox> <el-checkbox v-model="showEmployeeData" @change="search()">员工数据</el-checkbox>
</div> </div>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="head-card-element">
<el-text class="mx-1" size="large">消耗时间：</el-text>
<div>
<el-text size="large">消耗时间：</el-text>
<el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间" <el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间"
end-placeholder="结束时间" style="width: 400px" @change="handleDatePickerChange" :default-time="defaultTime"
end-placeholder="结束时间" style="width: 20vw" @change="handleDatePickerChange" :default-time="defaultTime"
:disabled-date="disabledDate" /> :disabled-date="disabledDate" />
<el-button @click="getToday()" style="margin-left: 10px"
:type="activeTimeRange === 'today' ? 'primary' : ''"> 今
<el-button @click="getToday()" style="margin-left: 1vw" :type="activeTimeRange === 'today' ? 'primary' : ''">
今
</el-button> </el-button>
<el-button @click="getYesterday()" style="margin-left: 10px"
<el-button @click="getYesterday()" style="margin-left: 1vw"
:type="activeTimeRange === 'yesterday' ? 'primary' : ''"> 昨 :type="activeTimeRange === 'yesterday' ? 'primary' : ''"> 昨
</el-button> </el-button>
<el-button @click="get7Days()" style="margin-left: 10px"
:type="activeTimeRange === '7days' ? 'primary' : ''"> 近7天
<el-button @click="get7Days()" style="margin-left: 1vw" :type="activeTimeRange === '7days' ? 'primary' : ''">
近7天
</el-button> </el-button>
<el-button type="success" @click="reset()">重置</el-button> <el-button type="success" @click="reset()">重置</el-button>
<el-button type="primary" @click="search()">查询</el-button> <el-button type="primary" @click="search()">查询</el-button>
<el-button type="primary" @click="exportExcel()">导出excel</el-button> <el-button type="primary" @click="exportExcel()">导出excel</el-button>
<el-button type="primary" @click="openExportList">查看导出列表</el-button> <el-button type="primary" @click="openExportList">查看导出列表</el-button>
</div> </div>
</el-col>
</el-row>
</el-card> </el-card>
<el-card> <el-card>
<div> <div>
消耗新币：{{ format3(Math.abs(permanentGolds)) }}新币&nbsp;&nbsp;&nbsp;&nbsp; 消耗新币：{{ format3(Math.abs(permanentGolds)) }}新币&nbsp;&nbsp;&nbsp;&nbsp;
总金币数：{{ format3(Math.abs(permanentGolds+freeGolds+taskGolds)) }}&nbsp;&nbsp;&nbsp;&nbsp;
总金币数：{{ format3(Math.abs(permanentGolds + freeGolds + taskGolds)) }}&nbsp;&nbsp;&nbsp;&nbsp;
永久金币：{{ format3(Math.abs(permanentGolds)) }}&nbsp;&nbsp;&nbsp;&nbsp; 永久金币：{{ format3(Math.abs(permanentGolds)) }}&nbsp;&nbsp;&nbsp;&nbsp;
免费金币：{{ format3(Math.abs(freeGolds)) }}&nbsp;&nbsp;&nbsp;&nbsp; 免费金币：{{ format3(Math.abs(freeGolds)) }}&nbsp;&nbsp;&nbsp;&nbsp;
任务金币：{{ format3(Math.abs(taskGolds)) }} 任务金币：{{ format3(Math.abs(taskGolds)) }}
</div> </div>
<!-- 设置表格容器的高度和滚动样式 -->
<div style="height: 540px; overflow-y: auto">
<el-table :data="tableData" style="width: 100%;height: 100%" @sort-change="handleSortChange">
<div style="height: 55vh;">
<el-table :data="tableData" style="height: 95%" @sort-change="handleSortChange">
<el-table-column type="index" label="序号" width="80px" fixed="left"> <el-table-column type="index" label="序号" width="80px" fixed="left">
<template #default="scope"> <template #default="scope">
<span>{{ <span>{{
@ -743,6 +725,6 @@ const getMarket = async function () {
.pagination { .pagination {
display: flex; display: flex;
margin-top: 20px;
margin-top: 1vh;
} }
</style> </style>

14
src/views/recharge/bean/addBeanRecharge.vue
View File

@ -187,7 +187,6 @@ const handleAddForm = async () => {
} }
</script> </script>
<template> <template>
<div>
<div class="userAndform"> <div class="userAndform">
<div class="left"> <div class="left">
<el-form :model="addForm" :rules="rules" ref="formRef" label-width="auto" style="max-width: 600px" <el-form :model="addForm" :rules="rules" ref="formRef" label-width="auto" style="max-width: 600px"
@ -207,14 +206,16 @@ const handleAddForm = async () => {
type="textarea" /> type="textarea" />
</el-form-item> </el-form-item>
<el-button @click="deleteAddForm" style="margin-left: 8.5vw;margin-top:1vw" type="success">重置</el-button> <el-button @click="deleteAddForm" style="margin-left: 8.5vw;margin-top:1vw" type="success">重置</el-button>
<el-button type="primary" :disabled="addDisabled" @click="handleAddForm" style="margin-top:1vw"> 提交 </el-button>
<el-button type="primary" :disabled="addDisabled" @click="handleAddForm" style="margin-top:1vw"> 提交
</el-button>
</el-form> </el-form>
</div> </div>
<div class="right">
<!-- 客户信息栏 --> <!-- 客户信息栏 -->
<div class="right">
<el-card v-if="user.jwcode" class="customer-info"> <el-card v-if="user.jwcode" class="customer-info">
<el-form :model="user" label-width="auto" style="min-width: 600px" label-position="left">
<el-text size="large" style="margin-left: 2vw">客户信息</el-text>
<el-form :model="user" label-width="auto" label-position="left">
<el-text size="large" style="margin-left: 7vw">客户信息</el-text>
<!-- 第一行：姓名 + 当前付费金豆 --> <!-- 第一行：姓名 + 当前付费金豆 -->
<div style="margin-top: 0.5vw;display:flex;"> <div style="margin-top: 0.5vw;display:flex;">
<p style="width:6vw;">姓名:</p> <p style="width:6vw;">姓名:</p>
@ -245,7 +246,6 @@ const handleAddForm = async () => {
</el-card> </el-card>
</div> </div>
</div> </div>
</div>
</template> </template>
<style scoped> <style scoped>
.userAndform { .userAndform {
@ -270,7 +270,7 @@ const handleAddForm = async () => {
float: left; float: left;
.customer-info { .customer-info {
width: 35vw;
width: 30vw;
height: 28vh; height: 28vh;
margin-top: 5vh; margin-top: 5vh;
display: flex; display: flex;

3
src/views/recharge/gold/addCoinRecharge.vue
View File

@ -793,7 +793,6 @@ onMounted(() => {
</div> </div>
<el-dialog v-model="FirstRechargeDialogVisible" title="操作确认" <el-dialog v-model="FirstRechargeDialogVisible" title="操作确认"
:before-close="FirstRechargeDialogVisiblehandleClose" :before-close="FirstRechargeDialogVisiblehandleClose"
:close-on-click-modal="false" width="400px"> :close-on-click-modal="false" width="400px">
@ -842,7 +841,6 @@ onMounted(() => {
</template> </template>
</el-dialog> </el-dialog>
<el-dialog v-model="RechargeDialogVisible" title="操作确认" :before-close="RechargeDialogVisiblehandleClose" <el-dialog v-model="RechargeDialogVisible" title="操作确认" :before-close="RechargeDialogVisiblehandleClose"
:close-on-click-modal="false" width="480px"> :close-on-click-modal="false" width="480px">
<!-- 内容整体居中且收窄 --> <!-- 内容整体居中且收窄 -->
@ -901,7 +899,6 @@ onMounted(() => {
</template> </template>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>

35
src/views/recharge/gold/coinRecharge.vue
View File

@ -1,39 +1,30 @@
<template> <template>
<div>
<!-- 这里放置标签切换的按钮 -->
<div style="height:4vh;">
<el-button-group> <el-button-group>
<!-- 切换后状态显示 primary 样式否则是默认样式 -->
<el-button
:type="activeTab === 'addCoinRecharge' ? 'primary' : 'default'"
@click="navigateTo('addCoinRecharge')"
:disabled="!hasAdd"
>
<el-button :type="activeTab === 'addCoinRecharge' ? 'primary' : 'default'" @click="navigateTo('addCoinRecharge')"
:disabled="!hasAdd">
新增充值 新增充值
</el-button> </el-button>
<el-button
:type="activeTab === 'coinRechargeDetail' ? 'primary' : 'default'"
@click="navigateTo('coinRechargeDetail')"
:disabled="!hasDetail"
>
<el-button :type="activeTab === 'coinRechargeDetail' ? 'primary' : 'default'"
@click="navigateTo('coinRechargeDetail')" :disabled="!hasDetail">
金币充值明细 金币充值明细
</el-button> </el-button>
</el-button-group> </el-button-group>
<!-- 渲染子路由组件 -->
<router-view></router-view>
</div> </div>
<router-view></router-view>
</template> </template>
<script setup> <script setup>
import {onMounted, ref, watch} from 'vue';
import {useRoute, useRouter} from 'vue-router';
import {storeToRefs} from "pinia";
import {useAdminStore} from "@/store/index.js";
import {hasMenuPermission, permissionMapping} from "@/utils/menuTreePermission.js";
import { onMounted, ref, watch } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { storeToRefs } from "pinia";
import { useAdminStore } from "@/store/index.js";
import { hasMenuPermission, permissionMapping } from "@/utils/menuTreePermission.js";
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const adminStore = useAdminStore(); const adminStore = useAdminStore();
const {menuTree} = storeToRefs(adminStore);
const { menuTree } = storeToRefs(adminStore);
const activeTab = ref(''); const activeTab = ref('');
const hasAdd = ref(false); const hasAdd = ref(false);
@ -41,7 +32,7 @@ const hasDetail = ref(false);
// 导航方法 // 导航方法
const navigateTo = (name) => { const navigateTo = (name) => {
activeTab.value = name; activeTab.value = name;
router.push({name});
router.push({ name });
}; };

111
src/views/recharge/gold/coinRechargeDetail.vue
View File

@ -370,9 +370,9 @@ const get = async function (val) {
tableData.value = tableData.value.map(item => ({ tableData.value = tableData.value.map(item => ({
...item, ...item,
// 处理永久金币 // 处理永久金币
permanentGold: (Number(item.permanentGold) || 0) ,
permanentGold: (Number(item.permanentGold) || 0),
// 处理免费金币 // 处理免费金币
freeGold: (Number(item.freeGold) || 0) ,
freeGold: (Number(item.freeGold) || 0),
// 处理充值金额 // 处理充值金额
money: (Number(item.money) || 0) money: (Number(item.money) || 0)
})) }))
@ -586,83 +586,58 @@ const getTagText = (state) => {
</script> </script>
<template> <template>
<el-row>
<el-col>
<el-card style="margin-bottom: 20px;margin-top: 10px">
<el-row style="margin-bottom: 10px">
<el-col :span="5">
<div class="head-card-element">
<el-text class="mx-1" size="large">精网号：</el-text>
<el-input v-model="rechargeUser.jwcode" placeholder="请输入精网号" style="width: 150px" clearable />
</div>
</el-col>
<el-col :span="5">
<div class="head-card-element">
<el-text class="mx-1" size="large">活动名称：</el-text>
<el-select v-model="rechargeUser.activity" placeholder="请选择活动名称" style="width: 180px" clearable>
<el-card style="margin-bottom: 0.5vh">
<div style="margin-bottom: 0.5vh;">
<el-text size="large">精网号：</el-text>
<el-input v-model="rechargeUser.jwcode" placeholder="请输入精网号" style="width: 10vw;margin-right: 1vw;" clearable />
<el-text size="large">活动名称：</el-text>
<el-select v-model="rechargeUser.activity" placeholder="请选择活动名称" style="width: 10vw;margin-right: 1vw;" clearable>
<el-option v-for="item in activity" :key="item.value" :label="item.label" :value="item.value" /> <el-option v-for="item in activity" :key="item.value" :label="item.label" :value="item.value" />
</el-select> </el-select>
</div>
</el-col>
<el-col :span="5">
<div class="head-card-element">
<el-text class="mx-1" size="large">所属地区：</el-text>
<el-cascader v-model="selectedMarketPath" :options="market" placeholder="请选择所属地区" clearable
style="width:180px" @change="handleMarketChange" />
</div>
</el-col>
<el-col :span="5">
<div class="head-card-element">
<el-text class="mx-1" size="large">充值平台：</el-text>
<el-select v-model="rechargeUser.payPlatform" placeholder="请选择充值平台" style="width: 180px" clearable>
<el-text size="large">所属地区：</el-text>
<el-cascader v-model="selectedMarketPath" :options="market" placeholder="请选择所属地区" clearable style="width: 10vw;margin-right: 1vw;"
@change="handleMarketChange" />
<el-text size="large">充值平台：</el-text>
<el-select v-model="rechargeUser.payPlatform" placeholder="请选择充值平台" style="width: 10vw;margin-right: 1vw;" clearable>
<el-option v-for="item in platform" :key="item.value" :label="item.label" :value="item.value" /> <el-option v-for="item in platform" :key="item.value" :label="item.label" :value="item.value" />
</el-select> </el-select>
</div>
</el-col>
<el-col :span="3">
<div class="head-card-element">
<el-checkbox v-model="showEmployeeData" @change="search()">员工数据</el-checkbox> <el-checkbox v-model="showEmployeeData" @change="search()">员工数据</el-checkbox>
</div> </div>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="head-card-element">
<el-text class="mx-1" size="large">充值时间：</el-text>
<div>
<el-text size="large">充值时间：</el-text>
<el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间" <el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间"
end-placeholder="结束时间" style="width: 400px" @change="handleDatePickerChange"
:default-time="defaultTime" :disabled-date="disabledDate"/>
<el-button @click="getToday()" style="margin-left: 10px"
:type="activeTimeRange === 'today' ? 'primary' : ''"> 今
end-placeholder="结束时间" style="width: 20vw" @change="handleDatePickerChange" :default-time="defaultTime"
:disabled-date="disabledDate" />
<el-button @click="getToday()" style="margin-left: 1vw" :type="activeTimeRange === 'today' ? 'primary' : ''">
今
</el-button> </el-button>
<el-button @click="getYesterday()" style="margin-left: 10px"
<el-button @click="getYesterday()" style="margin-left: 1vw"
:type="activeTimeRange === 'yesterday' ? 'primary' : ''"> 昨 :type="activeTimeRange === 'yesterday' ? 'primary' : ''"> 昨
</el-button> </el-button>
<el-button @click="get7Days()" style="margin-left: 10px"
:type="activeTimeRange === '7days' ? 'primary' : ''"> 近7天
<el-button @click="get7Days()" style="margin-left: 1vw" :type="activeTimeRange === '7days' ? 'primary' : ''">
近7天
</el-button> </el-button>
<el-button type="success" @click="reset()">重置</el-button> <el-button type="success" @click="reset()">重置</el-button>
<el-button type="primary" @click="search()">查询</el-button> <el-button type="primary" @click="search()">查询</el-button>
<el-button type="primary" @click="exportExcel()">导出Excel</el-button> <el-button type="primary" @click="exportExcel()">导出Excel</el-button>
<el-button type="primary" @click="openExportList">查看导出列表</el-button> <el-button type="primary" @click="openExportList">查看导出列表</el-button>
</div> </div>
</el-col>
</el-row>
</el-card> </el-card>
</el-col>
</el-row>
<el-row>
<el-col>
<el-card> <el-card>
<div> <div>
充值新币：{{ format3(permanentGolds) }}新币&nbsp;&nbsp;&nbsp;&nbsp; 充值新币：{{ format3(permanentGolds) }}新币&nbsp;&nbsp;&nbsp;&nbsp;
总金币数：{{ format3(permanentGolds+freeGolds) }}金币&nbsp;&nbsp;&nbsp;&nbsp;
总金币数：{{ format3(permanentGolds + freeGolds) }}金币&nbsp;&nbsp;&nbsp;&nbsp;
永久金币：{{ format3(permanentGolds) }}金币&nbsp;&nbsp;&nbsp;&nbsp; 永久金币：{{ format3(permanentGolds) }}金币&nbsp;&nbsp;&nbsp;&nbsp;
免费金币：{{ format3(freeGolds ) }}金币
免费金币：{{ format3(freeGolds) }}金币
</div> </div>
<!-- 设置表格容器的高度和滚动样式 --> <!-- 设置表格容器的高度和滚动样式 -->
<div style="height: 520px; overflow-y: auto;margin-top: 10px;">
<el-table :data="tableData" style="width: 100%" height="520px" @sort-change="handleSortChange">
<div style="height: 60vh;">
<el-table :data="tableData" height="60vh" @sort-change="handleSortChange">
<el-table-column type="index" label="序号" width="80px" fixed="left"> <el-table-column type="index" label="序号" width="80px" fixed="left">
<template #default="scope"> <template #default="scope">
<span>{{ <span>{{
@ -691,14 +666,13 @@ const getTagText = (state) => {
</div> </div>
<!-- 分页 --> <!-- 分页 -->
<div class="pagination" style="margin-top: 20px">
<div style="margin-top: 1vh">
<el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]" <el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange" layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange"
@current-change="handleCurrentChange"></el-pagination> @current-change="handleCurrentChange"></el-pagination>
</div> </div>
</el-card> </el-card>
</el-col>
</el-row>
<!-- 导出弹窗 --> <!-- 导出弹窗 -->
<el-dialog v-model="exportListVisible" title="导出列表" width="80%"> <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
<el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading"> <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
@ -732,23 +706,4 @@ const getTagText = (state) => {
</el-dialog> </el-dialog>
</template> </template>
<style scoped> <style scoped>
.pagination {
display: flex;
}
.status {
display: flex;
}
.head-card {
display: flex;
}
.head-card-element {
margin-right: 20px;
}
.head-card-btn {
margin-left: auto;
}
</style> </style>
Write Preview
Loading…
Cancel
Save