Skip to content

S
saas-manage
Commit e7ed5796 by wusiyi
Options

feat: 客户余额管理页面新增扣费明细弹窗

parent d189add5
Showing with 318 additions and 51 deletions
src/common/api/user/user.js
...@@ -22,7 +22,13 @@ export function customerBalanceRechargeApi(params) { ...@@ -22,7 +22,13 @@ export function customerBalanceRechargeApi(params) {
export function customerBalanceDelete(params) { export function customerBalanceDelete(params) {
return axios.post('/business/customerBalance/delete?ids=' + params) return axios.post('/business/customerBalance/delete?ids=' + params)
} }
// 获取操作日志 // 客户余额管理 查询全部操作日志
// export function getLogApi(params) { export function getLogListApi(params) {
// return axios.get('/pay/businessPayRecord/subjectList', params) return axios.post(
// } '/business/customerBalanceOptLogs/list?customerBalanceId=' + params
)
}
// 客户余额管理 分页查询全部扣费明细
export function getChargerRecordsApi(params) {
return axios.post('/charge/customerChargeRecords/list_page', params)
}
src/views/user/balance.vue
...@@ -88,12 +88,12 @@ ...@@ -88,12 +88,12 @@
align="center" align="center"
width="150" width="150"
:show-overflow-tooltip="true"></el-table-column> :show-overflow-tooltip="true"></el-table-column>
<el-table-column <!-- <el-table-column
label="折扣（%）" label="折扣（%）"
prop="discountRate" prop="discountRate"
align="center" align="center"
width="150" width="150"
:show-overflow-tooltip="true"></el-table-column> :show-overflow-tooltip="true"></el-table-column> -->
<el-table-column <el-table-column
label="授信额度（元）" label="授信额度（元）"
prop="lineCredit" prop="lineCredit"
...@@ -124,12 +124,11 @@ ...@@ -124,12 +124,11 @@
align="center" align="center"
width="200" width="200"
:show-overflow-tooltip="true"></el-table-column> :show-overflow-tooltip="true"></el-table-column>
<el-table-column <el-table-column
label="操作" label="操作"
align="center" align="center"
header-align="center" header-align="center"
width="80" width="130"
fixed="right"> fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
...@@ -149,11 +148,16 @@ ...@@ -149,11 +148,16 @@
title="手动充值" title="手动充值"
@click="handleRecharge(scope.row)" @click="handleRecharge(scope.row)"
style="cursor: pointer; color: #67c23a"></i> style="cursor: pointer; color: #67c23a"></i>
<!-- <i <i
class="el-icon-document" class="el-icon-document"
title="操作日志" title="操作日志"
@click="handleLog(scope.row)" @click="handleLog(scope.row)"
style="cursor: pointer; color: #1565c0"></i> --> style="cursor: pointer; color: #1565c0"></i>
<i
class="el-icon-money"
title="扣费明细"
@click="handleChargerLog(scope.row)"
style="cursor: pointer; color: #e6b800"></i>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -171,7 +175,7 @@ ...@@ -171,7 +175,7 @@
</div> </div>
<!-- 编辑 弹窗 --> <!-- 编辑 弹窗 -->
<el-dialog <el-dialog
:title="'编辑'" title="编辑"
:visible.sync="editVisible" :visible.sync="editVisible"
width="700px" width="700px"
@submit.native.prevent @submit.native.prevent
...@@ -182,7 +186,7 @@ ...@@ -182,7 +186,7 @@
ref="editForm" ref="editForm"
label-width="150px" label-width="150px"
label-position="right"> label-position="right">
<el-form-item <!-- <el-form-item
label="折扣（%）" label="折扣（%）"
type="number" type="number"
prop="discountRate" prop="discountRate"
...@@ -194,7 +198,7 @@ ...@@ -194,7 +198,7 @@
v-model="editForm.discountRate" v-model="editForm.discountRate"
size="small" size="small"
placeholder="请输入折扣" /> placeholder="请输入折扣" />
</el-form-item> </el-form-item> -->
<el-form-item <el-form-item
label="授信额度（元）" label="授信额度（元）"
type="number" type="number"
...@@ -230,7 +234,7 @@ ...@@ -230,7 +234,7 @@
</el-dialog> </el-dialog>
<!-- 手动充值 弹窗 --> <!-- 手动充值 弹窗 -->
<el-dialog <el-dialog
:title="'手动充值'" title="手动充值"
:visible.sync="rechargeVisible" :visible.sync="rechargeVisible"
:close-on-click-modal="false" :close-on-click-modal="false"
@submit.native.prevent @submit.native.prevent
...@@ -269,14 +273,176 @@ ...@@ -269,14 +273,176 @@
</el-button> </el-button>
</span> </span>
</el-dialog> </el-dialog>
<!-- 操作日志 --> <!-- 操作日志 弹窗 -->
<!-- <el-dialog :title="'操作日志'" :visible.sync="logVisible" width="700px"> <el-dialog title="操作日志" :visible.sync="logVisible" width="900px">
<ul style="color: #333; font-size: 12px; height: 600px; overflow: auto"> <ul style="color: #333; font-size: 14px; height: 600px; overflow: auto">
<li v-for="(item, index) in logList" :key="index"> <li v-for="(item, index) in logList" :key="index" style="height: 30px">
{{ item.createTime + ' ' + item.description }} ({{ index + 1 }})
{{
item.createTime.replace('T', ' ') +
'&nbsp; &nbsp;' +
item.optUserAccount +
'：' +
item.description
}}
</li> </li>
</ul> </ul>
</el-dialog> --> </el-dialog>
<!-- 扣费明细 弹窗 -->
<el-dialog
title="扣费明细"
:visible.sync="recordsVisible"
width="100%"
class="recordsDialog">
<div class="search">
<el-form :model="searchRecordsForm" size="small" :inline="true">
<el-form-item label="创建时间">
<el-date-picker
style="width: 360px"
v-model="searchRecordsForm.createTime"
type="datetimerange"
value-format="yyyy-MM-dd HH:ss:mm"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"></el-date-picker>
</el-form-item>
<el-form-item label="支付款项">
<el-select
style="width: 150px"
v-model="searchRecordsForm.chargeType"
placeholder="请选择支付款项">
<el-option
v-for="(item, index) in chargeTypeMap"
:key="index"
:label="item"
:value="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="支付方式">
<el-select
style="width: 150px"
v-model="searchRecordsForm.payMode"
placeholder="请选择支付方式">
<el-option
v-for="(item, index) in payModeListMap"
:key="index"
:label="item"
:value="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="订单号">
<el-input
v-model="searchForm.bizNo"
placeholder="请输入订单号"
clearable></el-input>
</el-form-item>
<el-form-item label="交易流水号">
<el-input
v-model="searchForm.tradeNo"
placeholder="请输入交易流水号"
clearable></el-input>
</el-form-item>
<el-form-item>
<el-button
type="primary"
size="small"
icon="el-icon-search"
@click="getChargerLog">
查询
</el-button>
</el-form-item>
</el-form>
</div>
<el-table
ref="recordsTable"
:data="chargerRecordsList"
border
height="40%"
width="100%"
:highlight-current-row="true"
header-row-class-name="header-row-class-name">
<el-table-column
label="序号"
type="index"
width="50"
align="center"
fixed="left"></el-table-column>
<el-table-column
label="创建时间"
prop="createTime"
align="center"
width="250"
:show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.createTime.replace('T', ' ') }}
</template>
</el-table-column>
<el-table-column
label="交易流水号"
prop="tradeNo"
align="center"
width="180"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column
label="支付款项"
prop="chargeType"
align="center"
width="150"
:show-overflow-tooltip="true">
<template slot-scope="scope">
{{ getChargeTypeText(scope.row.chargeType) }}
</template>
</el-table-column>
<el-table-column
label="订单号"
prop="bizNo"
align="center"
min-width="170"
:show-overflow-tooltip="true">
<template slot-scope="scope">
<div style="white-space: pre-wrap">{{ scope.row.bizNo }}</div>
</template>
</el-table-column>
<el-table-column
label="支付方式"
prop="payMode"
align="center"
width="150"
:show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.payMode == 1 ? '支付宝' : '额度' }}
</template>
</el-table-column>
<el-table-column
label="收取费用"
prop="fees"
align="center"
width="150"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column
label="扣前余额"
prop="balanceBefore"
align="center"
width="150"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column
label="扣后余额"
prop="balanceAfter"
align="center"
width="150"
:show-overflow-tooltip="true"></el-table-column>
</el-table>
<div class="pagination">
<el-pagination
layout="sizes, total, prev, pager, next, jumper"
background
:total="totalRecords"
:page-size="recordsPageSize"
:current-page="currentRecordsPage"
@size-change="recordsSizeChange"
@current-change="onRecordsCurrentChange" />
</div>
</el-dialog>
</div> </div>
</template> </template>
...@@ -285,7 +451,9 @@ import { ...@@ -285,7 +451,9 @@ import {
getCostomerBalanceApi, getCostomerBalanceApi,
editCustomerBalanceApi, editCustomerBalanceApi,
customerBalanceRechargeApi, customerBalanceRechargeApi,
customerBalanceDelete customerBalanceDelete,
getLogListApi,
getChargerRecordsApi
} from '@/common/api/user/user' } from '@/common/api/user/user'
export default { export default {
...@@ -295,16 +463,32 @@ export default { ...@@ -295,16 +463,32 @@ export default {
searchForm: {}, searchForm: {},
rechargeForm: {}, rechargeForm: {},
editForm: {}, editForm: {},
searchRecordsForm: {},
balanceList: [], balanceList: [],
// logList: [], logList: [],
chargerRecordsList: [],
namespace: '',
selection: [], selection: [],
payModeListMap: {
1: '支付宝',
2: '额度'
},
chargeTypeMap: {
1: 'POD(CN)',
2: 'POD(US)',
3: '一件定制'
},
loading: false, loading: false,
total: 0, total: 0,
currentPage: 1, currentPage: 1,
pageSize: 50, pageSize: 50,
editVisible: false, editVisible: false,
rechargeVisible: false rechargeVisible: false,
// logVisible: false logVisible: false,
recordsVisible: false,
totalRecords: 0,
currentRecordsPage: 1,
recordsPageSize: 50
} }
}, },
created() { created() {
...@@ -316,6 +500,10 @@ export default { ...@@ -316,6 +500,10 @@ export default {
this.currentPage = 1 this.currentPage = 1
this.getList() this.getList()
}, },
handleSelectionChange(selection) {
this.selection = selection
},
// 列表分页
onCurrentChange(currentPage) { onCurrentChange(currentPage) {
this.currentPage = currentPage this.currentPage = currentPage
this.getList() this.getList()
...@@ -325,8 +513,15 @@ export default { ...@@ -325,8 +513,15 @@ export default {
this.currentPage = 1 this.currentPage = 1
this.getList() this.getList()
}, },
handleSelectionChange(selection) { // 扣费明细分页
this.selection = selection recordsSizeChange(pageSize) {
this.recordsPageSize = pageSize
this.currentRecordsPage = 1
this.getChargerLog()
},
onRecordsCurrentChange(currentPage) {
this.currentRecordsPage = currentPage
this.getChargerLog()
}, },
// 获取列表数据 // 获取列表数据
async getList() { async getList() {
...@@ -427,25 +622,62 @@ export default { ...@@ -427,25 +622,62 @@ export default {
} }
}, },
// 折扣校验 // 折扣校验
validateDiscount(rule, value, callback) { // validateDiscount(rule, value, callback) {
if (value === '' || value === null || value === undefined) { // if (value === '' || value === null || value === undefined) {
callback() // callback()
} else if (Number(value) < 0 || Number(value) > 100) { // } else if (Number(value) < 0 || Number(value) > 100) {
callback(new Error('值需要介于0到100之间')) // callback(new Error('值需要介于0到100之间'))
// } else {
// callback()
// }
// },
// 查看操作日志
async handleLog(row) {
try {
const res = await getLogListApi(row.id)
this.logList = res.data
if (this.logList.length) {
this.logVisible = true
} else { } else {
callback() this.$message.warning('暂无数据')
}
} catch (e) {
console.log(e)
}
},
handleChargerLog(row) {
this.namespace = row.namespace
this.getChargerLog()
},
getChargeTypeText(type) {
return this.chargeTypeMap[type]
},
searchRecords() {},
// 分页查看扣费明细
async getChargerLog() {
try {
const data = {
pageSize: this.recordsPageSize,
currentPage: this.currentRecordsPage,
namespace: this.namespace,
...this.searchRecordsForm
}
const res = await getChargerRecordsApi(data)
this.chargerRecordsList = res.data.records
if (this.chargerRecordsList.length) {
this.totalRecords = res.data.total
this.chargerRecordsList.forEach((item) => {
item.bizNo = item.bizNo.replaceAll(',', '\n')
})
this.recordsVisible = true
} else {
this.$message.warning('暂无数据')
}
} catch (e) {
console.log(e)
} }
} }
// 查看操作日志
// async handleLog(row) {
// try {
// this.logList = await getLogApi({ ...row })
// } catch (e) {
// console.log(e)
// } finally {
// this.logVisible = true
// }
// }
} }
} }
</script> </script>
...@@ -474,10 +706,6 @@ export default { ...@@ -474,10 +706,6 @@ export default {
line-height: 30px; line-height: 30px;
} }
.el-icon-time:before {
content: '';
}
.el-dialog__footer { .el-dialog__footer {
text-align: center; text-align: center;
...@@ -490,11 +718,6 @@ export default { ...@@ -490,11 +718,6 @@ export default {
padding: 10px 20px; padding: 10px 20px;
} }
.el-icon-edit:before {
color: #ff9800;
font-weight: bold;
}
.el-range-editor--small .el-range-separator { .el-range-editor--small .el-range-separator {
line-height: 31px; line-height: 31px;
} }
...@@ -508,6 +731,44 @@ export default { ...@@ -508,6 +731,44 @@ export default {
} }
} }
} }
.recordsDialog {
margin: 10px;
&::v-deep {
.el-dialog {
height: 85vh !important;
display: flex;
flex-direction: column;
margin: 0 auto;
margin-top: 10vh !important;
}
.el-dialog__body {
flex: 1 1 0%;
display: flex;
flex-direction: column;
padding: 10px 20px;
overflow: hidden;
}
.table-area {
flex: 1 1 0%;
min-height: 0;
overflow: auto;
display: flex;
flex-direction: column;
}
.el-table {
flex: 1 1 0%;
min-height: 0;
/* 让table内容区出现滚动条 */
}
.el-table .el-table__cell {
padding: 6px 0;
}
}
}
.table { .table {
flex: 1; flex: 1;
overflow: hidden; overflow: hidden;
......
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