From d7d5760fba228083cec7bc3323266f298ef4b4dc Mon Sep 17 00:00:00 2001
From: zhaowei <zhaowei>
Date: 星期四, 11 九月 2025 13:58:39 +0800
Subject: [PATCH] 倍率报表页面日期范围调整为一周

---
 src/views/mdc/base/modules/MagnificationReport/MagnificationReportList.vue |  460 +++++++++++++++++++++++++++++++++++++++++++++------------
 1 files changed, 361 insertions(+), 99 deletions(-)

diff --git a/src/views/mdc/base/modules/MagnificationReport/MagnificationReportList.vue b/src/views/mdc/base/modules/MagnificationReport/MagnificationReportList.vue
index 595be3c..93fd442 100644
--- a/src/views/mdc/base/modules/MagnificationReport/MagnificationReportList.vue
+++ b/src/views/mdc/base/modules/MagnificationReport/MagnificationReportList.vue
@@ -2,7 +2,7 @@
   <div class="device_list">
     <!-- 鏌ヨ鍖哄煙 -->
     <div class="table-page-search-wrapper">
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
+      <a-form layout="inline" @keyup.enter.native="loadData">
         <a-row :gutter="24">
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <a-form-item label="璁惧缂栧彿">
@@ -11,14 +11,15 @@
           </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <a-form-item label="鏃ユ湡">
-              <a-range-picker value-format="YYYY-MM-DD" v-model="queryParam.dates" @change="dateParamChange"
-                              :disabled-date="disabledDate"/>
+              <a-range-picker value-format="YYYY-MM-DD" v-model="dates" @change="dateParamChange"
+                              :allow-clear="false" :disabled-date="disabledDate"/>
             </a-form-item>
           </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <a-space>
-              <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+              <a-button type="primary" @click="loadData" icon="search">鏌ヨ</a-button>
               <a-button type="primary" @click="searchReset" icon="reload">閲嶇疆</a-button>
+              <a-button type="primary" icon="download" @click="handleExportXls('鍊嶇巼鎶ヨ〃')">瀵煎嚭</a-button>
             </a-space>
           </a-col>
         </a-row>
@@ -27,84 +28,117 @@
     <!-- 鏌ヨ鍖哄煙-END -->
 
     <!-- 鎿嶄綔鎸夐挳鍖哄煙 -->
-    <div class="table-operator">
-      <a-button type="primary" icon="download" @click="handleExportXls('鍊嶇巼鎶ヨ〃')">瀵煎嚭</a-button>
-    </div>
+    <!--<div class="table-operator">-->
+    <!--<a-button type="primary" icon="download" @click="handleExportXls('鍊嶇巼鎶ヨ〃')">瀵煎嚭</a-button>-->
+    <!--</div>-->
 
     <!-- table鍖哄煙-begin -->
-    <div id="DeviceList" style="flex: 1;overflow: hidden">
-      <a-table :scroll="{x:'max-content',y:scrollY}" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
-               :pagination="ipagination" :loading="loading" @change="handleTableChange"/>
-    </div>
+    <a-spin :spinning="spinning">
+      <div id="Efficiency" class="container" style="margin-top: 20px;">
+        <div class="table2">
+          <table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap"
+                 v-if="dataList.length>0">
+            <thead>
+            <tr class="thead fixed equipname">
+              <th class="thgu dong1 name" rowspan="2"
+                  style="min-width: 50px; max-width: 50px;width: 50px;height: 66px">鍏徃
+              </th>
+              <th class="thgu dong2 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">杞﹂棿</th>
+              <th class="thgu dong3 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">宸ユ</th>
+              <th class="thgu dong4 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">璁惧缂栧彿
+              </th>
+              <th class="thgu dong5 name" rowspan="2" style="min-width: 162px; max-width: 162px;width: 162px;">璁惧鍚嶇О
+              </th>
+              <th class="thgu dong6 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">璁惧绫诲瀷
+              </th>
+              <template v-for="tableHead in tableHeads">
+                <th class="timeth" colspan="2">{{tableHead}}</th>
+              </template>
+            </tr>
+            <tr class="thead notfixed gudingth">
+              <template v-for="tableHead in tableHeads">
+                <th>涓昏酱鍊嶇巼骞冲潎鍊�</th>
+                <th>杩涚粰鍊嶇巼骞冲潎鍊�</th>
+              </template>
+            </tr>
+            </thead>
+            <tbody>
+
+            <tr class="mathData" v-for="(item, index) in dataList">
+              <template v-if="item.level1!=='鍚堣'&&item.level1!=='骞冲潎鍊�'">
+                <td class="tdgu kaitou" :rowspan="item.level1span"
+                    :class="{hidden: item.level1dis,noExl:item.level1dis}" v-show="!item.level1dis">
+                  <div class="wenzi">
+                    {{item.level1}}
+                  </div>
+                </td>
+                <td class="tdgu1 kaitou" :rowspan="item.level2span"
+                    :class="{hidden: item.level2dis,noExl:item.level2dis}" v-show="!item.level2dis">
+                  <div class="wenzi">
+                    {{item.level2}}
+                  </div>
+                </td>
+                <td class="tdgu2 kaitou wenzi" :rowspan="item.level3span"
+                    :class="{hidden: item.level3dis,noExl:item.level3dis}" v-show="!item.level3dis">
+                  <div class="wenzi">
+                    {{item.level3}}
+                  </div>
+                </td>
+                <td class="tdgu3  kaitou">{{item.equipmentId}}</td>
+                <td class="tdgu4 kaitou" style="min-width: 162px; max-width: 162px;width: 162px;">
+                  {{item.equipmentName}}
+                </td>
+                <td class="tdgu5 kaitou">{{item.equipmentType}}</td>
+              </template>
+
+              <!--鍚堣涓庡钩鍧囧�煎尯鍩�-->
+              <template v-else>
+                <td colspan="6" class="tdgu kaitou">{{item.level1}}</td>
+              </template>
+
+              <template v-for="(tableHead, index) in item.mdcBeilvVoList">
+                <td>{{tableHead.spindlebeilv | numFilter}}</td>
+                <td>{{tableHead.feedbeilv | numFilter}}</td>
+              </template>
+            </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </a-spin>
   </div>
 </template>
 
 <script>
   import moment from 'moment'
