From 2e4133d2bbb0f4626cf336f3e456783b9fb7867e Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期四, 04 八月 2022 02:40:08 +0800
Subject: [PATCH] 优化部分样式

---
 src/views/equipmentManagement/equipmentList/components/FormList.vue |  260 ++++++++++++++++++++-------------------------------
 1 files changed, 104 insertions(+), 156 deletions(-)

diff --git a/src/views/equipmentManagement/equipmentList/components/FormList.vue b/src/views/equipmentManagement/equipmentList/components/FormList.vue
index f46981c..84f9ee9 100644
--- a/src/views/equipmentManagement/equipmentList/components/FormList.vue
+++ b/src/views/equipmentManagement/equipmentList/components/FormList.vue
@@ -23,12 +23,7 @@
         <div class="cluster">
           鎵�灞為泦缇�
           <el-select v-model="cluster" placeholder="璇烽�夋嫨">
-            <el-option
-              v-for="item in clusterArr"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            >
+            <el-option v-for="item in clusterArr" :key="item.value" :label="item.label" :value="item.value">
             </el-option>
           </el-select>
         </div>
@@ -41,12 +36,8 @@
     </div>
 
     <div class="btns">
-      <div class="button add" @click="isShowAdd = true">
-        <span>+</span>娣诲姞璁惧
-      </div>
-      <div class="button export" @click="exportFile">
-        <span class="iconfont">&#xe614;</span>瀵煎嚭
-      </div>
+      <div class="button add" @click="isShowAdd = true"><span>+</span>娣诲姞璁惧</div>
+      <div class="button export" @click="exportFile"><span class="iconfont">&#xe614;</span>瀵煎嚭</div>
     </div>
 
     <div class="table-area">
@@ -60,27 +51,11 @@
         :stripe="true"
       >
         <el-table-column label="搴忓彿" width="80" class-name="index">
-          <template slot-scope="scope">{{
-            scope.$index + 1 + (page - 1) * size
-          }}</template>
+          <template slot-scope="scope">{{ scope.$index + 1 + (page - 1) * size }}</template>
         </el-table-column>
-        <el-table-column
-          prop="devId"
-          label="璁惧ID"
-          min-width="140"
-          show-overflow-tooltip
-        ></el-table-column>
-        <el-table-column
-          prop="devName"
-          label="璁惧鍚嶇О"
-          min-width="140"
-          show-overflow-tooltip
-        ></el-table-column>
-        <el-table-column
-          prop="devIp"
-          label="IP鍦板潃"
-          min-width="150"
-        ></el-table-column>
+        <el-table-column prop="devId" label="璁惧ID" min-width="185" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="devName" label="璁惧鍚嶇О" min-width="140" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="devIp" label="IP鍦板潃" min-width="150"></el-table-column>
         <el-table-column label="瀹夎鏃堕棿" min-width="159">
           <template slot-scope="scope">
             <div v-if="scope.row.installTime.length > 1">
@@ -114,11 +89,7 @@
         <el-table-column label="鎿嶄綔" min-width="180">
           <template slot-scope="scope">
             <!-- 鍔犲叆 -->
-            <el-tooltip
-              content="鍔犲叆闆嗙兢"
-              placement="top"
-              v-if="!scope.row.clusterId"
-            >
+            <el-tooltip content="鍔犲叆闆嗙兢" placement="top" v-if="!scope.row.clusterId">
               <span
                 class="iconfont option"
                 @click="joinCluster(scope.row)"
@@ -155,10 +126,7 @@
             </el-tooltip>
             <!-- 瑙g粦 -->
             <el-tooltip content="瑙i櫎缁戝畾" placement="top">
-              <span
-                class="iconfont option"
-                @click="Untying(scope.row)"
-                :class="{ disable: scope.row.isOnline != 1 }"
+              <span class="iconfont option" @click="Untying(scope.row)" :class="{ disable: scope.row.isOnline != 1 }"
                 >&#xe617;</span
               >
             </el-tooltip>
