diff --git a/nezha-fronted/src/components/charts/chart-list.vue b/nezha-fronted/src/components/charts/chart-list.vue
index 44ec7cc13..a96607fa0 100644
--- a/nezha-fronted/src/components/charts/chart-list.vue
+++ b/nezha-fronted/src/components/charts/chart-list.vue
@@ -199,7 +199,9 @@ export default {
       // 没有数据的设置提示信息暂无数据-针对每一个图
       if (len === 0) {
         this.$nextTick(() => {
-          this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId, this.filter);//????怎么设置的无数据？？
+          if(this.$refs.editChart[index]){
+            this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId, this.filter);//????怎么设置的无数据？？
+          }
         });
       } else {
         let startTime = '';
@@ -327,44 +329,47 @@ export default {
                   }
                 }
               });
-              if (chartItem.type === 'table') {//表格
-                if(filterType==='showFullScreen'){//table的全屏查询
-                  this.$refs.editChart[index].setData(chartItem, tableData,
-                    this.filter.panelId, this.filter,filterType);
-                }else {
-                  this.$refs.editChart[index].setData(chartItem, tableData,
-                    this.filter.panelId, this.filter);
-                }
-
-              } else if (chartItem.type === 'line' || chartItem.type === 'bar' || chartItem.type === 4) {
-                if (series.length && chartItem.type === 4) {//曲线汇总
-                  //series.push(sumData);//后续需要
-                }
-                if(filterType==='showFullScreen'){//table的全屏查询
-                  this.$refs.editChart[index].setData(chartItem, series,
-                    this.filter.panelId, this.filter,legend,filterType);
-                }else {
-                  this.$refs.editChart[index].setData(chartItem, series,
-                    this.filter.panelId, this.filter,legend);
+              if(this.$refs.editChart[index]) {
+                if (chartItem.type === 'table') {//表格
+                  if (filterType === 'showFullScreen') {//table的全屏查询
+                    this.$refs.editChart[index].setData(chartItem, tableData,
+                      this.filter.panelId, this.filter, filterType);
+                  } else {
+                    this.$refs.editChart[index].setData(chartItem, tableData,
+                      this.filter.panelId, this.filter);
+                  }
+                } else if (chartItem.type === 'line' || chartItem.type === 'bar' || chartItem.type === 4) {
+                  if (series.length && chartItem.type === 4) {//曲线汇总
+                    //series.push(sumData);//后续需要
+                  }
+                  if (filterType === 'showFullScreen') {//table的全屏查询
+                    this.$refs.editChart[index].setData(chartItem, series,
+                      this.filter.panelId, this.filter, legend, filterType);
+                  } else {
+                    this.$refs.editChart[index].setData(chartItem, series,
+                      this.filter.panelId, this.filter, legend);
+                  }
                 }
               }
             } else {
               const type = chartItem.type;
-              if (type === 'table') {
-                if(filterType==='showFullScreen'){//table的全屏查询
-                  this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
-                    this.filter,filterType);
-                }else {
-                  this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
-                    this.filter);
-                }
-              } else if (type === 'line' || type === 'bar' || chartItem.type === 4) {
-                if(filterType==='showFullScreen'){//table的全屏查询
-                  this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
-                    this.filter,filterType);
-                }else {
-                  this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
-                    this.filter);
+              if(this.$refs.editChart[index]) {
+                if (type === 'table') {
+                  if (filterType === 'showFullScreen') {//table的全屏查询
+                    this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
+                      this.filter, filterType);
+                  } else {
+                    this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
+                      this.filter);
+                  }
+                } else if (type === 'line' || type === 'bar' || chartItem.type === 4) {
+                  if (filterType === 'showFullScreen') {//table的全屏查询
+                    this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
+                      this.filter, filterType);
+                  } else {
+                    this.$refs.editChart[index].setData(chartItem, [], this.filter.panelId,
+                      this.filter);
+                  }
                 }
               }
             }
diff --git a/nezha-fronted/src/components/charts/chart-table.scss b/nezha-fronted/src/components/charts/chart-table.scss
index 42274ee9c..7e9c7c479 100644
--- a/nezha-fronted/src/components/charts/chart-table.scss
+++ b/nezha-fronted/src/components/charts/chart-table.scss
@@ -25,7 +25,7 @@
   .table-title {
     font-weight: bold;
     font-size: 18px;
-    line-height: 30px;
+    line-height: 26px;
     color: #333;
   }
   .edit:after{
@@ -33,6 +33,13 @@
     content: "";
     clear: both;
   }
