From a3eeadc6b3bd27056acd401a18a3a5638c891c4d Mon Sep 17 00:00:00 2001
From: hyx <hanyuxia@iie.ac.cn>
Date: Fri, 8 May 2020 20:40:46 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E4=BF=AE=E6=94=B9=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98=201=20chart=20=E7=BC=96=E8=BE=91=E9=A1=B5=E9=9D=A2=20?=
 =?UTF-8?q?unit=EF=BC=9A=E9=80=89=E6=8B=A9=E4=B8=8D=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=EF=BC=8C=E4=BF=AE=E6=94=B9=E5=90=8E=E4=BF=9D=E5=AD=98=E6=9C=AA?=
 =?UTF-8?q?=E8=B5=B7=E4=BD=9C=E7=94=A8=202=20chart=20legend=E7=94=B1?=
 =?UTF-8?q?=E7=8E=B0=E5=9C=A8=E7=9A=84=E7=BA=B5=E5=90=91=E6=8E=92=E5=88=97?=
 =?UTF-8?q?=EF=BC=8C=E6=94=B9=E4=B8=BA=E5=92=8Cgrafana=E4=B8=80=E8=87=B4?=
 =?UTF-8?q?=E6=A8=AA=E5=90=91=E6=8E=92=E5=88=97=E6=8D=A2=E8=A1=8C=203=20ur?=
 =?UTF-8?q?l,table,singleStat=E5=85=A8=E5=B1=8F=E7=AA=97=E5=8F=A3=E4=BD=8D?=
 =?UTF-8?q?=E7=BD=AE=E6=98=BE=E7=A4=BA=E8=BF=87=E4=BA=8E=E9=9D=A0=E4=B8=8B?=
 =?UTF-8?q?=204=20=E9=A2=84=E8=A7=88=EF=BC=9A=E5=AE=BD=E5=BA=A6=E8=BF=87?=
 =?UTF-8?q?=E5=AE=BD=E5=88=99=E6=98=BE=E7=A4=BA=E7=9C=81=E7=95=A5=E5=8F=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 nezha-fronted/src/assets/stylus/main.scss           |  2 +-
 .../src/components/charts/chartPreview.vue          | 13 +++++++++++--
 .../src/components/charts/line-chart-block.scss     |  3 ++-
 .../src/components/charts/line-chart-block.vue      |  1 -
 .../src/components/page/dashboard/chartBox.vue      |  2 +-
 5 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/nezha-fronted/src/assets/stylus/main.scss b/nezha-fronted/src/assets/stylus/main.scss
index 59e543683..51657895c 100644
--- a/nezha-fronted/src/assets/stylus/main.scss
+++ b/nezha-fronted/src/assets/stylus/main.scss
@@ -1466,7 +1466,7 @@ li{
 }
 .table-chart-dialog .el-dialog {
   height: 80%;
-  margin-top: 5% !important;
+  margin-top: 1vh !important;
 }
 .table-chart-dialog .el-dialog .el-dialog__body {
   height: calc(100% - 82px);
diff --git a/nezha-fronted/src/components/charts/chartPreview.vue b/nezha-fronted/src/components/charts/chartPreview.vue
index 986ea83c0..1486df1ec 100644
--- a/nezha-fronted/src/components/charts/chartPreview.vue
+++ b/nezha-fronted/src/components/charts/chartPreview.vue
@@ -11,6 +11,15 @@
     .visible{
       visibility: visible;
     }
+    .chart-title {
+      display: flex;
+    }
+    .chart-title-text{
+      max-width:calc(100% - 175px);
+      text-overflow: ellipsis;
+      overflow: hidden;
+      white-space: nowrap;
+    }
 </style>
 <style>
   .char-url-preview html{
@@ -40,8 +49,8 @@
               <span class="panel-info-corner-inner"></span>
           </span>
       </el-popover>
-      <div slot="title">
-        <span class="nz-dialog-title">{{chart.title}}</span>
+      <div slot="title" class="chart-title">
+        <span class="nz-dialog-title chart-title-text">{{chart.title}}</span>
         <div class="float-right panel-calendar dialog-tool"  v-if="chart.type!=='url'">
 
           <time-picker ref="calendarPanel" class="nz-dashboard-picker" style="margin-top: -12px;" @change="dateChange"></time-picker>
diff --git a/nezha-fronted/src/components/charts/line-chart-block.scss b/nezha-fronted/src/components/charts/line-chart-block.scss
index aa356148a..41559cf66 100644
--- a/nezha-fronted/src/components/charts/line-chart-block.scss
+++ b/nezha-fronted/src/components/charts/line-chart-block.scss
@@ -41,7 +41,8 @@
 .legend-item{
   text-overflow:ellipsis;
   white-space:nowrap;
-  width:100%;
+  /*width:100%;*/
+  margin-right:10px;
   overflow-x:hidden;
   cursor:pointer;
   display:inline-block;
diff --git a/nezha-fronted/src/components/charts/line-chart-block.vue b/nezha-fronted/src/components/charts/line-chart-block.vue
index 5f6812f0a..d012d08be 100644
--- a/nezha-fronted/src/components/charts/line-chart-block.vue
+++ b/nezha-fronted/src/components/charts/line-chart-block.vue
@@ -81,7 +81,6 @@
     <div class="legend-container" id="legendArea" ref="legendArea" v-show="firstShow" v-scrollBar:legend>
       <div v-for="(item, index) in legendList" :title="item.alias?item.alias:item.name"  @click="clickLegend(item.name,index)" class="legend-item" :class="{'ft-gr':isGrey[index]}" :key="'legend_' + item.name+'_'+index">
         <span class="legend-shape" :style="{background:(isGrey[index]?'#D3D3D3':bgColorList[index])}"></span>{{item.alias?item.alias:item.name}}
-        <br/><!--bgColorList[index]-->
       </div>
     </div>
     <!--
diff --git a/nezha-fronted/src/components/page/dashboard/chartBox.vue b/nezha-fronted/src/components/page/dashboard/chartBox.vue
index fc2fa9fe4..3535d77ea 100644
--- a/nezha-fronted/src/components/page/dashboard/chartBox.vue
+++ b/nezha-fronted/src/components/page/dashboard/chartBox.vue
@@ -922,7 +922,7 @@
         this.chart.height=item;
       },
       unitSelected:function(value){
-        this.chart.unit=value[value.length-1];
+        //this.chart.unit=value[value.length-1];
       },
       chartTypeChange(){
         let chartType = this.chart.type;