@@ -180,54 +148,37 @@
     </div>
 
     <!-- 瑙g粦寮圭獥 -->
-    <UnbindBox
-      @close="closeUnbindBox"
-      v-if="isShowUnbind"
-      :id="unbindId"
-      @reflash="reflash"
-    ></UnbindBox>
+    <UnbindBox @close="closeUnbindBox" v-if="isShowUnbind" :id="unbindId" @reflash="reflash"></UnbindBox>
 
     <!-- 娣诲姞璁惧寮圭獥 -->
     <AddBox @close="closeAddBox" v-if="isShowAdd"></AddBox>
 
     <!-- 閫�鍑洪泦缇ゅ脊绐� -->
-    <QuitClusterBox
-      :equipment="activeEquipment"
-      v-if="showQuit"
-      @close="showQuit = false"
-    ></QuitClusterBox>
+    <QuitClusterBox :equipment="activeEquipment" v-if="showQuit" @close="showQuit = false"></QuitClusterBox>
 
     <!-- 鍔犲叆闆嗙兢寮圭獥 -->
-    <JoinClusterBox
-      :equipment="activeEquipment"
-      v-if="showJoin"
-      @close="showJoin = false"
-    ></JoinClusterBox>
+    <JoinClusterBox :equipment="activeEquipment" v-if="showJoin" @close="showJoin = false"></JoinClusterBox>
   </div>
 </template>
 
 <script>
-import {
-  findDevList,
-  findClustersBySearch,
-  exportDevListExcel,
-} from "@/api/device";
-import AddBox from "@/views/equipmentManagement/equipmentList/components/AddBox";
-import UnbindBox from "@/views/equipmentManagement/equipmentDetail/components/UnbindBox";
-import QuitClusterBox from "@/views/equipmentManagement/equipmentList/components/QuitClusterBox";
-import JoinClusterBox from "@/views/equipmentManagement/equipmentList/components/JoinClusterBox";
+import { findDevList, findClustersBySearch, exportDevListExcel } from "@/api/device"
+import AddBox from "@/views/equipmentManagement/equipmentList/components/AddBox"
+import UnbindBox from "@/views/equipmentManagement/equipmentDetail/components/UnbindBox"
+import QuitClusterBox from "@/views/equipmentManagement/equipmentList/components/QuitClusterBox"
+import JoinClusterBox from "@/views/equipmentManagement/equipmentList/components/JoinClusterBox"
 
