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

Merge branch 'refs/heads/lihui/feature-20250623144029-金币前端lihui' into milestone-20250623-金币前端

lihui/feature-20250623144029-金币前端lihui
lihui 6 days ago
parent
066e41fb05 03be57ca36
commit
fa25cb17df
3 changed files with 526 additions and 309 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 376
      src/views/consume/addCoinConsume.vue
  2. 3
      src/views/consume/coinConsumeDetail.vue

376
src/views/consume/addCoinConsume.vue
View File

@ -1,10 +1,10 @@
<script setup>
import { reactive, onMounted } from "vue";
import { ref, computed, watch } from "vue";
import { ElMessage } from "element-plus";
import { Plus } from "@element-plus/icons-vue";
import {reactive, onMounted} 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 {ElMessageBox} from "element-plus";
import moment from "moment";
import _ from "lodash";
@ -15,7 +15,8 @@ const trimJwCode = () => {
addConsume.value.jwcode = addConsume.value.jwcode.replace(/\s/g, '');
}
}
//这是获取用户信息的接口
//这是获取当前登录的用户信息的接口
const adminData = ref({});
const getAdminData = async function () {
try {//await 暂停函数执行，直到请求完成
@ -33,51 +34,189 @@ const getAdminData = async function () {
}
};
// 这是添加消费信息的表单
// 通过精网号查询用户（客户）信息
const user = ref({
name: "",
jwcode: 0,
market: "",
historySumGold: 0,
historyPermanentGold: 0,
historyFreeGold: 0,
historyTaskGold: 0,
rechargeNum: 0,
consumeNum: 0,
firstRecharge: "",
nowPermanentGold: 0,
nowFreeJune: null,
nowTaskGold: 0,
nowFreeDecember: null,
nowFreeGold: 0,
nowSumGold: 0
})
// 这是添加消费信息的表单（金币）
const addConsume = ref({
freeCoin: 0,
rechargeCoin: 0,
taskCoin: 0,
updateType: "1",
indexName:"", //这个是指标字段，后面绑定
jwcode:0, //精网号
goodsName: "",// 商品名称 // todo 之后会用3楼的接口
sumGold: 0, // 消费金币总数
freeGold: 0, // 免费金币
permanentGold: 0, // 永久金币
taskGold: 0, // 任务金币
remark: "",//备注
adminId: 0,// 当前管理员id
// updateType: "1", 根据字段,不用了
// indexName: "", //这个是指标字段，后面绑定 根据需求，不用了
});
// 这是添加消费信息的接口
// const add = async function () {
// try {
// // 处理数据，使用楼上接口后需要隐藏
//
// // addConsume.value.rechargeCoin = Number(addConsume.value.rechargeCoin * 100);
// // addConsume.value.freeCoin = Number(addConsume.value.freeCoin * 100);
// // addConsume.value.taskCoin = Number(addConsume.value.taskCoin * 100);
//
// addConsume.value.sumGold = Number(addConsume.value.sumGold);
// addConsume.value.freeGold = Number(addConsume.value.freeGold);
// addConsume.value.permanentGold = Number(addConsume.value.permanentGold);
// addConsume.value.taskGold = Number(addConsume.value.taskGold);
//
// // addConsume.value.productName = indexs.value.productName;
//
// // 发送POST请求
// const result = await request({
// url: "/consume/add",
// data: addConsume.value,
// });
// if (result.code === 0) {
// ElMessage.error(result.msg);
// return;
// } else {
// ElMessage.success("添加成功");
// }
// //重置表单
// addConsume.value = {};
// addConsume.value.adminId = adminData.value.adminId;
// addConsume.value.adminName = adminData.value.adminName;
// // addConsume.value.updateType = "1";
// addConsume.value.freeCoin = 0;
// addConsume.value.rechargeCoin = 0;
// addConsume.value.taskCoin = 0;
// indexs.value = {};
// console.log("请求成功", result);
// user.value = {};
// } catch (error) {
// console.log("请求失败", error);
// ElMessage.error("添加失败，请检查输入内容是否正确");
//
// // 在这里可以处理错误逻辑，比如显示错误提示等
// }
// };
// 这是添加消费信息的接口
const add = async function () {
try {
// 处理数据，使用楼上接口后需要隐藏
addConsume.value.rechargeCoin = Number(addConsume.value.rechargeCoin * 100);
addConsume.value.freeCoin = Number(addConsume.value.freeCoin * 100);
addConsume.value.taskCoin = Number(addConsume.value.taskCoin * 100);
addConsume.value.productName = indexs.value.productName;
// 验证输入数据
if (!validateInput()) {
return;
}
// 数据转换
formatConsumeData();
// 发送POST请求
const result = await request({
url: "/consume/add",
data: addConsume.value,
});
if (result.code === 0) {
ElMessage.error(result.msg);
return;
} else {
// 处理响应
handleResponse(result);
// 重置表单
resetForm();
} catch (error) {
console.error("请求失败", error);
ElMessage.error("添加失败，请检查网络连接或联系管理员");
}
};
// 输入验证函数
function validateInput() {
const { sumGold, freeGold, permanentGold, taskGold } = addConsume.value;
// 验证金币数值
if (sumGold <= 0) {
ElMessage.error("消费金币总数必须大于0");
return false;
}
// 验证金币总和
const totalAvailableGold = freeGold + permanentGold + taskGold;
if (sumGold > totalAvailableGold) {
ElMessage.error("消费金币总数超过可用金币总和");
return false;
}
return true;
}
// 数据格式化函数
function formatConsumeData() {
// 转换数值类型
addConsume.value.sumGold = Number(addConsume.value.sumGold);
addConsume.value.freeGold = Number(addConsume.value.freeGold);
addConsume.value.permanentGold = Number(addConsume.value.permanentGold);
addConsume.value.taskGold = Number(addConsume.value.taskGold);
// 计算金币使用情况
const { usedFreeGold, usedPermanentGold, usedTaskGold } =
calculateCoins(
addConsume.value.sumGold,
addConsume.value.freeGold,
addConsume.value.permanentGold,
addConsume.value.taskGold
);
// 更新使用的金币数量
addConsume.value.usedFreeGold = usedFreeGold;
addConsume.value.usedPermanentGold = usedPermanentGold;
addConsume.value.usedTaskGold = usedTaskGold;
}
// 响应处理函数
function handleResponse(result) {
if (result.code !== 0) {
ElMessage.success("添加成功");
console.log("请求成功", result);
} else {
ElMessage.error(result.msg || "添加失败，未知错误");
}
//重置表单
addConsume.value = {};
addConsume.value.adminId = adminData.value.adminId;
addConsume.value.adminName = adminData.value.adminName;
addConsume.value.updateType = "1";
addConsume.value.freeCoin = 0;
addConsume.value.rechargeCoin = 0;
addConsume.value.taskCoin = 0;
}
// 重置表单函数
function resetForm() {
addConsume.value = {
jwcode: 0,
goodsName: "",
sumGold: 0,
freeGold: 0,
permanentGold: 0,
taskGold: 0,
remark: "",
adminId: adminData.value.adminId,
adminName: adminData.value.adminName,
freeCoin: 0,
rechargeCoin: 0,
taskCoin: 0,
};
indexs.value = {};
console.log("请求成功", result);
user.value = {};
} catch (error) {
console.log("请求失败", error);
ElMessage.error("添加失败，请检查输入内容是否正确");
}
// 在这里可以处理错误逻辑，比如显示错误提示等
}
};
const addBefore = () => {
Ref.value.validate(async (valid) => {
if (valid) {
@ -119,17 +258,18 @@ const checkFreeGoldRadio = function (rule, value, callback) {
callback();
}
};
const rules = reactive({
jwcode: [{ required: true, message: "请输入精网号", trigger: "blur" }],
productName: [{ required: true, message: "请选择消费商品", trigger: "change" }], // 修改为 change
taskCoin: [{ required: true, message: "请输入任务金币", trigger: "blur" }],
freeCoin: [{ required: true, message: "请输入免费金币", trigger: "blur" }],
jwcode: [{required: true, message: "请输入精网号", trigger: "blur"}],
productName: [{required: true, message: "请选择消费商品", trigger: "change"}], // 修改为 change
taskCoin: [{required: true, message: "请输入任务金币", trigger: "blur"}],
freeCoin: [{required: true, message: "请输入免费金币", trigger: "blur"}],
rechargeCoin: [
{ required: true, message: "请输入免费金币", trigger: "blur" },
{required: true, message: "请输入免费金币", trigger: "blur"},
],
allGold: [
{ required: true, message: "消费金币总数不能为空", trigger: "blur" },
{ validator: checkFreeGoldRadio, trigger: "blur" },
{required: true, message: "消费金币总数不能为空", trigger: "blur"},
{validator: checkFreeGoldRadio, trigger: "blur"},
],
indexName: [
{
@ -158,18 +298,21 @@ const delteConsume = function () {
isHC.value = 0;
};
// 查找客户信息的方法
const user = ref({
firstRechargeTime: "",
});
// const user = ref({
// firstRechargeTime: "",
// });
// 查询客户信息（通过精网号）
const getUser = async function (jwcode) {
trimJwCode();
try {
// 发送POST请求
const result = await request({
url: "/recharge/user",
url: "user/selectUser",
data: {
// 只需要传精网号
jwcode: addConsume.value.jwcode,
area: adminData.value.area,
// area: adminData.value.area,
},
});
console.log("请求成功", result);
@ -177,10 +320,11 @@ const getUser = async function (jwcode) {
if (result.code === 0) {
ElMessage.error(result.msg);
} else {
user.value = result.data;
user.value.A =
/* user.value.A =
Number(user.value.pendingRechargeTimes) +
Number(user.value.pendingSpendTimes);
Number(user.value.pendingSpendTimes);*/
console.log("用户信息", user.value);
ElMessage.success(result.msg);
}
@ -192,7 +336,9 @@ const getUser = async function (jwcode) {
};
//下面这个也是校验精网号是否存在的方法，通过脱离文本框实现，但是上面方法绑定了信息面板，在输入正确的精网号后能显示。
// 为什么写两次?
/*//下面这个也是校验精网号是否存在的方法，通过脱离文本框实现，但是上面方法绑定了信息面板，在输入正确的精网号后能显示。
//这是查询用户金币信息的接口
const userGold = ref({});
const getUserGold = async function (jwcode) {
@ -200,7 +346,7 @@ const getUserGold = async function (jwcode) {
try {
// 发送POST请求
const result = await request({
url: "/recharge/user",
// url: "/recharge/user",
data: {
jwcode: addConsume.value.jwcode,
area: adminData.value.area,
@ -223,8 +369,50 @@ const getUserGold = async function (jwcode) {
addConsume.value.jwcode = "";
// 在这里可以处理错误逻辑，比如显示错误提示等
}
};
};*/
function calculateCoins(sumGold, nowFreeGold, nowPermanentGold, nowTaskGold) {
let remaining = sumGold;
let usedFreeGold = 0;
let usedPermanentGold = 0;
let usedTaskGold = 0;
// 优先消耗免费金币
if (remaining > 0) {
usedFreeGold = Math.min(remaining, nowFreeGold);
remaining -= usedFreeGold;
}
// 其次消耗永久金币
if (remaining > 0) {
usedPermanentGold = Math.min(remaining, nowPermanentGold);
remaining -= usedPermanentGold;
}
// 最后消耗任务金币
if (remaining > 0) {
usedTaskGold = Math.min(remaining, nowTaskGold);
remaining -= usedTaskGold;
}
// 返回使用情况和剩余金币数量
return {
usedFreeGold,
usedPermanentGold,
usedTaskGold,
remaining,
finalFreeGold: nowFreeGold - usedFreeGold,
finalPermanentGold: nowPermanentGold - usedPermanentGold,
finalTaskGold: nowTaskGold - usedTaskGold
};
}
// 先注释掉
/*
function calculateCoins() {
if (
(userGold.value.coreJb +
@ -276,6 +464,7 @@ function calculateCoins() {
console.log("计算结果", addConsume.value);
}
}
*/
// 查询商品的接口
const goods = ref([]);
@ -283,7 +472,7 @@ const getGoods = async function () {
try {
// 发送POST请求
const result = await request({
url: "/product",
// url: "/product", // todo 后续换3楼的
data: {},
});
// 将响应结果存储到响应式数据中
@ -298,11 +487,12 @@ const getGoods = async function () {
};
// 获取指标的方法
const index = ref([]);
const getIndexs = async function (type) {
// todo 根据需求，不需要指标
/*const getIndexs = async function (type) {
try {
// 发送POST请求
const result = await request({
url: "/product/index",
// url: "/product/index",
data: {
type: type,
},
@ -315,10 +505,11 @@ const getIndexs = async function (type) {
console.log("请求失败", error);
// 在这里可以处理错误逻辑，比如显示错误提示等
}
};
};*/
// 选择商品名称是时触发的方法
const isHC = ref(0);
// const handleProductSelect = (productName) => {
// // 根据商品名称获取对应的商品信息
// // indexs.value.productName = productName;为什么直接绑定？？？
@ -332,7 +523,9 @@ const isHC = ref(0);
// addConsume.value.indexName = "";
// }
// };
const indexs = ref([]);
// const handleIndexSelect = () => {
// if (isHC.value === 1 && addConsume.value.indexName) {
// addConsume.value.productName = "homilychart" + addConsume.value.indexName;
@ -359,6 +552,7 @@ const queryIndexSearch = (queryString, cb) => {
cb(results);
};
// todo 这里的 homilychart 对应问题 homilyChart
// 商品选择处理（重点修改）
const handleProductSelect = async (selectedItem) => {
const productName = typeof selectedItem === 'string'
@ -398,8 +592,6 @@ const handleIndexBlur = (e) => {
};
// 挂载
onMounted(async function () {
await getAdminData();
@ -425,7 +617,7 @@ const handleSelectBlur = (value) => {
<template>
<div>
<div>
<!-- 根据activeTab切换显示内容 -->
@ -441,21 +633,30 @@ const handleSelectBlur = (value) => {
style="max-width: 750px;"
class="form-style"
>
<!-- todo 添加错误提示-->
<el-form-item prop="jwcode" label="精网号">
<el-input
<!-- <el-input
v-model="addConsume.jwcode"
style="width: 220px"
@change="getUserGold(addConsume.jwcode)"
/>-->
<el-input
v-model="addConsume.jwcode"
style="width: 220px"
/>
<el-button
type="primary"
@click="getUser(addConsume.jwcode)"
style="margin-left: 20px"
>查询</el-button
>查询
</el-button
>
</el-form-item>
<div style="display: flex; align-items: center; gap: 20px;">
<el-form-item prop="productName" label="商品名称" style="flex: 1; margin-right: 0px">
<el-autocomplete
v-model="addConsume.productName"
:fetch-suggestions="queryProductSearch"
@ -496,14 +697,17 @@ const handleSelectBlur = (value) => {
<el-form-item label="指标" v-else style="flex:1;margin-left: -5px;">
<el-input disabled placeholder="无" style="width: 100px" />
</el-form-item> -->
</div>
<el-form-item prop="allGold" label="消费金币总数" >
</div>
<el-form-item prop="allGold" label="消费金币总数">
<el-input
v-model="addConsume.allGold"
style="width: 100px"
@change="calculateCoins()"
/>
</el-form-item>
<div style="display: flex; align-items: center">
<el-form-item prop="rechargeCoin" label="永久金币" style="float: left">
<el-input
@ -534,6 +738,7 @@ const handleSelectBlur = (value) => {
<p style="margin-right: 20px">个</p>
</el-form-item>
</div>
<el-form-item prop="remark" label="备注">
<el-input
v-model="addConsume.remark"
@ -544,6 +749,7 @@ const handleSelectBlur = (value) => {
type="textarea"
/>
</el-form-item>
<el-form-item prop="commitName" label="提交人">
<el-input
style="width: 300px"
@ -552,10 +758,14 @@ const handleSelectBlur = (value) => {
placeholder="提交人姓名"
/>
</el-form-item>
<el-button type="success" @click="delteConsume" style="margin-left: 280px">重置</el-button>
<el-button type="primary" @click="addBefore"> 提交 </el-button>
<el-button type="primary" @click="addBefore"> 提交</el-button>
</el-form>
<!-- todo 这里少客户信息栏的卸载 -->
<!-- 客户信息栏 -->
<el-card style="width: 850px; float: right" class="customer-info">
<el-form
@ -574,8 +784,9 @@ const handleSelectBlur = (value) => {
<el-col :span="14">
<el-form-item label="历史金币总数">
<!-- 检查 user.totalRechargeGold 是否为有效的数字 -->
<p v-if="!isNaN(Number(user.totalRechargeGold))">
{{ Number(user.totalRechargeGold / 100) }}
<p v-if="!isNaN(Number(user.historySumGold))">
<!-- {{ Number(user.historySumGold / 100) }}-->
{{ Number(user.historySumGold) }}
</p>
<!-- 如果不是有效的数字，显示默认值 -->
<p v-else></p>
@ -590,30 +801,29 @@ const handleSelectBlur = (value) => {
<el-form-item label="当前金币总数" style="width: 500px">
<span
style="color: #2fa1ff; margin-right: 5px"
v-if="user.buyJb !== undefined"
>{{
(user.buyJb + user.free6 + user.free12 + user.coreJb) / 100
}}</span
v-if="user.nowSumGold !== undefined"
>
{{ user.nowSumGold }}</span
>
<span
style="display: inline; white-space: nowrap; color: #b1b1b1"
v-if="user.buyJb !== undefined"
>(永久金币:{{ user.buyJb / 100 }};免费金币:{{
(user.free6 + user.free12) / 100
}};任务金币:{{ user.coreJb / 100 }})</span
>
v-if="user.nowSumGold !== undefined"
>(永久金币:{{ user.nowPermanentGold }};免费金币:{{
(user.nowFreeGold)
}};任务金币:{{ user.nowTaskGold }})</span>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="首次充值日期">
<p v-if="user.firstRechargeDate">
{{ moment(user.firstRechargeDate).format("YYYY-MM-DD HH:mm:ss") }}
<p v-if="user.firstRecharge">
{{ moment(user.firstRecharge).format("YYYY-MM-DD HH:mm:ss") }}
</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="充值次数">
<p style="color: #2fa1ff">{{ user.rechargeTimes }}</p>
<p style="color: #2fa1ff">{{ user.rechargeNum }}</p>
</el-form-item>
</el-col>
<!-- <el-col :span="10">
@ -623,12 +833,12 @@ const handleSelectBlur = (value) => {
</el-col> -->
<el-col :span="10">
<el-form-item label="消费次数">
<p style="color: #2fa1ff">{{ user.spendTimes }}</p>
<p style="color: #2fa1ff">{{ user.consumeNum }}</p>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="所属门店">
<p>{{ adminData.area }}</p>
<p>{{ user.market }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
@ -641,15 +851,19 @@ const handleSelectBlur = (value) => {
</el-row>
</el-form>
</el-card>
</div>
<!-- 金币消耗明细的布局------------------------------------------------------- -->
<!-- <div v-else-if="activeTab === 'detail'"> -->
<!-- </div>
</div> -->
</template>
<style scoped>
p {
margin: 0px;

3
src/views/consume/coinConsumeDetail.vue
View File

@ -46,6 +46,7 @@ const area = ref([])
const activeName = ref('all')
// 消费平台选项
// todo 死数据吗？
const consumePlatform = [
{
value: '4',
@ -104,6 +105,7 @@ const get = async function (val) {
console.log('搜索参数', getObj.value)
// 发送POST请求
const result = await request({
// todo redis 寄了?
url: '/consume/select',
data: {
...getObj.value,
@ -304,6 +306,7 @@ const getArea = async function () {
try {
// 发送请求获取地区列表
const result = await request({
// todo 接口不对
url: '/area/list',
data: {}
})

Write Preview
Loading…
Cancel
Save