perf: entity详情头部样式调整

src/components/charts/panel.scss

@@ -522,13 +522,48 @@
   overflow: hidden;
   .entity-detail__header {
     display: flex;
-    justify-content: end;
+    justify-content: space-between;
     height: 70px;
     padding-right: 20px;
     background-color: #F7F9FB;
+
+    .detail-header__title {
+      display: flex;
+      align-items: center;
+      padding-left: 20px;
+      font-size: 20px;
+      font-weight: bold;
+
+      .title__icon-circle {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        height: 38px;
+        width: 38px;
+        border-radius: 50%;
+        background-color: #B8C1D1;
+
+        i {
+          background-color: white;
+          font-size: 17px;
+        }
+      }
+      .title__name {
+        padding-left: 10px;
+      }
+    }
+    .detail-header__operation {
+      display: flex;
+      align-items: end;
+
       & > .el-tabs > .el-tabs__header { // header背景色
-      margin: 0;
+        margin: 0 0 -1px 0;
+
         & > .el-tabs__nav-wrap > .el-tabs__nav-scroll > .el-tabs__nav {
+          & > .el-tabs__item {
+            height: 35px;
+            line-height: 35px;
+          }
           & > .el-tabs__item.is-active { // 激活的tab上边框和背景色
             background-color: white;
             border-top: 2px solid #0091ff;
@@ -552,6 +587,7 @@
         align-items: end;
       }
     }
+  }
   .entity-detail__body {
     height: calc(100% - 90px);
     width: 100%;

src/views/charts/Panel.vue

@@ -27,11 +27,17 @@
     </div>
   </div>
   <div class="cn-entity-detail" id="cn-entity-detail" v-else>
+    <div class="entity-detail__header">
+      <div class="detail-header__title">
+        <span class="title__icon-circle">
+          <i class="cn-icon cn-icon-ip"></i>
+        </span>
+        <span class="title__name">{{entity.name}}</span></div>
+      <div class="detail-header__operation">
         <div class="panel__time">
           <DateTimeRange class="date-time-range" :start-time="timeFilter.startTime" :end-time="timeFilter.endTime" ref="dateTimeRange" @change="reload"/>
           <TimeRefresh class="date-time-range" @change="timeRefreshChange" :end-time="timeFilter.endTime"/>
         </div>
-    <div class="entity-detail__header">
         <el-tabs v-model="currentTab">
           <el-tab-pane
               v-for="(tab, index) in detailTabs"
@@ -44,6 +50,7 @@
           </el-tab-pane>
         </el-tabs>
       </div>
+    </div>
     <div class="entity-detail__body">
       <div class="cn-panel">
         <chart v-for="chart in detailChartList" :key="chart.id" :chart="chart" :time-filter="timeFilter" :ref="`chart-${chart.id}`" :entity="entity"></chart>