|
|
@@ -0,0 +1,210 @@
|
|
|
+<template>
|
|
|
+ <div class="layout-padding">
|
|
|
+ <div class="layout-padding-auto layout-padding-view">
|
|
|
+ <el-row class="ml10" v-show="showSearch">
|
|
|
+ <el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList" ref="queryRef">
|
|
|
+ <el-form-item label="商户名称" prop="merchantName">
|
|
|
+ <el-input placeholder="请输入商户名称" style="max-width: 180px" v-model="state.queryForm.merchantName" clearable />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="银行账号" prop="bankAccount">
|
|
|
+ <el-input placeholder="请输入银行账号" style="max-width: 180px" v-model="state.queryForm.bankAccount" clearable />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="真实姓名" prop="realName">
|
|
|
+ <el-input placeholder="请输入真实姓名" style="max-width: 180px" v-model="state.queryForm.realName" clearable />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="审核状态" prop="auditStatus">
|
|
|
+ <el-select v-model="state.queryForm.auditStatus" placeholder="请选择审核状态" style="max-width: 180px" clearable>
|
|
|
+ <el-option label="待审核" :value="0" />
|
|
|
+ <el-option label="通过" :value="1" />
|
|
|
+ <el-option label="拒绝" :value="2" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="申请时间" prop="dateRange">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dateRange"
|
|
|
+ type="datetimerange"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始时间"
|
|
|
+ end-placeholder="结束时间"
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ style="max-width: 360px"
|
|
|
+ @change="handleDateChange"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button @click="getDataList" icon="search" type="primary">查询</el-button>
|
|
|
+ <el-button @click="resetQuery" icon="Refresh">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <div class="mb8" style="width: 100%">
|
|
|
+ <right-toolbar
|
|
|
+ @queryTable="getDataList"
|
|
|
+ class="ml10"
|
|
|
+ style="float: right; margin-right: 20px"
|
|
|
+ v-model:showSearch="showSearch"
|
|
|
+ ></right-toolbar>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ :data="state.dataList"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ @sort-change="sortChangeHandle"
|
|
|
+ style="width: 100%"
|
|
|
+ v-loading="state.loading"
|
|
|
+ border
|
|
|
+ :cell-style="tableStyle.cellStyle"
|
|
|
+ :header-cell-style="tableStyle.headerCellStyle"
|
|
|
+ >
|
|
|
+ <el-table-column align="center" type="selection" width="40" />
|
|
|
+ <el-table-column label="商户名称" prop="merchantName" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.merchantName || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="提现金额" prop="amount" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ <span style="color: #f56c6c; font-weight: bold">¥{{ scope.row.amount ? scope.row.amount.toFixed(2) : '0.00' }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="提现类型" prop="type" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="scope.row.type === 1 ? 'primary' : 'success'" size="small">
|
|
|
+ {{ scope.row.type === 1 ? '银行卡' : 'U' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="银行名称" prop="bankName" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.bankName || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="银行账号" prop="bankAccount" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.bankAccount || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="真实姓名" prop="realName" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.realName || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="申请时间" prop="applyTime" show-overflow-tooltip width="180">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.applyTime || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="审核状态" prop="auditStatus" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="auditStatusMap[scope.row.auditStatus]?.type || 'info'" size="small">
|
|
|
+ {{ auditStatusMap[scope.row.auditStatus]?.label || '--' }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="拒绝原因" prop="failReason" show-overflow-tooltip>
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.failReason || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="创建时间" prop="createdTime" show-overflow-tooltip width="180">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.createdTime || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" fixed="right" width="150">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button
|
|
|
+ v-if="scope.row.auditStatus === 0"
|
|
|
+ icon="Check"
|
|
|
+ @click="handleAudit(scope.row)"
|
|
|
+ text
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ >
|
|
|
+ 审核
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination @current-change="currentChangeHandle" @size-change="sizeChangeHandle" v-bind="state.pagination" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 审核弹窗 -->
|
|
|
+ <audit-dialog ref="auditDialogRef" @refresh="getDataList" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts" name="settlementMerchantWithdraw" setup>
|
|
|
+import { BasicTableProps, useTable } from '/@/hooks/table';
|
|
|
+import { fetchMerchantWithdrawList } from '/@/api/order';
|
|
|
+
|
|
|
+// 引入组件
|
|
|
+const AuditDialog = defineAsyncComponent(() => import('./audit.vue'));
|
|
|
+
|
|
|
+// 审核状态映射
|
|
|
+const auditStatusMap: Record<number, { label: string; type: any }> = {
|
|
|
+ 0: { label: '待审核', type: 'warning' },
|
|
|
+ 1: { label: '通过', type: 'success' },
|
|
|
+ 2: { label: '拒绝', type: 'danger' },
|
|
|
+};
|
|
|
+
|
|
|
+
|
|
|
+// 定义变量内容
|
|
|
+const auditDialogRef = ref();
|
|
|
+const queryRef = ref();
|
|
|
+const showSearch = ref(true);
|
|
|
+const selectObjs = ref([]);
|
|
|
+const multiple = ref(true);
|
|
|
+const dateRange = ref<any>([]);
|
|
|
+
|
|
|
+// 定义表格查询、变更
|
|
|
+const state: BasicTableProps = reactive<BasicTableProps>({
|
|
|
+ queryForm: {
|
|
|
+ merchantName: '',
|
|
|
+ bankAccount: '',
|
|
|
+ realName: '',
|
|
|
+ auditStatus: undefined,
|
|
|
+ startTime: '',
|
|
|
+ endTime: '',
|
|
|
+ },
|
|
|
+ pageList: fetchMerchantWithdrawList,
|
|
|
+ descs: ['created_time'],
|
|
|
+});
|
|
|
+
|
|
|
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, tableStyle } = useTable(state);
|
|
|
+
|
|
|
+// 处理日期范围变化
|
|
|
+const handleDateChange = (val: any) => {
|
|
|
+ if (val && val.length === 2) {
|
|
|
+ state.queryForm.startTime = val[0];
|
|
|
+ state.queryForm.endTime = val[1];
|
|
|
+ } else {
|
|
|
+ state.queryForm.startTime = '';
|
|
|
+ state.queryForm.endTime = '';
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 重置查询
|
|
|
+const resetQuery = () => {
|
|
|
+ queryRef.value?.resetFields();
|
|
|
+ dateRange.value = [];
|
|
|
+ state.queryForm.startTime = '';
|
|
|
+ state.queryForm.endTime = '';
|
|
|
+ getDataList();
|
|
|
+};
|
|
|
+
|
|
|
+// 多选事件
|
|
|
+const handleSelectionChange = (objs: any) => {
|
|
|
+ selectObjs.value = objs.map((val: any) => val.id);
|
|
|
+ multiple.value = !objs.length;
|
|
|
+};
|
|
|
+
|
|
|
+// 审核
|
|
|
+const handleAudit = (row: any) => {
|
|
|
+ auditDialogRef.value.openDialog(row);
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped></style>
|