-  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+  import $ from 'jquery'
+  import '@/components/table2excel/table2excel'
+  import { putAction, getAction } from '@/api/manage'
 
   export default {
     name: 'MagnificationReportList',
-    mixins: [JeecgListMixin],
     components: {},
     props: { nodeTree: '', Type: '', nodePeople: '' },
     data() {
       return {
-        disableMixinCreated: true,
+        tableHeads: [],
+        dataList: [],
+        spinning: false,
         /* 鍒嗛〉鍙傛暟 */
-        ipagination: {
-          current: 1,
-          pageSize: 30,
-          pageSizeOptions: ['30', '50', '100'],
-          showTotal: (total, range) => {
-            return range[0] + '-' + range[1] + ' 鍏�' + total + '鏉�'
-          },
-          showQuickJumper: true,
-          showSizeChanger: true,
-          total: 0
-        },
-        queryParam: {
-          dates: [moment().subtract(1, 'day').startOf('day'), moment().subtract(1, 'day').endOf('day')]
-        },
+        queryParam: {},
+        dates: [moment().subtract(7, 'day').startOf('day'), moment().subtract(1, 'day').endOf('day')],
         // 琛ㄥご
-        columns: [
-          {
-            title: '#',
-            dataIndex: '',
-            key: 'rowIndex',
-            width: 60,
-            align: 'center',
-            customRender: function(t, r, index) {
-              return parseInt(index) + 1
-            }
-          },
-          {
-            title: '璁惧缂栧彿',
-            align: 'center',
-            dataIndex: 'equipmentId',
-            width: 300
-          },
-          {
-            title: '涓昏酱鍊嶇巼骞冲潎鍊�',
-            align: 'center',
-            dataIndex: 'spindlebeilv'
-          },
-          {
-            title: '杩涚粰鍊嶇巼骞冲潎鍊�',
-            align: 'center',
-            dataIndex: 'feedbeilv'
-          },
-          {
-            title: '鏃ユ湡',
-            align: 'center',
-            dataIndex: 'theDate',
-            width: 300
-          }
-        ],
-        scrollY: 465,
         url: {
-          list: '/mdc/magnification/list',
-          exportXlsUrl: '/mdc/magnification/exportXls'
+          list: '/mdc/magnification/beilvList'
+        }
+      }
+    },
+    filters: {
+      numFilter(value) {
+        if (value) {
+          return parseFloat((value * 100).toFixed(2))
+        } else {
+          return '0'
         }
       }
     },
@@ -122,7 +156,7 @@
             this.queryParam.parentId = val.key
             this.queryParam.equipmentId = ''
           }
-          this.searchQuery()
+          this.loadData()
         }
       },
       nodePeople(val) {
@@ -134,14 +168,14 @@
             this.queryParam.parentId = val.key
             this.queryParam.equipmentId = ''
           }