+
+  .button-panel-height{
+    height:26px;
+  }
+  .button-panel-height button{
+    height:26px;
+  }
   .edit {
     position: absolute;
     right: 20px;
diff --git a/nezha-fronted/src/components/charts/chart-table.vue b/nezha-fronted/src/components/charts/chart-table.vue
index 3ce6d65a9..314a7d098 100644
--- a/nezha-fronted/src/components/charts/chart-table.vue
+++ b/nezha-fronted/src/components/charts/chart-table.vue
@@ -16,9 +16,9 @@
             <div class="table-title" v-show="firstShow">
                 {{data.title}}
             </div>
-            <div class="nz-btn-group nz-btn-group-light edit" v-show="firstShow">
+            <div class="nz-btn-group nz-btn-group-light edit button-panel-height"  v-show="firstShow">
               <button type="button" @click="refreshChart" style="padding: 6px 14px 5px 14px;" class="nz-btn nz-btn-size-large nz-btn-style-light"><i style="font-size: 16px;" class="global-active-color el-icon-refresh-right"></i></button><button
-              @click="editChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light"><i class="nz-icon nz-icon-edit"></i></button><button
+              @click="editChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light" ><i class="nz-icon nz-icon-edit"></i></button><button
               @click="removeChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light"><i class="el-icon-delete"></i></button><button
               @click="showAllScreen" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light"><i class="el-icon-full-screen"></i></button>
             </div>
diff --git a/nezha-fronted/src/components/charts/line-chart-block.scss b/nezha-fronted/src/components/charts/line-chart-block.scss
index a9856b490..7b94d0d10 100644
--- a/nezha-fronted/src/components/charts/line-chart-block.scss
+++ b/nezha-fronted/src/components/charts/line-chart-block.scss
@@ -2,12 +2,10 @@
 .clearfix:after{
   display: block;
   content: "";
-  height:0;
-  visibility:hidden;
   clear: both;
 }
 .clearfix{
-  //margin-bottom: 20px;
+  margin-bottom: 7px;
 }
 .legend-shape{
   display:inline-block;
@@ -47,9 +45,15 @@
   position: relative;
   background: #FFF;
   border: 1px solid #d8dce1;
-  padding: 20px 30px;
+  padding: 20px 8px;
   margin-bottom: 10px;
   padding-bottom: 3px;
+  .chart-title {
+    font-weight: bold;
+    font-size: 18px;
+    line-height: 26px;
+    color: #333;
+  }
   .line-area {
     box-sizing: border-box;
     background: #FFF;
@@ -60,6 +64,12 @@
     content: "";
     clear: both;
   }*/
+  .button-panel-height{
+    height:26px;
+  }
+  .button-panel-height button{
+    height:26px;
+  }
   .edit {
     position: absolute;
     right: 20px;
diff --git a/nezha-fronted/src/components/charts/line-chart-block.vue b/nezha-fronted/src/components/charts/line-chart-block.vue
index 7beac3e68..250a1f1a6 100644
--- a/nezha-fronted/src/components/charts/line-chart-block.vue
+++ b/nezha-fronted/src/components/charts/line-chart-block.vue
@@ -2,7 +2,7 @@
   @import './line-chart-block.scss';
 </style>
 <template>
-  <div class="line-chart-block" :id="'lineChartDiv'+chartIndex" v-show="divFirstShow">
+  <div class="line-chart-block"   :id="'lineChartDiv'+chartIndex" v-show="divFirstShow">
     <loading  :ref="'localLoading'+chartIndex"></loading>
     <!--<div class="edit">
 
@@ -21,14 +21,19 @@
         </span>
       </div>
     </div>-->
-    <div class="nz-btn-group nz-btn-group-light edit" v-show="firstShow">
-      <button type="button" @click="refreshChart" style="padding: 6px 14px 5px 14px;" class="nz-btn nz-btn-size-large nz-btn-style-light" v-if="showSetting"><i style="font-size: 16px;" class="global-active-color el-icon-refresh-right"></i></button><button
-      @click="editChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light" v-if="showSetting"><i class="nz-icon nz-icon-edit"></i></button><button
-      @click="removeChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light" v-if="showSetting"><i class="el-icon-delete"></i></button><button
-      @click="showAllScreen" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light"><i class="el-icon-full-screen"></i></button>
+    <div class="clearfix">
+      <div class="chart-title" v-show="firstShow">
+        {{data.title}}
+      </div>
+      <div class="nz-btn-group nz-btn-group-light edit button-panel-height" v-show="firstShow">
+        <button type="button" @click="refreshChart" style="padding: 6px 14px 5px 14px;" class="nz-btn nz-btn-size-large nz-btn-style-light" v-if="showSetting"><i style="font-size: 16px;" class="global-active-color el-icon-refresh-right"></i></button><button
+        @click="editChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light" v-if="showSetting"><i class="nz-icon nz-icon-edit"></i></button><button
+        @click="removeChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light" v-if="showSetting"><i class="el-icon-delete"></i></button><button
+        @click="showAllScreen" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light"><i class="el-icon-full-screen"></i></button>
+      </div>
     </div>
 
-    <div class="line-area" ref="lineChartArea"  id="lineChartArea" v-show="firstShow"></div>
+    <div class="line-area" style="border:solid 0px red;" ref="lineChartArea"  id="lineChartArea" v-show="firstShow"></div>
 
     <div class="legend-container"   id="legendArea" ref="legendArea" v-show="firstShow">
       <div v-for="(item, index) in legendList" :title="item.name"  @click="clickLegend(item.name,index)" class="legend-item" :class="{'ft-gr':isGrey[index]}" :key="'legend_' + item.name+'_'+index">
@@ -61,7 +66,7 @@
           <!--<button @click="refreshChart" type="button" class="nz-btn nz-btn-size-normal nz-btn-style-light"><i style="font-size: 14px;" class="el-icon-refresh-right"></i></button>-->
         </div>
       </div>
-      <div class="line-area " ref="screenShowArea"  id="screenShowArea" ></div>
+      <div class="line-area " ref="screenShowArea"  id="screenShowArea"  style="margin-top:10px;"></div>
       <div class="legend-container"  id="screenLegendArea" ref="screenLegendArea"  v-show="showLegend">
         <div v-for="(item, index) in screenLegendList" :title="item.name"  @click="clickScreenLegend(item.name,index)" class="legend-item" :class="{'ft-gr':isGreyScreen[index]}"  :key="'legend_' + item.name+'_'+index">
           <span class="legend-shape" :style="{background:(isGreyScreen[index]?'#D3D3D3':bgColorList[index])}"></span>{{item.name}}
@@ -317,6 +322,7 @@
         }
         var chartWidth = ele.clientWidth;
         var title = {
+          show:false,
           text: chartInfo.title || null,
           textAlign: 'left',
           useHTML: true,
@@ -330,6 +336,9 @@
           }
         };
         var option = {
+          title:{
+            show:false,
+          },
           color: this.bgColorList,
           tooltip: {
             trigger: 'axis',
@@ -500,9 +509,9 @@
           },
           grid: {
             //height:"50%",
-            //top: '13%',
+            top: 13,
             left: 65,
-            right: 65,
+            right: 45,
             containLabel: false,
             bottom:70,//156
           },
@@ -653,7 +662,7 @@
           });
           */
           this.echartStore.clear();
