Skip to content

薪
薪瑞通-前端
Commit 92aabe69 authored by 谢子梦's avatar 谢子梦
Browse files
Options

stage：充值记录

parent 16ac04fc
Hide whitespace changes
Inline Side-by-side
Showing with 147 additions and 43 deletions
src/views/business/salaryAccount/index.vue
View file @ 92aabe69
...@@ -71,8 +71,8 @@ ...@@ -71,8 +71,8 @@
</div> </div>
<div style="width: 90%;"> <div style="width: 90%;">
<el-row> <el-row>
<!-- <el-col :span="12"><el-button style="width:120px;" type="primary"--> <el-col :span="12"><el-button style="width:120px;" type="primary" plain
<!-- plain @click>账单查询</el-button></el-col>--> @click="showBill(ele.cardNo)">充值记录</el-button></el-col>
<el-col :span="12"><el-button style="width:120px;" type="primary" plain <el-col :span="12"><el-button style="width:120px;" type="primary" plain
@click="salarySelection(ele.payAccNo)">去发薪</el-button></el-col> @click="salarySelection(ele.payAccNo)">去发薪</el-button></el-col>
</el-row> </el-row>
...@@ -193,7 +193,8 @@ ...@@ -193,7 +193,8 @@
<el-form-item label="收款账户" prop="payeeAccNo"> <el-form-item label="收款账户" prop="payeeAccNo">
<el-input v-model="aliQRCodeRechargeForm.payeeAccNo" placeholder="请输入收款账号" disabled /> <el-input v-model="aliQRCodeRechargeForm.payeeAccNo" placeholder="请输入收款账号" disabled />
</el-form-item> </el-form-item>
<el-form-item label="付款账户" prop="payerAccNo" v-if="aliQRCodeRechargeForm.bindType && 2 === aliQRCodeRechargeForm.bindType"> <el-form-item label="付款账户" prop="payerAccNo"
v-if="aliQRCodeRechargeForm.bindType && 2 === aliQRCodeRechargeForm.bindType">
<accSelect :bindType="1" v-model="aliQRCodeRechargeForm.payerAccNo"></accSelect> <accSelect :bindType="1" v-model="aliQRCodeRechargeForm.payerAccNo"></accSelect>
</el-form-item> </el-form-item>
<el-form-item label="余额/服务费" prop="rechargeType"> <el-form-item label="余额/服务费" prop="rechargeType">
...@@ -247,7 +248,8 @@ ...@@ -247,7 +248,8 @@
<el-col :span="12"> <el-col :span="12">
<div class="ownRechargeMain"> <div class="ownRechargeMain">
<img class="ownRechargeImage" src="@/assets/images/zfb.png" alt=""> <img class="ownRechargeImage" src="@/assets/images/zfb.png" alt="">
<el-button class="ownRechargeButton" @click="ownAliQRCodeRechargeOpen = false; aliQRCodeRechargeOpen = true">支付宝充值</el-button> <el-button class="ownRechargeButton"
@click="ownAliQRCodeRechargeOpen = false; aliQRCodeRechargeOpen = true">支付宝充值</el-button>
</div> </div>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
...@@ -266,7 +268,7 @@ ...@@ -266,7 +268,7 @@
商户可通过银行转账方式完成对应支付宝专属收款账户的充值。支付宝会为商户的每个支付宝账户提供独立的"专属收款账户"，商户从任一同名银行账户向其对应的"专属收款账户"转账，即可完成充值。 商户可通过银行转账方式完成对应支付宝专属收款账户的充值。支付宝会为商户的每个支付宝账户提供独立的"专属收款账户"，商户从任一同名银行账户向其对应的"专属收款账户"转账，即可完成充值。
</el-col> </el-col>
</el-row> </el-row>
<el-row style=";margin-top: 15px;"> <el-row style="margin-top: 15px;">
<el-col :span="24"> <el-col :span="24">
<span style="font-weight: bold;font-size: 22px;color: #1a1a1a"> <span style="font-weight: bold;font-size: 22px;color: #1a1a1a">
三步完成充值 三步完成充值
...@@ -297,11 +299,11 @@ ...@@ -297,11 +299,11 @@
<el-descriptions-item label="户名">{{ offlineRechargeData.bankAccName <el-descriptions-item label="户名">{{ offlineRechargeData.bankAccName
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="银行">{{ offlineRechargeData.cardBank <el-descriptions-item label="银行">{{ offlineRechargeData.cardBank
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="支行">{{ offlineRechargeData.cardBranch <el-descriptions-item label="支行">{{ offlineRechargeData.cardBranch
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="开户地">{{ offlineRechargeData.cardLocation <el-descriptions-item label="开户地">{{ offlineRechargeData.cardLocation
}}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="联行号">{{ offlineRechargeData.cardDeposit <el-descriptions-item label="联行号">{{ offlineRechargeData.cardDeposit
}}</el-descriptions-item> }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
...@@ -323,19 +325,74 @@ ...@@ -323,19 +325,74 @@
<el-button type="primary" @click="rechargeCoursePanel = false">确 定</el-button> <el-button type="primary" @click="rechargeCoursePanel = false">确 定</el-button>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog title="确认支付" :visible.sync="qrPayPanel.open" width="20%"> <el-dialog title="确认支付" :visible.sync="qrPayPanel.open" width="20%">
<div> <div>
<span style="font-size: 18px;">1、使用手机支付宝扫码支付;</span> <span style="font-size: 18px;">1、使用手机支付宝扫码支付;</span>
<qr-code-component :text="qrPayPanel.payUrl" /> <qr-code-component :text="qrPayPanel.payUrl" />
</div> </div>
<div style="margin-top: 12px;"> <div style="margin-top: 12px;">
<span style="font-size: 18px;">2、通过支付宝官网支付，<a :href="qrPayPanel.payUrl" target="_blank" <span style="font-size: 18px;">2、通过支付宝官网支付，<a :href="qrPayPanel.payUrl" target="_blank"
style="font-size: 20px;color: #409EFF;"><strong>去支付</strong></a>;</span> style="font-size: 20px;color: #409EFF;"><strong>去支付</strong></a>;</span>
</div> </div>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button @click="qrPayPanel.open = false">取 消</el-button> <el-button @click="qrPayPanel.open = false">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog title="充值记录" :visible.sync="billPanel" width="80%">
<el-form :model="billQuery" size="small" :inline="true" label-width="100px">
<el-form-item label="收支类型" prop="tranType">
<el-select v-model="billQuery.tranType" clearable placeholder="请选择">
<el-option label="全部" :value="''" />
<el-option label="收入" :value="1" />
<el-option label="支出" :value="2" />
</el-select>
</el-form-item>
<el-form-item label="时间">
<el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss"
type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="getBillList">搜索</el-button>
</el-form-item>
</el-form>
<el-tabs value="first" @tab-click="billTypeTabClick">
<el-tab-pane label="服务费账单" name="first"></el-tab-pane>
<el-tab-pane label="余额账单" name="second"></el-tab-pane>
</el-tabs>
<el-table v-loading="loading" :data="billDataList">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="账单类型" align="center" prop="billType">
<template slot-scope="scope">
<span v-if="scope.row.billType == 1">服务费账单</span>
<span v-if="scope.row.billType == 2">余额</span>
</template>
</el-table-column>
<el-table-column label="收支类型" align="center" prop="tranType">
<template slot-scope="scope">
<el-button type="success" size="mini" v-if="scope.row.tranType == 1">收入</el-button>
<el-button size="mini" v-if="scope.row.tranType == 2">支出</el-button>
</template>
</el-table-column>
<el-table-column label="金额" align="center" prop="tranAmount">
<template slot-scope="scope">
<span v-if="scope.row.tranType == 1" style="color: rgb(255, 208, 75)">
+ {{ scope.row.tranAmount }}
</span>
<span v-if="scope.row.tranType == 2">
- {{ scope.row.tranAmount }}
</span>
</template>
</el-table-column>
<el-table-column label="时间" align="center" prop="tranTime" width="180" />
</el-table>
<el-pagination small layout="prev, pager, next" :total="billTotal" :page.sync="billQuery.pageNum"
@size-change="handleSizeChange" @current-change="handleCurrentChange" :limit.sync="billQuery.pageSize"
@pagination="getBillList()">
</el-pagination>
<div slot="footer" class="dialog-footer">
<el-button @click="billPanel = false">关 闭</el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
...@@ -343,16 +400,17 @@ ...@@ -343,16 +400,17 @@
import AccSelect from '@/views/business/accInfo/accSelect.vue' import AccSelect from '@/views/business/accInfo/accSelect.vue'
import { listAllAccInfo, getAccAliInfo } from '@/api/business/accInfo' import { listAllAccInfo, getAccAliInfo } from '@/api/business/accInfo'
import { addAccRecharge } from '@/api/business/accRecharge.js' import { addAccRecharge } from '@/api/business/accRecharge.js'
import { addDateRange } from '@/utils/ruoyi'
import QrCodeComponent from '@/components/QrCode.vue' import QrCodeComponent from '@/components/QrCode.vue'
export default { export default {
name: 'SalaryAccount', name: 'SalaryAccount',
components: { QrCodeComponent, AccSelect }, components: { QrCodeComponent, AccSelect },
data() { data() {
return { return {
qrPayPanel: { qrPayPanel: {
open: false, open: false,
payUrl: '' payUrl: ''
}, },
// 账户详情 // 账户详情
accDetail: { accDetail: {
content_style: { content_style: {
...@@ -411,7 +469,21 @@ export default { ...@@ -411,7 +469,21 @@ export default {
}, },
// 线下充值 // 线下充值
rechargeCoursePanel: false, rechargeCoursePanel: false,
offlineRechargeData: {} offlineRechargeData: {},
// 充值记录相关参数
billQuery: {
pageNum: 1,
pageSize: 10,
billType: 1, //账单类型:1-服务费;2-余额
tranType: '', //收支类型:1-收入;2-支出
startTime: '',
endTime: '',
},
dateRange: [formatDate(new Date()), formatDate(new Date())],
billDataList: [],
billTotal: 0,
userInfoName: null,
accountCollection: []
} }
}, },
created() { }, created() { },
...@@ -425,6 +497,38 @@ export default { ...@@ -425,6 +497,38 @@ export default {
} }
}, },
methods: { methods: {
showBill(cardNo) {
this.billQuery.cardNo = cardNo;
this.billPanel = true;
this.getBillList();
},
handleSizeChange(val) {
this.billQuery.pageSize = Number(val)
this.getBillList()
},
handleCurrentChange(val) {
this.billQuery.pageNum = Number(val)
this.getBillList()
},
getBillList() {
if (this.dateRange && this.dateRange.length > 0) {
let searchVal = addDateRange(this.billQuery, this.dateRange)
this.billQuery.startTime = searchVal.params.beginTime.split(" ")[0] + " 00:00:00"
this.billQuery.endTime = searchVal.params.endTime.split(" ")[0] + " 23:59:59"
} else {
this.billQuery.startTime = ''
this.billQuery.endTime = ''
}
this.loading = true
listBill(this.billQuery).then(res => {
if (res.code == 200) {
this.billDataList = res.rows
this.billTotal = res.total
}
}).finally(() => {
this.loading = false
})
},
// 选择线下充值方法 // 选择线下充值方法
offlineRecharge() { offlineRecharge() {
this.ownAliQRCodeRechargeOpen = false this.ownAliQRCodeRechargeOpen = false
...@@ -443,17 +547,17 @@ export default { ...@@ -443,17 +547,17 @@ export default {
}, },
// 点击服务分充值方法-自有 // 点击服务分充值方法-自有
ownServiceChargeRecharge(val) { ownServiceChargeRecharge(val) {
this.aliQRCodeRechargeForm.rechargeType = 1 this.aliQRCodeRechargeForm.rechargeType = 1
this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.aliQRCodeRechargeForm.bindType = val.bindType this.aliQRCodeRechargeForm.bindType = val.bindType
this.ownRechargeTitle = '自有服务费充值' this.ownRechargeTitle = '自有服务费充值'
this.ownAliQRCodeRechargeOpen = true this.ownAliQRCodeRechargeOpen = true
}, },
// 点击余额充值方法-自有 // 点击余额充值方法-自有
ownBalanceRecharge(val) { ownBalanceRecharge(val) {
this.aliQRCodeRechargeForm.rechargeType = 2 this.aliQRCodeRechargeForm.rechargeType = 2
this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo this.aliQRCodeRechargeForm.payeeAccNo = val.payAccNo
this.aliQRCodeRechargeForm.bindType = val.bindType this.aliQRCodeRechargeForm.bindType = val.bindType
this.ownRechargeTitle = '自有余额充值' this.ownRechargeTitle = '自有余额充值'
this.ownAliQRCodeRechargeOpen = true this.ownAliQRCodeRechargeOpen = true
}, },
...@@ -477,15 +581,15 @@ export default { ...@@ -477,15 +581,15 @@ export default {
if (valid) { if (valid) {
this.$modal.loading('充值中....') this.$modal.loading('充值中....')
addAccRecharge(this.aliQRCodeRechargeForm).then(res => { addAccRecharge(this.aliQRCodeRechargeForm).then(res => {
this.aliQRCodeRechargeOpen = false this.aliQRCodeRechargeOpen = false
if (200 === res.code) { if (200 === res.code) {
if (1 === this.aliQRCodeRechargeForm.bindType) { if (1 === this.aliQRCodeRechargeForm.bindType) {
this.qrPayPanel.payUrl = res.data.msg this.qrPayPanel.payUrl = res.data.msg
this.qrPayPanel.open = true this.qrPayPanel.open = true
this.$forceUpdate() this.$forceUpdate()
} else { } else {
this.$modal.msgSuccess("充值成功！"); this.$modal.msgSuccess("充值成功！");
} }
} }
}).finally(() => { }).finally(() => {
this.$modal.closeLoading() this.$modal.closeLoading()
...@@ -544,9 +648,9 @@ export default { ...@@ -544,9 +648,9 @@ export default {
this.$modal.closeLoading() this.$modal.closeLoading()
}) })
}, },
goRegister() { goRegister() {
window.open('https://admins.openbanks.cn/#/register?parameters=MPf%2Flhts8VrGmGDCjFNey4AqyYOJk1pQAc0KS6cZqp2QcvSNrm9LqLlqELVUfoVT', '_blank') window.open('https://admins.openbanks.cn/#/register?parameters=MPf%2Flhts8VrGmGDCjFNey4AqyYOJk1pQAc0KS6cZqp2QcvSNrm9LqLlqELVUfoVT', '_blank')
}, },
} }
} }
</script> </script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment