Files
jdt-admin/src/views/finance/index.vue

359 lines
8.0 KiB
Vue

<template>
<CommonPage show-footer :title="$route.title">
<n-row gutter="12">
<n-col :span="24">
<div flex>
<n-card w-400>
<n-statistic label="总提现金额(含已驳回)" tabular-nums>
<n-number-animation
ref="numberAnimationInstRef"
:from="0"
:to="cardData.total / 100"
/>
</n-statistic>
</n-card>
<n-card ml-10 w-400>
<n-statistic label="待处理金额" tabular-nums>
<n-number-animation
ref="numberAnimationInstRef"
:from="0"
:to="cardData.service / 100"
/>
</n-statistic>
</n-card>
<n-card ml-10 w-400>
<n-statistic label="已审核金额" tabular-nums>
<n-number-animation
ref="numberAnimationInstRef"
:from="0"
:to="cardData.count / 100"
/>
</n-statistic>
</n-card>
</div>
</n-col>
<n-col :span="24">
<div mt-10>
<span w-80>提现状态:</span>
<n-radio-group v-model:value="queryData.status" class="ml-10">
<n-radio-button
v-for="song in songs"
:key="song.value"
:value="song.value"
:label="song.label"
/>
</n-radio-group>
</div>
</n-col>
<n-col :span="24">
<div mt-10 flex items-center>
<span w-80>号码搜索:</span>
<n-input v-model:value="queryData.word" style="width: 25%" placeholder="请输入手机号码" />
</div>
</n-col>
<n-col :span="10">
<div mt-10 flex items-center>
<span w-80>申请时间:</span>
<n-date-picker
v-model:formatted-value="queryData.time"
value-format="yyyy-MM-dd"
type="daterange"
clearable
/>
</div>
</n-col>
<n-col :span="24">
<div mt-10>
<n-button type="primary" @click="getList">搜索</n-button>
<n-button ml-10 @click="clearQueryData">重置</n-button>
</div>
</n-col>
</n-row>
<n-data-table
class="mt-10"
:loading="loading"
:columns="columns"
:data="data"
:pagination="pagination"
:bordered="false"
remote
/>
<!-- 打款记录 -->
<n-modal v-model:show="showModal">
<n-card
style="width: 500px"
title="打款记录"
:bordered="false"
size="huge"
role="dialog"
aria-modal="true"
>
<n-form ref="formRef" :model="model" :rules="rules" label-placement="left">
<n-grid :cols="1" :x-gap="24">
<n-form-item-gi :span="12" label="打款截图" path="img">
<Upload v-model:list="model.img" />
</n-form-item-gi>
<n-form-item-gi>
<div w-full flex justify-center>
<n-button type="primary" @click="ok">确定</n-button>
<n-button class="ml-10" @click="clear">关闭</n-button>
</div>
</n-form-item-gi>
</n-grid>
</n-form>
</n-card>
</n-modal>
</CommonPage>
</template>
<script setup>
import api from './api'
import { NButton, NImage, NTag } from 'naive-ui'
import Upload from '@/components/Upload.vue'
import { h, withDirectives, resolveDirective } from 'vue'
const vPerms = resolveDirective('perms')
const vRole = [[vPerms, ['/admin/store/withdraw/edit']]]
const showModal = ref(false)
const queryData = ref({
status: '',
word: '',
time: '',
})
const cardData = ref({
total: 0,
service: 0,
count: 0,
})
const songs = ref([
{
value: 1,
label: '已审核',
},
{
value: 2,
label: '已驳回',
},
{
value: 3,
label: '待审核',
},
])
const nowRow = ref({})
const formRef = ref(null)
const model = ref({
img: [],
})
const rules = {
img: { required: true, type: 'array', message: '请上传打款截图' },
}
const columns = ref([
{
title: '名字',
key: 'name',
align: 'center',
},
{
title: '电话',
key: 'phone',
align: 'center',
},
{
title: '银行名称',
key: 'bank',
align: 'center',
},
{
title: '银行卡号',
key: 'bank_card',
align: 'center',
},
{
title: '账户名称',
key: 'bank_name',
align: 'center',
},
{
title: '法人',
key: 'bank_user',
align: 'center',
},
{
title: '提现金额',
slot: 'integral',
align: 'center',
render: (row) => {
return h('span', {}, row.integral)
},
},
{
title: '审核状态',
align: 'center',
slot: 'status',
render: (row) => {
return h(
NTag,
{
type: row.status === 1 ? 'success' : row.status === 2 ? 'error' : 'warning',
},
{
default: () => (row.status === 1 ? '已审核' : row.status === 2 ? '已驳回' : '待审核'),
}
)
},
},
{
title: '申请时间',
key: 'add_time',
align: 'center',
},
{
title: '打款截图',
slot: 'img',
render: (row) => {
return h(NImage, {
src: row.status_img,
width: '50',
})
},
},
{
title: '操作',
align: 'center',
slot: 'action',
render: (row) => {
if (row.status === 3) {
return [
withDirectives(
h(
NButton,
{
text: true,
type: 'primary',
onClick: () => {
nowRow.value = row
showModal.value = true
},
},
{
default: () => '审核',
}
),
vRole
),
withDirectives(
h(
NButton,
{
class: 'ml-10',
text: true,
type: 'error',
onClick: () => {
nowRow.value = row
refuse()
},
},
{
default: () => '拒绝',
}
),
vRole
),
]
}
},
},
])
const loading = ref(false)
const data = ref([])
const pagination = ref({
page: 1,
pageSize: 10,
itemCount: 0,
onChange: (page) => {
pagination.value.page = page
getList()
},
})
onMounted(() => {
getList()
})
const getList = async () => {
loading.value = true
const query_data = {
Status: queryData.value.status || '',
Phone: queryData.value.word || '',
StartTime: queryData.value.time === null ? '' : queryData.value.time[0] || '',
EndTime: queryData.value.time === null ? '' : queryData.value.time[1] || '',
}
const res = await api.getData({
pageNum: pagination.value.page,
pageSize: pagination.value.pageSize,
...query_data,
})
data.value = res.data.data || []
pagination.value.itemCount = res.data.total
cardData.value.total = res.data.all
cardData.value.service = res.data.audit_integral
cardData.value.count = res.data.success_integral
loading.value = false
}
const clear = async () => {
model.value = {
img: [],
}
showModal.value = false
formRef.value?.restoreValidation()
await getList()
}
const ok = () => {
formRef.value?.validate(async (errors) => {
if (!errors) {
const res = await api.passAudit({
bid: nowRow.value.bid,
wid: nowRow.value.wid,
img: model.value.img[0].url,
status: 1,
})
$message.success(res.msg)
clear()
}
})
}
const refuse = async () => {
const res = await api.passAudit({
bid: nowRow.value.bid,
wid: nowRow.value.wid,
img: model.value.img[0]?.url || '',
status: 2,
})
clear()
$message.success(res.msg)
}
const clearQueryData = () => {
queryData.value = {
status: '',
time: null,
word: '',
}
getList()
}
</script>
<style lang="scss" scoped></style>