From 7c6e568541aff48a3796cdb1d453dc38d2999d01 Mon Sep 17 00:00:00 2001
From: zhangyu <zhangyu@geedgenetworks.com>
Date: Thu, 6 May 2021 13:33:07 +0800
Subject: [PATCH] =?UTF-8?q?style=EF=BC=9Aproject=20topo=20=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/project/L5/CanvasProps.vue         | 43 ++++++++-----------
 .../components/common/project/topologyL5.vue  | 27 +++++++++---
 .../page/dashboard/explore/promqlInput.vue    |  2 +-
 .../page/dashboard/overview/overview.vue      |  4 +-
 .../page/dashboard/overview/overview2.vue     |  2 +-
 5 files changed, 44 insertions(+), 34 deletions(-)

diff --git a/nezha-fronted/src/components/common/project/L5/CanvasProps.vue b/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
index 52e70da40..741e272a7 100644
--- a/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
+++ b/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
@@ -22,15 +22,15 @@
               </el-option>
             </el-select>
           </el-form-item>
-          <!--iconToolState-->
-          <el-form-item :label="'Icon state'" class="half-form-item" prop="type" v-if="!selection.pen.type">
-            <el-switch
-              v-model="selection.pen.data.iconToolState"
-              :active-value="true"
-              :inactive-value="false"
-              active-color="#ee9d3f"
-            />
-          </el-form-item>
+<!--          &lt;!&ndash;iconToolState&ndash;&gt;-->
+<!--          <el-form-item :label="'Icon state'" class="half-form-item" prop="type" v-if="!selection.pen.type">-->
+<!--            <el-switch-->
+<!--              v-model="selection.pen.data.iconToolState"-->
+<!--              :active-value="true"-->
+<!--              :inactive-value="false"-->
+<!--              active-color="#ee9d3f"-->
+<!--            />-->
+<!--          </el-form-item>-->
 
           <!--metric-->
           <div class="right-box-sub-title" style="margin-bottom: 10px">
@@ -57,7 +57,7 @@
               :from-father-data="true"
               @removeExpression="removeExpression"
             ></promql-input>
-            <el-row>
+            <el-row style="margin-top: 10px">
               <template>
                 <el-col class="legend-title">
                   {{$t('dashboard.panel.chartForm.legend')}}&nbsp;
@@ -1579,6 +1579,12 @@ export default {
   }
 </style>
 <style lang="scss" scoped>
