From c141b25eaf779bf934862bc6f43307caff1f3b90 Mon Sep 17 00:00:00 2001
From: Sea <zhangh@jujiatech.com>
Date: Mon, 14 Oct 2024 14:31:39 +0800
Subject: [PATCH] =?UTF-8?q?=E6=88=91=E7=9A=84=E6=95=91=E5=8A=A9=E6=9B=B4?=
 =?UTF-8?q?=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                            |  5 +-
 src/views/myBailout/BailoutQuery.vue | 94 ++++++++++++++++++------------------
 2 files changed, 51 insertions(+), 48 deletions(-)

diff --git a/README.md b/README.md
index 694beea..ee0cbcd 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,9 @@
 # wldp
 
-## Project setup
+## 安装依赖，这里eslint依赖有冲突，需要强制安装
+
 ```
-npm install
+npm install --force 
 ```
 
 ### Compiles and hot-reloads for development
diff --git a/src/views/myBailout/BailoutQuery.vue b/src/views/myBailout/BailoutQuery.vue
index ef292ba..a40a183 100644
--- a/src/views/myBailout/BailoutQuery.vue
+++ b/src/views/myBailout/BailoutQuery.vue
@@ -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;
                 }
 
             }