From 3a097696dbc536ad29ccf60b7cf381a08e1bebf0 Mon Sep 17 00:00:00 2001
From: zhaowei <zhaowei>
Date: 星期四, 26 六月 2025 17:41:30 +0800
Subject: [PATCH] 1、设备日利用率以及设备日利用率对比页面优化图表加载展示区域及代码 2、调整操作工终端登录页背景图片

---
 src/assets/terminal/login-bg.jpg                                               |    0 
 src/views/dnc/base/OperatorLogin.vue                                           |   13 -
 src/views/mdc/base/equipmentDayAvail.vue                                       |   46 +--
 src/views/mdc/base/equipmentAvailCompare.vue                                   |    6 
 src/views/mdc/base/modules/EquipmentDayAvail/EquipmentDayAvailMain.vue         |  259 +++++++---------------
 src/views/mdc/base/modules/EquipmentAvailCompare/EquipmentAvailCompareMain.vue |  277 +++++-------------------
 6 files changed, 163 insertions(+), 438 deletions(-)

diff --git a/src/assets/terminal/login-bg.jpg b/src/assets/terminal/login-bg.jpg
new file mode 100644
index 0000000..74ff20d
--- /dev/null
+++ b/src/assets/terminal/login-bg.jpg
Binary files differ
diff --git a/src/views/dnc/base/OperatorLogin.vue b/src/views/dnc/base/OperatorLogin.vue
index f0e6ba9..47f0154 100644
--- a/src/views/dnc/base/OperatorLogin.vue
+++ b/src/views/dnc/base/OperatorLogin.vue
@@ -46,10 +46,6 @@
 
           <a-button type="primary" size="large" block :loading="loading" @click="handleLogin">鐧诲綍</a-button>
         </a-form-model>
-        <!--<div class="footer">-->
-        <!--<a @click="handleRegister">娉ㄥ唽璐﹀彿</a>-->
-        <!--<a @click="handleForget">蹇樿瀵嗙爜</a>-->
-        <!--</div>-->
       </a-card>
     </div>
   </div>
@@ -192,13 +188,6 @@
           callback()
         }
       }
-
-      // handleRegister() {
-      //   this.$router.push('/register')
-      // },
-      // handleForget() {
-      //   this.$message.info('璇疯仈绯荤鐞嗗憳閲嶇疆瀵嗙爜')
-      // }
     }
   }
 </script>
@@ -210,7 +199,7 @@
     align-items: center;
     min-height: 100vh;
     background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
-    url('../../../assets/operator-login-bg.png') no-repeat center;
+    url('../../../assets/terminal/login-bg.jpg') no-repeat center;
     background-size: cover;
 
     .login-container {
diff --git a/src/views/mdc/base/equipmentAvailCompare.vue b/src/views/mdc/base/equipmentAvailCompare.vue
index 53ec061..d05b04a 100644
--- a/src/views/mdc/base/equipmentAvailCompare.vue
+++ b/src/views/mdc/base/equipmentAvailCompare.vue
@@ -38,14 +38,9 @@
     data() {
       return {
         activeKey: '1',
-        description: '璁惧淇℃伅',
-        selectEquipmentId: '',
         selectEquipment: {},
         selectPeople: {},
         selectTypeTree: '',
-        url: {
-          equipmentStatistics: '/mdc/equipment/equipmentStatistics'
-        },
         isDepartType: ''
       }
     },
@@ -64,7 +59,6 @@
               description: res.message
             })
           }