-import bus from "@/plugin/bus";
+import bus from "@/plugin/bus"
 
 export default {
   components: {
     AddBox,
     UnbindBox,
     QuitClusterBox,
-    JoinClusterBox,
+    JoinClusterBox
   },
   created() {
-    this.getCluster();
+    this.getCluster()
   },
   data() {
     return {
@@ -244,8 +195,8 @@
       cluster: null, //閫変腑鐨勯泦缇ょ被鍨�
       showQuit: false, //灞曠ず閫�鍑洪泦缇ょ殑寮圭獥
       showJoin: false, //灞曠ず鍔犲叆闆嗙兢鐨勫脊绐�
-      activeEquipment: null, //澶勭悊涓殑璁惧
-    };
+      activeEquipment: null //澶勭悊涓殑璁惧
+    }
   },
   methods: {
     async getCluster() {
@@ -253,47 +204,47 @@
         InputText: "",
         Page: 1,
         Size: 10000,
-        userId: JSON.parse(sessionStorage.getItem("userInfo")).id,
-      });
+        userId: JSON.parse(sessionStorage.getItem("userInfo")).id
+      })
       if (res && res.success) {
         res.data.list.forEach((item) => {
           this.clusterArr.push({
             label: item.clusterName,
-            value: item.clusterId,
-          });
-        });
+            value: item.clusterId
+          })
+        })
       }
     },
 
     // 璺冲埌璁惧璇︽儏
     checkDetail(row) {
       if (row.isOnline != 1) {
-        return;
+        return
       }
       this.$router.push({
         path: "/equipmentDetail",
         query: {
-          id: row.devId,
-        },
-      });
+          id: row.devId
+        }
+      })
     },
 
     // 璺冲埌绠楁硶璇︽儏
     algorithmDetail(row) {
       if (row.isOnline != 1) {
-        return;
+        return
       }
       this.$router.push({
         path: "/algorithmDetail",
         query: {
-          id: row.devId,
-        },
-      });
+          id: row.devId
+        }
+      })
     },
 
     // 鏌ヨ鍒楄〃
     searchingBtn() {
-      let param = {};
+      let param = {}
 
       if (!this.searchTime) {
         param = {
@@ -302,8 +253,8 @@
           startTime: "",
           endTime: "",
           clusterId: this.cluster,
-          inputText: this.inputText,
-        };
+          inputText: this.inputText
+        }
       } else {
         param = {
           page: this.page,
@@ -311,112 +262,109 @@
           startTime: this.searchTime[0],
           endTime: this.searchTime[1],
           clusterId: this.cluster,
-          inputText: this.inputText,
-        };
+          inputText: this.inputText
+        }
       }
 
       findDevList(param)
         .then((res) => {
-          this.dataList = res.data.list;
+          this.dataList = res.data.list
           //鏃堕棿鍒嗚鏄剧ず
           this.dataList.forEach((item) => {
-            item.installTime = item.installTime.split(" ");
-            item.firstUseTime = item.firstUseTime.split(" ");
-          });
-          this.total = res.data.total;
+            item.installTime = item.installTime.split(" ")
+            item.firstUseTime = item.firstUseTime.split(" ")
+          })
+          this.total = res.data.total
           if (res.data.total <= this.size) {
-            this.page = 1;
+            this.page = 1
           }
 
