update caching and not in cache icon

mindinsight/ui/src/components/multiselectGroup.vue

@@ -49,9 +49,12 @@ limitations under the License.
                         :content="item.label"
                         placement="top">
               <span class="select-disable">
-                <i :title="$t('components.cache')"
+                <i :title="$t('trainingDashboard.waitLoading')"
                    class="el-icon-time"
-                   v-if="item.checked && (item.loading==='CACHING' || item.loading==='NOT_IN_CACHE')"></i>
+                   v-if="item.checked && item.loading==='NOT_IN_CACHE'"></i>
+                <i :title="$t('trainingDashboard.loadingTip')"
+                   class="el-icon-loading"
+                   v-if="item.checked && item.loading==='CACHING'"></i>
                 {{item.label}}</span>
             </el-tooltip>
           </span>
@@ -83,9 +86,12 @@ limitations under the License.
                       :content="item.label"
                       placement="top">
             <span class="select-disable">
-              <i :title="$t('components.cache')"
-                 class="el-icon-time"
-                 v-if="item.checked && (item.loading==='CACHING' || item.loading==='NOT_IN_CACHE')"></i>
+              <i :title="$t('trainingDashboard.waitLoading')"
+                   class="el-icon-time"
+                   v-if="item.checked && item.loading==='NOT_IN_CACHE'"></i>
+              <i :title="$t('trainingDashboard.loadingTip')"
+                   class="el-icon-loading"
+                   v-if="item.checked && item.loading==='CACHING'"></i>
               {{item.label}}</span>
           </el-tooltip>
         </span>

mindinsight/ui/src/locales/en-us.json

@@ -143,6 +143,7 @@
     "invalidId": "Invalid training job.",
     "summaryDirPath": "Summary path:",
     "loadingTip": "Loading...",
+    "waitLoading": "waiting to be loaded",
     "switchTitle": "The Computational Graph and Data Graph modules do not support auto refresh."
   },
   "scalar": {
@@ -450,7 +451,6 @@
     "gridAccuracy": "Decimal places are reserved.",
     "inCorrectInput": "Invalid input.",
     "gridTableNoData": "No data in the table.",
-    "cache": "CACHING",
     "value": "Value",
     "dimsFilterInputTitle": "Dimension Selection",
     "dimsFilterInputTip": "The dimension value can be a specific index (consistent with the Python index meaning and supporting negative signs) or a colon (:) that indicates all values of the current dimension."

mindinsight/ui/src/locales/zh-cn.json

@@ -143,6 +143,7 @@
     "invalidId": "无效的训练作业",
     "summaryDirPath": "训练日志路径：",
     "loadingTip": "加载中",
+    "waitLoading": "待加载",
     "switchTitle": "计算图和数据图模块不支持自动刷新"
   },
   "scalar": {
@@ -449,7 +450,6 @@
     "gridAccuracy": "保留小数位",
     "inCorrectInput": "无效输入",
     "gridTableNoData": "表格无数据",
-    "cache": "正在加载",
     "value": "数值",
     "dimsFilterInputTitle": "维度选择",
     "dimsFilterInputTip": "维度输入值可以是具体的索引（和Python的索引含义一致,支持负号）或者冒号\":\"，其中冒号\":\"表示当前维度的所有值"

mindinsight/ui/src/views/train-manage/training-dashboard.vue

@@ -21,9 +21,10 @@ limitations under the License.
       <div class="cl-dashboard-top-title">
         {{$t('trainingDashboard.trainingDashboardTitle')}}
       </div>
-      <div :title="$t('trainingDashboard.loadingTip')"
+      <div :title="trainJobCached > 1 ? $t('trainingDashboard.loadingTip') :  $t('trainingDashboard.waitLoading')"
            v-if="trainJobCached"
-           class="el-icon-loading loading-icon"></div>
+           class="loading-icon"
+           :class="trainJobCached > 1 ? 'el-icon-loading' : 'el-icon-time'"></div>
       <div class="path-message">
         <span>{{$t('symbols.leftbracket')}}</span>
         <span>{{$t('trainingDashboard.summaryDirPath')}}</span>
@@ -314,7 +315,7 @@ export default {
         mousedown: 'mousedown',
         mouseup: 'mouseup',
       },
-      trainJobCached: false,
+      trainJobCached: 0,
       cacheKey: {
         notInCache: 'NOT_IN_CACHE',
         caching: 'CACHING',
@@ -2110,13 +2111,16 @@ export default {
           response.data.train_jobs.length
         ) {
           const curTrain = response.data.train_jobs[0];
-          if (curTrain.cache_status !== this.cacheKey.cached) {
-            this.trainJobCached = true;
+          const showIcon = curTrain.graph_files || curTrain.summary_files;
+          if (showIcon && curTrain.cache_status === this.cacheKey.notInCache) {
+            this.trainJobCached = 1;
+          } else if (showIcon && curTrain.cache_status === this.cacheKey.caching) {
+            this.trainJobCached = 2;
           } else {
-            this.trainJobCached = false;
+            this.trainJobCached = 0;
           }
         } else {
-          this.trainJobCached = false;
+          this.trainJobCached = 0;
         }
       });
     },