|
|
@@ -14,14 +14,14 @@ |
|
|
|
<div class="bailout-query__result"> |
|
|
|
<div class="tip"> |
|
|
|
<h5>当前情况</h5> |
|
|
|
<span> <i>*</i>温馨提示:为避免信息泄漏,请查询完本人待遇后,点击“关闭”!</span> |
|
|
|
<span> <i>*</i>温馨提示:为避免信息泄漏,请查询完本人信息后,点击“首页”!</span> |
|
|
|
</div> |
|
|
|
<div class="money" > |
|
|
|
<div class="center" style=""> |
|
|
|
<div class="money-item" v-for="(item,index) in moneyDate.currtMx" :key="index" > |
|
|
|
<span style="font-weight: 500">{{ item.archive_name }}:</span> |
|
|
|
<span>{{ item.class_name }}</span> |
|
|
|
<span style="color: #ff4f4f;margin-left: auto">{{item.amount}}</span> 元 |
|
|
|
<span style="color: #ff4f4f;margin-left: auto">{{item.amount}}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-if="moneyDate.currtMx.length === 0 && !empty " style="text-align: center;font-size: 16px;color: #999;margin-top: 30px">暂无数据</div> |
|
|
@@ -35,17 +35,18 @@ |
|
|
|
<h5>历史发放情况</h5> |
|
|
|
<div class="table"> |
|
|
|
<div class="table-center"> |
|
|
|
<el-table v-if="!empty && moneyDate.hisMx.length > 0" :show-header="false" empty-text="暂无数据" border :data="moneyDate.hisMx" style="width: 100%"> |
|
|
|
<el-table-column prop="archive_name" label="Date" align="center"/> |
|
|
|
<el-table :span-method="mergeCells" v-if="!empty && moneyDate.hisMx.length > 0" :show-header="false" empty-text="暂无数据" border :data="moneyDate.hisMx" style="width: 100%"> |
|
|
|
<el-table-column prop="archive_name" label="Date" width="200px" align="center"/> |
|
|
|
<el-table-column prop="class_name" label="Name" align="center"/> |
|
|
|
<el-table-column prop="period_id" label="Address" width="150px" align="center"> |
|
|
|
<el-table-column prop="period_id" label="Date" width="150px" align="center" > |
|
|
|
<template #default="scope"> |
|
|
|
{{scope.row.period_id.slice(0,4)}}-{{scope.row.period_id.slice(4,6)}} |
|
|
|
<!-- {{scope.row.period_id}}--> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="amount" label="Address" width="200px" align="center"> |
|
|
|
<template #default="scope"> |
|
|
|
<i>{{scope.row.amount}}</i> 元 |
|
|
|
<i>{{scope.row.amount}}</i> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
@@ -76,49 +77,12 @@ export default { |
|
|
|
components: { Framework }, |
|
|
|
data () { |
|
|
|
return { |
|
|
|
person_uid: '', // 510212196307160054 |
|
|
|
person_uid: '', // 510212196307160054 //512326196303104368 |
|
|
|
person_name: '', |
|
|
|
idNumber: '', |
|
|
|
pageSize: 10, |
|
|
|
currentPage: 100, |
|
|
|
tableData: [ |
|
|
|
{ |
|
|
|
date: '2016-05-03', |
|
|
|
name: 'Tom', |
|
|
|
address: 'No. 189, Grove St, Los Angeles' |
|
|
|
}, |
|
|
|
{ |
|
|
|
date: '2016-05-02', |
|
|
|
name: 'Tom', |
|
|
|
address: 'No. 189, Grove St, Los Angeles' |
|
|
|
}, |
|
|
|
{ |
|
|
|
date: '2016-05-04', |
|
|
|
name: 'Tom', |
|
|
|
address: 'No. 189, Grove St, Los Angeles' |
|
|
|
}, |
|
|
|
{ |
|
|
|
date: '2016-05-01', |
|
|
|
name: 'Tom', |
|
|
|
address: 'No. 189, Grove St, Los Angeles' |
|
|
|
}, |
|
|
|
{ |
|
|
|
date: '2016-05-01', |
|
|
|
name: 'Tom', |
|
|
|
address: 'No. 189, Grove St, Los Angeles' |
|
|
|
}, |
|
|
|
{ |
|
|
|
date: '2016-05-01', |
|
|
|
name: 'Tom', |
|
|
|
address: 'No. 189, Grove St, Los Angeles' |
|
|
|
}, |
|
|
|
{ |
|
|
|
date: '2016-05-01', |
|
|
|
name: 'Tom', |
|
|
|
address: 'No. 189, Grove St, Los Angeles' |
|
|
|
} |
|
|
|
|
|
|
|
], |
|
|
|
tableData: [], |
|
|
|
moneyDate: { |
|
|
|
currtMx: [], |
|
|
|
hisMx: [] |
|
|
@@ -128,6 +92,27 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 合并单元格 |
|
|
|
mergeCells ({ column, rowIndex }) { |
|
|
|
if (column.property === 'period_id') { |
|
|
|
const currentPeriod = this.moneyDate.hisMx[rowIndex].period_id |
|
|
|
const prevPeriod = rowIndex > 0 ? this.moneyDate.hisMx[rowIndex - 1].period_id : null |
|
|
|
|
|
|
|
if (prevPeriod === currentPeriod) { |
|
|
|
return [0, 0] // 不显示单元格 |
|
|
|
} else { |
|
|
|
let rowspan = 1 |
|
|
|
for (let i = rowIndex + 1; i < this.moneyDate.hisMx.length; i++) { |
|
|
|
if (this.moneyDate.hisMx[i].period_id === currentPeriod) { |
|
|
|
rowspan++ |
|
|
|
} else { |
|
|
|
break |
|
|
|
} |
|
|
|
} |
|
|
|
return [rowspan, 1] // 合并单元格 |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
async queryPaymentAmount () { |
|
|
|
if (this.person_uid === '') return ElMessage.error('请输入身份证号') |
|
|
|
const params = { |
|
|
@@ -135,6 +120,19 @@ export default { |
|
|
|
} |
|
|
|
const { data } = await this.$http.get('api/archive/queryPaymentAmount.do', { params }) |
|
|
|
|
|
|
|
data.hisMx.sort((a, b) => { |
|
|
|
// 先按 period_id 降序排序 |
|
|
|
if (b.period_id !== a.period_id) { |
|
|
|
return b.period_id - a.period_id |
|
|
|
} |
|
|
|
// 再按 archive_name 升序排序 |
|
|
|
return a.archive_name.localeCompare(b.archive_name) |
|
|
|
}) |
|
|
|
data.currtMx.sort((a, b) => { |
|
|
|
// archive_name 升序排序 |
|
|
|
return a.archive_name.localeCompare(b.archive_name) |
|
|
|
}) |
|
|
|
|
|
|
|
this.moneyDate = data |
|
|
|
if (data.currtMx.length === 0 && data.hisMx.length === 0) { |
|
|
|
this.empty = true |
|
|
@@ -270,8 +268,12 @@ export default { |
|
|
|
border: 1px solid #D7D7D7; |
|
|
|
border-radius: 8px; |
|
|
|
.table-center{ |
|
|
|
width: 1400px; |
|
|
|
width: 900px; |
|
|
|
margin: 0 auto; |
|
|
|
|
|
|
|
} |
|
|
|
:deep(.cell){ |
|
|
|
font-size: 18px; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|