wanma-benteng
/
new-admin-view
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化：资金流水显示内容优化

This commit is contained in:
wuhui_zzw 2024-04-19 17:20:09 +08:00
parent 0432814995
commit 6a4fa2573e
2 changed files with 113 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/filters/commFilter.js
View File

@ -337,7 +337,9 @@ export function transactionTypeFilter(type) {
'brokerage_two': '二级分佣',
'refund_brokerage_one': '返还一级分佣',
'refund_brokerage_two': '返还二级分佣',
'order': '订单支付'
'order': '订单支付',
'supplier_mer': '供应商提成',
'province_mer': '省公司门店提成'
}
return typeMap[type]
}

126
src/views/accounts/capitalFlow/index.vue
View File

@ -47,35 +47,57 @@
</div>
<cards-data :card-lists="cardLists" />
</div>
<el-table
v-loading="listLoading"
:data="tableData.data"
style="width: 100%"
size="mini"
class="table"
highlight-current-row
>
<el-table-column label="订单号" min-width="200">
<el-table v-loading="listLoading" :data="tableData.data" style="width: 100%" size="mini" class="table" highlight-current-row>
<el-table-column label="订单号" min-width="170" align="center">
<template slot-scope="scope">
<span v-if="scope.row.financial_type != 'sys_accoubts'">{{ scope.row.order_sn }}</span>
<span v-else>{{ scope.row.financial_record_sn }}</span>
</template>
</el-table-column>
<el-table-column prop="financial_record_sn" label="交易流水号" min-width="200" />
<el-table-column prop="create_time" label="交易时间" min-width="150" sortable />
<el-table-column prop="user_info" label="对方信息" min-width="150" />
<el-table-column label="交易类型" min-width="100">
<el-table-column prop="financial_record_sn" label="交易流水号" min-width="170" align="center" />
<el-table-column prop="create_time" label="交易时间" min-width="130" sortable align="center" />
<el-table-column label="交易用户" min-width="280" align="center">
<template slot-scope="scope">
<div class="user-content">
<div class="user-avatar">
<img :src="scope.row.user.avatar || moren" />
</div>
<div class="user-info">
<div class="nickname">{{ scope.row.user.nickname }}</div>
<div class="agent-type-text">
<el-tag type="info" effect="dark" size="small">{{ scope.row.user.uid }}</el-tag>
</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="交易类型" min-width="120" align="center">
<template slot-scope="scope">
<span>{{ scope.row.financial_type | transactionTypeFilter }}</span>
</template>
</el-table-column>
<el-table-column label="收支金额（元）" min-width="150" >
<el-table-column label="收支金额（元）" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.financial_pm === 1 ? scope.row.number : -scope.row.number }}</span>
</template>
</el-table-column>
<el-table-column label="操作" min-width="150" fixed="right">
<el-table-column label="归属商户" min-width="280" align="center">
<template slot-scope="scope">
<div class="user-content">
<div class="user-avatar">
<img :src="scope.row.merchant.mer_avatar || moren" />
</div>
<div class="user-info">
<div class="nickname">{{ scope.row.merchant.mer_name }}</div>
<div class="agent-type-text">
<el-tag type="info" effect="dark" size="small">{{ scope.row.merchant.mer_id }}</el-tag>
</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="操作" min-width="100" fixed="right">
<template slot-scope="scope" v-if="scope.row.financial_type != 'supplier_mer' && scope.row.financial_type != 'province_mer'">
<router-link v-if="scope.row.financial_type == 'sys_accoubts'" :to=" { path:`${roterPre}` + '/accounts/reconciliation?reconciliation_id='+scope.row.order_id } ">
<el-button type="text" size="small" class="mr10">详情</el-button>
</router-link>
@ -118,6 +140,7 @@ export default {
components: { fileList, cardsData },
data() {
return {
moren: require("@/assets/images/f.png"),
timeVal: [],
tableData: {
data: [],
@ -244,8 +267,79 @@ export default {
}
</script>
<style scoped>
<style scoped lang="scss">
.selWidth {
width: 320px;
}
/deep/ .cell{
padding: 0!important;
}
.user-content{
--user-content-height-: 80px;
height: var(--user-content-height-);
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
.user-avatar{
height: var(--user-content-height-);
width: var(--user-content-height-);
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
img{
height: 80%!important;
width: 80%!important;
border-radius: 50% !important;
}
}
.user-info{
max-width: calc(100% - var(--user-content-height-));
height: var(--user-content-height-);
display: inline-flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
align-items: flex-start;
.nickname{
width: 100%;
height: 25px;
line-height: 25px;
text-align: left;
font-size: 15px;
font-weight: bold;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
.user-id{
color: #fff;
background-color: #409eff;
border-color: #409eff;
height: 18px;
line-height: 20px;
font-size: 13px;
padding: 0 5px;
border-radius: 5px;
margin-left: 10px;
width: max-content!important;
}
}
.user-id{
width: 100%;
text-align: left;
font-size: 13px;
line-height: calc(var(--user-content-height- * 35%));
}
}
}
</style>