293 lines
12 KiB
Vue
293 lines
12 KiB
Vue
<template>
|
|
<div>
|
|
<el-form inline @submit.native.prevent="queryHandle">
|
|
<el-form-item label="用户ID">
|
|
<el-input v-model="query.userId" placeholder="请输入用户ID" />
|
|
</el-form-item>
|
|
<el-form-item label="用户名">
|
|
<el-input v-model="query.userName" placeholder="请输入用户名" />
|
|
</el-form-item>
|
|
<el-form-item label="支付宝账号">
|
|
<el-input v-model="query.zhifubao" placeholder="请输入支付宝账号" />
|
|
</el-form-item>
|
|
<el-form-item label="支付宝姓名">
|
|
<el-input v-model="query.zhifubaoName" placeholder="请输入支付宝姓名" />
|
|
</el-form-item>
|
|
<el-form-item label="提现类型">
|
|
<el-select v-model="query.userType">
|
|
<el-option label="全部" value=""></el-option>
|
|
<el-option label="用户提现" value="1"></el-option>
|
|
<el-option label="分销商提现" value="2"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="状态">
|
|
<el-select v-model="query.state">
|
|
<el-option label="全部" value=""></el-option>
|
|
<el-option label="待转账" value="0"></el-option>
|
|
<el-option label="成功" value="1"></el-option>
|
|
<el-option label="失败" value="2"></el-option>
|
|
<el-option label="待审核" value="3"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="日期">
|
|
<el-date-picker v-model="timeValue" type="datetimerange" range-separator="至" start-placeholder="开始日期"
|
|
end-placeholder="结束日期" @change="changeTime" :default-time="['00:00:00', '23:59:59']">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" @click="queryHandle">查询</el-button>
|
|
<el-button @click="resetHandle">重置</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-table v-loading="tableData.loading" :data="tableData.list" border stripe>
|
|
<el-table-column label="ID" prop="id" width="80"></el-table-column>
|
|
<el-table-column label="用户ID" prop="userId" width="100"></el-table-column>
|
|
<el-table-column label="用户名" prop="userName" width="200">
|
|
<template slot-scope="scope">
|
|
<template v-if="scope.row.relationId">
|
|
<div class="danger_user">
|
|
<div class="user_info">
|
|
<i class="icon el-icon-warning"></i>
|
|
危险用户：{{ scope.row.userName }}
|
|
</div>
|
|
<el-tag type="danger" disable-transitions>{{ scope.row.relationId }}</el-tag>
|
|
</div>
|
|
</template>
|
|
<template v-else>
|
|
{{ scope.row.userName }}
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="提现信息" width="200">
|
|
<template slot-scope="scope">
|
|
<div>提现金额：￥{{ scope.row.money }}</div>
|
|
<div>手续费：￥{{ scope.row.rate }}</div>
|
|
<div style="margin-top: 6px;">
|
|
提现类型：
|
|
<span v-if="scope.row.userType == 1">用户提现</span>
|
|
<span v-if="scope.row.userType == 2">代理提现</span>
|
|
</div>
|
|
<div>订单编号：{{ scope.row.orderNumber }}</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="提现统计" width="200">
|
|
<template slot-scope="scope">
|
|
<div>成功提现金额：￥{{ scope.row.total }}</div>
|
|
<div>成功提现次数：{{ scope.row.count }}</div>
|
|
<div style="margin-top: 6px;">待审提现金额合计：￥{{ scope.row.verifyTotal }}</div>
|
|
<div>待审提现申请笔数：{{ scope.row.verifyCount }}</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="支付宝信息" prop="zhifubao" width="200">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.zhifubaoName }} / {{ scope.row.zhifubao }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="申请时间" prop="createAt" width="200"></el-table-column>
|
|
<el-table-column label="转账时间" prop="outAt" width="200"></el-table-column>
|
|
<el-table-column label="状态" prop="state" width="200">
|
|
<template slot-scope="scope">
|
|
<el-tag type="warning" v-if="scope.row.state == 0" disable-transitions>
|
|
待转账
|
|
</el-tag>
|
|
<el-tag type="success" v-if="scope.row.state == 1" disable-transitions>
|
|
成功
|
|
</el-tag>
|
|
<div style="display: flex;flex-direction: column;" v-if="scope.row.state == 2">
|
|
<div>
|
|
<el-tag type="danger" disable-transitions>
|
|
失败：{{ scope.row.refund }}
|
|
</el-tag>
|
|
</div>
|
|
</div>
|
|
<el-tag type="warning" v-if="scope.row.state == 3" disable-transitions>
|
|
待审核
|
|
</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center" width="100" fixed="right">
|
|
<template slot-scope="scope">
|
|
<el-button type="text" size="mini" @click="deliverHandle(scope.row)" v-if="scope.row.state == 3">
|
|
待审核
|
|
</el-button>
|
|
<el-button type="text" disabled v-else>已审核</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<div class="pagination">
|
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
:page-sizes="[10, 20, 30, 40]" :page-size="tableData.limit" :current-page="tableData.page"
|
|
layout="total,sizes, prev, pager, next,jumper" :total="tableData.total">
|
|
</el-pagination>
|
|
</div>
|
|
<el-dialog title="提现审核" width="600px" :visible.sync="visible" @close="onClose">
|
|
<el-form :model="form" :rules="rules" ref="form" label-width="80px" label-position="left">
|
|
<el-form-item label="审核" prop="isAgree">
|
|
<el-radio-group v-model="form.isAgree">
|
|
<el-radio label="1"> 同意 </el-radio>
|
|
<el-radio label="0"> 拒绝 </el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="备注" prop="refund" v-if="form.isAgree == 0">
|
|
<el-input v-model="form.refund" placeholder="拒绝原因"></el-input>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<div class="dialog-footer" style="display: flex; justify-content: flex-end;">
|
|
<el-button size="small" @click="visible = false"> 取 消 </el-button>
|
|
<el-button size="small" type="primary" :loading="confirmLoading"
|
|
@click="confirmHandle">确定</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { cashOutAuditPage, cashOutAuditAudit } from "@/api/withdraw.js";
|
|
export default {
|
|
data() {
|
|
return {
|
|
timeValue: [],
|
|
query: {
|
|
userId: "",
|
|
userName: "",
|
|
userType: '',
|
|
zhifubao: "",
|
|
zhifubaoName: "",
|
|
state: "",
|
|
startTime: "",
|
|
endTime: ""
|
|
},
|
|
resetQuery: {},
|
|
tableData: {
|
|
page: 1,
|
|
limit: 10,
|
|
total: 0,
|
|
list: [],
|
|
loading: false
|
|
},
|
|
visible: false,
|
|
confirmLoading: false,
|
|
form: {
|
|
id: "",
|
|
isAgree: "1",
|
|
refund: "",
|
|
userId: ''
|
|
},
|
|
rules: {
|
|
isAgree: [],
|
|
refund: [
|
|
{ required: true, message: "请输入拒绝原因", trigger: "blur" }
|
|
]
|
|
}
|
|
};
|
|
},
|
|
mounted() {
|
|
this.resetQuery = { ...this.query };
|
|
this.cashOutAuditPage();
|
|
},
|
|
methods: {
|
|
// 关闭弹窗, 重置表单
|
|
onClose() {
|
|
this.$refs.form.resetFields();
|
|
},
|
|
// 打开发放奖品弹窗
|
|
deliverHandle(row) {
|
|
this.form.id = row.id;
|
|
this.form.userId = row.userId
|
|
this.visible = true;
|
|
},
|
|
// 提交发放奖品
|
|
confirmHandle() {
|
|
this.$refs.form.validate(async valid => {
|
|
if (valid) {
|
|
this.confirmLoading = true;
|
|
try {
|
|
const { data } = await cashOutAuditAudit(this.form);
|
|
if (data.code == 0) {
|
|
this.$message.success("审核成功");
|
|
this.visible = false;
|
|
this.cashOutAuditPage();
|
|
} else {
|
|
this.$message.error(data.msg || "审核失败");
|
|
}
|
|
} catch (error) {
|
|
console.log(error);
|
|
}
|
|
this.confirmLoading = false;
|
|
}
|
|
});
|
|
},
|
|
// 开始查询
|
|
queryHandle() {
|
|
this.tableData.page = 1;
|
|
this.cashOutAuditPage();
|
|
},
|
|
// 重置查询
|
|
resetHandle() {
|
|
this.query = { ...this.resetQuery };
|
|
this.timeValue = [];
|
|
this.cashOutAuditPage();
|
|
},
|
|
// 确认选择日期
|
|
changeTime() {
|
|
if (this.timeValue.length == 2) {
|
|
this.query.startTime = this.timeValue[0];
|
|
this.query.endTime = this.timeValue[1];
|
|
} else {
|
|
this.query.startTime = "";
|
|
this.query.endTime = "";
|
|
}
|
|
},
|
|
// 分页数量
|
|
handleSizeChange(size) {
|
|
this.tableData.limit = size;
|
|
this.cashOutAuditPage();
|
|
},
|
|
// 分页
|
|
handleCurrentChange(val) {
|
|
this.tableData.page = val;
|
|
this.cashOutAuditPage();
|
|
},
|
|
// 获取列表
|
|
async cashOutAuditPage() {
|
|
try {
|
|
this.tableData.loading = true;
|
|
const { data } = await cashOutAuditPage({
|
|
...this.query,
|
|
page: this.tableData.page,
|
|
limit: this.tableData.limit
|
|
});
|
|
this.tableData.loading = false;
|
|
this.tableData.list = data.page.list;
|
|
this.tableData.total = data.page.totalCount;
|
|
} catch (error) {
|
|
this.tableData.loading = false;
|
|
console.log(error);
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.danger_user {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
|
|
.user_info {
|
|
display: flex;
|
|
align-items: center;
|
|
$color: #F56C6C;
|
|
color: $color;
|
|
gap: 4px;
|
|
|
|
.icon {
|
|
color: $color;
|
|
}
|
|
}
|
|
}
|
|
</style>
|