From f67b4c736c68cd3d1f75e5fc6b6e23189f12b979 Mon Sep 17 00:00:00 2001
From: Lius <Lius2225@163.com>
Date: 星期二, 19 十二月 2023 11:34:57 +0800
Subject: [PATCH] 设备管理增加按车间筛选条件

---
 src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue |  240 +++++++++++++++++++++++++++++++++++++++---------------------
 1 files changed, 156 insertions(+), 84 deletions(-)

diff --git a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue
index 479b163..7150831 100644
--- a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue
+++ b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue
@@ -56,25 +56,32 @@
           <!--</table>-->
           <!--</div>-->
           <!--</div>-->
-          <a-table :columns="columns" :data-source="dataList" bordered :pagination="false" :scroll="{y:168}"
+          <!--<a-spin :spinning=""></a-spin>-->
+          <a-table :columns="columns" :data-source="dataList" bordered :pagination="false" :scroll="{y:210}"
                    :customRow="customRow"
-                   rowKey="alarmCode">
-            <span slot="timeCount" slot-scope="text">{{getFormattedTime(text)}}</span>
-            <!--<a-table-->
-              <!--slot="expandedRowRender"-->
-              <!--slot-scope="row"-->
-              <!--:columns="innerColumns"-->
-              <!--:data-source="row.innerDataList"-->
-              <!--:pagination="false"-->
-            <!--&gt;-->
-              <!--<span slot="duration" slot-scope="text">{{getFormattedTime(text)}}</span>-->
-            <!--</a-table>-->
+                   rowKey="alarmCode" @expand="handleExpandChange" :loading="outerDataLoading"
+          >
+            <span slot="timeCount" slot-scope="text">{{text | getFormattedTime}}</span>
+            <a-table
+              slot="expandedRowRender"
+              slot-scope="row"
+              :columns="innerColumns"
+              :data-source="row.innerDataList"
+              :pagination="false"
+              rowKey="rowIndex"
+              :loading="innerDataLoading"
+            >
+              <span slot="duration" slot-scope="text">{{text | getFormattedTime}}</span>
+            </a-table>
           </a-table>
         </div>
-        <div style="width: 100%;height: 55%;display: flex;">
-          <div id="MdcEquipmentWarningPie" style="height: 100%;width: 35%;"></div>
-          <div id="MdcEquipmentWarningLine" style="height: 100%;width: 65%;"></div>
-        </div>
+
+        <a-spin :spinning="echartLoading">
+          <div style="width: 100%;height: 100%;display: flex;">
+            <div id="MdcEquipmentWarningPie" style="height: 100%;width: 35%;"></div>
+            <div id="MdcEquipmentWarningLine" style="height: 100%;width: 65%;"></div>
+          </div>
+        </a-spin>
       </div>
     </div>
   </div>
@@ -92,21 +99,32 @@
 
   const columns = [
     { title: '鎶ヨ鍙�', dataIndex: 'alarmCode', key: 'alarmCode', align: 'center' },
-    { title: '鍑虹幇娆℃暟', dataIndex: 'count', key: 'count', align: 'center' },
+    { title: '鍑虹幇娆℃暟', dataIndex: 'count', key: 'count', align: 'center', sorter: (a, b) => b.count - a.count },
     {
       title: '鍚堣鎸佺画鏃堕棿',
       dataIndex: 'timeCount',
       key: 'timeCount',
       scopedSlots: { customRender: 'timeCount' },
-      align: 'center'
+      align: 'center',
+      sorter: (a, b) => b.timeCount - a.timeCount
     },
-    { title: '鎶ヨ淇℃伅', dataIndex: 'alarmContent', key: 'alarmContent', align: 'center' }
+    { title: '鎶ヨ淇℃伅', dataIndex: 'alarmContent', key: 'alarmContent', align: 'center', ellipsis: true }
   ]
 
   const innerColumns = [
+    {
+      title: '',
+      dataIndex: 'rowIndex',
+      key: 'rowIndex',
+      width: 60,
+      align: 'center',
+      customRender: function(t, r, index) {
+        return parseInt(index) + 1
+      }
+    },
     { title: '璁惧缂栧彿', dataIndex: 'equipmentId', key: 'equipmentId', align: 'center' },
     { title: '璁惧鍚嶇О', dataIndex: 'equipmentName', key: 'equipmentName', align: 'center' },
-    { title: '鎶ヨ鏃堕棿', dataIndex: 'alarmTime', key: 'alarmTime', align: 'center' },
+    { title: '鎶ヨ鏃堕棿', dataIndex: 'startTime', key: 'startTime', align: 'center' },
     { title: '缁撴潫鏃堕棿', dataIndex: 'endTime', key: 'endTime', align: 'center' },
     {
       title: '鎸佺画鏃堕棿',
@@ -125,7 +143,9 @@
       return {
         dataSource: [],
         /* table鍔犺浇鐘舵�� */
-        loading: false,
+        outerDataLoading: false,
+        innerDataLoading: false,
+        echartLoading: false,
         typeTree: '',
         typeParent: 1,
         typeEquipment: 1,
@@ -151,14 +171,16 @@
         url: {
           efficiencyList: '/mdc/alarmAnalyze/alarmList',
           listByType: '/mdc/MdcUtilizationRate/getByType',
-          alarmTrend: '/mdc/alarmAnalyze/alarmTrend'
+          alarmTrend: '/mdc/alarmAnalyze/alarmTrend',
+          equipmentAlarmList: '/mdc/alarmAnalyze/equipmentAlarmList'
         },
         tableHeads: [],
         pieDate: [0],
         XData: [0],
         YData: [0],
         columns,
-        innerColumns
+        innerColumns,
+        hasRequsetAlarmCodeList: []
       }
     },
     props: { nodeTree: '', Type: '', nodePeople: '' },
@@ -214,6 +236,35 @@
         } else {
           return '0'
         }
