You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
671 lines
21 KiB
671 lines
21 KiB
<script setup>
|
|
import { computed, onMounted, reactive, ref, watch } from 'vue'
|
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
|
import API from '@/util/http.js'
|
|
import { useAdminStore } from "@/store/index.js";
|
|
import { storeToRefs } from "pinia";
|
|
import { findMenuById, permissionMapping } from "@/utils/menuTreePermission.js"
|
|
import { e } from 'mathjs';
|
|
|
|
const adminStore = useAdminStore();
|
|
const { adminData, menuTree } = storeToRefs(adminStore);
|
|
// 国际化
|
|
import { useI18n } from 'vue-i18n'
|
|
const { t } = useI18n()
|
|
|
|
|
|
const tableData = ref([])
|
|
const pagination = ref({
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
total: 0
|
|
})
|
|
|
|
// 精网号去空格
|
|
const trimJwCode = () => {
|
|
if (addRefund.value.jwcode) {
|
|
addRefund.value.jwcode = addRefund.value.jwcode.replace(/\s/g, '');
|
|
}
|
|
}
|
|
|
|
// 这是添加退款信息的表单
|
|
const addRefund = ref({
|
|
jwcode: '',
|
|
goodsName: '',
|
|
refundType: '',
|
|
refundModel: 0, // 0:全部退款, 1:部分退款
|
|
permanentGold: '',
|
|
freeGold: '',
|
|
taskGold: '',
|
|
sumGold: 0,
|
|
remark: '',
|
|
adminId: adminData.value.id,
|
|
adminName: adminData.value.name,
|
|
orderCode: '',
|
|
type: 0
|
|
})
|
|
|
|
// 取消按钮
|
|
const cancel = function () {
|
|
addRefund.value = {
|
|
jwcode: '',
|
|
goodsName: '',
|
|
refundType: '',
|
|
refundModel: 0,
|
|
permanentGold: '',
|
|
freeGold: '',
|
|
taskGold: '',
|
|
sumGold: 0,
|
|
remark: '',
|
|
adminId: adminData.value.id,
|
|
orderCode: '',
|
|
}
|
|
}
|
|
|
|
const getRefund = async function () {
|
|
if (!addRefund.value.jwcode) {
|
|
ElMessage.error(t('elmessage.checkJwCode'))
|
|
return
|
|
}
|
|
addRefund.value.orderCode = ''
|
|
addRefund.value.goodsName = ''
|
|
addRefund.value.permanentGold = ''
|
|
addRefund.value.freeGold = ''
|
|
addRefund.value.taskGold = ''
|
|
let type = null
|
|
if (addRefund.value.refundType === t('refund.refundTypeOptions.商品退款')) {
|
|
type = 1
|
|
} else {
|
|
type = 0
|
|
}
|
|
const params = {
|
|
pageNum: pagination.value.pageNum,
|
|
pageSize: pagination.value.pageSize,
|
|
goldDetail: {
|
|
jwcode: addRefund.value.jwcode,
|
|
flag: 0,
|
|
type: type,
|
|
markets:[]
|
|
}
|
|
}
|
|
try {
|
|
const res = await API({
|
|
url: '/goldDetail/getGoldDetail',
|
|
data: {
|
|
...params
|
|
}
|
|
})
|
|
tableData.value = res.data.list
|
|
pagination.value.total = res.data.total
|
|
if (Array.isArray(res.data.list) && res.data.list.length > 0) {
|
|
orderCodes.value = res.data.list.map(item => ({
|
|
label: item.orderCode,
|
|
value: item.orderCode
|
|
}))
|
|
console.log("看看订单号们", orderCodes.value)
|
|
} else {
|
|
ElMessage.info(t('elmessage.noOrder'))
|
|
}
|
|
} catch (error) {
|
|
console.log('goldDetail有错误', error)
|
|
ElMessage.error(t('elmessage.requestFailed'))
|
|
tableData.value = []
|
|
pagination.value.total = 0
|
|
}
|
|
}
|
|
// 这是添加退款信息的接口
|
|
const add = async function () {
|
|
// 检查是否有添加权限
|
|
if (!canAdd.value) {
|
|
ElMessage.error(t('elmessage.noPermission'))
|
|
return
|
|
}
|
|
try {
|
|
if (addRefund.value.refundType === t('refund.refundTypeOptions.商品退款')) {
|
|
addRefund.value.type = 1
|
|
} else {
|
|
addRefund.value.type = 0
|
|
}
|
|
// 对提交的金币数乘以 100
|
|
const processedRefund = {
|
|
...addRefund.value,
|
|
permanentGold: addRefund.value.permanentGold * 100,
|
|
freeGold: addRefund.value.freeGold * 100,
|
|
taskGold: addRefund.value.taskGold * 100,
|
|
sumGold: addRefund.value.sumGold * 100
|
|
}
|
|
console.log('提交的退款信息', processedRefund)
|
|
addDisabled.value = true
|
|
// 发送POST请求
|
|
const result = await API({
|
|
url: '/refund/add',
|
|
data: processedRefund
|
|
})
|
|
|
|
addDisabled.value = false
|
|
if (result.code === 0) {
|
|
ElMessage.error(result.msg)
|
|
return
|
|
}
|
|
console.log('请求成功', result)
|
|
ElMessage.success(t('elmessage.addSuccess'))
|
|
// 重置表单
|
|
cancel()
|
|
} catch (error) {
|
|
console.log('请求失败', error)
|
|
ElMessage.error('请求失败，请重试')
|
|
addDisabled.value = false
|
|
}
|
|
}
|
|
|
|
// 提交禁止重复点击
|
|
const addDisabled = ref(false)
|
|
|
|
// 提交退款信息前的表单验证
|
|
const addBefore = () => {
|
|
Ref.value.validate(async (valid) => {
|
|
if (valid) {
|
|
ElMessageBox.confirm(t('elmessage.confirmRefund'))
|
|
.then(() => {
|
|
add()
|
|
})
|
|
.catch(() => {
|
|
console.log('取消退款')
|
|
})
|
|
} else {
|
|
// 提示
|
|
ElMessage({
|
|
type: 'error',
|
|
message: t('elmessage.checkInputContent')
|
|
})
|
|
}
|
|
})
|
|
}
|
|
|
|
// 表单验证
|
|
const Ref = ref(null)
|
|
const validateJwCode = (rule, value, callback) => {
|
|
if (!value) {
|
|
callback(new Error(t('elmessage.noEmptyJwcode')));
|
|
return;
|
|
}
|
|
if (/[^0-9]/.test(value)) {
|
|
callback(new Error(t('elmessage.limitDigitJwcode')));
|
|
return;
|
|
}
|
|
callback();
|
|
};
|
|
const rules = reactive({
|
|
jwcode: [{ required: true, validator: validateJwCode, trigger: 'blur' }],
|
|
refundType: [{ required: true, message: t('elmessage.checkRefundType'), trigger: 'blur' }],
|
|
goodsName: [{ required: false, message: t('elmessage.checkRefundGoods'), trigger: 'blur' }],
|
|
// 订单号
|
|
orderCode: [{ required: true, message: t('elmessage.checkOrderNo'), trigger: 'blur' }],
|
|
taskGold: [{ required: true, message: t('elmessage.checkTaskGold'), trigger: 'blur' }],
|
|
freeGold: [{ required: true, message: t('elmessage.checkFreeGold'), trigger: 'blur' }],
|
|
permanentGold: [
|
|
{ required: true, message: t('elmessage.checkPermanentGold'), trigger: 'blur' }
|
|
],
|
|
sumGold: [
|
|
{ required: true, message: t('elmessage.checkPayModel'), trigger: 'blur' },
|
|
{
|
|
validator: (rule, value) => {
|
|
if (value === 0) {
|
|
return Promise.reject(new Error(t('elmessage.noTotalGoldZero')))
|
|
}
|
|
return Promise.resolve()
|
|
},
|
|
trigger: 'blur'
|
|
}
|
|
]
|
|
})
|
|
// 查找客户信息的方法
|
|
const user = ref({
|
|
firstRechargeTime: ''
|
|
})
|
|
const getUser = async function (jwcode) {
|
|
trimJwCode();
|
|
// 验证精网号
|
|
if (!jwcode) {
|
|
ElMessage.warning(t('elmessage.noEmptyJwcode'));
|
|
return;
|
|
}
|
|
|
|
// 验证精网号是否为数字
|
|
if (!/^\d{1,9}$/.test(jwcode)) {
|
|
cancel()
|
|
return;
|
|
}
|
|
try {
|
|
// 发送POST请求
|
|
const result = await API({
|
|
url: '/user/selectUser',
|
|
data: {
|
|
jwcode: addRefund.value.jwcode
|
|
}
|
|
})
|
|
console.log('请求成功', result)
|
|
|
|
// 重置订单信息
|
|
restGoods()
|
|
//在此处错误逻辑的提示做了注释，在后续商品查询接口返回错误时，提示信息会显示在弹窗中
|
|
if (result.code === 0) {
|
|
ElMessage.error(result.msg);
|
|
} else if (result.data === null) {
|
|
ElMessage.error(t('elmessage.noUser'));
|
|
} else {
|
|
// 对传过来的金币数除以 100
|
|
const processedData = {
|
|
...result.data,
|
|
historySumGold: (Number(result.data.historySumGold) || 0),
|
|
nowSumGold: (Number(result.data.nowSumGold) || 0),
|
|
nowPermanentGold: (Number(result.data.nowPermanentGold) || 0),
|
|
nowFreeGold: (Number(result.data.nowFreeGold) || 0),
|
|
nowTaskGold: (Number(result.data.nowTaskGold) || 0)
|
|
}
|
|
user.value = processedData;
|
|
console.log("用户信息", user.value);
|
|
|
|
tableData.value = []
|
|
addRefund.value.refundType = ''
|
|
}
|
|
} catch (error) {
|
|
console.log("请求失败", error);
|
|
ElMessage.error(t('elmessage.jwcodeError'));
|
|
}
|
|
}
|
|
|
|
|
|
// 退款类型，写死为商品退款
|
|
const refundType = ref([
|
|
{ value: '商品退款', label: t('refund.refundTypeOptions.商品退款') },
|
|
{ value: '金币退款', label: t('refund.refundTypeOptions.金币退款') }
|
|
])
|
|
|
|
// 存储所有商品信息和订单号下拉数据
|
|
const goodsName = ref([])
|
|
const orderCodes = ref([])
|
|
|
|
// 根据订单号自动带出商品名和金币信息
|
|
const handleOrderChange = (orderCode) => {
|
|
addRefund.value.refundModel = 0
|
|
addRefund.value.goodsName = ''
|
|
addRefund.value.permanentGold = ''
|
|
addRefund.value.freeGold = ''
|
|
addRefund.value.taskGold = ''
|
|
const order = tableData.value.find(item => item.orderCode === orderCode)
|
|
if (order) {
|
|
addRefund.value.goodsName = order.goodsName
|
|
if (addRefund.value.refundType === t('refund.refundTypeOptions.金币退款')) {
|
|
selectedGoodsGold.value = {
|
|
permanentGold: Number(order.permanentGold) || 0,
|
|
freeGold: Number(order.freeGold) || 0,
|
|
taskGold: Number(order.taskGold) || 0
|
|
}
|
|
console.log('看看金币退款参数', selectedGoodsGold.value)
|
|
} else {
|
|
selectedGoodsGold.value = {
|
|
permanentGold: -Number(order.permanentGold) || 0,
|
|
freeGold: -Number(order.freeGold) || 0,
|
|
taskGold: -Number(order.taskGold) || 0
|
|
}
|
|
console.log('看看商品退款参数', selectedGoodsGold.value)
|
|
}
|
|
|
|
// 全部退款的填充
|
|
if (addRefund.value.refundModel === 0) {
|
|
addRefund.value.permanentGold = selectedGoodsGold.value.permanentGold.toString()
|
|
addRefund.value.freeGold = selectedGoodsGold.value.freeGold.toString()
|
|
addRefund.value.taskGold = selectedGoodsGold.value.taskGold.toString()
|
|
}
|
|
} else {
|
|
addRefund.value.goodsName = ''
|
|
selectedGoodsGold.value = {
|
|
permanentGold: 0,
|
|
freeGold: 0,
|
|
taskGold: 0
|
|
}
|
|
}
|
|
}
|
|
|
|
// 存储选中商品的金币花费信息
|
|
const selectedGoodsGold = ref({
|
|
permanentGold: 0,
|
|
freeGold: 0,
|
|
taskGold: 0
|
|
})
|
|
|
|
// 重置订单信息
|
|
const restGoods = () => {
|
|
addRefund.value.orderCode = ''
|
|
addRefund.value.goodsName = ''
|
|
addRefund.value.permanentGold = ''
|
|
addRefund.value.freeGold = ''
|
|
addRefund.value.taskGold = ''
|
|
}
|
|
|
|
// 处理退款方式切换
|
|
const handleRefundModelChange = () => {
|
|
// 全部退款的自动填充 上面有
|
|
if (addRefund.value.refundModel === 0) {
|
|
addRefund.value.permanentGold = selectedGoodsGold.value.permanentGold.toString();
|
|
addRefund.value.freeGold = selectedGoodsGold.value.freeGold.toString();
|
|
addRefund.value.taskGold = selectedGoodsGold.value.taskGold.toString();
|
|
}
|
|
}
|
|
|
|
// 统一的输入处理函数
|
|
const handleGoldInput = (type, value) => {
|
|
// 1. 过滤非法字符（只允许数字和小数点）
|
|
let filtered = value.replace(/[^\d.]/g, '');
|
|
|
|
// 2. 防止多个小数点
|
|
const dotCount = (filtered.match(/\./g) || []).length;
|
|
if (dotCount > 1) {
|
|
// 保留第一个小数点，移除后续的小数点
|
|
const parts = filtered.split('.');
|
|
filtered = parts[0] + '.' + parts.slice(1).join('');
|
|
}
|
|
|
|
// 3. 限制小数点后两位
|
|
if (filtered.includes('.')) {
|
|
const [integer, decimal] = filtered.split('.');
|
|
if (decimal.length > 2) {
|
|
filtered = `${integer}.${decimal.slice(0, 2)}`;
|
|
}
|
|
}
|
|
|
|
// 4. 检查是否以小数点开头，如果是，在前面添加0
|
|
if (filtered.startsWith('.')) {
|
|
filtered = '0' + filtered;
|
|
}
|
|
|
|
// 5. 更新值
|
|
addRefund.value[type] = filtered;
|
|
|
|
// 6. 验证逻辑（这里直接应用修正后的值）
|
|
const maxValue = selectedGoodsGold.value[type];
|
|
const inputValue = Number(filtered || 0);
|
|
|
|
if (isNaN(inputValue)) {
|
|
return;
|
|
}
|
|
|
|
if (inputValue > maxValue) {
|
|
// 修正为最大值并设置回输入框
|
|
const correctedValue = maxValue.toFixed(2);
|
|
addRefund.value[type] = correctedValue;
|
|
ElMessage.warning(t('elmessage.limitBalance'));
|
|
}
|
|
|
|
if (inputValue < 0) {
|
|
// 修正为0并设置回输入框
|
|
addRefund.value[type] = '0';
|
|
ElMessage.warning(t('elmessage.noNegativeNumber'));
|
|
}
|
|
}
|
|
|
|
// 使用示例
|
|
const handlePermanentGoldInput = (value) => handleGoldInput('permanentGold', value);
|
|
const handleFreeGoldInput = (value) => handleGoldInput('freeGold', value);
|
|
const handleTaskGoldInput = (value) => handleGoldInput('taskGold', value);
|
|
|
|
// 计算总金币
|
|
const calculatedRechargeGoods = computed(() => {
|
|
const permanentGold = addRefund.value.permanentGold === '' ? 0 : +addRefund.value.permanentGold;
|
|
const freeGold = addRefund.value.freeGold === '' ? 0 : +addRefund.value.freeGold;
|
|
const taskGold = addRefund.value.taskGold === '' ? 0 : +addRefund.value.taskGold;
|
|
return Number((permanentGold + freeGold + taskGold).toFixed(2));
|
|
})
|
|
const canAdd = ref(findMenuById(menuTree.value,permissionMapping.add_gold_coin_refund))
|
|
watch(calculatedRechargeGoods, (newVal) => {
|
|
addRefund.value.sumGold = newVal
|
|
})
|
|
const handlePageSizeChange = function (val) {
|
|
pagination.value.pageSize = val
|
|
getRefund()
|
|
}
|
|
const handleCurrentChange = function (val) {
|
|
pagination.value.pageNum = val
|
|
getRefund()
|
|
}
|
|
onMounted(() =>{
|
|
console.log(adminData.value)
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="father">
|
|
<div class="userAndForm">
|
|
<div class="left">
|
|
<el-form :model="addRefund" ref="Ref" :rules="rules" label-width="auto" label-position="right"
|
|
style="min-width: 420px" class="add-form">
|
|
<el-form-item prop="jwcode" :label="$t('common_add.jwcode')">
|
|
<el-input v-model="addRefund.jwcode" style="width: 220px" />
|
|
<el-button type="primary" @click="getUser(addRefund.jwcode)" style="margin-left: 20px">{{ $t('common.search') }}
|
|
</el-button>
|
|
</el-form-item>
|
|
<el-form-item prop="refundType" :label="$t('common_add.refundType')">
|
|
<el-select v-model="addRefund.refundType" :placeholder="$t('common_add.refundTypePlaceholder')" style="width: 220px"
|
|
@change="getRefund(addRefund.jwcode)">
|
|
<el-option v-for="item in refundType" :key="item.value" :label="item.label" :value="item.value" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item prop="orderCode" :label="$t('common_add.orderNo')">
|
|
<el-select v-model="addRefund.orderCode" :placeholder="$t('common_add.orderNoPlaceholder')" style="width: 220px;" clearable filterable
|
|
@change="handleOrderChange">
|
|
<el-option v-for="(item, index) in orderCodes" :key="index" :label="item.label" :value="item.value" />
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item prop="goodsName" :label="$t('common_add.goodsName')">
|
|
<el-input v-model="addRefund.goodsName" style="width: 220px" disabled />
|
|
</el-form-item>
|
|
|
|
<el-form-item prop="refundModel" :label="$t('common_add.refundModel')">
|
|
<el-radio-group v-model="addRefund.refundModel" @change="handleRefundModelChange">
|
|
<el-radio :value="0">{{ $t('common_add.refundModelAll') }}</el-radio>
|
|
<el-radio :value="1">{{ $t('common_add.refundModelPart') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<el-form-item prop="permanentGold" :label="$t('common_add.permanentGold')">
|
|
<el-input v-model="addRefund.permanentGold" style="width: 220px" :disabled="addRefund.refundModel === 0"
|
|
@input="handlePermanentGoldInput($event)" type="number">
|
|
</el-input> {{ $t('common.个') }}
|
|
|
|
<template>
|
|
|
|
</template>
|
|
</el-form-item>
|
|
|
|
<el-form-item prop="freeGold" :label="$t('common_add.freeGold')">
|
|
<el-input v-model="addRefund.freeGold" style="float: left; width: 220px"
|
|
:disabled="addRefund.refundModel === 0" @input="handleFreeGoldInput($event)" type="number" />
|
|
{{ $t('common.个') }}
|
|
</el-form-item>
|
|
|
|
<div>
|
|
<el-form-item prop="taskGold" :label="$t('common_add.taskGold')">
|
|
<el-input v-model="addRefund.taskGold" style="float: left; width: 220px"
|
|
:disabled="addRefund.refundModel === 0" @input="handleTaskGoldInput($event)" type="number" />
|
|
{{ $t('common.个') }}
|
|
</el-form-item>
|
|
</div>
|
|
<div>
|
|
<el-form-item prop="sumGold" :label="$t('common_add.refundGoldCoin')">
|
|
<el-input disabled v-model="addRefund.sumGold" style="width: 220px">
|
|
</el-input>
|
|
</el-form-item>
|
|
</div>
|
|
<div>
|
|
<el-form-item prop="remark" :label="$t('common_add.remark')">
|
|
<el-input v-model="addRefund.remark" style="width: 220px" :rows="3" maxlength="100" show-word-limit
|
|
type="textarea" />
|
|
</el-form-item>
|
|
</div>
|
|
|
|
<el-button type="success" @click="cancel()" style="margin-left: 200px">{{ $t('common.reset') }}</el-button>
|
|
<el-button type="primary" :disabled="addDisabled" @click="addBefore" v-if="canAdd"> {{ $t('common.submit') }}</el-button>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="right">
|
|
<div class="right-up">
|
|
<!-- 客户信息栏 -->
|
|
<el-card v-if="user.jwcode" class="customer-info">
|
|
<el-form :model="user" label-width="auto" label-position="left">
|
|
<span style="margin-left: 30%;font-size: larger;">{{ $t('common_add_user.customerInfo') }}</span>
|
|
|
|
<el-row style="margin-top: 1vh;">
|
|
<div class="line">
|
|
<span style="width:5vw;">{{ $t('common_add_user.name') }}</span>
|
|
<span style="width:10vw;">{{ user.name }}</span>
|
|
<span style="width:10vw;">{{ $t('common_add_user.currentGoldCoinTotal') }}</span>
|
|
<span style="color: #2fa1ff;width: 25vw;" v-if="user.nowSumGold !== undefined">{{
|
|
user.nowSumGold
|
|
}}</span>
|
|
</div>
|
|
</el-row>
|
|
<el-row style="height: 3vh;width: 100%;">
|
|
<span style="height:3vh;color: #b1b1b1;font-size: small;margin-left:50%;"
|
|
v-if="user.nowPermanentGold !== undefined">({{ $t('common_add_user.permanentGold') }}:{{
|
|
user.nowPermanentGold
|
|
}};
|
|
{{ $t('common_add_user.freeGold') }}:{{ user.nowFreeGold }};
|
|
{{ $t('common_add_user.taskGold') }}:{{ user.nowTaskGold }})</span>
|
|
</el-row>
|
|
<el-row>
|
|
<!-- 第二行：精网号 + 消费次数 -->
|
|
<div class="line">
|
|
<span style="width:5vw;">{{ $t('common_add_user.jwcode') }}</span>
|
|
<span style="width: 10vw;">{{ user.jwcode }}</span>
|
|
|
|
<span style="width:10vw;">{{ $t('common_add_user.consumptionTimes') }}</span>
|
|
<span style="width: 10vw;color: #2fa1ff;">{{ user.consumeNum }}</span>
|
|
</div>
|
|
</el-row>
|
|
<el-row>
|
|
<span style="height:3vh;color: #b1b1b1;font-size: small;margin-left:50%;">({{ $t('common_add_user.onlyStatisticsDataAfter20250101') }}2025-01-01)</span>
|
|
</el-row>
|
|
|
|
<!-- 第四行：所属门店 -->
|
|
<el-row>
|
|
<div class="line">
|
|
<span style="width:5vw;">{{ $t('common_add_user.store') }}</span>
|
|
<span style="width: 10vw;">{{ user.market }}</span>
|
|
</div>
|
|
</el-row>
|
|
</el-form>
|
|
</el-card>
|
|
</div>
|
|
|
|
<div>
|
|
<el-card class="card" v-if="tableData.length > 0">
|
|
<el-table :data="tableData" style="height:43vh;width:50vw">
|
|
<el-table-column type="index" :label="$t('refund.id')" width="80">
|
|
<template #default="scope">
|
|
<span>{{
|
|
scope.$index + 1 + (pagination.pageNum - 1) * pagination.pageSize
|
|
}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="type" :label="$t('refund.type')" width="100">
|
|
<template #default="{ row }">
|
|
{{ row.type === 0 ? $t('refund.recharge') : $t('refund.consume') }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="goodsName" :label="$t('refund.productName')" width="120" show-overflow-tooltip />
|
|
<el-table-column prop="orderCode" :label="$t('refund.orderCode')" width="200px" show-overflow-tooltip />
|
|
<el-table-column prop="permanentGold" :label="$t('refund.permanentGold')" width="120">
|
|
<template #default="{ row }">
|
|
{{ row.permanentGold }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="freeGold" :label="$t('refund.freeGold')" width="120">
|
|
<template #default="{ row }">
|
|
{{ row.freeGold }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="taskGold" :label="$t('refund.taskGold')" width="120">
|
|
<template #default="{ row }">
|
|
{{ row.taskGold }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="isRefund" :label="$t('refund.isRefund')" width="120">
|
|
<template #default="{ row }">
|
|
{{ row.isRefund === 1 ? $t('refund.no') : $t('refund.yes') }}
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-pagination class="pagination" v-model:current-page="pagination.pageNum"
|
|
v-model:page-size="pagination.pageSize" layout="total, sizes, prev, pager, next, jumper"
|
|
:total="pagination.total" @size-change="handlePageSizeChange"
|
|
@current-change="handleCurrentChange"></el-pagination>
|
|
</el-card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
p {
|
|
margin: 0px;
|
|
}
|
|
|
|
.father {
|
|
width: 75vw;
|
|
height: 70vh;
|
|
display: flex;
|
|
}
|
|
|
|
.userAndForm {
|
|
width: 25vw;
|
|
height: 100%;
|
|
display: flex;
|
|
}
|
|
|
|
.left {
|
|
width: 35vw;
|
|
display: flex;
|
|
|
|
.add-form {
|
|
width: 100%;
|
|
margin-top: 30px;
|
|
}
|
|
}
|
|
|
|
.right-up {
|
|
width: 50vw;
|
|
height: 20vh;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-left: 5vw;
|
|
|
|
.customer-info {
|
|
height: 21vh;
|
|
padding-left: 5%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.line {
|
|
display: flex;
|
|
height: 3vh;
|
|
}
|
|
}
|
|
}
|
|
|
|
.card {
|
|
width: 50vw;
|
|
height: 50vh;
|
|
margin-left: 5vw;
|
|
margin-top: 1vh;
|
|
}
|
|
|
|
.pagination {
|
|
display: flex;
|
|
margin-top: 0.5vh;
|
|
}
|
|
</style>
|