feat:充值记录、更新余额

This commit is contained in:
dzc committed 2024-12-30 20:07:42 +08:00
1 parent 8e12194caf
commit 6925cf0eca
7 files changed
+339 -129

No files matched your search

+16
View File
@@ -1,5 +1,13 @@
import request from "/@/utils/request"
export function updateBalance(obj?: Object) {
return request({
url: '/wallet/walletTransaction/update-balance',
method: 'put',
data: obj
})
}
export function fetchList(query?: Object) {
return request({
url: '/wallet/walletTransaction/page',
@@ -8,6 +16,14 @@ export function fetchList(query?: Object) {
})
}
export function pageJoin(query?: Object) {
return request({
url: '/wallet/walletTransaction/page-join',
method: 'get',
params: query
})
}
export function addObj(obj?: Object) {
return request({
url: '/wallet/walletTransaction',
+5
View File
@@ -0,0 +1,5 @@
export const convertToInteger = (num: number | string | undefined): number => {
if (typeof num === 'undefined') return 0
const parsedNumber = typeof num === 'string' ? parseFloat(num) : num
return Math.round(parsedNumber * 100)
}
+10
View File
@@ -0,0 +1,10 @@
/**
* 显示价格把分转换到元
* @param price
* @returns
*/
export function displayPrice(price: any, suffix: string = "元") {
if (typeof price === 'undefined') return '0.0' + suffix
const parsedNumber = typeof price === 'string' ? parseFloat(price) : price
return (parsedNumber / 100.0).toFixed(1) + suffix
}
@@ -0,0 +1,165 @@
<template>
<el-dialog title="修改余额" v-model="visible" width="30%" :close-on-click-modal="false" draggable>
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="120px"
v-loading="loading">
<el-row :gutter="24">
<el-col :span="24" class="mb20">
<el-form-item label="用户编号" prop="id">
<el-input v-model="form.id" placeholder="" disabled />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="用户昵称" prop="nickname">
<el-input v-model="form.nickname" placeholder="" disabled />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="变动前余额(元)" prop="balance">
<el-input v-model="form.balance" placeholder="" disabled />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="变动类型" prop="changeType">
<el-radio-group v-model="form.changeType">
<el-radio :label="1">充值</el-radio>
<el-radio :label="-1">减少</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="变动余额(元)" prop="changeBalance">
<el-input-number v-model="form.changeBalance" :min="0" :precision="2" :step="0.1"
class="!w-240px" />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="变动后余额(元)" prop="balanceResult">
<el-input v-model="balanceResult" placeholder="" disabled />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts" name="WalletManageDialog">
import { useDict } from '/@/hooks/dict';
import { useMessage } from "/@/hooks/message";
import * as walletApi from "/@/api/wallet/wallet-manage"
import * as walletTransactionApi from "/@/api/wallet/wallet-transaction"
import * as AdminUserApi from '/@/api/admin/user'
import { rule } from '/@/utils/validate';
import { displayPrice } from "/@/utils/formatMoney"
import { convertToInteger } from "/@/utils/convert"
const emit = defineEmits(['refresh']);
// 定义变量内容
const dataFormRef = ref();
const visible = ref(false)
const loading = ref(false)
// 定义字典
// 提交表单数据
const form = reactive<any>({
id: undefined,
walletId: undefined,
nickname: undefined,
balance: '0',
changeBalance: 0,
changeType: 1
});
/** 变动后的余额 */
const balanceResult = computed(() =>
displayPrice(
convertToInteger(form.balance) +
convertToInteger(form.changeBalance) * form.changeType
)
)
// 定义校验规则
const dataRules = ref({
changeBalance: [{ required: true, message: '变动余额不能为空', trigger: 'blur' }]
})
// 打开弹窗
const openDialog = (userId: string, id: string) => {
visible.value = true
form.id = ''
// 重置表单数据
nextTick(() => {
dataFormRef.value?.resetFields();
});
// 获取walletManage信息
if (id) {
form.id = id
getwalletManageData(userId, id)
}
};
// 提交
const onSubmit = async () => {
const valid = await dataFormRef.value.validate().catch(() => { });
if (!valid) return false;
if (form.changeBalance <= 0) {
useMessage().error('变动余额不能为零')
return
}
if (convertToInteger(balanceResult.value) < 0) {
useMessage().error('变动后的余额不能小于 0')
return
}
try {
loading.value = true;
const pa = {
...form,
userId: form.id,
walletId: form.walletId,
balance: form.changeBalance * 100,
}
await walletTransactionApi.updateBalance(pa)
useMessage().success("操作成功");
visible.value = false;
emit('refresh');
} catch (err: any) {
useMessage().error(err.msg);
} finally {
loading.value = false;
}
};
// 初始化表单数据
const getwalletManageData = async (userId: string, id: string) => {
// 获取数据
loading.value = true
try {
const { data: user } = await AdminUserApi.getObj(userId)
const { data: wallet } = await walletApi.getObj(id)
form.id = user.userId
form.walletId = wallet.id
form.nickname = user.nickname
form.balance = displayPrice(wallet.balance, "")
form.changeType = 1
form.changeBalance = 0
} finally {
loading.value = false
}
};
// 暴露变量
defineExpose({
openDialog
});
</script>
-110
View File
@@ -1,110 +0,0 @@
<template>
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
<el-row :gutter="24">
<el-col :span="12" class="mb20">
<el-form-item label="是否冻结饭卡" prop="isFreeze">
<el-input v-model="form.isFreeze" placeholder="请输入是否冻结饭卡" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="绑定饭卡时间" prop="activeBindTime">
<el-input v-model="form.activeBindTime" placeholder="请输入绑定饭卡时间" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="饭卡绑定状态" prop="activeBindStatus">
<el-input v-model="form.activeBindStatus" placeholder="请输入饭卡绑定状态" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts" name="WalletManageDialog">
import { useDict } from '/@/hooks/dict';
import { useMessage } from "/@/hooks/message";
import { getObj, addObj, putObj } from '/@/api/wallet/wallet-manage'
import { rule } from '/@/utils/validate';
const emit = defineEmits(['refresh']);
// 定义变量内容
const dataFormRef = ref();
const visible = ref(false)
const loading = ref(false)
// 定义字典
// 提交表单数据
const form = reactive({
id: '',
isFreeze: '',
activeBindTime: '',
activeBindStatus: '',
});
// 定义校验规则
const dataRules = ref({
})
// 打开弹窗
const openDialog = (id: string) => {
visible.value = true
form.id = ''
// 重置表单数据
nextTick(() => {
dataFormRef.value?.resetFields();
});
// 获取walletManage信息
if (id) {
form.id = id
getwalletManageData(id)
}
};
// 提交
const onSubmit = async () => {
const valid = await dataFormRef.value.validate().catch(() => { });
if (!valid) return false;
try {
loading.value = true;
form.id ? await putObj(form) : await addObj(form);
useMessage().success(form.id ? '修改成功' : '添加成功');
visible.value = false;
emit('refresh');
} catch (err: any) {
useMessage().error(err.msg);
} finally {
loading.value = false;
}
};
// 初始化表单数据
const getwalletManageData = (id: string) => {
// 获取数据
loading.value = true
getObj(id).then((res: any) => {
Object.assign(form, res.data)
}).finally(() => {
loading.value = false
})
};
// 暴露变量
defineExpose({
openDialog
});
</script>
+47 -19
View File
@@ -17,31 +17,56 @@
@sort-change="sortChangeHandle">
<el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="#" width="40" />
<el-table-column prop="cardNumber" label="用户" show-overflow-tooltip />
<el-table-column prop="cardNumber" label="头像" show-overflow-tooltip />
<el-table-column prop="cardNumber" label="手机号" show-overflow-tooltip />
<el-table-column prop="cardNumber" label="部门" show-overflow-tooltip />
<el-table-column prop="cardNumber" label="饭卡类型" show-overflow-tooltip />
<el-table-column prop="username" label="用户" show-overflow-tooltip />
<el-table-column prop="userAvatar" label="头像" show-overflow-tooltip>
<template #default="{ row }">
<preview-image :src="row.userAvatar" />
</template>
</el-table-column>
<el-table-column prop="userMobile" width="120" label="手机号" show-overflow-tooltip />
<el-table-column prop="deptName" label="部门" show-overflow-tooltip />
<el-table-column prop="walletTypeUniqueCode" label="饭卡类型" show-overflow-tooltip>
<template #default="{ row }">
<dict-tag :options="wallet_type" :value="row.walletTypeUniqueCode" />
</template>
</el-table-column>
<el-table-column prop="cardNumber" label="饭卡卡号" show-overflow-tooltip />
<el-table-column prop="balance" label="余额" show-overflow-tooltip />
<el-table-column prop="totalExpense" label="累计支出" show-overflow-tooltip />
<el-table-column prop="totalRecharge" label="累计充值" show-overflow-tooltip />
<el-table-column prop="isFreeze" label="是否冻结饭卡" show-overflow-tooltip />
<el-table-column prop="activeBindStatus" label="饭卡绑定状态" show-overflow-tooltip />
<el-table-column label="操作" width="150">
<template #default="scope">
<el-table-column prop="balance" label="余额" show-overflow-tooltip>
<template #default="{ row }">
<div class="color-primary">{{ displayPrice(row.balance) }}</div>
</template>
</el-table-column>
<el-table-column prop="totalExpense" label="累计支出" show-overflow-tooltip>
<template #default="{ row }">
<div class="color-danger">{{ displayPrice(row.totalExpense) }}</div>
</template>
</el-table-column>
<el-table-column prop="totalRecharge" label="累计充值" show-overflow-tooltip>
<template #default="{ row }">
<div class="color-warning">{{ displayPrice(row.totalRecharge) }}</div>
</template>
</el-table-column>
<el-table-column prop="isFreeze" width="120" label="是否冻结饭卡" show-overflow-tooltip>
<template #default="{ row }">
<dict-tag :options="yes_no_type" :value="row.isFreeze" />
</template>
</el-table-column>
<el-table-column prop="activeBindStatus" width="120" label="饭卡绑定状态" show-overflow-tooltip />
<el-table-column prop="createTime" width="200" label="创建时间" show-overflow-tooltip />
<el-table-column label="操作" fixed="right" width="200">
<template #default="{ row }">
<el-button icon="edit-pen" text type="primary" v-auth="'wallet_walletManage_edit'"
@click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
<el-button icon="delete" text type="primary" v-auth="'wallet_walletManage_del'"
@click="handleDelete([scope.row.id])">删除</el-button>
@click="formDialogRef.openDialog(row.id)">详情</el-button>
<el-button icon="edit-pen" text type="primary" v-auth="'wallet_walletManage_edit'"
@click="changeBalanceRef.openDialog(row.userId, row.id)">充值/扣款</el-button>
</template>
</el-table-column>
</el-table>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
</div>
<!-- 编辑、新增 -->
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
<transaction-list ref="formDialogRef" @refresh="getDataList(false)" />
<change-balance ref="changeBalanceRef" @refresh="getDataList(false)" />
</div>
</template>
@@ -51,13 +76,16 @@ import { BasicTableProps, useTable } from "/@/hooks/table";
import { fetchList, fetchListJoin, delObjs } from '/@/api/wallet/wallet-manage'
import { useMessage, useMessageBox } from "/@/hooks/message";
import { useDict } from '/@/hooks/dict';
import { displayPrice } from "/@/utils/formatMoney"
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
const TransactionList = defineAsyncComponent(() => import('./transaction-list.vue'));
const ChangeBalance = defineAsyncComponent(() => import('./change-balance.vue'));
// 定义查询字典
const { wallet_type, yes_no_type } = useDict('wallet_type', 'yes_no_type');
// 定义变量内容
const formDialogRef = ref()
const changeBalanceRef = ref()
// 搜索变量
const queryRef = ref()
const showSearch = ref(true)
@@ -0,0 +1,96 @@
<template>
<el-dialog title="钱包余额明细" v-model="visible" :close-on-click-modal="false" draggable>
<el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
:header-cell-style="tableStyle.headerCellStyle" @sort-change="sortChangeHandle">
<el-table-column align="center" width="200" label="编号" prop="id" />
<el-table-column align="center" width="200" label="钱包编号" prop="walletId" />
<el-table-column align="center" label="交易类型" prop="title" />
<el-table-column align="center" label="交易金额" prop="price">
<template #default="{ row }"> {{ displayPrice(row.price) }} </template>
</el-table-column>
<el-table-column align="center" label="钱包余额" prop="balance">
<template #default="{ row }"> {{ displayPrice(row.balance) }} </template>
</el-table-column>
<el-table-column align="center" label="交易时间" prop="createTime" width="180px" />
</el-table>
<template #footer>
<Pagination v-model:limit="state.queryForm.pageSize" v-model:page="state.queryForm.pageNo" :total="total"
@pagination="getDataList" />
</template>
</el-dialog>
</template>
<script setup lang="ts" name="WalletManageDialog">
import { BasicTableProps, useTable } from "/@/hooks/table";
import { useDict } from '/@/hooks/dict';
import { useMessage } from "/@/hooks/message";
import * as walletTransactionApi from '/@/api/wallet/wallet-transaction'
import { rule } from '/@/utils/validate';
import { displayPrice } from "/@/utils/formatMoney"
const emit = defineEmits(['refresh']);
// 定义变量内容
const dataFormRef = ref();
const visible = ref(false)
const loading = ref(false)
// 定义字典
// 提交表单数据
const form = reactive({
id: '',
isFreeze: '',
activeBindTime: '',
activeBindStatus: '',
});
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: walletTransactionApi.pageJoin
})
// 定义校验规则
const dataRules = ref({
})
// table hook
const {
getDataList,
currentChangeHandle,
sizeChangeHandle,
sortChangeHandle,
downBlobFile,
tableStyle
} = useTable(state)
// 打开弹窗
const openDialog = (id: string) => {
visible.value = true
form.id = ''
// 重置表单数据
nextTick(() => {
dataFormRef.value?.resetFields();
});
// 获取walletManage信息
if (id) {
form.id = id
getwalletManageData(id)
}
};
// 初始化表单数据
const getwalletManageData = (id: string) => {
// 获取数据
loading.value = true
const res = walletTransactionApi.pageJoin({ walletId: id });
console.log(res);
};
// 暴露变量
defineExpose({
openDialog
});
</script>