-        }).finally(() => {
         })
       },
       tabChange(val) {
diff --git a/src/views/mdc/base/equipmentDayAvail.vue b/src/views/mdc/base/equipmentDayAvail.vue
index 02baad8..ef21734 100644
--- a/src/views/mdc/base/equipmentDayAvail.vue
+++ b/src/views/mdc/base/equipmentDayAvail.vue
@@ -1,22 +1,20 @@
 <template>
   <a-card :bordered="false">
-    <div style="width: 100%; height: 100%;overflow: hidden">
-      <a-row type="flex" :gutter="16">
-        <a-col :md="5">
-          <a-tabs :activeKey="activeKey" @change="tabChange">
-            <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render>
-              <base-tree @getCurrSelected="changeSelectionNode"></base-tree>
-            </a-tab-pane>
-            <a-tab-pane v-if="isDepartType == 0" key="2" tab="閮ㄩ棬灞傜骇">
-              <depart-tree @getCurrSelectedDD="changeSelectionNodedd"></depart-tree>
-            </a-tab-pane>
-          </a-tabs>
-        </a-col>
-        <a-col :md="24-5" :sm="24">
-          <equipment-day-avail-main  ref="equipmentDayAvailMain" :nodeTree='selectEquipment'  :nodePeople='selectPeople' :Type="selectTypeTree"></equipment-day-avail-main>
-        </a-col>
-      </a-row>
-    </div>
+    <a-row type="flex" :gutter="16">
+      <a-col :md="5">
+        <a-tabs :activeKey="activeKey" @change="tabChange">
+          <a-tab-pane key="1" tab="杞﹂棿灞傜骇" force-render>
+            <base-tree @getCurrSelected="changeSelectionNode"></base-tree>
+          </a-tab-pane>
+          <a-tab-pane v-if="isDepartType == 0" key="2" tab="閮ㄩ棬灞傜骇">
+            <depart-tree @getCurrSelectedDD="changeSelectionNodedd"></depart-tree>
+          </a-tab-pane>
+        </a-tabs>
+      </a-col>
+      <a-col :md="24-5" :sm="24">
+        <equipment-day-avail-main  ref="equipmentDayAvailMain" :nodeTree='selectEquipment'  :nodePeople='selectPeople' :Type="selectTypeTree"></equipment-day-avail-main>
+      </a-col>
+    </a-row>
   </a-card>
 </template>
 
@@ -36,14 +34,9 @@
     data() {
       return {
         activeKey: '1',
-        description: '璁惧淇℃伅',
-        selectEquipmentId: '',
         selectEquipment: {},
         selectPeople:{},
         selectTypeTree: '',
-        url: {
-          equipmentStatistics: '/mdc/equipment/equipmentStatistics'
-        },
         isDepartType:'',
       }
     },
@@ -57,17 +50,14 @@
           if (res.success) {
             this.isDepartType = res.result[0].value
           } else {
-            // this.$message.warn(res.message)
             this.$notification.warning({
               message:'娑堟伅',
               description:res.message
             });
           }
-        }).finally(() =>{
         })
       },
       tabChange(val) {
-        // console.log(val)
         this.activeKey = val
         this.selectTypeTree = val
       },
@@ -81,8 +71,4 @@
       }
     }
   }
-</script>
-
-<style scoped>
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file
diff --git a/src/views/mdc/base/modules/EquipmentAvailCompare/EquipmentAvailCompareMain.vue b/src/views/mdc/base/modules/EquipmentAvailCompare/EquipmentAvailCompareMain.vue
index eaa447e..7bc1596 100644
--- a/src/views/mdc/base/modules/EquipmentAvailCompare/EquipmentAvailCompareMain.vue
+++ b/src/views/mdc/base/modules/EquipmentAvailCompare/EquipmentAvailCompareMain.vue
@@ -1,49 +1,44 @@
 <template>
-  <a-spin :spinning="loading">
-    <div :bordered="false" class="device_list">
-      <div class="com_box">
-        <!-- 鏌ヨ鍖哄煙 -->
-        <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
-          <a-form layout="inline" @keyup.enter.native="searchQuery">
-            <a-row :gutter="24">
-              <a-col :md="4" :sm="4">
-                <a-form-item label="璁惧缂栧彿">
-                  <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input>
-                </a-form-item>
-              </a-col>
-              <a-col :md="4" :sm="4">
-                <a-form-item label="璁惧鍚嶇О">
-                  <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input>
-                </a-form-item>
-              </a-col>
-              <a-col :md="5" :sm="5" :xs="5">
-                <a-form-item label="鏃堕棿">
-                  <a-range-picker @change="dateParamChange" v-model="dates" format="YYYYMMDD" :allow-clear="false"/>
-                </a-form-item>
-              </a-col>
-              <a-col :md="6" :sm="6" :xs="6">
-                <a-form-item label="鏃堕棿娈�">
-                  <a-time-picker :default-value="moment('00:00', 'HH:mm')" format="HH:mm" @change="onChangeStart" :allow-clear="false"/>
-                  鑷�
-                  <a-time-picker :default-value="moment('08:00', 'HH:mm')" format="HH:mm" @change="onChangeEnd" :allow-clear="false"/>
-                </a-form-item>
-              </a-col>
-              <a-col :md="2" :sm="3" :xs="3">
-                <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
-              </a-col>
-            </a-row>
-          </a-form>
-        </div>
-        <!-- table鍖哄煙-begin -->
-        <div id="DeviceList">
-          <div style="padding: 5px;width: 100%;height: 100%">
-            <div style="width: 100%;height: 100%" id="dayAvailBar"></div>
-          </div>
-        </div>
-        <!-- table鍖哄煙-end -->
-      </div>
+  <div class="device_list">
+    <!-- 鏌ヨ鍖哄煙 -->
+    <div style="background-color: #fff" class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+          <a-col :md="4" :sm="4">
+            <a-form-item label="璁惧缂栧彿">
+              <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" readOnly v-model="queryParams.equipmentId"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :md="5" :sm="5">
+            <a-form-item label="璁惧鍚嶇О">
+              <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" readOnly v-model="queryParams.equipmentName"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :md="6" :sm="6" :xs="6">
+            <a-form-item label="鏃堕棿">
+              <a-range-picker @change="dateParamChange" v-model="dates" format="YYYYMMDD" :allow-clear="false"/>
+            </a-form-item>
+          </a-col>
+          <a-col :md="6" :sm="6" :xs="6">
+            <a-form-item label="鏃堕棿娈�">
+              <a-time-picker :default-value="moment('00:00', 'HH:mm')" format="HH:mm" @change="onChangeStart"
+                             :allow-clear="false"/>
+              鑷�
+              <a-time-picker :default-value="moment('08:00', 'HH:mm')" format="HH:mm" @change="onChangeEnd"
+                             :allow-clear="false"/>
+            </a-form-item>
+          </a-col>
+          <a-col :md="2" :sm="3" :xs="3">
+            <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+          </a-col>
+        </a-row>
+      </a-form>
     </div>
-  </a-spin>
+
+    <a-spin :spinning="spinning">
+      <div style="width: 100%;height: 100%" id="dayAvailBar"></div>
+    </a-spin>
+  </div>
 </template>
 
 <script>