-          this.searchQuery()
+          this.loadData()
         }
       }
     },
     created() {
-      this.queryParam.startTime = moment(this.queryParam.dates[0]).format('YYYY-MM-DD')
-      this.queryParam.endTime = moment(this.queryParam.dates[1]).format('YYYY-MM-DD')
-      this.loadData(1)
+      this.queryParam.startTime = moment(this.dates[0]).format('YYYY-MM-DD')
+      this.queryParam.endTime = moment(this.dates[1]).format('YYYY-MM-DD')
+      this.loadData()
     },
     mounted() {
       window.addEventListener('resize', this.handleWindowResize)
@@ -151,6 +185,133 @@
       window.removeEventListener('resize', this.handleWindowResize)
     },
     methods: {
+      loadData() {
+        this.tableHeads = []
+        this.dataList = []
+        this.spinning = true
+        getAction(this.url.list, this.queryParam).then(res => {
+          if (res.success) {
+            this.tableHeads = res.result.dates
+            this.dataList = res.result.mdcMagnificationVos
+            if (res.result.mdcMagnificationVos && !res.result.mdcMagnificationVos.length) {
+              this.$notification.info({
+                message: '娑堟伅',
+                description: '鏆傛棤璇ョ被鍨嬫暟鎹�'
+              })
+            }
+            this.checkSameData(this.dataList)
+            this.checkSameData1(this.dataList)
+            this.checkSameData2(this.dataList)
+            this.combineCell()
+          }
+        }).finally(() => {
+          this.spinning = false
+        })
+      },
+
+      checkSameData(dataList) {
+        let cache = {}  //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣
+        let indices = []  //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍�
+        dataList.map((item, index) => {
+          let level1 = item.level1
+          let _index = cache[level1]
+          if (_index !== undefined) {
+            indices[_index].push(index)
+          } else {
+            cache[level1] = indices.length
+            indices.push([index])
+          }
+        })
+        let result = []
+        indices.map((item) => {
+          item.map((index) => {
+            result.push(dataList[index])
+          })
+        })
+        this.dataList = result
+      },
+
+      checkSameData1(dataList) {
+        let cache = {}  //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣
+        let indices = []  //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍�
+        dataList.map((item, index) => {
+          let level2 = item.level2
+          let _index = cache[level2]
+          if (_index !== undefined) {
+            indices[_index].push(index)
+          } else {
+            cache[level2] = indices.length
+            indices.push([index])
+          }
+        })
+        let result = []
+        indices.map((item) => {
+          item.map((index) => {
+            result.push(dataList[index])
+          })
+        })
+        this.dataList = result
+      },
+
+      checkSameData2(dataList) {
+        let cache = {}  //瀛樺偍鐨勬槸閿槸kclx 鐨勫�硷紝鍊兼槸kclx 鍦╥ndeces涓暟缁勭殑涓嬫爣
+        let indices = []  //鏁扮粍涓瘡涓�涓�兼槸涓�涓暟缁勶紝鏁扮粍涓殑姣忎竴涓厓绱犳槸鍘熸暟缁勪腑鐩稿悓kclx鐨勪笅鏍�
+        dataList.map((item, index) => {
+          let level3 = item.level3
+          let _index = cache[level3]
+          if (_index !== undefined) {
+            indices[_index].push(index)
+          } else {
+            cache[level3] = indices.length
+            indices.push([index])
+          }
+        })
+        let result = []
+        indices.map((item) => {
+          item.map((index) => {
+            result.push(dataList[index])
+          })
+        })
+        this.dataList = result
+      },
+
+      // 鍚堝苟
+      combineCell() {
+        console.log(this.dataList)
+        let list = this.dataList
+        for (let field in list[0]) {
+          var k = 0
+          while (k < list.length) {
+            list[k][field + 'span'] = 1
+            list[k][field + 'dis'] = false
+            for (var i = k + 1; i <= list.length - 1; i++) {
+              if (list[k][field] === list[i][field] && list[k][field] !== '') {
+                list[k][field + 'span']++
+                list[k][field + 'dis'] = false
+                list[i][field + 'span'] = 1
+                list[i][field + 'dis'] = true
+              } else {
+                break
+              }
+            }
+            k = i
+          }
+        }
+        return list
+      },
+
+      handleExportXls() {
+        $('#Efficiency').table2excel({
+          exclude: '.noExl',
+          name: 'Excel Document Name',
+          filename: '鍊嶇巼鎶ヨ〃',
+          exclude_img: true,
+          fileext: '.xls',
+          exclude_links: true,
+          exclude_inputs: false
+        })
+      },
+
       dateParamChange(dateArray) {
         this.queryParam.startTime = dateArray[0]
         this.queryParam.endTime = dateArray[1]
@@ -161,53 +322,154 @@
         return current > moment().subtract(1, 'day').endOf('day')
       },
 
+      searchReset() {
+        this.dates = [moment().subtract(7, 'day').startOf('day'), moment().subtract(1, 'day').endOf('day')]
+        this.queryParam = {
+          startTime: moment(this.dates[0]).format('YYYY-MM-DD'),
+          endTime: moment(this.dates[1]).format('YYYY-MM-DD')
+        }
+        this.loadData()
+      },
+
       /**
        * 褰撴祻瑙堝櫒鍙绐楀彛灏哄鍙戠敓鏀瑰彉鏃惰Е鍙�
        */
       handleWindowResize() {
-        const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0, -2)
-        const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0, -2)
-        this.scrollY = boxHeight - tableHeadHeight - 100
+        const tableContainer = document.getElementById('Efficiency') // 琛ㄦ牸瀹瑰櫒
+        const clientHeight = document.documentElement.clientHeight || document.body.clientHeight // 娴忚鍣ㄥ彲瑙嗗尯鍩熼珮搴�
+        const containerTopToClientTopHeight = tableContainer.getBoundingClientRect().top // 琛ㄦ牸瀹瑰櫒椤堕儴鍒版祻瑙堝櫒鍙鍖哄煙椤堕儴鐨勯棿璺�
+        tableContainer.style.height = (clientHeight - containerTopToClientTopHeight - 32) + 'px'
       }
     }
   }
 </script>
 <style scoped>
