From 9b6707a857d91aac00ca840661eb4998eabd7e4f Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期三, 21 十月 2020 17:40:36 +0800
Subject: [PATCH] 调整增加底库form的样式, 国标刷新按钮增加loading

---
 src/components/LeftNav.vue               |   73 ++++++++++++++++++------------------
 src/pages/library/components/addBase.vue |   31 ++++++++-------
 2 files changed, 54 insertions(+), 50 deletions(-)

diff --git a/src/components/LeftNav.vue b/src/components/LeftNav.vue
index 5322b01..94dbe0d 100644
--- a/src/components/LeftNav.vue
+++ b/src/components/LeftNav.vue
@@ -126,7 +126,8 @@
               <div class="tree-edit gb-refresh" v-show="!TreeDataPool.gbReadonly">
                 <el-tooltip content="鍒锋柊" placement="top" popper-class="atooltip">
                   <button @click="refreshGB">
-                    <i class="el-icon-refresh" style="font-size:16px"></i>
+                    <i v-if="loadingGBTree" class="el-icon-loading" style="font-size:16px"></i>
+                    <i v-else class="el-icon-refresh" style="font-size:16px"></i>
                   </button>
                 </el-tooltip>
               </div>
@@ -334,17 +335,17 @@
   },
 
   computed: {
-    showTab () {
+    showTab() {
       return true;
     },
-    showCam () {
+    showCam() {
       return this.appName === "Camera" || this.appName === 'Cluster' || (this.appName === "Search" && (this.buttonAuthority.indexOf("search:camera") >= 0 || this.isAdmin));
     },
-    showCluster () {
+    showCluster() {
       return this.appName === "Cluster";
     },
     // 鏁版嵁鏍堥厤缃繀椤绘樉绀恒�� 妫�绱㈤�氳繃鏉冮檺鎺у埗鏄剧ず, 鏈畨瑁呮暟鎹爤涔熶笉鏄剧ず
-    showDataStack () {
+    showDataStack() {
       if (this.appName === "DataStack") {
         return true;
       }
@@ -364,10 +365,10 @@
 
       return false;
     },
-    showLock () {
+    showLock() {
       return this.edit;
     },
-    openeds () {
+    openeds() {
       let arry = [];
       for (let i = 0; i < this.TreeDataPool.openeds.length; i++) {
         if (this.TreeDataPool.openeds[i]) {
@@ -378,7 +379,7 @@
       }
       return arry;
     },
-    isAdmin () {
+    isAdmin() {
       if (
         sessionStorage.getItem("userInfo") &&
         sessionStorage.getItem("userInfo") !== ""
@@ -389,7 +390,7 @@
       return false;
     }
   },
-  data () {
+  data() {
     return {
       cameraAuth: "videoMonitor:camera",
       dataStack: "videoMonitor:dataStack",
@@ -444,7 +445,7 @@
       menuLoading: false
     };
   },
-  created () {
+  created() {
     console.log(this.appName)
     console.log(this.showCam)
     if (this.showCam) {
@@ -462,44 +463,44 @@
     }
   },
   methods: {
-    searchAreaData () {
+    searchAreaData() {
       this.TreeDataPool.fetchTreeData();
     },
-    searchDataStack () {
+    searchDataStack() {
       this.DataStackPool.fetchFiles();
     },
-    searchClusterData () {
+    searchClusterData() {
       this.TreeDataPool.fetchClusterTree();
     },
-    lockSwitch () {
+    lockSwitch() {
       this.TreeDataPool.readonly = !this.TreeDataPool.readonly;
     },
-    gbLockSwitch () {
+    gbLockSwitch() {
       this.TreeDataPool.gbReadonly = !this.TreeDataPool.gbReadonly;
     },
-    dataStackLockSwitch () {
+    dataStackLockSwitch() {
       this.DataStackPool.readonly = !this.DataStackPool.readonly;
     },
-    closeTree () {
+    closeTree() {
       this.TreeDataPool.showTreeBox = false;
       bus.$emit('refreshCompareImg')
     },
-    addNode (event) {
+    addNode(event) {
       this.$refs.tree.addNode(event, { id: 0 });
     },
-    addCamera (node) {
+    addCamera(node) {
       bus.$emit("addCameraOnTree", node);
     },
-    addDir (node) {
+    addDir(node) {
       bus.$emit("addDirOnTree", node);
     },
-    menuOpen (index) {
+    menuOpen(index) {
       this.TreeDataPool.openeds[index] = true;
     },
-    menuClose (index) {
+    menuClose(index) {
       this.TreeDataPool.openeds[index] = false;
     },
-    refreshGB () {
+    refreshGB() {
       // 闃叉閲嶅鍒锋柊
       if (this.loadingGBTree) {
         return;
@@ -513,7 +514,7 @@
         this.loadingGBTree = false;
       }, 1000 * 60);
     },
-    querySearchAsync (type) {
+    querySearchAsync(type) {
       clearTimeout(this.timeout);
       this.timeout = setTimeout(() => {
         if (type === "camera") {
@@ -524,7 +525,7 @@
         }
       }, 500);
     },
-    handleClick (event) {
+    handleClick(event) {
       if (event.name == 'dataStack') {
         this.DataStackPool.fetchFiles();
         this.DataStackPool.clean();
@@ -533,7 +534,7 @@
       this.TreeDataPool.treeActiveName = event.name
       console.log("褰撳墠婵�娲籲ame锛�", this.TreeDataPool.treeActiveName)
     },
-    async changeEnable () {
+    async changeEnable() {
       if (this.PollData.localVideo === 0) {
         this.$notify({
           title: "澶辫触",
@@ -549,13 +550,13 @@
         console.log(res, '鍒囨崲鏈湴鏂囦欢鍒嗘瀽寮�鍏�')
       }
     },
-    getCheckedFiles () {
+    getCheckedFiles() {
       let list1 = this.TreeDataPool.localVedioList.filter(i => {
         return i.checkStatus
       })
       return list1
     },
-    async stopVedio (status) {
+    async stopVedio(status) {
       // let list1 = this.getCheckedFiles();
       if (this.TreeDataPool.checkedLocalVedio.length == 0) {
         this.$notify({
@@ -578,7 +579,7 @@
         console.log(res, '寮�鍚殏鍋滃弬鏁�')
       }
     },
-    async deleteLocalFiles () {
+    async deleteLocalFiles() {
       let list1 = this.getCheckedFiles();
       console.log(list1, '宸插嬀閫夌殑瑙嗛')
       if (list1.length == 0) {
@@ -600,16 +601,16 @@
       }
     },
 
-    refrash (current, pageSize) {
+    refrash(current, pageSize) {
       this.TreeDataPool.localCurrentPage = current;
     },
 
-    importCameras (area) {
+    importCameras(area) {
       this.importAreaId = area
       this.$refs["import-btn"].click()
     },
 
-    async uploadFile (params) {
+    async uploadFile(params) {
       const _file = params.file;
       const fileReader = new FileReader();
       fileReader.onload = (ev) => {
@@ -667,14 +668,14 @@
       };
       fileReader.readAsBinaryString(_file);
     },
-    exceed () {
+    exceed() {
       this.$message.error("鏈�澶氬彧鑳戒笂浼�1涓獂ls鏂囦欢");
     },
     //鍒犻櫎鏂囦欢
-    remove () {
+    remove() {
 
     },
-    newCamera () {
+    newCamera() {
       return {
         latitude: 0,
         rtsp: "",
@@ -950,7 +951,7 @@
     color: #606266;
   }
 }
-.flex-box{
+.flex-box {
   display: flex;
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/library/components/addBase.vue b/src/pages/library/components/addBase.vue
index 1902648..0cff106 100644
--- a/src/pages/library/components/addBase.vue
+++ b/src/pages/library/components/addBase.vue
@@ -5,7 +5,7 @@
       :model="form"
       :rules="rules"
       label-width="150px"
-      class="mt50"
+      class="add-base-form"
       label-position="left"
     >
       <el-row>
@@ -75,7 +75,7 @@
             required
             prop="startTime"
           >
-            <el-col :span="11" class="">
+            <el-col :span="11" class>
               <el-date-picker
                 size="small"
                 type="datetime"
@@ -121,7 +121,7 @@
             </el-radio-group>
           </el-form-item>
         </el-col>
-      </el-row> -->
+      </el-row>-->
       <el-row>
         <el-col :span="6" :offset="15">
           <el-form-item style="margin-top:50px;text-align:right;" label-width="0px">
@@ -193,7 +193,7 @@
     baseObject: function (newVal, oldVal) {
       this.foreverChecked = false
       this.form = newVal
-      console.log(this.form,'baseObject')
+      console.log(this.form, 'baseObject')
       if (!newVal.endTime || newVal.endTime === undefined || newVal.endTime === null) {
         this.form.isForever = '1'
         this.foreverChecked = true
@@ -249,7 +249,7 @@
               tableName: this.form.tableName,
               startTime: this.$moment(this.form.startTime).format('YYYY-MM-DD HH:mm:ss'),
               tableType: this.form.tableType,
-              isForever: this.foreverChecked ? '1':'0',
+              isForever: this.foreverChecked ? '1' : '0',
               id: this.form.id,
               endTime: this.form.endTime ? this.$moment(this.form.endTime).format('YYYY-MM-DD HH:mm:ss') : '',
               bwType: this.form.bwType,
@@ -283,7 +283,7 @@
               tableName: this.form.tableName,
               startTime: this.$moment(this.form.startTime).format('YYYY-MM-DD 00:00:00'),
               tableType: this.form.tableType,
-              isForever: this.foreverChecked ? '1':'0',
+              isForever: this.foreverChecked ? '1' : '0',
               id: this.form.id,
               endTime: this.form.endTime ? this.$moment(this.form.endTime).format('YYYY-MM-DD 23:59:59') : '',
               bwType: this.form.bwType,
@@ -309,7 +309,7 @@
         })
       }
     },
-    onCancle(){
+    onCancle() {
       this.$emit('closeAdd')
     },
     forever(value) {
@@ -319,14 +319,14 @@
     },
     init() {
       console.log('娣诲姞搴曞簱琛ㄥ崟鏀跺埌鐨勬暟鎹�', this.baseObject, this.type)
-      if(Object.keys(this.baseObject).length > 3){
+      if (Object.keys(this.baseObject).length > 3) {
         this.form = this.baseObject
         if (!this.form.endTime) {
           this.foreverChecked = true
         } else {
           this.foreverChecked = false
         }
-      }else{
+      } else {
         this.$refs.baseForm.resetFields()
       }
     },
@@ -386,6 +386,9 @@
 }
 </script>
 <style lang="scss">
+.add-base-form {
+  margin-top: 50px;
+}
 .el-radio__inner {
   border: 1px solid #dcdfe6;
   border-radius: 100%;
@@ -447,15 +450,15 @@
     line-height: 40px;
     outline: none;
     padding: 0 0 0 15px;
-    -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
-    transition: border-color .2s cubic-bezier(.645,.045,.355,1);
+    -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+    transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
     width: 100%;
   }
   .el-input--prefix .el-input__inner {
     padding-left: 22px;
   }
   .el-input--suffix .el-input__inner {
-      padding-right: 0;
+    padding-right: 0;
   }
   .el-input__prefix {
     position: absolute;
@@ -463,7 +466,7 @@
     left: 0px;
     top: 0;
     text-align: center;
-    color: #C0C4CC;
+    color: #c0c4cc;
     -webkit-transition: all 0.3s;
     transition: all 0.3s;
   }
@@ -473,7 +476,7 @@
     right: -2px;
     top: 0;
     text-align: center;
-    color: #C0C4CC;
+    color: #c0c4cc;
     -webkit-transition: all 0.3s;
     transition: all 0.3s;
     pointer-events: none;

--
Gitblit v1.8.0