@@ -51,77 +46,65 @@
   import { getAction } from '@/api/manage'
 
   export default {
-    name: 'equipmentAvailCompareMain',
+    name: 'EquipmentAvailCompareMain',
     props: { nodeTree: '', Type: '', nodePeople: '' },
     data() {
       return {
-        activeKey: '1',
         typeTree: '',
         typeParent: 1,
         typeEquipment: 1,
         spaceTime: [],
         usingRates: [],
         dates: [],
-        readOnly: true,
         queryParam: {},
         queryParams: {},
         queryParamEquip: {},
-        queryParamPeople: {},
         url: {
           dayUtilizationRateContrast: '/mdc/efficiencyReport/dayUtilizationRateContrast',
           getEquipmentByPid: '/mdc/mdcEquipment/getEquipmentByPid',
           getEquipmentByDepPid: '/mdc/mdcEquipment/getEquipmentByDepPid'
         },
-        AnalysisList: {},
-        loading: false
+        spinning: false
       }
     },
     watch: {
       Type(valmath) {
         this.dataList = []
         this.queryParams.typeTree = valmath
-        // console.log(this.queryParams.typeTree)
       },
       nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢
         if (JSON.stringify(val) != '{}') {
           if (val.equipmentId) {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = ''
             this.queryParams.equipmentId = val.equipmentId
             this.queryParams.equipmentName = val.equipmentName
             this.queryParamEquip.equipmentId = val.equipmentId
             this.searchQuery()
           } else {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = val.key
             this.queryParams.equipmentId = ''
             this.initEquipment(val.key)
           }
-
         }
       },
       nodePeople(val) {
         if (JSON.stringify(val) != '{}') {
           if (val.equipmentId) {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = ''
             this.queryParams.equipmentId = val.equipmentId
             this.queryParamEquip.equipmentId = val.equipmentId
             this.searchQuery()
           } else {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = val.key
             this.queryParams.equipmentId = ''
             this.initEquipmentDep(val.key)
           }
-
         }
       }
     },
     methods: {
       drawTu() {
         let dayAvailBar = this.$echarts.init(document.getElementById('dayAvailBar'), 'macarons')
-        //dayAvailLine = echarts.init(document.getElementById('dayAvailLine'));
         let dayAvailBarOption = {
           title: {
             text: '璁惧鏃ュ埄鐢ㄧ巼鍥�',
@@ -186,37 +169,25 @@
       moment,
       onChangeStart(time, timeString) {
         this.queryParam.startTime = timeString
-        // console.log(time, timeString);
       },
       onChangeEnd(time, timeString) {
         this.queryParam.endTime = timeString
-        // console.log(time, timeString);
       },
       disabledDate(current) {
         //Can not slect days before today and today
         return current && current > moment().subtract('days', 1)
       },
-      dataChange(val) {
-        if (val) this.queryParam.dateTime = val.format('YYYYMMDD')
-      },
-      handleChange(value) {
-        this.queryParam.timeType = value
-        // console.log(this.queryParam.timeType)
-      },
-      tabChange(val) {
-        this.activeKey = val
-      },
       dateParamChange(v1, v2) {
-        // console.log(v1,v2)
         this.queryParam.startDate = v2[0]
         this.queryParam.endDate = v2[1]
-        // console.log(v2[0],v2[1])
       },
       loadAnalysis() {
-        this.loading = true
+        this.spaceTime = []
+        this.usingRates = []
+        this.spinning = true
         getAction(this.url.dayUtilizationRateContrast, this.queryParam).then(res => {
           if (res.success) {
-            this.spaceTime.push(res.result.dataList)
+            this.spaceTime = res.result.dateList
             for (let i = 0; i < res.result.dayRateDto.length; i++) {
               this.usingRates.push(res.result.dayRateDto[i].utilizationRate)
             }
@@ -225,7 +196,7 @@
             this.$message.warning(res.message)
           }
         }).finally(() => {
-          this.loading = false
+          this.spinning = false
         })
       },
       numFilter(value) {
@@ -236,118 +207,12 @@
         }
       },
       searchQuery() {
-        this.loading = true
-        this.spaceTime = []
-        this.usingRates = []
-        if (this.queryParams.typeTree == '1') {
-          this.queryParams.parentId = this.queryParamEquip.parentId
-          // this.queryParams.equipmentId =  this.queryParamEquip.equipmentId
-
-        } else {
-          this.queryParams.parentId = this.queryParamEquip.parentId
-          // this.queryParams.equipmentId = ""
-        }
-        this.AnalysisList = []
+        this.queryParams.parentId = this.queryParamEquip.parentId
         //鑾峰彇鏌ヨ鏉′欢
         this.queryParam.parentId = this.queryParams.parentId
         this.queryParam.equipmentId = this.queryParams.equipmentId
         this.queryParam.typeTree = this.queryParams.typeTree
-        getAction(this.url.dayUtilizationRateContrast, this.queryParam).then((res) => {
-          if (res.success) {
-            this.spaceTime = res.result.dateList
-            for (let i = 0; i < res.result.dayRateDto.length; i++) {
-              // res.result[i].useRateDayShift = this.numFilter(res.result[i].useRateDayShift)
-              this.usingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate))
-            }
-            this.drawTu()
-          } else {
-            // this.$message.warning(res.message)
-            this.$notification.warning({
-              message: '娑堟伅',
-              description: res.message
-            })
-          }
-        }).finally(() => {
-          this.loading = false
-        })
-      },
-      searchReset() {
-        this.loading = true
-        this.spaceTime = []
-        this.usingRates = []
-        if (this.queryParams.typeTree == '1') {
-          this.typeTree = this.queryParams.typeTree
-          this.typeParent = this.queryParams.parentId
-          this.typeEquipment = this.queryParams.equipmentId
-          this.queryParams = {}
-          this.queryParam = {}
-          this.queryParams.typeTree = this.typeTree
-          this.queryParams.parentId = this.typeParent
-          if (this.queryParams.parentId != '') {
-            this.queryParams.equipmentId = ''
-            this.initEquipment()
-          } else {
-            if (this.queryParams.equipmentId == this.queryParamEquip.equipmentId) {
-              this.queryParams.equipmentId = this.typeEquipment
-            } else {
-              this.queryParams.equipmentId = this.queryParamEquip.equipmentId
-            }
-          }
-          getAction(this.url.dayUtilizationRateContrast, this.queryParams).then((res) => {
-            if (res.success) {
-              this.spaceTime = res.result.dateList
-              for (let i = 0; i < res.result.dayRateDto.length; i++) {
-                this.usingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate))
-              }
-              this.drawTu()
-            } else {
-              // this.$message.warning(res.message)
-              this.$notification.warning({
-                message: '娑堟伅',
-                description: res.message
-              })
-            }
-          }).finally(() => {
-            this.loading = false
-          })
-        } else {
-          this.typeTree = this.queryParams.typeTree
-          this.typeParent = this.queryParams.parentId
-          this.typeEquipment = this.queryParams.equipmentId
-          this.queryParams = {}
-          this.queryParam = {}
-          this.dates = []
-          this.queryParams.typeTree = this.typeTree
-          this.queryParams.parentId = this.typeParent
-          if (this.queryParams.parentId != '') {
-            this.queryParams.equipmentId = ''
-            this.initEquipment()
-          } else {
-            if (this.queryParams.equipmentId == this.queryParamEquip.equipmentId) {
-              this.queryParams.equipmentId = this.typeEquipment
-            } else {
-              this.queryParams.equipmentId = this.queryParamEquip.equipmentId
-            }
-          }
-          getAction(this.url.dayUtilizationRateContrast, this.queryParams).then((res) => {
-            if (res.success) {
-              this.spaceTime = res.result.dateList
-              for (let i = 0; i < res.result.dayRateDto.length; i++) {
-                this.usingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate))
-              }
-              this.drawTu()
-            } else {
-              // this.$message.warning(res.message)
-              this.$notification.warning({
-                message: '娑堟伅',
-                description: res.message
-              })
-            }
-          }).finally(() => {
-            this.loading = false
-          })
-        }
-
+        this.loadAnalysis()
       },
       initEquipment(id) {
         let _this = this
@@ -361,16 +226,13 @@
               _this.searchQuery()
             } else {
               this.queryParams = {}
-              // this.queryList()
               this.equipment = {}
-              // _this.$message.warning('璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒')
               _this.$notification.warning({
                 message: '娑堟伅',
                 description: '璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒'
               })
             }
           } else {
-            // this.$message.warning(res.message)
             _this.$notification.warning({
               message: '娑堟伅',
               description: res.message
@@ -390,9 +252,7 @@
               _this.searchQuery()
             } else {
               this.queryParams = {}
-              // this.queryList()
               this.equipment = {}
-              // _this.$message.warning('璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒')
               _this.$notification.warning({
                 message: '娑堟伅',
                 description: '璇疯仈绯荤鐞嗗憳锛屽紑鏀捐澶囨潈闄愶紒'
@@ -415,67 +275,52 @@
       this.queryParam.startTime = '00:00'
       this.queryParam.endTime = '08:00'
       this.queryParams.typeTree = '1'
-
-    },
-    mounted() {
       this.initEquipment()
-    }
+    },
   }
 </script>
 
 <style lang="less" scoped>
-  /*@import '~@assets/less/common.less';*/
+  .device_list {
+    display: flex;
+    flex-direction: column;
+
+    /deep/ .ant-spin-nested-loading {
+      flex: 1;
+
+      .ant-spin-container {
+        height: 100%;
+      }
+    }
+  }
 
   @media screen and (min-width: 1920px) {
     .device_list {
       height: 811px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (min-width: 1680px) and (max-width: 1920px) {
     .device_list {
       height: 811px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (min-width: 1400px) and (max-width: 1680px) {
     .device_list {
       height: 663px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (min-width: 1280px) and (max-width: 1400px) {
     .device_list {
       height: 564px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (max-width: 1280px) {
     .device_list {
       height: 564px !important;
-      overflow: auto;
     }
-  }
-
-  /deep/ .ant-card-body {
-    height: 100% !important;
-  }
-
-  .device_list .com_box {
-    display: flex !important;
-    height: 100% !important;
-    flex-direction: column !important;
-  }
-
-  .device_list .table-page-search-wrapper {
-    height: 6% !important;
-  }
-
-  .device_list #DeviceList {
-    height: 90% !important;
   }
 </style>
diff --git a/src/views/mdc/base/modules/EquipmentDayAvail/EquipmentDayAvailMain.vue b/src/views/mdc/base/modules/EquipmentDayAvail/EquipmentDayAvailMain.vue
index e24d024..accff3c 100644
--- a/src/views/mdc/base/modules/EquipmentDayAvail/EquipmentDayAvailMain.vue
+++ b/src/views/mdc/base/modules/EquipmentDayAvail/EquipmentDayAvailMain.vue
@@ -1,63 +1,57 @@
 <template>
-  <a-spin :spinning="loading">
-    <div :bordered="false" class="device_list">
-      <div class="com_box">
-        <!-- 鏌ヨ鍖哄煙 -->
-        <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper">
-          <a-form layout="inline" @keyup.enter.native="searchQuery">
-            <a-row :gutter="24">
-              <a-col :md="4" :sm="4">
-                <a-form-item label="璁惧缂栧彿">
-                  <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentId"></a-input>
-                </a-form-item>
-              </a-col>
-              <a-col :md="4" :sm="4">
-                <a-form-item label="璁惧鍚嶇О">
-                  <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" :readOnly="readOnly" v-model="queryParams.equipmentName"></a-input>
-                </a-form-item>
-              </a-col>
-              <a-col :md="4" :sm="4" :xs="4">
-                <a-form-item label="鏃ユ湡">
-                  <a-date-picker v-model="queryParam.dateTime" :disabledDate="disabledDate" format='YYYYMMDD' :allow-clear="false"
-                                 @change="dataChange"/>
-                </a-form-item>
-              </a-col>
-              <a-col :md="4" :sm="4" :xs="4">
-                <a-form-item label="闂撮殧">
-                  <a-select default-value="2" style="width: 140px" v-model="queryParam.timeType">
-                    <a-select-option :value="2">
-                      2
-                    </a-select-option>
-                    <a-select-option :value="3">
-                      3
-                    </a-select-option>
-                    <a-select-option :value="4">
-                      4
-                    </a-select-option>
-                    <a-select-option :value="6">
-                      6
-                    </a-select-option>
-                  </a-select>
-                  灏忔椂
-                </a-form-item>
-              </a-col>
-              <a-col :md="3" :sm="3" :xs="3">
-                <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
-              </a-col>
-            </a-row>
-          </a-form>
-        </div>
-        <!-- table鍖哄煙-begin -->
-        <div id="DeviceList">
-
-          <div style="padding: 5px;width: 100%;height: 100%">
-            <div style="width: 100%;height: 100%" id="dayAvailBar"></div>
-          </div>
-        </div>
-        <!-- table鍖哄煙-end -->
-      </div>
+  <div class="device_list">
+    <!-- 鏌ヨ鍖哄煙 -->
+    <div style=" background-color: #fff" class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+          <a-col :md="4" :sm="4">
+            <a-form-item label="璁惧缂栧彿">
+              <a-input placeholder="杈撳叆璁惧缂栧彿鏌ヨ" readOnly v-model="queryParams.equipmentId"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :md="5" :sm="5">
+            <a-form-item label="璁惧鍚嶇О">
+              <a-input placeholder="杈撳叆璁惧鍚嶇О鏌ヨ" readOnly v-model="queryParams.equipmentName"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :md="4" :sm="4" :xs="4">
+            <a-form-item label="鏃ユ湡">
+              <a-date-picker v-model="queryParam.dateTime" :disabledDate="disabledDate" :allow-clear="false"
+                             value-format="YYYYMMDD"/>
+            </a-form-item>
+          </a-col>
+          <a-col :md="4" :sm="4" :xs="4">
+            <a-form-item label="闂撮殧">
+              <a-select default-value="2" v-model="queryParam.timeType">
+                <a-select-option :value="2">
+                  2
+                </a-select-option>
+                <a-select-option :value="3">
+                  3
+                </a-select-option>
+                <a-select-option :value="4">
+                  4
+                </a-select-option>
+                <a-select-option :value="6">
+                  6
+                </a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :md="1" :sm="1" :xs="1">
+            <a-form-item label="">灏忔椂</a-form-item>
+          </a-col>
+          <a-col :md="3" :sm="3" :xs="3">
+            <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+          </a-col>
+        </a-row>
+      </a-form>
     </div>
-  </a-spin>
+
+    <a-spin :spinning="spinning">
+      <div style="width: 100%;height: 100%" id="dayAvailBar"></div>
+    </a-spin>
+  </div>
 </template>
 
 <script>
@@ -65,84 +59,62 @@
   import { getAction } from '@/api/manage'
 
   export default {
-    name: 'equipmentDayAvailMain',
-    components: {
-    },
+    name: 'EquipmentDayAvailMain',
     props: { nodeTree: '', Type: '', nodePeople: '' },
     data() {
       return {
-        activeKey: '1',
-        typeTree: '',
-        typeParent: 1,
-        typeEquipment: 1,
         spaceTime: [],
-        useingRates: [],
-        dates: [],
-        xianshi: '',
-        readOnly: true,
+        usingRates: [],
         queryParam: {
           dateTime: undefined,
           timeType: '2'
         },
         queryParams: {},
         queryParamEquip: {},
-        queryParamPeople: {},
-        dataStartsoucre: [],
         url: {
-          comparativeAnalysis: '/mdc/efficiencyReport/comparativeAnalysis',
           dayUtilizationRate: '/mdc/efficiencyReport/dayUtilizationRate',
           getEquipmentByPid: '/mdc/mdcEquipment/getEquipmentByPid',
           getEquipmentByDepPid: '/mdc/mdcEquipment/getEquipmentByDepPid'
         },
-        AnalysisList: {},
-        loading: false
+        spinning: false
       }
     },
     watch: {
       Type(valmath) {
         this.dataList = []
         this.queryParams.typeTree = valmath
-        // console.log(this.queryParams.typeTree)
       },
       nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢
         if (JSON.stringify(val) != '{}') {
           if (val.equipmentId) {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = ''
             this.queryParams.equipmentId = val.equipmentId
             this.queryParams.equipmentName = val.equipmentName
-            console.log('XXXval=', val)
             this.queryParamEquip.equipmentId = val.equipmentId
             this.searchQuery()
           } else {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = val.key
             this.queryParams.equipmentId = ''
             this.initEquipment(val.key)
           }
-
         }
       },
       nodePeople(val) {
         if (JSON.stringify(val) != '{}') {
           if (val.equipmentId) {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = ''
             this.queryParams.equipmentId = val.equipmentId
             this.queryParamEquip.equipmentId = val.equipmentId
             this.searchQuery()
           } else {
-            // this.$set(this.queryParam, 'tierName', val.title)
             this.queryParamEquip.parentId = val.key
             this.queryParams.equipmentId = ''
             this.initEquipmentDep(val.key)
           }
-
         }
       }
     },
     methods: {
-      moment,
       drawTu() {
         let dayAvailBar = this.$echarts.init(document.getElementById('dayAvailBar'), 'macarons')
         let dayAvailBarOption = {
@@ -194,7 +166,7 @@
                   color: '#4169E1'
                 }
               },
-              data: this.useingRates,
+              data: this.usingRates,
               markPoint: {
                 data: [
                   { type: 'max', name: '鏈�澶у��', symbolSize: 70 },
@@ -205,34 +177,22 @@
           ]
         }
         dayAvailBar.setOption(dayAvailBarOption)
+
+        window.addEventListener('resize', () => dayAvailBar.resize())
       },
       disabledDate(current) {
         //Can not slect days before today and today
         return current && current > moment().subtract('days', 1)
       },
-      dataChange(val) {
-        this.queryParam.dateTime = val.format('YYYYMMDD')
-      },
-      handleChange(value) {
-        this.queryParam.timeType = value
-        // console.log(this.queryParam.timeType)
-      },
-      tabChange(val) {
-        this.activeKey = val
-      },
-      dateParamChange(v1, v2) {
-        // console.log(v1,v2)
-        this.queryParam.startTime = v2[0]
-        this.queryParam.endTime = v2[1]
-        // console.log(v2[0],v2[1])
-      },
       loadAnalysis() {
-        this.loading = true
+        this.spaceTime = []
+        this.usingRates = []
+        this.spinning = true
         getAction(this.url.dayUtilizationRate, this.queryParam).then(res => {
           if (res.success) {
-            this.spaceTime.push(res.result.dataList)
+            this.spaceTime = res.result.dateList
             for (var i = 0; i < res.result.dayRateDto.length; i++) {
-              this.useingRates.push(res.result.dayRateDto[i].utilizationRate)
+              this.usingRates.push(res.result.dayRateDto[i].utilizationRate)
             }
             this.drawTu()
           } else {
@@ -242,7 +202,7 @@
             })
           }
         }).finally(() => {
-          this.loading = false
+          this.spinning = false
         })
       },
       numFilter(value) {
@@ -253,44 +213,16 @@
         }
       },
       searchQuery() {
-        if (this.queryParam.dateTime) {
-          this.loading = true
-          this.spaceTime = []
-          this.useingRates = []
-          if (this.queryParams.typeTree == '1') {
-            this.queryParams.parentId = this.queryParamEquip.parentId
-            // this.queryParams.equipmentId =  this.queryParamEquip.equipmentId
-          } else {
-            this.queryParams.parentId = this.queryParamEquip.parentId
-            // this.queryParams.equipmentId = ""
-          }
-          this.AnalysisList = []
-          //鑾峰彇鏌ヨ鏉′欢
-          this.queryParam.parentId = this.queryParams.parentId
-          this.queryParam.equipmentId = this.queryParams.equipmentId
-          this.queryParam.typeTree = this.queryParams.typeTree
-          getAction(this.url.dayUtilizationRate, this.queryParam).then((res) => {
-            if (res.success) {
-              this.spaceTime = res.result.dateList
-              for (var i = 0; i < res.result.dayRateDto.length; i++) {
-                this.useingRates.push(this.numFilter(res.result.dayRateDto[i].utilizationRate))
-              }
-              this.drawTu()
-            } else {
-              this.$notification.warning({
-                message: '娑堟伅',
-                description: res.message
-              })
-            }
-          }).finally(() => {
-            this.loading = false
-          })
+        if (this.queryParams.typeTree == '1') {
+          this.queryParams.parentId = this.queryParamEquip.parentId
         } else {
-          this.$notification.warning({
-            message: '娑堟伅',
-            description: '璇烽�夋嫨鏃堕棿'
-          })
+          this.queryParams.parentId = this.queryParamEquip.parentId
         }
+        //鑾峰彇鏌ヨ鏉′欢
+        this.queryParam.parentId = this.queryParams.parentId
+        this.queryParam.equipmentId = this.queryParams.equipmentId
+        this.queryParam.typeTree = this.queryParams.typeTree
+        this.loadAnalysis()
       },
       initEquipment(id) {
         let _this = this
@@ -347,75 +279,54 @@
       }
     },
     created() {
-      let collectTime = moment(moment().add(-1, 'd'), 'YYYY-MM-DD')
-      this.queryParams.collectTime = collectTime
-      this.queryParam.dateTime = this.queryParams.collectTime.format('YYYYMMDD')
+      this.queryParam.dateTime = moment().add(-1, 'd').format('YYYYMMDD')
       this.queryParams.typeTree = '1'
       this.initEquipment()
-
     }
   }
 </script>
 
 <style lang="less" scoped>
-  /*@import '~@assets/less/common.less';*/
+  .device_list {
+    display: flex;
+    flex-direction: column;
+
+    /deep/ .ant-spin-nested-loading {
+      flex: 1;
+
+      .ant-spin-container {
+        height: 100%;
+      }
+    }
+  }
 
   @media screen and (min-width: 1920px) {
     .device_list {
       height: 811px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (min-width: 1680px) and (max-width: 1920px) {
     .device_list {
       height: 811px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (min-width: 1400px) and (max-width: 1680px) {
     .device_list {
       height: 663px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (min-width: 1280px) and (max-width: 1400px) {
     .device_list {
       height: 564px !important;
-      overflow: auto;
     }
   }
 
   @media screen and (max-width: 1280px) {
     .device_list {
       height: 564px !important;
-      overflow: auto;
     }
-  }
-
-  /*.device_list{*/
-  /*display: flex;*/
-  /*}*/
-  /*.device_list .table-page-search-wrapper{*/
-  /**/
-  /*}*/
-  /deep/ .ant-card-body {
-    height: 100% !important;
-  }
-
-  .device_list .com_box {
-    display: flex !important;
-    height: 100% !important;
-    flex-direction: column !important;
-  }
-
-  .device_list .table-page-search-wrapper {
-    height: 6% !important;
-  }
-
-  .device_list #DeviceList {
-    height: 90% !important;
   }
 </style>

--
Gitblit v1.9.3