-  @import '~@assets/less/common.less';
+  .table2 {
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+  }
 
-  .device_list {
-    display: flex;
-    flex-direction: column;
+  .table2 thead tr th:first-child,
+  .table tbody tr .tdgu {
+    position: sticky;
+    left: 0;
+    z-index: 1;
+  }
+
+  .table tbody tr .wenzi {
+    transform: rotate(360deg);
+    writing-mode: vertical-lr;
+    letter-spacing: 2px;
+  }
+
+  .table tbody tr .kaitou {
+    z-index: 1;
+    background-color: white;
+  }
+
+  .table tbody tr .tdgu1 {
+    position: sticky;
+    left: 50px;
+    z-index: 2;
+  }
+
+  .table tbody tr .tdgu2 {
+    position: sticky;
+    left: 100px;
+    z-index: 2;
+  }
+
+  .table tbody tr .tdgu3 {
+    position: sticky;
+    left: 150px;
+    z-index: 2;
+  }
+
+  .table tbody tr .tdgu4 {
+    position: sticky;
+    left: 300px;
+    z-index: 2;
+  }
+
+  .table tbody tr .tdgu5 {
+    position: sticky;
+    left: 462px;
+    z-index: 2;
+  }
+
+  .table2 thead tr .timeth,
+  .table2 thead tr .thgu {
+    position: sticky;
+    top: 0;
+    z-index: 3;
+  }
+
+  .table2 thead .gudingth th {
+    position: sticky;
+    top: 32px;
+    z-index: 2;
+  }
+
+  .table2 thead .equipname .name {
+    z-index: 3;
+  }
+
+  .table2 thead .equipname .dong1 {
+    z-index: 4;
+    left: 0;
+  }
+
+  .table2 thead .equipname .dong2 {
+    z-index: 5;
+    left: 50px;
+  }
+
+  .table2 thead .equipname .dong3 {
+    z-index: 5;
+    left: 100px;
+  }
+
+  .table2 thead .equipname .dong4 {
+    z-index: 5;
+    left: 150px;
+  }
+
+  .table2 thead .equipname .dong5 {
+    z-index: 5;
+    left: 300px;
+  }
+
+  .table2 thead .equipname .dong6 {
+    z-index: 5;
+    left: 462px;
+  }
+
+  #Efficiency {
     overflow: hidden;
   }
 
-  @media screen and (min-width: 1920px) {
-    .device_list {
-      height: 811px !important;
-    }
+  .dataContent {
+    white-space: nowrap;
+    border-collapse: separate;
+    border-spacing: 0;
+    border: 1px solid #ccc;
+    width: 100%;
+    text-align: center;
   }
 
-  @media screen and (min-width: 1680px) and (max-width: 1920px) {
-    .device_list {
-      height: 811px !important;
-    }
+  .dataContent .thead th {
+    background-color: #fafafa;
+    text-align: center;
+    height: 30px;
+    padding: 5px;
   }
 
-  @media screen and (min-width: 1400px) and (max-width: 1680px) {
-    .device_list {
-      height: 663px !important;
-    }
+  .dataContent .mathData td {
+    padding: 10px;
   }
 
-  @media screen and (min-width: 1280px) and (max-width: 1400px) {
-    .device_list {
-      height: 564px !important;
-    }
-  }
-
-  @media screen and (max-width: 1280px) {
-    .device_list {
-      height: 564px !important;
-    }
+  td {
+    vertical-align: middle;
   }
 </style>
\ No newline at end of file

--
Gitblit v1.9.3