+  /deep/ .metric-selector-input-box{
+    width: calc(100% - 120px) !important;
+  }
+  /deep/ .query-row .input-box{
+    margin: 0;
+  }
   .legend-title{
     width: 100px;
     margin-right: 10px;
@@ -1718,20 +1724,9 @@ export default {
       padding: 2px 6px;
       color: #EC7F66;
     }
-    /*.form-row-item .nz-icon-minus-position {
-      position: absolute;
-      top: 50%;
-      right: -55px;
-      -webkit-transform: translate(-50%, -50%);
-      transform: translate(-50%, -50%);
-      background: rgba(236, 127, 102, 0.1);
-      border-radius: 4px;
-      padding: 0 5px;
-
-      .nz-icon-minus {
-        color: #EC7F66;
-      }
-    }*/
+    .form-row-item .nz-icon-minus-position {
+      right: -44px;
+    }
 
     .tooltip-box {
       padding-left: 10px;
diff --git a/nezha-fronted/src/components/common/project/topologyL5.vue b/nezha-fronted/src/components/common/project/topologyL5.vue
index 465ef9714..6739d45bc 100644
--- a/nezha-fronted/src/components/common/project/topologyL5.vue
+++ b/nezha-fronted/src/components/common/project/topologyL5.vue
@@ -5,8 +5,8 @@
 <template>
   <div class="project-box list-page" v-loading="topologyLoading" v-has="'topo_list'">
     <div class="main-list">
-      <div class="main-container" style="padding-left: 0">
-        <div v-if="editTopologyFlag" class="edit-topologyLine" style="padding-left: 20px;width: calc(100% - 20px);position: absolute;top: 9px;padding-right: 20px">
+      <div class="main-container" :class="fromOverView?'from-overview':'from-project'">
+        <div v-if="editTopologyFlag" class="edit-topologyLine top-tools" style="padding-left: 20px;width: calc(100% - 20px);">
           <!--工具栏-->
           <span class="project-topology-tool">
           <el-dropdown trigger="click" size="small" placement="bottom-start" v-has="'topo_icon_list'">
@@ -130,7 +130,7 @@
             </button>
           </div>
         </div>
-        <div class="nz-table2" style="padding: 0 20px 10px 5px;">
+        <div class="nz-table2">
           <!--悬浮network部分-->
           <div class="network-info">
             <div v-if="popDataShow.main">
@@ -1559,7 +1559,7 @@ export default {
         if (res.code == 200) {
           this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
           this.uploadPicShow = false
-          this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data,header) => {
+          this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data, header) => {
             const group = this.tools.find(tool => tool.group === this.uploadPic.unit)
             if (group) {
               group.children.push({
@@ -1618,7 +1618,7 @@ export default {
             promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/1`))
             imgArr.push({ ...item })
           })
-          Promise.all(promiseArr).then((res2,header) => {
+          Promise.all(promiseArr).then((res2, header) => {
             this.iconArray = [...res.data.list]
             this.iconArray.forEach((item, index) => {
               item.image = res2[index]
@@ -1688,7 +1688,7 @@ export default {
             .get(url)
             .then((res) => {
               return {
-                data: ('data:image/jpeg;base64,' + res.data),
+                data: ('data:image/jpeg;base64,' + res.data)
               }
             })
             .then(data => {
@@ -2652,4 +2652,19 @@ export default {
       cursor: pointer;
     }
   }
+  .from-overview{
+    padding:0 !important;
+    width: calc(100% - 2px);
+    height: calc(100% - 2px) !important;
+    .nz-table2{
+      padding: 0 !important;
+      height: 100%;
+    }
+  }
+  .from-project{
+    padding-left: 0;
+    .nz-table2{
+      padding: 0 20px 10px 5px;
+    }
+  }
 </style>
diff --git a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
index ec2277db1..c602615be 100644
--- a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
+++ b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
@@ -584,7 +584,7 @@ export default {
 
   .query-row .input-box {
     flex: auto;
-    margin: 0 10px;
+    margin-right: 10px;
   }
 
   .metric-btn {
diff --git a/nezha-fronted/src/components/page/dashboard/overview/overview.vue b/nezha-fronted/src/components/page/dashboard/overview/overview.vue
index 1d7e15a81..eec0a097c 100644
--- a/nezha-fronted/src/components/page/dashboard/overview/overview.vue
+++ b/nezha-fronted/src/components/page/dashboard/overview/overview.vue
@@ -109,7 +109,7 @@
           <div v-loading="topologyLoading"  class="content-col-content">
             <transition name = "el-zoom-in-center">
               <div v-if="allProject&&allProject.length>0" style="width: 100%;height: 100%;position: relative">
-                <el-carousel :interval="5000" :trigger="'click'" arrow="hover">
+                <el-carousel :interval="5000" :autoplay="false" :trigger="'click'" arrow="hover">
                   <el-carousel-item v-for="(item,index) in allProject" :key="index">
                     <div class="maskLayer" @click="toProject(item)"></div>
                     <span class="project-name">{{item.name}}</span>
@@ -349,7 +349,7 @@ export default {
       })
     },
     queryAllProjectData () {
-      this.$get('/project', { pageSize: -1 }).then(res => {
+      this.$get('monitor/project', { pageSize: -1 }).then(res => {
         this.topologyLoading = true
         const axiosAll = []
         const temp = []
diff --git a/nezha-fronted/src/components/page/dashboard/overview/overview2.vue b/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
index eb57f8a99..1a517fb75 100644
--- a/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
+++ b/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
@@ -127,7 +127,7 @@
           <div class="content-col-content"  v-loading="topologyLoading">
             <transition name = "el-zoom-in-center">
               <div style="width: 100%;height: 100%;position: relative" v-if="allProject&&allProject.length>0">
-                <el-carousel :interval="5000" arrow="hover" :trigger="'click'">
+                <el-carousel :interval="50000" :autoplay="false" arrow="hover" :trigger="'click'">
                   <el-carousel-item v-for="(item,index) in allProject" :key="index">
                     <div class="maskLayer" @click="toProject(item)"></div>
                     <span class="project-name">{{item.name}}</span>