CN-242 Cyptocurrency--配置图表

src/assets/css/components/components/charts/panel.scss

@@ -86,9 +86,8 @@
   font-weight:normal;
 }
 
-.cn-chart__crypto-header{
-  font-size:15px;
-  font-family: SimHei;
+.cn-panel-crypto {
+  grid-template-columns: repeat(36, 1fr) !important;
 }
 
 .cn-panel, .cn-panel>.cn-chart__tabs>.el-tabs__content>.el-tab-pane, .cn-chart__group .cn-chart__body {

src/components/charts/ChartTableActiveIp.vue

@@ -2,7 +2,7 @@
   <div class="cn-chart cn-chart__table">
     <div class="cn-chart__header chart-header-position" >
       <slot name="chartErrorInfo"></slot>
-      <div class="header__title cn-chart__crypto-header">
+      <div class="header__title ">
         <slot name="title"></slot>
       </div>
       <div class="header__operations">

src/components/rightBox/settings/ChartBox.vue

@@ -56,7 +56,7 @@
 
               <el-option :key="panelTypeAndRouteMapping.trafficSummary" :label="$t('trafficSummary.trafficSummary')" :value="panelTypeAndRouteMapping.trafficSummary"></el-option>
               <el-option :key="panelTypeAndRouteMapping.networkAppPerformance" :label="$t('networkAppPerformance.networkAppPerformance')" :value="panelTypeAndRouteMapping.networkAppPerformance"></el-option>
-              <el-option :key="panelTypeAndRouteMapping.cyptocurrency" :label="$t('overall.cyptocurrency')" :value="panelTypeAndRouteMapping.cyptocurrency"></el-option>
+              <el-option :key="panelTypeAndRouteMapping.cryptocurrency" :label="$t('overall.cryptocurrency')" :value="panelTypeAndRouteMapping.cryptocurrency"></el-option>
               <el-option :key="panelTypeAndRouteMapping.dnsServiceInsights" :label="$t('dnsServiceInsights.dnsServiceInsights')" :value="panelTypeAndRouteMapping.dnsServiceInsights"></el-option>
               <el-option :key="panelTypeAndRouteMapping.ipEntityDetail" :label="$t('entities.ipEntityDetail')" :value="panelTypeAndRouteMapping.ipEntityDetail"></el-option>
               <el-option :key="panelTypeAndRouteMapping.domainEntityDetail" :label="$t('entities.domainEntityDetail')" :value="panelTypeAndRouteMapping.domainEntityDetail"></el-option>

src/utils/constants.js

@@ -27,7 +27,7 @@ export const fromRoute = {
   user: 'user',
   galaxyProxy: 'galaxyProxy',
   chart: 'chart',
-  cyptocurrency: 'cyptocurrency'
+  cryptocurrency: 'cryptocurrency'
 }
 
 /* panel类别和名称之间的映射 */
@@ -38,7 +38,7 @@ export const panelTypeAndRouteMapping = {
   ipEntityDetail: 4,
   domainEntityDetail: 5,
   appEntityDetail: 6,
-  cyptocurrency: 7
+  cryptocurrency: 7
 }
 
 /* operationLog state 执行状态属性 值与名称之间的映射 */

src/views/charts/Chart.vue

@@ -93,7 +93,7 @@
       </chart-error>
     </template>
     <template #title v-if="layout.indexOf(layoutConstant.HEADER) > -1"  >
-      <span  :class="{ 'cn-chart__crypto-header':(isEchartsTimeBar||isEchartsCategoryBar)}">{{chartInfo.i18n ? $t(chartInfo.i18n) : chartInfo.name}}</span>
+      {{chartInfo.i18n ? $t(chartInfo.i18n) : chartInfo.name}}
     </template>
     <template #operations v-if="layout.indexOf(layoutConstant.HEADER) > -1">
       <div class="header__operation header__operation--echarts" v-if="chart.type === 31">
@@ -459,7 +459,7 @@
               :errorInfo="errorInfo"
       >
       </chart-error>
-      <div class="header__title cn-chart__crypto-header" >
+      <div class="header__title" >
         <span :title="chartInfo.i18n ? $t(chartInfo.i18n) : chartInfo.name">{{chartInfo.i18n ? $t(chartInfo.i18n) : chartInfo.name}}</span>
       </div>
 

src/views/charts/Panel.vue

@@ -1,6 +1,6 @@
 <template>
   <div style="padding: 10px 0 20px 20px;" v-if="!isEntityDetail">
-    <div class="cn-panel" id="cn-panel">
+    <div id="cn-panel" :class="(isCryptocurrency)?'cn-panel cn-panel-crypto':'cn-panel'">
       <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"/>
@@ -104,10 +104,13 @@ export default {
       // entity详情的chart
       detailTabs: [],
       detailChartList: [],
-      currentTab: ''
+      currentTab: '',
+      isCryptocurrency: false// 是否为挖矿列表
     }
   },
   async mounted () {
+    const path = this.$route.path
+    this.isCryptocurrency = this.$route.path.indexOf('cryptocurrency') > -1
     await this.init()
     if (!this.$_.isEmpty(this.detailTabs)) {
       this.currentTab = this.detailTabs[0].id + ''