+      },
+
+      /**
+       * 鏍煎紡鍖栨椂闂�
+       * @param seconds 绉掓暟
+       * @returns '' 鏍煎紡鍖栧悗鏃堕棿瀛楃涓�
+       */
+      getFormattedTime(seconds) {
+        var hours = Math.floor(seconds / 3600)
+        var minutes = Math.floor((seconds % 3600) / 60)
+        var secs = seconds % 60
+
+        if (hours === 0) {
+          if (minutes === 0) {
+            return secs === 0 ? 0 : `${secs}绉抈
+          } else {
+            if (secs === 0) {
+              return `${minutes}鍒哷
+            }
+            return `${minutes}鍒� ${secs}绉抈
+          }
+        } else {
+          if (minutes === 0 && secs === 0) {
+            return `${hours}灏忔椂`
+          } else if (minutes !== 0 && secs === 0) {
+            return `${hours}灏忔椂 ${minutes}鍒哷
+          }
+        }
+        return `${hours}灏忔椂 ${minutes}鍒� ${secs}绉抈
       }
     },
     methods: {
@@ -226,34 +277,35 @@
       },
       TableDraw(key, val) {
         let that = this
+        that.echartLoading = true
         that.queryParam.alarmCode = val.alarmCode
         console.log(this.queryParam)
-        that.pieDate = []
-        that.XData = []
-        that.YData = []
-        getAction(that.url.alarmTrend, that.queryParam).then(res => {
-          if (res.success) {
-            for (var i = 0; i < res.result.equipmentCountList.length; i++) {
-              that.pieDate.push({
-                name: res.result.equipmentCountList[i].key,
-                value: res.result.equipmentCountList[i].count
+        getAction(that.url.alarmTrend, that.queryParam)
+          .then(res => {
+            if (res.success) {
+              that.pieDate = res.result.equipmentCountList.map(item => {
+                return {
+                  name: item.key,
+                  value: item.count
+                }
               })
+              that.XData = res.result.dateCountList.map(item => item.key)
+              that.YData = res.result.dateCountList.map(item => item.count)
+
+              // this.tableHeads = res.result.dates
+              // this.dataList = res.result
+              // this.draw()
+              // this.checkSameData(this.dataList)
+              // this.checkSameData1(this.dataList)
+              // this.checkSameData2(this.dataList)
+              // this.combineCell();
+              // this.initDeviceType(this.dataList)
+              that.drawWrin()
             }
-            for (var j = 0; j < res.result.dateCountList.length; j++) {
-              that.XData.push(res.result.dateCountList[j].key)
-              that.YData.push(res.result.dateCountList[j].count)
-            }
-            // this.tableHeads = res.result.dates
-            // this.dataList = res.result
-            // this.draw()
-            // this.checkSameData(this.dataList)
-            // this.checkSameData1(this.dataList)
-            // this.checkSameData2(this.dataList)
-            // this.combineCell();
-            // this.initDeviceType(this.dataList)
-            that.drawWrin()
-          }
-        })
+          })
+          .finally(() => {
+            that.echartLoading = false
+          })
         console.log(this.YData)
 
       },
@@ -381,21 +433,14 @@
       //     }
       //   }
       loadData1() {
+        this.outerDataLoading = true
         this.tableHeads = []
         this.dataList = []
         getAction(this.url.efficiencyList, this.queryParam).then(res => {
           if (res.success) {
             // this.tableHeads = res.result.dates
             this.dataList = res.result
-            this.dataList.forEach(item => item.innerDataList = [
-              {
-                equipmentId: '11234',
-                equipmentName: '绔嬩綋鏈哄簥',
-                alarmTime: 20,
-                endTime: 20,
-                duration: 123
-              }
-            ])
+            this.hasRequsetAlarmCodeList = []
             // this.draw()
             // this.checkSameData(this.dataList)
             // this.checkSameData1(this.dataList)
@@ -404,6 +449,8 @@
             // this.initDeviceType(this.dataList)
 
           }
+        }).finally(() => {
+          this.outerDataLoading = false
         })
       },
       drawWrin() {
@@ -519,32 +566,6 @@
       },
 
       /**
-       * 鏍煎紡鍖栨椂闂�
-       * @param seconds 绉掓暟
-       * @returns 鏍煎紡鍖栧悗鏃堕棿瀛楃涓�
-       */
-      getFormattedTime(seconds) {
-        var hours = Math.floor(seconds / 3600)
-        var minutes = Math.floor((seconds % 3600) / 60)
-        var secs = seconds % 60
-
-        if (hours == 0) {
-          if (minutes == 0) {
-            return `${secs}绉抈
-          } else {
-            return `${minutes}鍒� ${secs}绉抈
-          }
-        } else {
-          if (minutes == 0 && secs == 0) {
-            return `${hours}灏忔椂`
-          } else if (minutes != 0 && secs == 0) {
-            return `${hours}灏忔椂 ${minutes}鍒哷
-          }
-        }
-        return `${hours}灏忔椂 ${minutes}鍒� ${secs}绉抈
-      },
-
-      /**
        * 鑷畾涔夎〃鏍艰瑙﹀彂
        * @param record 褰撳墠琛屼俊鎭�
        * @param index 褰撳墠琛屼笅鏍�
@@ -553,10 +574,42 @@
       customRow(record, index) {
         return {
           on: {
-            click: () => {
-              this.TableDraw(index, record)
+            click: (event) => {
+              // 濡傛灉鐐瑰嚮鐨勪笉鏄睍寮�鍥炬爣鍖哄煙鍒欐覆鏌撳浘琛紝鐩稿弽鍒欑浉褰撲簬鐐瑰嚮灞曞紑鍥炬爣
+              if (event.target.className !== 'ant-table-row-expand-icon-cell') {
+                this.TableDraw(index, record)
+              } else {
+                if (event.target.children && event.target.children.length > 0) event.target.children[0].click()
+              }
             }
           }
+        }
+      },
+
+      /**
+       * 鑷畾涔夎〃鏍艰瑙﹀彂
+       * @param expanded 褰撳墠琛屾槸鍚︿负灞曞紑鐘舵��
+       * @param record 褰撳墠琛屼俊鎭�
+       */
+      handleExpandChange(expanded, record) {
+        let _this = this
+        // 褰撳睍寮�鏃惰嫢璇ヨ鏈灞曞紑杩囨墠浼氳姹傚悗鍙版暟鎹紝灞曞紑杩囩殑鏁版嵁浼氳缂撳瓨鏃犻渶閲嶅璇锋眰
+        const param = Object.assign({ alarmCode: record.alarmCode }, this.queryParam)
+        if (expanded && !this.hasRequsetAlarmCodeList.includes(record.alarmCode)) {
+          this.innerDataLoading = true
+          getAction(this.url.equipmentAlarmList, param).then(res => {
+            if (res.success) {
+              _this.dataList.forEach(item => {
+                if (item.alarmCode === record.alarmCode) {
+                  item.innerDataList = res.result
+                }
+              })
+              _this.hasRequsetAlarmCodeList.push(record.alarmCode)
+            }
+          })
+            .finally(() => {
+              _this.innerDataLoading = false
+            })
         }
       }
     }
@@ -779,6 +832,25 @@
   /deep/ .ant-table-body .ant-table-row td {
     padding-top: 10px;
     padding-bottom: 10px;
+  }
+
+  /deep/ .ant-table-scroll > .ant-table-body > table > .ant-table-tbody > .ant-table-row td {
     cursor: pointer;
   }
+
+  /deep/ .ant-spin-nested-loading {
+    height: 55%;
+  }
+
+  /deep/ .ant-spin-container {
+    height: 100%;
+  }
+
+  /deep/ .ant-table.ant-table-bordered {
+    height: 265px;
+  }
+
+  /deep/ .ant-table-scroll > .ant-table-placeholder {
+    height: 210px;
+  }
 </style>
\ No newline at end of file

--
Gitblit v1.9.3