|
@@ -1,6 +1,38 @@
|
|
|
<template>
|
|
|
<div class="app-container">
|
|
|
- <!-- 顶部卡片 -->
|
|
|
+ <!-- 查询和其他操作 -->
|
|
|
+ <div class="filter-container">
|
|
|
+ <el-select
|
|
|
+ v-model="listQuery.condition" size="mini" class="filter-item"
|
|
|
+ style="width: 200px;" placeholder="请选择汇款类型"
|
|
|
+ >
|
|
|
+ <el-option label="日汇款" value="1" />
|
|
|
+ <el-option label="月汇款" value="2" />
|
|
|
+ </el-select>
|
|
|
+ <el-select
|
|
|
+ v-model="listQuery.paymentMode" size="mini" class="filter-item"
|
|
|
+ style="width: 200px;margin-left: 10px;" placeholder="请选择类型"
|
|
|
+ >
|
|
|
+ <el-option label="普通订单" :value="1" />
|
|
|
+ <el-option label="消费金" :value="2" />
|
|
|
+ <el-option label="代金券" :value="3" />
|
|
|
+ <el-option label="余额" :value="4" />
|
|
|
+ <el-option label="佣金" :value="5" />
|
|
|
+ </el-select>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="listQuery.time" type="month" placeholder="选择日期" size="mini"
|
|
|
+ class="filter-item" value-format="yyyy-MM"
|
|
|
+ style="margin-left: 10px;line-height: 1;"
|
|
|
+ />
|
|
|
+ <el-button
|
|
|
+ size="mini" class="filter-item" type="primary" icon="el-icon-search"
|
|
|
+ style="margin-left:10px;"
|
|
|
+ @click="getList"
|
|
|
+ >
|
|
|
+ 查找
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
<div>
|
|
|
<el-card>
|
|
|
<div slot="header">
|
|
@@ -14,6 +46,7 @@
|
|
|
<el-button type="primary" @click="handleWithdrawal">提现</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
<div>
|
|
|
<div style="font-size: 18px;font-weight: bold;">基本数据</div>
|
|
|
<div style="display: flex;justify-content: space-around;align-items: center;text-align: center;">
|
|
@@ -31,6 +64,12 @@
|
|
|
</div>
|
|
|
<div style="padding: 8px;">
|
|
|
<div style="font-size: 30px;font-weight: bold;color: #ffae11;margin-bottom: 6px;">
|
|
|
+ {{ financialData.alreadyArrived || '0' }}
|
|
|
+ </div>
|
|
|
+ <div style="font-size: 16px;color: #333333;">已提现金额</div>
|
|
|
+ </div>
|
|
|
+ <div style="padding: 8px;">
|
|
|
+ <div style="font-size: 30px;font-weight: bold;color: #ffae11;margin-bottom: 6px;">
|
|
|
{{ financialData.withdrawableMoney || '0' }}
|
|
|
</div>
|
|
|
<div style="font-size: 16px;color: #333333;">可提现金额(元)</div>
|
|
@@ -50,7 +89,9 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
- <div class="correlation" style="font-size: 18px;font-weight: bold;">
|
|
|
+ <div
|
|
|
+ style="display: flex;align-items: center;padding: 10px 0px;font-size: 18px;font-weight: bold;"
|
|
|
+ >
|
|
|
<span>消费金相关</span>
|
|
|
<el-tooltip placement="top" effect="light">
|
|
|
<div slot="content" style="font-size: 18px;">
|
|
@@ -59,7 +100,7 @@
|
|
|
可提现:客户已支付已核销订单的消费金可提现金额(按照提现比例折算);<br />
|
|
|
待到账冻结:客户已支付未核销订单的消费金支付金额;<br />
|
|
|
</div>
|
|
|
- <div class="icon">
|
|
|
+ <div style="color: rgb(255, 174, 17);">
|
|
|
<i class="el-icon-warning-outline" :size="34"></i>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
@@ -99,7 +140,9 @@
|
|
|
</div>
|
|
|
<div>
|
|
|
<div style="font-size: 18px;font-weight: bold;">代金券相关</div>
|
|
|
- <div style="display: flex;justify-content: space-around;align-items: center;flex-wrap: wrap;text-align: center;">
|
|
|
+ <div
|
|
|
+ style="display: flex;justify-content: space-around;align-items: center;flex-wrap: wrap;text-align: center;"
|
|
|
+ >
|
|
|
<div style="padding: 8px;">
|
|
|
<div style="font-size: 30px;font-weight: bold;color: #ffae11;margin-bottom: 6px;">
|
|
|
{{ financialData.voucherTurnover || '0' }}
|
|
@@ -147,7 +190,9 @@
|
|
|
</div>
|
|
|
<div>
|
|
|
<div style="font-size: 18px;font-weight: bold;">余额相关</div>
|
|
|
- <div style="display: flex;justify-content: space-around;align-items: center;flex-wrap: wrap;text-align: center;">
|
|
|
+ <div
|
|
|
+ style="display: flex;justify-content: space-around;align-items: center;flex-wrap: wrap;text-align: center;"
|
|
|
+ >
|
|
|
<div style="padding: 8px;">
|
|
|
<div style="font-size: 30px;font-weight: bold;color: #ffae11;margin-bottom: 6px;">
|
|
|
{{ financialData.rechargeTurnover || '0' }}
|
|
@@ -183,80 +228,52 @@
|
|
|
</el-card>
|
|
|
</div>
|
|
|
<!-- 选项卡 -->
|
|
|
- <div style="position: relative;">
|
|
|
- <div style="position: absolute;top: 6px;right: 20px;z-index: 999;">
|
|
|
- <el-select
|
|
|
- v-model="listQuery.paymentMode" size="mini" class="filter-item"
|
|
|
- style="width: 200px;margin-left: 10px;" placeholder="请选择类型"
|
|
|
- @change="getList()"
|
|
|
- >
|
|
|
- <el-option label="普通订单" value="1" />
|
|
|
- <el-option label="消费金" value="2" />
|
|
|
- <el-option label="代金券" value="3" />
|
|
|
- <el-option label="余额" value="4" />
|
|
|
- </el-select>
|
|
|
- <el-date-picker
|
|
|
- v-model="listQuery.time" type="month" placeholder="选择日期" size="mini"
|
|
|
- style="margin-left: 10px;line-height: 1;" value-format="yyyy-MM"
|
|
|
- @change="getList()"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <el-tabs v-model="listQuery.condition" @tab-click="getList()">
|
|
|
- <el-tab-pane label="日汇款" name="1" />
|
|
|
- <el-tab-pane label="月汇款" name="2" />
|
|
|
- <!-- <el-tab-pane label="交易金流水" name="3" /> -->
|
|
|
- </el-tabs>
|
|
|
- <div>
|
|
|
- <el-table
|
|
|
- ref="multipleTable" :data="financialData.finances" border
|
|
|
- :header-cell-style="{ background: '#EEF3FF', color: '#333333' }" tooltip-effect="dark" style="width: 100%"
|
|
|
- >
|
|
|
- <el-table-column label="日期" width="220">
|
|
|
- <template slot-scope="scope">{{ scope.row.time }}</template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="income" label="收入(元)" width="220" />
|
|
|
- <el-table-column prop="expenditure" label="支出(元)" show-overflow-tooltip />
|
|
|
- <el-table-column label="操作" show-overflow-tooltip>
|
|
|
- <template slot-scope="scope">
|
|
|
- <div class="btnList">
|
|
|
- <el-button type="text" @click="seeMore(scope.row)">查看</el-button>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
+ <div>
|
|
|
+ <el-table
|
|
|
+ ref="multipleTable" :data="financialData.finances" border
|
|
|
+ :header-cell-style="{ background: '#EEF3FF', color: '#333333' }" tooltip-effect="dark" style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-table-column label="日期" width="220">
|
|
|
+ <template slot-scope="scope">{{ scope.row.time }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="income" label="收入(元)" width="220" />
|
|
|
+ <el-table-column prop="expenditure" label="支出(元)" show-overflow-tooltip />
|
|
|
+ <el-table-column label="操作" show-overflow-tooltip>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="btnList">
|
|
|
+ <el-button type="text" @click="seeMore(scope.row)">查看</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
</div>
|
|
|
|
|
|
<el-dialog title="提现" :visible.sync="isVisible" width="50%">
|
|
|
+ <p style="margin-left: 50px;">
|
|
|
+ <span>提现至:</span>
|
|
|
+ <span v-if="Number(privacyTime) === 0">
|
|
|
+ {{ bankDetails.bankCard &&
|
|
|
+ bankDetails.bankCard.replace(/\s/g, '')
|
|
|
+ .replace(/(\d{4})\d+(\d{4})$/, "$1 **** **** $2") }}
|
|
|
+ </span>
|
|
|
+ <span v-else>{{ bankDetails.bankCard }}</span>
|
|
|
+ <span style="margin-left: 40px;">{{ bankDetails.bankName }}</span>
|
|
|
+ </p>
|
|
|
<el-form v-if="show" ref="formData" :model="formData" label-width="120px" size="small" :rules="rules">
|
|
|
- <p class="text_tip">
|
|
|
- <span>提现至:</span>
|
|
|
- <span v-if="Number(privacyTime) === 0">
|
|
|
- {{ bankDetails.bankCard &&
|
|
|
- bankDetails.bankCard.replace(/\s/g, '')
|
|
|
- .replace(/(\d{4})\d+(\d{4})$/, "$1 **** **** $2") }}
|
|
|
- </span>
|
|
|
- <span v-else>{{ bankDetails.bankCard }}</span>
|
|
|
- <span style="margin-left: 40px;">{{ bankDetails.bankName }}</span>
|
|
|
- </p>
|
|
|
<el-form-item label="提现类型" prop="withdrawalType">
|
|
|
- <el-radio-group v-model="formData.withdrawalType">
|
|
|
- <el-radio :label="1">正常支付订单</el-radio>
|
|
|
- <el-radio :label="2">交易金</el-radio>
|
|
|
+ <el-radio-group v-model="formData.withdrawalType" @input="handleWithdrawalSearch">
|
|
|
+ <el-radio :label="1">普通订单</el-radio>
|
|
|
+ <el-radio :label="2">消费金</el-radio>
|
|
|
<el-radio :label="3">代金券</el-radio>
|
|
|
- <el-radio :label="4">平台余额</el-radio>
|
|
|
+ <el-radio :label="4">余额</el-radio>
|
|
|
+ <el-radio :label="5">佣金</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="提现金额" prop="withdrawalMoney">
|
|
|
- <el-col :span="16">
|
|
|
- <el-input
|
|
|
- v-model="formData.withdrawalMoney" maxlength="9"
|
|
|
- :placeholder="`可提现金额:${formData.withdrawalType === 1 ? financialData.withdrawableMoney : formData.withdrawalType === 2 ? financialData.beeWithdrawal : '--'}`"
|
|
|
- />
|
|
|
- </el-col>
|
|
|
- <el-col :span="6" style="text-align:center">
|
|
|
- <el-button type="warning" @click="getAllwithdrawalAmount">全部提现</el-button>
|
|
|
- </el-col>
|
|
|
+ <el-input
|
|
|
+ v-model="formData.withdrawalMoney" maxlength="9" disabled
|
|
|
+ placeholder="请输入提现金额(只能全部提现)"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<p v-else class="tips">您的账户尚未绑定银行卡,无法提现</p>
|
|
@@ -336,11 +353,16 @@ export default {
|
|
|
name: 'List',
|
|
|
data() {
|
|
|
return {
|
|
|
- moneydio: false,
|
|
|
+ listQuery: {
|
|
|
+ condition: '1', // 时间条件 1-日汇总 2-月汇总
|
|
|
+ time: '', // 时间值
|
|
|
+ paymentMode: 1
|
|
|
+ },
|
|
|
financialData: {
|
|
|
finances: [],
|
|
|
turnover: 0,
|
|
|
frozenMoney: 0,
|
|
|
+ alreadyArrived: 0,
|
|
|
withdrawableMoney: 0,
|
|
|
withdrawableStayMoney: 0,
|
|
|
presenterVoucher: 0,
|
|
@@ -364,10 +386,21 @@ export default {
|
|
|
presenterRechargeVoucher: 0, // 余额赠送代金券
|
|
|
ordersForRechargeWithdrawal: [] // 余额支付金额(可提现)的相关订单
|
|
|
},
|
|
|
+
|
|
|
+ privacyTime: 0,
|
|
|
formData: {
|
|
|
- withdrawalType: 1,
|
|
|
+ withdrawalType: '',
|
|
|
withdrawalMoney: ''
|
|
|
},
|
|
|
+ rules: {
|
|
|
+ withdrawalType: [ { required: true, message: '请选择提现类型', trigger: 'blur' } ],
|
|
|
+ withdrawalMoney: [ { required: true, message: '请输入提现金额', trigger: 'blur' } ]
|
|
|
+ },
|
|
|
+ isVisible: false,
|
|
|
+ show: false,
|
|
|
+ bankDetails: {},
|
|
|
+
|
|
|
+ moneydio: false,
|
|
|
moneyForm: {
|
|
|
time: '',
|
|
|
income: '',
|
|
@@ -375,22 +408,8 @@ export default {
|
|
|
page: 1,
|
|
|
pageSize: 10
|
|
|
},
|
|
|
- total: 1,
|
|
|
- rules: {
|
|
|
- withdrawalType: [ { required: true, message: '请选择提现类型', trigger: 'blur' } ],
|
|
|
- withdrawalMoney: [ { required: true, message: '请输入提现金额', trigger: 'blur' } ]
|
|
|
- },
|
|
|
- listQuery: {
|
|
|
- condition: '1', // 时间条件 1-日汇总 2-月汇总
|
|
|
- time: '', // 时间值
|
|
|
- // paymentMode:4
|
|
|
- paymentMode: '1'
|
|
|
- },
|
|
|
tableDatas: [],
|
|
|
- isVisible: false,
|
|
|
- bankDetails: {},
|
|
|
- show: false,
|
|
|
- privacyTime: 0
|
|
|
+ total: 0
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
@@ -398,17 +417,20 @@ export default {
|
|
|
this.getList()
|
|
|
},
|
|
|
methods: {
|
|
|
- seeMore(row) {
|
|
|
- this.moneydio = true
|
|
|
- this.moneyForm.time = row.time
|
|
|
- this.moneyForm.page = 1
|
|
|
- this.total = 1
|
|
|
- this.tableDatas = []
|
|
|
- this.getInfo()
|
|
|
+ async getList() {
|
|
|
+ const loading = this.$loading({ text: '加载中' })
|
|
|
+ try {
|
|
|
+ const res = await getFinanceCount(this.listQuery)
|
|
|
+ this.financialData = res.data
|
|
|
+ } finally {
|
|
|
+ loading.close()
|
|
|
+ }
|
|
|
},
|
|
|
+
|
|
|
// 提现
|
|
|
async handleWithdrawal() {
|
|
|
this.isVisible = true
|
|
|
+ this.formData.withdrawalType = this.listQuery.paymentMode
|
|
|
this.formData.withdrawalMoney = ''
|
|
|
// const res = await getWithdrawalDetails(this.listQuery);
|
|
|
const res = await getBank({})
|
|
@@ -417,23 +439,18 @@ export default {
|
|
|
} else {
|
|
|
this.show = true
|
|
|
this.bankDetails = res.data
|
|
|
+ this.handleWithdrawalSearch(this.formData.withdrawalType)
|
|
|
}
|
|
|
},
|
|
|
// 提现确定
|
|
|
async handleConfirm() {
|
|
|
if (this.show) {
|
|
|
if (this.formData.withdrawalMoney <= 0) {
|
|
|
- this.$message({
|
|
|
- message: '请输入正确的提现金额',
|
|
|
- type: 'warning'
|
|
|
- })
|
|
|
+ this.$message({ message: '请输入正确的提现金额', type: 'warning' })
|
|
|
return false
|
|
|
}
|
|
|
if (!this.formData.withdrawalType) {
|
|
|
- this.$message({
|
|
|
- message: '请选择提现类型',
|
|
|
- type: 'warning'
|
|
|
- })
|
|
|
+ this.$message({ message: '请选择提现类型', type: 'warning' })
|
|
|
return false
|
|
|
}
|
|
|
const res = await withdrawal({
|
|
@@ -445,13 +462,8 @@ export default {
|
|
|
withdrawalType: this.formData.withdrawalType, // 提现类型
|
|
|
withdrawalMoney: this.formData.withdrawalMoney // 提现金额
|
|
|
})
|
|
|
- if (res.code === '') {
|
|
|
- this.$message({
|
|
|
- message: '成功',
|
|
|
- type: 'success'
|
|
|
- })
|
|
|
- this.isVisible = false
|
|
|
- }
|
|
|
+ this.$message({ message: '成功', type: 'success' })
|
|
|
+ this.isVisible = false
|
|
|
} else {
|
|
|
this.isVisible = false
|
|
|
this.$router.push({
|
|
@@ -459,18 +471,23 @@ export default {
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
- // 全部提现
|
|
|
- getAllwithdrawalAmount() {
|
|
|
- if (this.formData.withdrawalType === 1) {
|
|
|
- this.formData.withdrawalMoney = this.financialData.withdrawableMoney || 0
|
|
|
- } else if (this.formData.withdrawalType === 2) {
|
|
|
- this.formData.withdrawalMoney = this.financialData.beeWithdrawal || 0
|
|
|
+ async handleWithdrawalSearch(e) {
|
|
|
+ const loading = this.$loading({ text: '加载中' })
|
|
|
+ try {
|
|
|
+ const res = await getFinanceCount({ condition: '1', time: '', paymentMode: e })
|
|
|
+ this.formData.withdrawalMoney = res.data.withdrawableMoney
|
|
|
+ } finally {
|
|
|
+ loading.close()
|
|
|
}
|
|
|
},
|
|
|
- // 初始化查询所有数据
|
|
|
- async getList() {
|
|
|
- const res = await getFinanceCount(this.listQuery)
|
|
|
- this.financialData = res.data
|
|
|
+
|
|
|
+ seeMore(row) {
|
|
|
+ this.moneydio = true
|
|
|
+ this.moneyForm.time = row.time
|
|
|
+ this.moneyForm.page = 1
|
|
|
+ this.total = 0
|
|
|
+ this.tableDatas = []
|
|
|
+ this.getInfo()
|
|
|
},
|
|
|
// 查询明细
|
|
|
async getInfo() {
|
|
@@ -487,22 +504,13 @@ export default {
|
|
|
padding: 20px;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
-}
|
|
|
-
|
|
|
-.text_tip {
|
|
|
- margin-left: 50px;
|
|
|
-}
|
|
|
-
|
|
|
-.correlation {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 10px;
|
|
|
- padding: 10px 0px;
|
|
|
|
|
|
- .icon {
|
|
|
- color: rgb(255, 174, 17);
|
|
|
- font-size: 24px;
|
|
|
- cursor: pointer;
|
|
|
+ .filter-container {
|
|
|
+ .filter-item {
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: middle;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|