From 05d754bb09ba4aeddd60320d33d583d388434c2f Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期一, 20 十二月 2021 15:38:45 +0800
Subject: [PATCH] 树形组件修改

---
 src/pages/shuohuangMonitorAnalyze/components/configManage.vue |  114 +++++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 83 insertions(+), 31 deletions(-)

diff --git a/src/pages/shuohuangMonitorAnalyze/components/configManage.vue b/src/pages/shuohuangMonitorAnalyze/components/configManage.vue
index 382d0b0..eafc08a 100644
--- a/src/pages/shuohuangMonitorAnalyze/components/configManage.vue
+++ b/src/pages/shuohuangMonitorAnalyze/components/configManage.vue
@@ -8,8 +8,8 @@
               <label>鍘熷瑙嗛淇濆瓨鍒板瓨鍌ㄦ湇鍔″櫒</label>
               <el-switch
                 v-model="memoryServe"
-                active-color="#409eff"
-                inactive-color="#dcdfe6"
+                active-color="#4B72E2"
+                inactive-color="#B7BEC8"
                 :active-value="true"
                 :inactive-value="false"
                 size="small"
@@ -17,10 +17,21 @@
             </div>
             <div>
               <label>瀛樺偍鏃堕棿</label>
-              <el-select v-model="memoryTime" size="small">
+              <el-input-number
+                v-model="memoryTime" min="0"
+              size="small"  style="max-width: 190px"
+              >
+
+
+              </el-input-number> &nbsp;&nbsp;鍛�
+              <!-- <el-select
+                v-model="memoryTime"
+                size="small"
+                style="max-width: 190px"
+              >
                 <el-option value="week">涓�鍛�</el-option>
                 <el-option value="month">涓�涓湀</el-option>
-              </el-select>
+              </el-select> -->
             </div>
           </div>
           <div class="flex-box">
@@ -28,8 +39,8 @@
               <label>瑙嗛杞偍瀹屾垚鍚庢牸寮忓寲纭洏</label>
               <el-switch
                 v-model="format"
-                active-color="#409eff"
-                inactive-color="#dcdfe6"
+                active-color="#4B72E2"
+                inactive-color="#B7BEC8"
                 :active-value="true"
                 :inactive-value="false"
                 size="small"
@@ -41,8 +52,8 @@
               <label>瑙嗛鏂囦欢瓒呭嚭鏃堕棿鑷姩鍒犻櫎</label>
               <el-switch
                 v-model="autoRemove"
-                active-color="#409eff"
-                inactive-color="#dcdfe6"
+                active-color="#4B72E2"
+                inactive-color="#B7BEC8"
                 :active-value="true"
                 :inactive-value="false"
                 size="small"
@@ -50,7 +61,11 @@
             </div>
             <div>
               <label>鍒犻櫎鏃堕棿</label>
-              <el-select v-model="removeTime" size="small">
+              <el-select
+                v-model="removeTime"
+                size="small"
+                style="max-width: 190px"
+              >
                 <el-option value="week">涓�鍛�</el-option>
                 <el-option value="month">涓�涓湀</el-option>
               </el-select>
@@ -62,13 +77,14 @@
         <div class="analyze-setting">
           <div class="flex-box">
             <div>
-              <label>瑙嗛鍒嗘瀽鍛ㄦ湡:</label>
+              <label>瑙嗛鍒嗘瀽鍛ㄦ湡</label>
               <el-input-number
                 v-model="analyzePeriod"
                 controls-position="right"
                 :min="1"
                 :max="10"
-                size="small"
+                size="mini"
+                style="max-width: 90px"
               ></el-input-number>
             </div>
           </div>
@@ -84,56 +100,92 @@
 
 <script>
 export default {
-  data () {
+  data() {
     return {
-      activeNames: ['1', '2'],
+      activeNames: ["1", "2"],
       memoryServe: false,
-      memoryTime: '',
+      memoryTime: 1,
       format: false,
       autoRemove: true,
-      removeTime: '',
-      analyzePeriod: '',
-    }
+      removeTime: "",
+      analyzePeriod: "",
+    };
   },
   methods: {
-    handleChange () {
-
-    }
-  }
-}
+    handleChange() {},
+  },
+};
 </script>
 
 <style lang="scss">
 .config-manage {
-  padding: 20px;
+  padding: 28px 33px;
+  background: #fff;
+  box-shadow: 0px 3px 6px rgba(160, 174, 230, 0.56);
+  height: 100%;
+  border-radius: 10px;
+  .el-collapse {
+    border-top: none;
+    border-bottom: none;
+  }
+  .el-collapse-item__content {
+    padding-top: 24px;
+  }
+  .el-collapse-item__wrap {
+    border-bottom: none;
+  }
+  .el-collapse-item__header {
+    font-weight: bold;
+    font-size: 14px;
+    color: #425277;
+    padding: 0 18px;
+    height: 40px;
+    background: #f4f6f9;
+    border: none;
+  }
+  .el-collapse-item__header.is-active {
+    border-bottom-color: transparent;
+    background-color: #2d52d7;
+    color: #fff;
+    height: 40px;
+    padding: 0 18px;
+  }
   .el-collapse-item__header {
     font-weight: bold;
     font-size: 15px;
   }
   .flex-box {
-    margin-bottom: 10px;
+    margin-right: 74px;
     & > div {
       display: flex;
       align-items: center;
-      margin-right: 10px;
       & + div {
-        margin-left: 40px;
+        margin-left: 35px;
       }
       label {
-        padding-right: 10px;
-        color: #666;
+        padding-right: 15px;
+        color: #425277;
       }
     }
   }
   .memory-setting {
-    padding-left: 60px;
+    padding-left: 23px;
+    display: flex;
   }
   .analyze-setting {
-    padding-left: 60px;
+    padding-left: 23px;
   }
   .btns {
-    text-align: right;
+    text-align: center;
     padding-top: 20px;
+    .el-button {
+      padding: 9px 42px;
+      background-color: #2d52d7;
+      font-size: 13px;
+      span {
+        color: #fff;
+      }
+    }
   }
 }
 </style>
\ No newline at end of file

--
Gitblit v1.8.0