2023-09-18 09:59:02 +08:00

259 lines
7.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div>
<el-card class="!border-none mb-4" shadow="never">
<el-form class="mb-[-16px]" :model="queryParams" inline>
<el-form-item label="订单编号" prop="order_sn">
<el-input
class="w-[280px]"
v-model="queryParams.order_sn"
clearable
placeholder="请输入订单编号"
/>
</el-form-item>
<el-form-item label="用户" prop="nickname">
<el-input
class="w-[280px]"
v-model="queryParams.nickname"
clearable
placeholder="请输入"
/>
</el-form-item>
<el-form-item label="提现金额" prop="amount">
<el-input
class="w-[280px]"
v-model="queryParams.amount"
clearable
placeholder="请输入提现金额"
/>
</el-form-item>
<el-form-item label="状态:" prop="status">
<el-select
v-model="queryParams.status"
clearable
placeholder="请选择状态"
>
<el-option
v-for="item in statusList"
:key="item.label"
:value="item.id"
:label="item.name"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button>
<el-button @click="resetParams">重置</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card class="!border-none" v-loading="pager.loading" shadow="never">
<!--
<el-button v-perms="['withdraw/add']" type="primary" @click="handleAdd">
<template #icon>
<icon name="el-icon-Plus" />
</template>
新增
</el-button>
<el-button
v-perms="['withdraw/delete']"
:disabled="!selectData.length"
@click="handleDelete(selectData)"
>
删除
</el-button> -->
<div class="mt-4">
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
<!-- <el-table-column type="selection" width="55" /> -->
<el-table-column label="ID" prop="id" width="110" />
<el-table-column
label="订单编号"
prop="order_sn"
show-overflow-tooltip
/>
<el-table-column
label="公司"
prop="company_name"
show-overflow-tooltip
/>
<el-table-column label="用户" prop="nickname" show-overflow-tooltip />
<el-table-column
label="提现金额"
prop="amount"
show-overflow-tooltip
/>
<el-table-column label="状态" prop="status" show-overflow-tooltip>
<template #default="{ row }">
<span v-if="row.status == 0" style="color: #e6a23c">待审核</span>
<span v-if="row.status == 1" style="color: #409eff">通过</span>
<span v-if="row.status == 2" style="color: #f56c6c">拒绝</span>
<span v-if="row.status == 3" style="color: #67c23a">已转账</span>
</template>
</el-table-column>
<el-table-column
label="提现时间"
prop="create_time"
show-overflow-tooltip
/>
<el-table-column
label="备注"
prop="deny_desc"
show-overflow-tooltip
/>
<el-table-column label="操作" width="120" fixed="right">
<template #default="{ row }">
<!-- <el-button
v-perms="['withdraw/edit']"
type="primary"
link
@click="handleEdit(row)"
>
编辑
</el-button>
<el-button
v-perms="['withdraw/delete']"
type="danger"
link
@click="handleDelete(row.id)"
>
删除
</el-button>
-->
<el-button
v-perms="['withdraw/audit']"
type="primary"
link
v-if="row.status == 0"
@click="handleAudit(row, true)"
>
审核
</el-button>
<el-button
v-perms="['withdraw/audit']"
type="primary"
link
v-else
@click="handleAudit(row, false)"
>
详情
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="flex mt-4 justify-end">
<pagination v-model="pager" @change="getLists" />
</div>
</el-card>
<edit-popup
v-if="showEdit"
ref="editRef"
:dict-data="dictData"
@success="getLists"
@close="showEdit = false"
/>
<audit-popup
v-if="showAudit"
ref="auditRef"
:dict-data="dictData"
@success="getLists"
@close="showAudit = false"
/>
</div>
</template>
<script lang="ts" setup name="withdrawLists">
import { usePaging } from "@/hooks/usePaging";
import { useDictData } from "@/hooks/useDictOptions";
import { apiWithdrawLists, apiWithdrawDelete } from "@/api/withdraw";
import { timeFormat } from "@/utils/util";
import feedback from "@/utils/feedback";
import EditPopup from "./edit.vue";
import AuditPopup from "./audit.vue";
const editRef = shallowRef<InstanceType<typeof EditPopup>>();
const auditRef = shallowRef<InstanceType<typeof AuditPopup>>();
// 是否显示编辑框
const showEdit = ref(false);
const showAudit = ref(false);
// 查询条件
const queryParams = reactive({
order_sn: "",
user_id: "",
nickname: "",
company_name: "",
admin_id: "",
amount: "",
status: "",
});
// 状态0待审核1通过2拒绝3已转账
const statusList = ref([
{
id: 0,
name: "待审核",
},
{
id: 1,
name: "通过",
},
{
id: 2,
name: "拒绝",
},
{
id: 3,
name: "已转账",
},
]);
// 选中数据
const selectData = ref<any[]>([]);
// 表格选择后回调事件
const handleSelectionChange = (val: any[]) => {
selectData.value = val.map(({ id }) => id);
};
// 获取字典数据
const { dictData } = useDictData("");
// 分页相关
const { pager, getLists, resetParams, resetPage } = usePaging({
fetchFun: apiWithdrawLists,
params: queryParams,
});
// 添加
const handleAdd = async () => {
showEdit.value = true;
await nextTick();
editRef.value?.open("add");
};
// 编辑
const handleEdit = async (data: any) => {
showEdit.value = true;
await nextTick();
editRef.value?.open("edit");
editRef.value?.setFormData(data);
};
// 审核
const handleAudit = async (data: any, type: boolean) => {
showAudit.value = true;
await nextTick();
auditRef.value?.open(type ? "audit" : "detail");
auditRef.value?.setFormData(data);
};
// 删除
const handleDelete = async (id: number | any[]) => {
await feedback.confirm("确定要删除?");
await apiWithdrawDelete({ id });
getLists();
};
getLists();
</script>