-          option.title = title;
+          //option.title = title;
           this.echartStore.setOption(option);//创建图表
           //this.echartStore.hideLoading();
           this.$refs['localLoading'+this.chartIndex].endLoading();
@@ -671,9 +680,9 @@
           this.$nextTick(() => {
             let divHeight = this.$refs.legendArea.offsetHeight;
             if(!chartInfo.height){
-              this.echartStore.resize({height:(400-divHeight)});
+              this.echartStore.resize({height:(400-divHeight-35)});
             }else {
-              this.echartStore.resize({height:(chartInfo.height-divHeight-25)});
+              this.echartStore.resize({height:(chartInfo.height-divHeight-25-35)});
             }
           });
           this.firstShow = true; // 展示操作按键
diff --git a/nezha-fronted/src/components/common/language/cn.js b/nezha-fronted/src/components/common/language/cn.js
index d55761d52..66ee1e99b 100644
--- a/nezha-fronted/src/components/common/language/cn.js
+++ b/nezha-fronted/src/components/common/language/cn.js
@@ -28,7 +28,14 @@ const cn = {
     query: '查询',
     back: '返回',
     unavailable: '不可用',
-    available: '可用'
+    available: '可用',
+    createChart:'新增图表',
+    createProject:'新增项目',
+    createAsset:'新增资产',
+    createAlertRule:'新增告警规则',
+    createAccount:'新增用户名',
+    createPrometheusServer:'新增 prometheus server',
+    createDatacenter:'新增DC'
   },
   dashboard:{
     title:'仪表盘',
diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js
index 33eddf520..4a7a3fe2f 100644
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -36,6 +36,13 @@ const en = {
     unavailable: 'Unavailable',
     available: 'Available',
    changePwd:'Change Password',//修改密码
+    createChart:'create chart',
+    createProject:'create project',
+    createAsset:'create asset',
+    createAlertRule:'create alert rule',
+    createAccount:'create account',
+    createPrometheusServer:'create prometheus server',
+    createDatacenter:'create datacenter'
   },
   dashboard:{
     title:'Dashboard',
diff --git a/nezha-fronted/src/components/page/alert/config.vue b/nezha-fronted/src/components/page/alert/config.vue
index d47a472af..2099f2456 100644
--- a/nezha-fronted/src/components/page/alert/config.vue
+++ b/nezha-fronted/src/components/page/alert/config.vue
@@ -20,11 +20,9 @@
 
         </div>
         <div>
-          <button id="alert-add" @click="toAdd"
-                  class="nz-btn nz-btn-size-normal nz-btn-style-light float-right nz-btn-min-width-82">
-                    <span class="top-tool-btn-txt">
+          <button id="alert-add" @click="toAdd"  :title="$t('overall.createAlertRule')"
+                  class="nz-btn nz-btn-size-normal nz-btn-style-light float-right ">
                       <i class="nz-icon-create-square nz-icon"></i>
-                      {{$t('overall.add')}}</span>
           </button>
           <div class="top-tool-search float-right">
             <search-input :searchMsg="searchMsg" @search="search"></search-input>
diff --git a/nezha-fronted/src/components/page/asset/asset.vue b/nezha-fronted/src/components/page/asset/asset.vue
index a0463df7e..b99193ce7 100644
--- a/nezha-fronted/src/components/page/asset/asset.vue
+++ b/nezha-fronted/src/components/page/asset/asset.vue
@@ -33,10 +33,8 @@
       <div class="top-tools">
         <div></div>
         <div>
-          <button @click.stop="tagShow('showAdd')" class="nz-btn nz-btn-size-normal nz-btn-style-light float-right nz-btn-min-width-82" id="asset-add">
-            <span class="top-tool-btn-txt">
+          <button @click.stop="tagShow('showAdd')" :title="$t('overall.createAsset')"   class="nz-btn nz-btn-size-normal nz-btn-style-light float-right " id="asset-add">
                <i class="nz-icon-create-square nz-icon"></i>
-              {{$t('overall.add')}}</span>
             <!-- ADD按钮 -->
           </button>
           <div class="top-tool-search float-right"><search-input :searchMsg="searchMsg" @search="search"></search-input></div>
diff --git a/nezha-fronted/src/components/page/config/account.vue b/nezha-fronted/src/components/page/config/account.vue
index f6325d1d5..e1aba6591 100644
--- a/nezha-fronted/src/components/page/config/account.vue
+++ b/nezha-fronted/src/components/page/config/account.vue
@@ -21,11 +21,9 @@
       <div class="top-tools">
         <div></div>
         <div>
-          <button type="button" @click="toAdd"
-                  class="nz-btn nz-btn-size-normal nz-btn-style-light float-right nz-btn-min-width-82" id="account-add">
-                <span class="top-tool-btn-txt">
+          <button type="button" @click="toAdd"  :title="$t('overall.createAccount')"
+                  class="nz-btn nz-btn-size-normal nz-btn-style-light float-right " id="account-add">
                   <i class="nz-icon-create-square nz-icon"></i>
-                  {{$t('overall.add')}}</span>
           </button>
           <div class="top-tool-search float-right">
             <search-input :searchMsg="searchMsg" @search="search"></search-input>
diff --git a/nezha-fronted/src/components/page/config/dc.vue b/nezha-fronted/src/components/page/config/dc.vue
index 876277d2d..8bf81e0c4 100644
--- a/nezha-fronted/src/components/page/config/dc.vue
+++ b/nezha-fronted/src/components/page/config/dc.vue
@@ -23,11 +23,9 @@
       <div class="top-tools">
         <div></div>
         <div>
-          <button type="button" @click=""
-                  class="nz-btn nz-btn-size-normal nz-btn-style-light float-right nz-btn-min-width-82" id="dc-add">
-                <span class="top-tool-btn-txt">
+          <button type="button" @click=""  :title="$t('overall.createDatacenter')"
+                  class="nz-btn nz-btn-size-normal nz-btn-style-light float-right " id="dc-add">
                   <i class="nz-icon-create-square nz-icon"></i>
-                  {{$t('overall.add')}}</span>
           </button>
           <div class="top-tool-search float-right">
             <search-input :searchMsg="searchMsg" @search="search"></search-input>
diff --git a/nezha-fronted/src/components/page/config/promServer.vue b/nezha-fronted/src/components/page/config/promServer.vue
index 8bda88b87..c980ed2f8 100644
--- a/nezha-fronted/src/components/page/config/promServer.vue
+++ b/nezha-fronted/src/components/page/config/promServer.vue
@@ -21,11 +21,9 @@
       <div class="top-tools">
         <div></div>
         <div>
-          <button @click="toAdd" class="nz-btn nz-btn-size-normal nz-btn-style-light float-right nz-btn-min-width-82"
+          <button @click="toAdd" class="nz-btn nz-btn-size-normal nz-btn-style-light float-right "  :title="$t('overall.createPrometheusServer')"
                   id="prom-add">
-                  <span class="top-tool-btn-txt">
                     <i class="nz-icon-create-square nz-icon"></i>
-                    {{$t('overall.add')}}</span>
           </button>
           <div class="top-tool-search float-right">
             <search-input :searchMsg="searchMsg" @search="search"></search-input>
diff --git a/nezha-fronted/src/components/page/dashboard/panel.vue b/nezha-fronted/src/components/page/dashboard/panel.vue
index 172c147d3..4a3de41b2 100644
--- a/nezha-fronted/src/components/page/dashboard/panel.vue
+++ b/nezha-fronted/src/components/page/dashboard/panel.vue
@@ -63,11 +63,9 @@
 <!--            <search-input ref="searchInput" :searchMsg="searchMsg" @search="search"></search-input>-->
 <!--          </div>-->
 
-          <button @click="toAddChart"
-                  class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-82">
-                      <span class="top-tool-btn-txt">
+          <button @click="toAddChart" :title="$t('overall.createChart')"
+                  class="nz-btn nz-btn-size-normal nz-btn-style-light ">
                           <i class="nz-icon-create-square nz-icon"></i>
-                          {{$t('overall.add')}}</span>
           </button>
         </div>
       </div>
@@ -390,7 +388,9 @@
           params.start_time = startTimeTmp;
           params.end_time = endTimeTmp;
         }
-        this.$refs.chartList.initData(params);
+        if(this.$refs.chartList){
+          this.$refs.chartList.initData(params);
+        }
       },
 
       /*图表相关操作--end*/
@@ -706,7 +706,6 @@
 
     li {
       padding: 0 20px !important;
-
     }
   }
 
diff --git a/nezha-fronted/src/components/page/project/project.vue b/nezha-fronted/src/components/page/project/project.vue
index b3c6a119c..f7715a89a 100644
--- a/nezha-fronted/src/components/page/project/project.vue
+++ b/nezha-fronted/src/components/page/project/project.vue
@@ -99,10 +99,8 @@
 <!--          </div>-->
         </div>
         <div>
-          <button @click="toCreateEndpoint" class="nz-btn nz-btn-size-normal nz-btn-style-light float-right nz-btn-min-width-82" id="project-add-ep">
-            <span class='top-tool-btn-txt'>
-              <i class="nz-icon-create-square nz-icon"></i>
-              {{$t('overall.add')}}</span>
+          <button @click="toCreateEndpoint" :title="$t('overall.createProject')"  class="nz-btn nz-btn-size-normal nz-btn-style-light float-right " id="project-add-ep">
+            <i class="nz-icon-create-square nz-icon"></i>
           </button>
           <div class="top-tool-search float-right"><search-input :searchMsg="endpointSearchMsg" @search="endpointSearch" ref="projectSearch"></search-input></div>
         </div>