-          bus.$emit("refleshNode", this.dataList);
+          bus.$emit("refleshNode", this.dataList)
         })
         .catch((err) => {
-          console.log(err);
-        });
+          console.log(err)
+        })
     },
 
     //鍒嗛〉鍔熻兘
     handleSizeChange(size) {
-      this.size = size;
-      this.searchingBtn();
+      this.size = size
+      this.searchingBtn()
     },
     //鍒嗛〉鍔熻兘
     refrash(page) {
-      this.page = page;
-      this.searchingBtn();
+      this.page = page
+      this.searchingBtn()
     },
 
     //瑙g粦鎸夐挳
     Untying(row) {
       if (row.isOnline != 1) {
-        return;
+        return
       }
-      this.unbindId = row.devId;
-      this.isShowUnbind = true;
+      this.unbindId = row.devId
+      this.isShowUnbind = true
     },
 
     //鑾峰緱榛樿鏃堕棿
     getDateInit() {
       // 瑕佹眰 榛樿涓�涓湀
-      const end = new Date();
-      const start = new Date();
-      const nowDate = new Date();
-      nowDate.setHours(0);
-      nowDate.setMinutes(0);
-      nowDate.setSeconds(0);
-      nowDate.setMilliseconds(0);
-      start.setTime(nowDate.getTime() - 3600 * 1000 * 24 * 30);
-      end.setTime(nowDate.getTime() + 3600 * 1000 * 24 - 1);
-      return [
-        this.$moment(start).format("YYYY-MM-DD HH:mm:ss"),
-        this.$moment(end).format("YYYY-MM-DD HH:mm:ss"),
-      ];
+      const end = new Date()
+      const start = new Date()
+      const nowDate = new Date()
+      nowDate.setHours(0)
+      nowDate.setMinutes(0)
+      nowDate.setSeconds(0)
+      nowDate.setMilliseconds(0)
+      start.setTime(nowDate.getTime() - 3600 * 1000 * 24 * 30)
+      end.setTime(nowDate.getTime() + 3600 * 1000 * 24 - 1)
+      return [this.$moment(start).format("YYYY-MM-DD HH:mm:ss"), this.$moment(end).format("YYYY-MM-DD HH:mm:ss")]
     },
 
     //鍏抽棴鏂板寮圭獥
     closeAddBox() {
-      this.isShowAdd = false;
-      this.searchingBtn();
+      this.isShowAdd = false
+      this.searchingBtn()
     },
     // 鍏抽棴瑙g粦寮圭獥
     closeUnbindBox() {
-      this.isShowUnbind = false;
+      this.isShowUnbind = false
     },
 
     //瑙g粦鎴愬姛鍥炶皟
     reflash() {
-      this.isShowUnbind = false;
-      this.searchingBtn();
+      this.isShowUnbind = false
+      this.searchingBtn()
     },
 
     clearSearch() {
-      this.searchTime = this.getDateInit();
-      this.inputText = "";
-      this.cluster = "";
-      this.searchingBtn();
+      this.searchTime = this.getDateInit()
+      this.inputText = ""
+      this.cluster = ""
+      this.searchingBtn()
     },
 
     //閫�鍑洪泦缇�
     quitCluster(equipment) {
       if (equipment.isOnline != 1) {
-        return;
+        return
       }
-      this.activeEquipment = equipment;
-      this.showQuit = true;
+      this.activeEquipment = equipment
+      this.showQuit = true
     },
 
     //鍔犲叆闆嗙兢
     joinCluster(equipment) {
       if (equipment.isOnline != 1) {
-        return;
+        return
       }
-      this.activeEquipment = equipment;
-      this.showJoin = true;
+      this.activeEquipment = equipment
+      this.showJoin = true
     },
 
     //瀵煎嚭鍒楄〃鏂囦欢
     async exportFile() {
-      let param = {};
+      let param = {}
 
       if (!this.searchTime) {
         param = {
@@ -425,8 +373,8 @@
           startTime: "",
           endTime: "",
           clusterId: this.cluster,
-          inputText: this.inputText,
-        };
+          inputText: this.inputText
+        }
       } else {
         param = {
           page: this.page,
@@ -434,38 +382,38 @@
           startTime: this.searchTime[0],
           endTime: this.searchTime[1],
           clusterId: this.cluster,
-          inputText: this.inputText,
-        };
+          inputText: this.inputText
+        }
       }
-      const result = await exportDevListExcel(param);
+      const result = await exportDevListExcel(param)
 
       var blob = new Blob([result.body.data], {
-          type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8",
+          type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
         }),
-        Temp = document.createElement("a");
+        Temp = document.createElement("a")
 
-      Temp.href = window.URL.createObjectURL(blob);
+      Temp.href = window.URL.createObjectURL(blob)
 
-      console.log(result);
-      console.log(result.fileName);
+      console.log(result)
+      console.log(result.fileName)
 
-      Temp.download = window.decodeURI(result.fileName);
+      Temp.download = window.decodeURI(result.fileName)
 
-      Temp.setAttribute("download", result.fileName);
+      Temp.setAttribute("download", result.fileName)
 
-      document.body.appendChild(Temp);
+      document.body.appendChild(Temp)
 
-      Temp.click();
+      Temp.click()
 
-      document.body.removeChild(Temp);
+      document.body.removeChild(Temp)
 
-      window.URL.revokeObjectURL(Temp);
-    },
+      window.URL.revokeObjectURL(Temp)
+    }
   },
   mounted() {
-    this.searchingBtn();
-  },
-};
+    this.searchingBtn()
+  }
+}
 </script>
 
 <style scoped lang="scss">
@@ -725,7 +673,7 @@
 }
 </style>
 
-<style >
+<style>
 .el-date-table td.start-date span,
 .el-date-table td.end-date span {
   background-color: #0065ff;
@@ -740,4 +688,4 @@
   color: #0065ff;
   border-color: #0065ff;
 }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0