!444 Table text is displayed in the center

Merge pull request !444 from 冯学峰/myMaster02

mindinsight/ui/src/components/header.vue

@@ -49,6 +49,7 @@ limitations under the License.
           v-if="this.$route.path.indexOf('/scalar') > 0
           || this.$route.path.indexOf('/image') > 0
           || this.$route.path.indexOf('/histogram') > 0
+          || this.$route.path.indexOf('/tensor') > 0
           || this.$route.path.indexOf('/training-dashboard') > 0
           || !this.$route.path.indexOf('/compare-plate')">
         <!-- automatic refresh switch -->

mindinsight/ui/src/views/train-manage/hardware-visual.vue

@@ -29,9 +29,9 @@ limitations under the License.
                       :data="chipTableData"
                       width="100%"
                       height="100%">
-              <el-table-column prop="chip_name"
-                               width="120">
+              <el-table-column width="120">
                 <template slot="header">
+                  <span class="cl-text-center">
                     Name
                     <el-tooltip class="item"
                                 effect="light"
@@ -39,11 +39,15 @@ limitations under the License.
                                 placement="top-start">
                       <i class="el-icon-info"></i>
                     </el-tooltip>
+                  </span>
+                </template>
+                <template slot-scope="scope">
+                  <span class="cl-text-center">{{ scope.row.chip_name }}</span>
                 </template>
               </el-table-column>
-              <el-table-column prop="device_id"
-                               width="80">
+              <el-table-column width="80">
                 <template slot="header">
+                  <span class="cl-text-center">
                     NPU
                     <el-tooltip class="item"
                                 effect="light"
@@ -51,11 +55,15 @@ limitations under the License.
                                 placement="top-start">
                       <i class="el-icon-info"></i>
                     </el-tooltip>
+                  </span>
+                </template>
+                <template slot-scope="scope">
+                  <span class="cl-text-center">{{ scope.row.device_id }}</span>
                 </template>
               </el-table-column>
-              <el-table-column prop="available"
-                               width="110">
+              <el-table-column width="110">
                 <template slot="header">
+                  <span class="cl-text-center">
                     Available
                     <el-tooltip class="item"
                                 effect="light"
@@ -63,17 +71,20 @@ limitations under the License.
                                 placement="top-start">
                       <i class="el-icon-info"></i>
                     </el-tooltip>
+                  </span>
                 </template>
                 <template slot-scope="scope">
+                  <span class="cl-text-center">
                     <i class="el-icon-success"
                        v-if="scope.row.available"></i>
                     <i class="el-icon-question"
                        v-else></i>
+                  </span>
                 </template>
               </el-table-column>
-              <el-table-column prop="health"
-                               width="80">
+              <el-table-column width="80">
                 <template slot="header">
+                  <span class="cl-text-center">
                     Health
                     <el-tooltip class="item"
                                 effect="light"
@@ -81,8 +92,10 @@ limitations under the License.
                                 placement="top-start">
                       <i class="el-icon-info"></i>
                     </el-tooltip>
+                  </span>
                 </template>
                 <template slot-scope="scope">
+                  <span class="cl-text-center">
                     <i class="el-icon-success"
                        v-if="scope.row.health===0"></i>
                     <i class="el-icon-warning normal"
@@ -93,11 +106,12 @@ limitations under the License.
                        v-if="scope.row.health===3"></i>
                     <i class="el-icon-remove"
                        v-if="scope.row.health=== 0xffffffff"></i>
+                  </span>
                 </template>
               </el-table-column>
-              <el-table-column prop="ip_address"
-                               width="130">
+              <el-table-column width="130">
                 <template slot="header">
+                  <span class="cl-text-center">
                     IP Address
                     <el-tooltip class="item"
                                 effect="light"
@@ -105,6 +119,10 @@ limitations under the License.
                                 placement="top-start">
                       <i class="el-icon-info"></i>
                     </el-tooltip>
+                  </span>
+                </template>
+                <template slot-scope="scope">
+                  <span class="cl-text-center">{{ scope.row.ip_address }}</span>
                 </template>
               </el-table-column>
               <el-table-column prop="aicore">
@@ -680,12 +698,10 @@ export default {
       padding-top: 16px;
       & > div {
         width: 100%;
-        .el-table_1_column_1,
-        .el-table_1_column_2,
-        .el-table_1_column_3,
-        .el-table_1_column_4,
-        .el-table_1_column_5 {
+        .cl-text-center {
+          display: inline-block;
           text-align: center;
+          width: 100%;
         }
         .el-table::before {
           height: 0px;