|
|
@ -1,15 +1,18 @@ |
|
|
|
<script setup> |
|
|
|
import { reactive } from "vue"; |
|
|
|
import { ref, computed, watch } from "vue"; |
|
|
|
import { ref, onMounted, reactive, computed, watch, nextTick, h } 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"; |
|
|
|
import moment from "moment"; |
|
|
|
import { range, re } from "mathjs"; |
|
|
|
import { _debounce } from '../../util/index.js'; |
|
|
|
import * as xlsx from 'xlsx'; |
|
|
|
|
|
|
|
// 这是添加上传图片的接口 |
|
|
|
const imageUrl = ref(""); |
|
|
|
const rechargeVoucher = ref(""); |
|
|
|
const Rate = ref(); |
|
|
|
const adminData = ref({}); |
|
|
|
const getAdminData = async function () { |
|
|
@ -297,8 +300,57 @@ const deleteRecharge = function () { |
|
|
|
}; |
|
|
|
|
|
|
|
// 批量充值 |
|
|
|
// jwcode列表 |
|
|
|
const jwcodeList = ref([]); |
|
|
|
// jwcode下拉框懒加载变量 |
|
|
|
const rangeNumber = ref(10); |
|
|
|
// 获取jwcode列表 |
|
|
|
const getJwcodeList = async function () { |
|
|
|
try { |
|
|
|
// 发送POST请求 |
|
|
|
const result = await API.post( |
|
|
|
"http://192.168.8.93:10010/recharge/user/jwcode", |
|
|
|
{} |
|
|
|
); |
|
|
|
|
|
|
|
// 将响应结果存储到响应式数据中 |
|
|
|
console.log("请求成功", result); |
|
|
|
// 存储表格数据 |
|
|
|
jwcodeList.value = result.data; |
|
|
|
jwcodeList.value = jwcodeList.value.map(item => ({ value: item, label: item })) |
|
|
|
console.log("精网号", jwcodeList.value); |
|
|
|
} catch (error) { |
|
|
|
console.log("请求失败", error); |
|
|
|
// 在这里可以处理错误逻辑,比如显示错误提示等 |
|
|
|
} |
|
|
|
}; |
|
|
|
// 滚动到底部加载更多数据 |
|
|
|
const loadMore = (n) => { |
|
|
|
return () => { |
|
|
|
rangeNumber.value += 5; |
|
|
|
}; |
|
|
|
}; |
|
|
|
// 筛选方法 |
|
|
|
const filterMethod = _debounce(function (filterVal) { |
|
|
|
if (filterVal) { |
|
|
|
const filterArr = jwcodeList.value.fliter((item) => |
|
|
|
item.toLowerCase().includes(filterVal.toLowerCase()) |
|
|
|
); |
|
|
|
options.value = filterArr; |
|
|
|
} else { |
|
|
|
options.value = jwcodeList.value; |
|
|
|
} |
|
|
|
}, 500); |
|
|
|
// 下拉框出现时调用过滤方法 |
|
|
|
const visibleChange = function (flag) { |
|
|
|
if (flag) { |
|
|
|
filterMethod(); |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
// 批量充值弹窗 |
|
|
|
const batchRechargeVisible = ref(false); |
|
|
|
const jwcodeSelectRef = ref(null); |
|
|
|
const i = ref(1); |
|
|
|
const delObj = ref({}); |
|
|
|
const batchDelObj = ref([]); |
|
|
@ -323,20 +375,109 @@ const closeBatchRechargeVisible = function () { |
|
|
|
const batchInit = function () { |
|
|
|
openBatchRechargeVisible(); |
|
|
|
}; |
|
|
|
// |
|
|
|
|
|
|
|
// 提取添加滚动监听的逻辑到单独函数 |
|
|
|
const addScrollListener = () => { |
|
|
|
const SELECTWRAP_DOM = document.querySelector(".el-select-dropdown .el-select-dropdown__wrap"); |
|
|
|
if (SELECTWRAP_DOM) { |
|
|
|
SELECTWRAP_DOM.addEventListener("scroll", function () { |
|
|
|
const condition = this.scrollHeight - this.scrollTop <= this.clientHeight; |
|
|
|
if (condition) binding.value(); |
|
|
|
}); |
|
|
|
} |
|
|
|
}; |
|
|
|
// 局部注册指令 |
|
|
|
const vJwcodeLoadmore = { |
|
|
|
mounted(el, binding) { |
|
|
|
nextTick(() => { |
|
|
|
console.log("el===", el, "binding===", binding); |
|
|
|
const SELECTWRAP_DOM = el.querySelector(".el-select-dropdown .el-select-dropdown__wrap"); |
|
|
|
console.log("SELECTWRAP_DOM===", SELECTWRAP_DOM); |
|
|
|
if (SELECTWRAP_DOM) { |
|
|
|
SELECTWRAP_DOM.addEventListener("scroll", function () { |
|
|
|
/** |
|
|
|
* scrollHeight 获取元素内容高度(只读) |
|
|
|
* scrollTop 获取或者设置元素的偏移值, |
|
|
|
* 常用于:计算滚动条的位置, 当一个元素的容器没有产生垂直方向的滚动条, 那它的scrollTop的值默认为0. |
|
|
|
* clientHeight 读取元素的可见高度(只读) |
|
|
|
* 如果元素滚动到底, 下面等式返回true, 没有则返回false: |
|
|
|
* ele.scrollHeight - ele.scrollTop === ele.clientHeight; |
|
|
|
*/ |
|
|
|
const condition = this.scrollHeight - this.scrollTop <= this.clientHeight; |
|
|
|
if (condition) binding.value(); |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
}; |
|
|
|
// 下拉框打开时调用添加滚动监听函数 |
|
|
|
// const jwcodeSelectScrollerListener = () => { |
|
|
|
// console.log(jwcodeSelectRef.value, 'jwcodeSelectRef.value') |
|
|
|
// if (jwcodeSelectRef.value) { |
|
|
|
// directives.loadmore(jwcodeSelectRef.value, loadMore(rangeNumber.value)); |
|
|
|
// } |
|
|
|
// }; |
|
|
|
// 添加行数对象 |
|
|
|
const addLineObj = ref(0); |
|
|
|
//添加一行 |
|
|
|
const addLine = function () { |
|
|
|
batchData.value.unshift({ |
|
|
|
line: ++i.value, |
|
|
|
showInput: true, |
|
|
|
}); |
|
|
|
}; |
|
|
|
// |
|
|
|
// 添加多行 |
|
|
|
const addLines = function () { |
|
|
|
try { |
|
|
|
for (let i = 0; i < addLineObj.value; i++) { |
|
|
|
addLine(); |
|
|
|
} |
|
|
|
ElMessage.success("添加成功"); |
|
|
|
} catch (error) { |
|
|
|
console.log("添加失败", error); |
|
|
|
ElMessage.error("添加失败"); |
|
|
|
} |
|
|
|
} |
|
|
|
// 导入excel按钮的ref |
|
|
|
const uploadRefMap = ref({}); |
|
|
|
// 获取excel数据 |
|
|
|
const excelList = ref([]); |
|
|
|
// 动态设置upload Ref |
|
|
|
const handleSetUploadRefMap = (el) => { |
|
|
|
if (el) { |
|
|
|
uploadRefMap.value[`Upload_Ref`] = el |
|
|
|
} |
|
|
|
} |
|
|
|
// 文件上传自定义 |
|
|
|
const httpExcelRequest = async (op) => { |
|
|
|
// 获取除文件之外的参数,具体根据实际业务需求来 |
|
|
|
console.log(op.data) |
|
|
|
// 获取上传的excel 并解析数据 |
|
|
|
let file = op.file |
|
|
|
let dataBinary = await readFile(file); |
|
|
|
let workBook = xlsx.read(dataBinary, { type: "binary", cellDates: true }) |
|
|
|
let workSheet = workBook.Sheets[workBook.SheetNames[0]] |
|
|
|
const excelData = xlsx.utils.sheet_to_json(workSheet, { header: 1 }) |
|
|
|
excelList.value = excelData |
|
|
|
console.log(excelData) |
|
|
|
} |
|
|
|
|
|
|
|
const readFile = (file) => { |
|
|
|
return new Promise((resolve) => { |
|
|
|
let reader = new FileReader() |
|
|
|
reader.readAsBinaryString(file) |
|
|
|
reader.onload = (ev) => { |
|
|
|
resolve(ev.target?.result) |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
//获取批量删除的数组 |
|
|
|
const handleSelectionChangebatch = function (val) { |
|
|
|
console.log("val===", val); |
|
|
|
batchDelObj.value = val; |
|
|
|
console.log("大傻春"); |
|
|
|
}; |
|
|
|
// |
|
|
|
//批量删除 |
|
|
|
const batchDel = function () { |
|
|
|
ElMessageBox.confirm("确认批量删除吗?", "批量删除", { |
|
|
|
confirmButtonText: "确定", |
|
|
@ -361,21 +502,23 @@ const batchDel = function () { |
|
|
|
}); |
|
|
|
}); |
|
|
|
}; |
|
|
|
// |
|
|
|
//单行删除初始化 |
|
|
|
const del = function (row) { |
|
|
|
console.log("row===", row); |
|
|
|
delObj.value.line = row.line; |
|
|
|
}; |
|
|
|
// 单行删除 |
|
|
|
const delConfirm = function () { |
|
|
|
batchData.value = batchData.value.filter( |
|
|
|
(item) => item.line != delObj.value.line |
|
|
|
); |
|
|
|
console.log("batchData===", batchData.value); |
|
|
|
}; |
|
|
|
// |
|
|
|
//单行重置初始化 |
|
|
|
const reset = function (row) { |
|
|
|
resetObj.value.line = row.line; |
|
|
|
}; |
|
|
|
// 单行重置 |
|
|
|
const resetConfirm = function () { |
|
|
|
for (let i = 0; i < batchData.value.length; i++) { |
|
|
|
if (batchData.value[i].line == resetObj.value.line) { |
|
|
@ -386,7 +529,7 @@ const resetConfirm = function () { |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
// |
|
|
|
//取消批量充值 |
|
|
|
const cancelBatch = function () { |
|
|
|
ElMessageBox.confirm("确认取消吗?此操作将不会保存任何数据。", "确认取消", { |
|
|
|
confirmButtonText: "确定", |
|
|
@ -408,7 +551,7 @@ const cancelBatch = function () { |
|
|
|
}); |
|
|
|
}); |
|
|
|
}; |
|
|
|
// |
|
|
|
//监听改变活动时的操作 |
|
|
|
const changeActivity = function (row) { |
|
|
|
console.log("row===", row); |
|
|
|
let ratio = 0; |
|
|
@ -429,7 +572,7 @@ const changeActivity = function (row) { |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
// |
|
|
|
//监听改变充值金币时的操作 |
|
|
|
const changePaidGold = function (row) { |
|
|
|
console.log("row===", row); |
|
|
|
let ratio = 0; |
|
|
@ -448,48 +591,53 @@ const changePaidGold = function (row) { |
|
|
|
row.freeGold = Math.ceil(Number(row.paidGold) / ratio); |
|
|
|
} |
|
|
|
} |
|
|
|
let rate = row.rate; |
|
|
|
if (rate == null || rate == "") { |
|
|
|
row.rechargeGold = 0; |
|
|
|
} else { |
|
|
|
if (row.paidGold == null || row.paidGold == "") { |
|
|
|
row.rechargeGold = 0; |
|
|
|
} else { |
|
|
|
row.rechargeGold = Math.ceil(Number(row.paidGold) * rate); |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
// |
|
|
|
const calculatedRowFreeGold = function (row) { |
|
|
|
// 监听改变币种时的操作 |
|
|
|
const changeRate = function (row) { |
|
|
|
console.log("row===", row); |
|
|
|
let ratio = 0; |
|
|
|
for (let i = 0; i < activity.value.length; i++) { |
|
|
|
if (activity.value[i].activityId == row.activityId) { |
|
|
|
ratio = activity.value[i].ratio; |
|
|
|
break; |
|
|
|
let rate = row.rate; |
|
|
|
if (rate == null || rate == "") { |
|
|
|
row.rechargeGold = 0; |
|
|
|
} else { |
|
|
|
if (row.paidGold == null || row.paidGold == "") { |
|
|
|
row.rechargeGold = 0; |
|
|
|
} else { |
|
|
|
row.rechargeGold = Math.ceil(Number(row.paidGold) * rate); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
for (let i = 0; i < batchData.value.length; i++) { |
|
|
|
if (batchData.value[i].line == row.line) { |
|
|
|
if (ratio == 0) { |
|
|
|
batchData.value[i].freeGold = 0; |
|
|
|
} else { |
|
|
|
const paidGold = Number(batchData.value[i].paidGold) || 0; |
|
|
|
batchData.value[i].freeGold = Math.ceil(paidGold / ratio); |
|
|
|
} |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
const calculatedRowRechargeGold = computed(() => { |
|
|
|
if (Rate.value != 0) { |
|
|
|
const paidGold = Number(addRecharge.value.paidGold) || 0; |
|
|
|
const rate = Number(Rate.value) || 1; // 避免乘以0 |
|
|
|
return Number(Math.ceil(paidGold * rate)); |
|
|
|
//监听改变凭证时的操作 |
|
|
|
const changeVoucher = function (row) { |
|
|
|
if ((imageUrl.value != "" && rechargeVoucher.value != "") || (imageUrl.value != null && rechargeVoucher.value != null)) { |
|
|
|
console.log("row===", row); |
|
|
|
row.imageUrl = imageUrl.value; |
|
|
|
row.rechargeVoucher = rechargeVoucher.value; |
|
|
|
console.log("row===", row); |
|
|
|
imageUrl.value = ""; |
|
|
|
rechargeVoucher.value = ""; |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
// watch(calculatedRowFreeGold, (newVal) => { |
|
|
|
// addRecharge.value.freeGold = Number(newVal); |
|
|
|
// }); |
|
|
|
} |
|
|
|
// 上传图片成功的回调函数 |
|
|
|
const handleBatchAvatarSuccess = (response, uploadFile) => { |
|
|
|
|
|
|
|
watch(calculatedRowRechargeGold, (newVal) => { |
|
|
|
addRecharge.value.rechargeGold = Number(newVal); |
|
|
|
}); |
|
|
|
// |
|
|
|
const batchAdd = function () { |
|
|
|
imageUrl.value = URL.createObjectURL(uploadFile.raw); |
|
|
|
console.log("图片上传成功", response, uploadFile); |
|
|
|
rechargeVoucher.value = `http://192.168.8.93:10010/upload/${response.data}`; |
|
|
|
console.log("图片名称", rechargeVoucher.value); |
|
|
|
}; |
|
|
|
//批量充值确认按钮 |
|
|
|
const batchAdd = async function () { |
|
|
|
console.log("batchData===", batchData.value); |
|
|
|
if (batchData.value.length == 0) { |
|
|
|
ElMessage({ |
|
|
@ -525,6 +673,13 @@ const batchAdd = function () { |
|
|
|
} |
|
|
|
console.log("batchData===", batchData.value); |
|
|
|
|
|
|
|
const result = await API.post("http://192.168.8.93:10010/recharge/recharge/addmore", { ...batchData.value }); |
|
|
|
|
|
|
|
if (result.code === 0) { |
|
|
|
ElMessage.error("添加失败"); |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
ElMessage({ |
|
|
|
type: "success", |
|
|
|
message: "添加成功!", |
|
|
@ -532,6 +687,81 @@ const batchAdd = function () { |
|
|
|
|
|
|
|
closeBatchRechargeVisible(); |
|
|
|
}; |
|
|
|
|
|
|
|
// 批量设置的对象 |
|
|
|
const batchSettingObj = ref({}); |
|
|
|
// 批量充值弹窗 |
|
|
|
const batchSettingVisible = ref(false); |
|
|
|
// 打开批量充值弹窗 |
|
|
|
const openBatchSettingVisible = function () { |
|
|
|
batchSettingVisible.value = true; |
|
|
|
}; |
|
|
|
// 关闭批量充值弹窗 |
|
|
|
const closeBatchSettingVisible = function () { |
|
|
|
batchSettingVisible.value = false; |
|
|
|
}; |
|
|
|
// 批量设置初始化 |
|
|
|
const batchSettingInit = function () { |
|
|
|
openBatchSettingVisible(); |
|
|
|
} |
|
|
|
// 上传图片成功的回调函数 |
|
|
|
const batchSettingHandleAvatarSuccess = (response, uploadFile) => { |
|
|
|
batchSettingObj.value.imageUrl = URL.createObjectURL(uploadFile.raw); |
|
|
|
console.log("图片上传成功", response, uploadFile); |
|
|
|
batchSettingObj.value.rechargeVoucher = `http://192.168.8.93:10010/upload/${response.data}`; |
|
|
|
console.log("图片名称", batchSettingObj.value.rechargeVoucher); |
|
|
|
}; |
|
|
|
// 批量设置取消按钮 |
|
|
|
const cancelBatchSetting = function () { |
|
|
|
batchSettingObj.value = {}; |
|
|
|
closeBatchSettingVisible(); |
|
|
|
} |
|
|
|
// 批量设置确认按钮 |
|
|
|
const batchSettingConfirm = function () { |
|
|
|
for (let i = 0; i < batchData.value.length; i++) { |
|
|
|
if (batchSettingObj.value.jwcode != "" && batchSettingObj.value.jwcode != null) { |
|
|
|
batchData.value[i].jwcode = batchSettingObj.value.jwcode; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.activityId != "" && batchSettingObj.value.activityId != null) { |
|
|
|
batchData.value[i].activityId = batchSettingObj.value.activityId; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.paidGold != "" && batchSettingObj.value.paidGold != null) { |
|
|
|
batchData.value[i].paidGold = batchSettingObj.value.paidGold; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.freeGold != "" && batchSettingObj.value.freeGold != null) { |
|
|
|
batchData.value[i].freeGold = batchSettingObj.value.freeGold; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.rate != "" && batchSettingObj.value.rate != null) { |
|
|
|
batchData.value[i].rate = batchSettingObj.value.rate; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.rechargeGold != "" && batchSettingObj.value.rechargeGold != null) { |
|
|
|
batchData.value[i].rechargeGold = batchSettingObj.value.rechargeGold; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.payWay != "" && batchSettingObj.value.payWay != null) { |
|
|
|
batchData.value[i].payWay = batchSettingObj.value.payWay; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.rechargeTime != "" && batchSettingObj.value.rechargeTime != null) { |
|
|
|
batchData.value[i].rechargeTime = batchSettingObj.value.rechargeTime; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.imageUrl != "" && batchSettingObj.value.imageUrl != null) { |
|
|
|
batchData.value[i].imageUrl = batchSettingObj.value.imageUrl; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.rechargeVoucher != "" && batchSettingObj.value.rechargeVoucher != null) { |
|
|
|
batchData.value[i].rechargeVoucher = batchSettingObj.value.rechargeVoucher; |
|
|
|
} |
|
|
|
if (batchSettingObj.value.remark != "" && batchSettingObj.value.remark != null) { |
|
|
|
batchData.value[i].remark = batchSettingObj.value.remark; |
|
|
|
} |
|
|
|
} |
|
|
|
batchSettingObj.value = {}; |
|
|
|
closeBatchSettingVisible(); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 挂载 |
|
|
|
onMounted(async function () { |
|
|
|
await getJwcodeList(); |
|
|
|
}); |
|
|
|
</script> |
|
|
|
|
|
|
|
<template> |
|
|
@ -540,36 +770,14 @@ const batchAdd = function () { |
|
|
|
<el-button type="primary" plain @click="batchInit()">批量充值</el-button> |
|
|
|
</div> |
|
|
|
|
|
|
|
<el-form |
|
|
|
:model="addRecharge" |
|
|
|
ref="Ref" |
|
|
|
:rules="rules" |
|
|
|
label-width="auto" |
|
|
|
style="max-width: 600px" |
|
|
|
class="add-form" |
|
|
|
> |
|
|
|
<el-form :model="addRecharge" ref="Ref" :rules="rules" label-width="auto" style="max-width: 600px" class="add-form"> |
|
|
|
<el-form-item prop="jwcode" label="精网号"> |
|
|
|
<el-input v-model="addRecharge.jwcode" style="width: 220px" /> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
@click="getUser(addRecharge.jwcode)" |
|
|
|
style="margin-left: 20px" |
|
|
|
>查询</el-button |
|
|
|
> |
|
|
|
<el-button type="primary" @click="getUser(addRecharge.jwcode)" style="margin-left: 20px">查询</el-button> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="activityId" label="活动名称"> |
|
|
|
<el-select |
|
|
|
v-model="addRecharge.activityId" |
|
|
|
placeholder="请选择" |
|
|
|
style="width: 300px" |
|
|
|
@change="handleActivityChange" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in activity" |
|
|
|
:key="item.value" |
|
|
|
:label="item.activityName" |
|
|
|
:value="item.activityId" |
|
|
|
/> |
|
|
|
<el-select v-model="addRecharge.activityId" placeholder="请选择" style="width: 300px" @change="handleActivityChange"> |
|
|
|
<el-option v-for="item in activity" :key="item.value" :label="item.activityName" :value="item.activityId" /> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="paidGold" label="充值金币"> |
|
|
@ -580,66 +788,24 @@ const batchAdd = function () { |
|
|
|
<p>个</p> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="rechargeGold" label="充值金额"> |
|
|
|
<el-select |
|
|
|
prop="rechargeGold" |
|
|
|
v-model="Rate" |
|
|
|
placeholder="货币名称" |
|
|
|
style="width: 95px; margin-right: 5px" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in currency" |
|
|
|
:key="item.value" |
|
|
|
:label="item.currency" |
|
|
|
:value="item.exchangeRate" |
|
|
|
/> |
|
|
|
<el-select prop="rechargeGold" v-model="Rate" placeholder="货币名称" style="width: 95px; margin-right: 5px"> |
|
|
|
<el-option v-for="item in currency" :key="item.value" :label="item.currency" :value="item.exchangeRate" /> |
|
|
|
</el-select> |
|
|
|
<el-input v-model="addRecharge.rechargeGold" style="width: 200px" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="payWay" label="收款方式"> |
|
|
|
<el-select |
|
|
|
v-model="addRecharge.payWay" |
|
|
|
placeholder="请选择" |
|
|
|
style="width: 300px" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
/> |
|
|
|
<el-select v-model="addRecharge.payWay" placeholder="请选择" style="width: 300px"> |
|
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" /> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="rechargeTime" label="交款时间"> |
|
|
|
<el-date-picker |
|
|
|
v-model="addRecharge.rechargeTime" |
|
|
|
type="date" |
|
|
|
style="width: 300px" |
|
|
|
/> |
|
|
|
<el-date-picker v-model="addRecharge.rechargeTime" type="date" style="width: 300px" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item |
|
|
|
prop="rechargeVoucher" |
|
|
|
label="交款凭证" |
|
|
|
style="margin-bottom: 5px" |
|
|
|
> |
|
|
|
<el-upload |
|
|
|
action="http://192.168.8.93:10010/upload" |
|
|
|
class="avatar-uploader" |
|
|
|
:show-file-list="false" |
|
|
|
:on-success="handleAvatarSuccess" |
|
|
|
:before-upload="beforeAvatarUpload" |
|
|
|
style="width: 100px; height: 115px" |
|
|
|
> |
|
|
|
<img |
|
|
|
v-if="imageUrl" |
|
|
|
:src="imageUrl" |
|
|
|
class="avatar" |
|
|
|
style="width: 100px; height: 115px" |
|
|
|
/> |
|
|
|
<el-icon |
|
|
|
v-else |
|
|
|
class="avatar-uploader-icon" |
|
|
|
style="width: 100px; height: 100px" |
|
|
|
> |
|
|
|
<el-form-item prop="rechargeVoucher" label="交款凭证" style="margin-bottom: 5px"> |
|
|
|
<el-upload action="http://192.168.8.93:10010/upload" class="avatar-uploader" :show-file-list="false" |
|
|
|
:on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload" style="width: 100px; height: 115px"> |
|
|
|
<img v-if="imageUrl" :src="imageUrl" class="avatar" style="width: 100px; height: 115px" /> |
|
|
|
<el-icon v-else class="avatar-uploader-icon" style="width: 100px; height: 100px"> |
|
|
|
<Plus /> |
|
|
|
</el-icon> |
|
|
|
</el-upload> |
|
|
@ -648,41 +814,19 @@ const batchAdd = function () { |
|
|
|
</p> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="remark" label="备注"> |
|
|
|
<el-input |
|
|
|
v-model="addRecharge.remark" |
|
|
|
style="width: 300px" |
|
|
|
:rows="2" |
|
|
|
maxlength="100" |
|
|
|
show-word-limit |
|
|
|
type="textarea" |
|
|
|
/> |
|
|
|
<el-input v-model="addRecharge.remark" style="width: 300px" :rows="2" maxlength="100" show-word-limit |
|
|
|
type="textarea" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="submitter" label="提交人"> |
|
|
|
<el-input |
|
|
|
style="width: 300px" |
|
|
|
:value="adminData.name" |
|
|
|
disabled |
|
|
|
placeholder="提交人姓名" |
|
|
|
/> |
|
|
|
<el-input style="width: 300px" :value="adminData.name" disabled placeholder="提交人姓名" /> |
|
|
|
</el-form-item> |
|
|
|
<el-button @click="deleteRecharge" style="margin-left: 280px" |
|
|
|
>重置</el-button |
|
|
|
> |
|
|
|
<el-button @click="deleteRecharge" style="margin-left: 280px">重置</el-button> |
|
|
|
<el-button type="primary" @click="addBefore"> 提交 </el-button> |
|
|
|
</el-form> |
|
|
|
|
|
|
|
<!-- 客户信息栏 --> |
|
|
|
<el-card |
|
|
|
style="width: 1200px; float: right" |
|
|
|
class="customer-info" |
|
|
|
width="3000px" |
|
|
|
> |
|
|
|
<el-form |
|
|
|
:model="user" |
|
|
|
label-width="auto" |
|
|
|
style="max-width: 1200px" |
|
|
|
label-position="left" |
|
|
|
> |
|
|
|
<el-card style="width: 1200px; float: right" class="customer-info" width="3000px"> |
|
|
|
<el-form :model="user" label-width="auto" style="max-width: 1200px" label-position="left"> |
|
|
|
<el-text size="large" style="margin-left: 20px">客户信息</el-text> |
|
|
|
<el-row style="margin-top: 20px"> |
|
|
|
<el-col :span="10"> |
|
|
@ -705,13 +849,10 @@ const batchAdd = function () { |
|
|
|
<span style="color: #2fa1ff; margin-right: 5px" v-if="user.buyJb">{{ |
|
|
|
user.buyJb + user.free6 + user.free12 + user.coreJb |
|
|
|
}}</span> |
|
|
|
<span |
|
|
|
style="display: inline; white-space: nowrap; color: #b1b1b1" |
|
|
|
v-if="user.buyJb" |
|
|
|
>(充值金币:{{ user.buyJb }};免费金币:{{ |
|
|
|
<span style="display: inline; white-space: nowrap; color: #b1b1b1" v-if="user.buyJb">(充值金币:{{ user.buyJb |
|
|
|
}};免费金币:{{ |
|
|
|
user.free6 + user.free12 |
|
|
|
}};任务金币:{{ user.coreJb }})</span |
|
|
|
> |
|
|
|
}};任务金币:{{ user.coreJb }})</span> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="10"> |
|
|
@ -752,33 +893,26 @@ const batchAdd = function () { |
|
|
|
</el-form> |
|
|
|
</el-card> |
|
|
|
|
|
|
|
<el-dialog |
|
|
|
v-model="batchRechargeVisible" |
|
|
|
title="批量充值" |
|
|
|
width="1800px" |
|
|
|
style="height: 700px" |
|
|
|
:close-on-click-modal="false" |
|
|
|
> |
|
|
|
<el-dialog v-model="batchRechargeVisible" title="批量充值" width="1800px" style="height: 700px" |
|
|
|
:close-on-click-modal="false"> |
|
|
|
<el-row style="margin-bottom: 10px"> |
|
|
|
<el-button type="primary" @click="addLine()" style="margin-right: auto" |
|
|
|
>新增一行</el-button |
|
|
|
> |
|
|
|
<el-button |
|
|
|
type="danger" |
|
|
|
plain |
|
|
|
@click="batchDel()" |
|
|
|
style="margin-right: 10px; width: 130px" |
|
|
|
>批量删除</el-button |
|
|
|
> |
|
|
|
<!-- <el-button type="primary" @click="addLine()" style="margin-right: 10px">新增一行</el-button> --> |
|
|
|
<div style="font-weight: bold; font-size: 20px;"> |
|
|
|
<span>添加</span> |
|
|
|
<el-input style="width: 40px;" v-model="addLineObj"></el-input> |
|
|
|
<span>行</span> |
|
|
|
<el-button type="primary" @click="addLines()" style="margin-right: 10px;">添加</el-button> |
|
|
|
</div> |
|
|
|
<el-button type="warning" @click="batchSettingInit()" style="margin-right: 10px;">批量设置</el-button> |
|
|
|
<!-- <el-upload :ref="(el) => handleSetUploadRefMap(el)" action="" :http-request="httpExcelRequest" :limit="1" :show-file-list="false" |
|
|
|
class="uploadExcelContent" :data={} style="margin-right: auto"> |
|
|
|
<el-button type="success" >导入jwcode</el-button> |
|
|
|
</el-upload> --> |
|
|
|
<el-button type="danger" plain @click="batchDel()" style="margin-right: 10px; width: 130px">批量删除</el-button> |
|
|
|
</el-row> |
|
|
|
<el-row> |
|
|
|
<el-table |
|
|
|
:data="batchData" |
|
|
|
border |
|
|
|
max-height="540px" |
|
|
|
style="height: 540px" |
|
|
|
@selection-change="handleSelectionChangebatch" |
|
|
|
> |
|
|
|
<el-table :data="batchData" border max-height="540px" style="height: 540px" |
|
|
|
@selection-change="handleSelectionChangebatch"> |
|
|
|
<el-table-column type="selection" width="50px" /> |
|
|
|
<el-table-column property="index" label="序号" width="55px"> |
|
|
|
<template #default="scope"> |
|
|
@ -786,31 +920,29 @@ const batchAdd = function () { |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="jwcode" label="精网号" width="150px"> |
|
|
|
<!-- <template #default="scope"> |
|
|
|
<el-input v-if="scope.row.showInput" v-model="scope.row.jwcode" style="width: 110px" /> |
|
|
|
<span v-else>{{ scope.row.jwcode }}</span> |
|
|
|
</template> --> |
|
|
|
<template #default="scope"> |
|
|
|
<el-input |
|
|
|
v-if="scope.row.showInput" |
|
|
|
v-model="scope.row.jwcode" |
|
|
|
style="width: 110px" |
|
|
|
/> |
|
|
|
<!-- <el-select v-if="scope.row.showInput" ref="jwcodeSelectRef" filterable clearable v-model="scope.row.jwcode" |
|
|
|
placeholder="请选择精网号" style="widows: 110px;" :filter-method="filterMethod" |
|
|
|
v-jwcodeLoadmore="loadMore(rangeNumber)" @visible-change="visibleChange"> |
|
|
|
<el-option v-for="item in jwcodeList.slice(0, rangeNumber)" :key="item" :label="item" :value="item"> |
|
|
|
</el-option> |
|
|
|
</el-select> --> |
|
|
|
<el-select-v2 v-if="scope.row.showInput" filterable clearable v-model="scope.row.jwcode" |
|
|
|
placeholder="请选择精网号" style="widows: 110px;" :options="jwcodeList"> |
|
|
|
</el-select-v2> |
|
|
|
<span v-else>{{ scope.row.jwcode }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="activityName" label="活动名称" width="150px"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-select |
|
|
|
v-if="scope.row.showInput" |
|
|
|
filterable |
|
|
|
clearable |
|
|
|
v-model="scope.row.activityId" |
|
|
|
placeholder="请选择活动名称" |
|
|
|
@change="changeActivity(scope.row)" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in activity" |
|
|
|
:key="item.activityId" |
|
|
|
:label="item.activityName" |
|
|
|
:value="item.activityId" |
|
|
|
> |
|
|
|
<el-select v-if="scope.row.showInput" filterable clearable v-model="scope.row.activityId" |
|
|
|
placeholder="请选择活动名称" @change="changeActivity(scope.row)"> |
|
|
|
<el-option v-for="item in activity" :key="item.activityId" :label="item.activityName" |
|
|
|
:value="item.activityId"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<span v-else>{{ scope.row.activityName }}</span> |
|
|
@ -818,40 +950,23 @@ const batchAdd = function () { |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="paidGold" label="充值金币" width="110px"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-input |
|
|
|
v-if="scope.row.showInput" |
|
|
|
v-model="scope.row.paidGold" |
|
|
|
style="width: 70px" |
|
|
|
@change="changePaidGold(scope.row)" |
|
|
|
/> |
|
|
|
<el-input v-if="scope.row.showInput" v-model="scope.row.paidGold" style="width: 70px" |
|
|
|
@change="changePaidGold(scope.row)" /> |
|
|
|
<span v-else>{{ scope.row.paidGold }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="freeGold" label="免费金币" width="110px"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-input |
|
|
|
v-if="scope.row.showInput" |
|
|
|
v-model="scope.row.freeGold" |
|
|
|
style="width: 70px" |
|
|
|
/> |
|
|
|
<el-input v-if="scope.row.showInput" v-model="scope.row.freeGold" style="width: 70px" /> |
|
|
|
<span v-else>{{ scope.row.paidGold }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="rate" label="货币名称"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-select |
|
|
|
v-if="scope.row.showInput" |
|
|
|
filterable |
|
|
|
clearable |
|
|
|
v-model="scope.row.rate" |
|
|
|
placeholder="请选择币种" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in currency" |
|
|
|
:key="item.exchangeRate" |
|
|
|
:label="item.currency" |
|
|
|
:value="item.exchangeRate" |
|
|
|
> |
|
|
|
<el-select v-if="scope.row.showInput" filterable clearable v-model="scope.row.rate" placeholder="请选择币种" |
|
|
|
@change="changeRate(scope.row)"> |
|
|
|
<el-option v-for="item in currency" :key="item.exchangeRate" :label="item.currency" |
|
|
|
:value="item.exchangeRate"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<span v-else>{{ scope.row.rate }}</span> |
|
|
@ -864,19 +979,8 @@ const batchAdd = function () { |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="payWay" label="收款方式" width="130px"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-select |
|
|
|
v-if="scope.row.showInput" |
|
|
|
filterable |
|
|
|
clearable |
|
|
|
v-model="scope.row.payWay" |
|
|
|
placeholder="请选择收款方式" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
<el-select v-if="scope.row.showInput" filterable clearable v-model="scope.row.payWay" placeholder="请选择收款方式"> |
|
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<span v-else>{{ scope.row.payWay }}</span> |
|
|
@ -884,13 +988,8 @@ const batchAdd = function () { |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="rechargeTime" label="交款时间" width="150px"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-date-picker |
|
|
|
v-if="scope.row.showInput" |
|
|
|
type="date" |
|
|
|
v-model="scope.row.rechargeTime" |
|
|
|
style="width: 120px" |
|
|
|
placeholder="请选择交款时间" |
|
|
|
> |
|
|
|
<el-date-picker v-if="scope.row.showInput" type="date" v-model="scope.row.rechargeTime" style="width: 120px" |
|
|
|
placeholder="请选择交款时间"> |
|
|
|
</el-date-picker> |
|
|
|
<span v-else>{{ |
|
|
|
moment(scope.row.rechargeTime).format("YYYY-MM-DD HH:mm:ss") |
|
|
@ -899,51 +998,30 @@ const batchAdd = function () { |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="rechargeVoucher" label="充值凭证"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-upload |
|
|
|
class="avatar-uploader" |
|
|
|
:show-file-list="true" |
|
|
|
:on-success="handleAvatarSuccess" |
|
|
|
:before-upload="beforeAvatarUpload" |
|
|
|
v-if="scope.row.showInput" |
|
|
|
> |
|
|
|
<img |
|
|
|
v-if="scope.row.imageUrl" |
|
|
|
:src="scope.row.imageUrl" |
|
|
|
class="avatar" |
|
|
|
/> |
|
|
|
<el-icon v-else class="avatar-uploader-icon"></el-icon> |
|
|
|
<el-upload action="http://192.168.8.93:10010/upload" class="avatar-uploader" :show-file-list="false" |
|
|
|
:on-success="handleBatchAvatarSuccess" v-if="scope.row.showInput" @change="changeVoucher(scope.row)"> |
|
|
|
<img v-if="scope.row.imageUrl" :src="scope.row.imageUrl" class="avatar" /> |
|
|
|
<el-icon v-else class="avatar-uploader-icon"> |
|
|
|
<Plus /> |
|
|
|
</el-icon> |
|
|
|
</el-upload> |
|
|
|
<span v-else>{{ scope.row.rechargeVoucher }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="remark" label="备注" width="130px"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-input |
|
|
|
type="textarea" |
|
|
|
v-if="scope.row.showInput" |
|
|
|
v-model="scope.row.remark" |
|
|
|
style="max-width: 90px" |
|
|
|
rows="1" |
|
|
|
cols="12" |
|
|
|
></el-input> |
|
|
|
<el-input type="textarea" v-if="scope.row.showInput" v-model="scope.row.remark" style="max-width: 90px" |
|
|
|
rows="1" cols="12"></el-input> |
|
|
|
<span v-else>{{ scope.row.remark }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column property="submitter" label="提交人"> |
|
|
|
<el-input :value="adminData.name" disabled /> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
fixed="right" |
|
|
|
prop="operation" |
|
|
|
label="操作" |
|
|
|
width="150px" |
|
|
|
> |
|
|
|
<el-table-column fixed="right" prop="operation" label="操作" width="150px"> |
|
|
|
<template #default="scope"> |
|
|
|
<div style="display: flex"> |
|
|
|
<el-popconfirm |
|
|
|
title="确定将此条信息删除吗?" |
|
|
|
@confirm="delConfirm" |
|
|
|
> |
|
|
|
<el-popconfirm title="确定将此条信息删除吗?" @confirm="delConfirm"> |
|
|
|
<template #reference> |
|
|
|
<el-button type="danger" text @click="del(scope.row)"> |
|
|
|
删除 |
|
|
@ -956,10 +1034,7 @@ const batchAdd = function () { |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</el-popconfirm> |
|
|
|
<el-popconfirm |
|
|
|
title="确定将此条信息重置吗?" |
|
|
|
@confirm="resetConfirm" |
|
|
|
> |
|
|
|
<el-popconfirm title="确定将此条信息重置吗?" @confirm="resetConfirm"> |
|
|
|
<template #reference> |
|
|
|
<el-button type="primary" text @click="reset(scope.row)"> |
|
|
|
重置 |
|
|
@ -984,6 +1059,59 @@ const batchAdd = function () { |
|
|
|
</div> |
|
|
|
</el-row> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
<el-dialog v-model="batchSettingVisible" title="批量设置" :close-on-click-modal="false" style="width: 550px;"> |
|
|
|
<el-form label-position="left" label-width="auto"> |
|
|
|
<el-form-item label="活动名称"> |
|
|
|
<el-select v-model="batchSettingObj.activityId" placeholder="请选择活动名称" clearable> |
|
|
|
<el-option v-for="item in activity" :key="item.activityId" :label="item.activityName" |
|
|
|
:value="item.activityId"> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="充值金币"> |
|
|
|
<el-input v-model="batchSettingObj.paidGold" placeholder="请输入充值金币"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="免费金币"> |
|
|
|
<el-input v-model="batchSettingObj.freeGold"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="充值金额"> |
|
|
|
<div style="display: flex;"> |
|
|
|
<el-select v-model="batchSettingObj.rate" placeholder="请选择币种" style="width: 120px; margin-right: 10px;" |
|
|
|
clearable> |
|
|
|
<el-option v-for="item in currency" :key="item.exchangeRate" :label="item.currency" |
|
|
|
:value="item.exchangeRate"></el-option> |
|
|
|
</el-select> |
|
|
|
<el-input v-model="batchSettingObj.rechargeGold" placeholder="请输入充值金额"></el-input> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="payWay" label="收款方式"> |
|
|
|
<el-select v-model="batchSettingObj.payWay" placeholder="请选择收款方式" clearable> |
|
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="rechargeTime" label="交款时间"> |
|
|
|
<el-date-picker v-model="batchSettingObj.rechargeTime" type="date" placeholder="请选择交款时间"></el-date-picker> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="rechargeVoucher" label="交款凭证"> |
|
|
|
<el-upload action="http://192.168.8.93:10010/upload" class="avatar-uploader" :show-file-list="false" |
|
|
|
:on-success="batchSettingHandleAvatarSuccess" :before-upload="beforeAvatarUpload" |
|
|
|
style="width: 100px; height: 115px;"> |
|
|
|
<img v-if="batchSettingObj.imageUrl" :src="batchSettingObj.imageUrl" class="avatar" |
|
|
|
style="width: 100px; height: 115px;" /> |
|
|
|
<el-icon v-else class="avatar-uploader-icon" style="width: 100px; height: 100px;"> |
|
|
|
<Plus /> |
|
|
|
</el-icon> |
|
|
|
</el-upload> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="remark" label="备注"> |
|
|
|
<el-input type="textarea" v-model="batchSettingObj.remark" placeholder="请输入备注" /> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<el-button @click="cancelBatchSetting()" style="margin-left: 370px">取消</el-button> |
|
|
|
<el-button type="primary" @click="batchSettingConfirm()"> 确认 </el-button> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|