refactor(测试跟踪): 测试跟踪首页样式对齐

test-track/frontend/src/business/home/components/FailureTestCaseList.vue

@@ -13,8 +13,15 @@
       <div v-show="!loadError">
         <el-table :data="tableData" class="adjust-table table-content"
                   header-cell-class-name="home-table-cell" style="min-height: 228px">
-          <el-table-column type="index" :label="$t('home.case.index')" show-overflow-tooltip width="100" />
-          <el-table-column prop="caseName" :label="$t('home.case.case_name')" min-width="200">
+          <el-table-column
+            type="index"
+            :label="$t('home.case.index')"
+            show-overflow-tooltip
+            width="100px"/>
+          <el-table-column
+            prop="caseName"
+            :label="$t('home.case.case_name')"
+            min-width="200px">
             <template v-slot:default="{row}">
               <el-link style="color: #783887; width: 100%;" :underline="false" type="info" @click="redirect(row.caseType,row.id)"
                        :disabled="(row.caseType === 'apiCase' && apiCaseReadOnly) || (row.caseType === 'scenario' && apiScenarioReadOnly) ||
@@ -23,19 +30,31 @@
               </el-link>
             </template>
           </el-table-column>
-          <el-table-column prop="caseType" :label="$t('home.case.case_type')" show-overflow-tooltip column-key="caseType" width="100">
+          <el-table-column
+            prop="caseType"
+            :label="$t('home.case.case_type')"
+            show-overflow-tooltip
+            column-key="caseType"
+            min-width="100px">
             <template v-slot:default="scope">
               <basic-case-type-label :value="scope.row.caseType"></basic-case-type-label>
             </template>
           </el-table-column>
-          <el-table-column prop="testPlan" :label="$t('home.case.test_plan')" min-width="200">
+          <el-table-column
+            prop="testPlan"
+            :label="$t('home.case.test_plan')"
+            min-width="300px">
             <template v-slot:default="{row}">
               <el-link style="color: #783887; width: 100%;" :underline="false" type="info" @click="redirect('testPlanEdit',row.testPlanId)" v-permission-disable="['PROJECT_TRACK_PLAN:READ']">
                 {{ row.testPlan }}
               </el-link>
             </template>
           </el-table-column>
-          <el-table-column prop="failureTimes" :label="$t('home.case.failure_times')" show-overflow-tooltip align="right" width="120"/>
+          <el-table-column
+            prop="failureTimes"
+            :label="$t('home.case.failure_times')"
+            show-overflow-tooltip
+            min-width="100px"/>
           <template #empty>
             <div
               style="width: 100%;height: 144px;display: flex;flex-direction: column;justify-content: center;align-items: center">

test-track/frontend/src/business/home/components/ReviewList.vue

@@ -19,16 +19,38 @@
       <div v-show="!loadError">
         <el-table class="adjust-table table-content" :data="tableData" @row-click="intoPlan"
                   header-cell-class-name="home-table-cell" style="min-height: 228px">
-          <el-table-column type="index" :label="$t('home.table.index')" show-overflow-tooltip width="100" />
-          <el-table-column prop="name" :label="$t('commons.name')" show-overflow-tooltip min-width="200" />
-          <el-table-column prop="status" :label="$t('test_track.plan.plan_status')" width="90">
+          <el-table-column
+            type="index"
+            :label="$t('home.table.index')"
+            show-overflow-tooltip
+            width="100px"/>
+          <el-table-column
+            prop="name"
+            :label="$t('commons.name')"
+            show-overflow-tooltip
+            min-width="200px"/>
+          <el-table-column
+            prop="status"
+            :label="$t('test_track.plan.plan_status')"
+            min-width="100px">
             <template v-slot:default="scope">
               <basic-status-label :value="scope.row.status"></basic-status-label>
             </template>
           </el-table-column>
-          <el-table-column prop="creator" :label="$t('test_track.review.creator')" show-overflow-tooltip min-width="150" />
-          <el-table-column prop="reviewerName" :label="$t('test_track.review.reviewer')" show-overflow-tooltip min-width="150" />
-          <el-table-column :label="$t('test_track.review.result_distribution')" show-overflow-tooltip min-width="200">
+          <el-table-column
+            prop="creator"
+            :label="$t('test_track.review.creator')"
+            show-overflow-tooltip
+            min-width="100px"/>
+          <el-table-column
+            prop="reviewerName"
+            :label="$t('test_track.review.reviewer')"
+            show-overflow-tooltip
+            min-width="300px"/>
+          <el-table-column
+            :label="$t('test_track.review.result_distribution')"
+            show-overflow-tooltip
+            min-width="300px">
             <template v-slot:default="scope">
               <el-tooltip :content="getResultTip(scope.row.total, scope.row.reviewed, scope.row.pass)"
                           placement="top" :enterable="false" class="item" effect="dark">

test-track/frontend/src/business/home/components/RunningTaskList.vue

@@ -14,8 +14,15 @@
         <el-table
           :enable-selection="false" :condition="condition" :data="tableData" class="adjust-table table-content"
           @refresh="search" header-cell-class-name="home-table-cell" style="min-height: 228px">
-          <el-table-column type="index" :label="$t('home.table.index')" show-overflow-tooltip width="100" />
-          <el-table-column prop="name" :label="$t('commons.name')" min-width="200">
+          <el-table-column
+            type="index"
+            :label="$t('home.table.index')"
+            show-overflow-tooltip
+            width="100px"/>
+          <el-table-column
+            prop="name"
+            :label="$t('commons.name')"
+            min-width="200px">
             <template v-slot:default="{row}">
               <!-- 若为只读用户不可点击之后跳转-->
               <span v-if="isReadOnly">
@@ -26,13 +33,28 @@
               </el-link>
             </template>
           </el-table-column  >
-          <ms-table-column prop="taskType" :label="$t('home.table.task_type')" :filters="typeFilters" width="100">
+          <ms-table-column
+            prop="taskType"
+            :label="$t('home.table.task_type')"
+            :filters="typeFilters"
+            min-width="100px">
             <template v-slot:default="scope">
               <basic-task-type-label :value="scope.row.taskGroup"></basic-task-type-label>
             </template>
           </ms-table-column>
-          <el-table-column prop="rule" :label="$t('home.table.run_rule')" show-overflow-tooltip min-width="200"/>
-          <el-table-column :label="$t('home.table.task_status')" width="100">
+          <el-table-column
+            prop="creator"
+            :label="$t('home.table.create_user')"
+            show-overflow-tooltip
+            min-width="100px"/>
+          <el-table-column
+            prop="rule"
+            :label="$t('home.table.run_rule')"
+            show-overflow-tooltip
+            min-width="300px"/>
+          <el-table-column
+            :label="$t('home.table.task_status')"
+            min-width="100px">
             <template v-slot:default="scope">
               <div>
                 <el-switch
@@ -44,17 +66,13 @@
               </div>
             </template>
           </el-table-column>
-          <el-table-column :label="$t('home.table.next_execution_time')" width="170">
+          <el-table-column
+            :label="$t('home.table.next_execution_time')"
+            min-width="200px">
             <template v-slot:default="scope">
               <span>{{ scope.row.nextExecutionTime | datetimeFormat }}</span>
             </template>
           </el-table-column>
-          <el-table-column prop="creator" :label="$t('home.table.create_user')" show-overflow-tooltip min-width="150" />
-          <el-table-column :label="$t('home.table.update_time')" width="170">
-            <template v-slot:default="scope">
-              <span>{{ scope.row.updateTime | datetimeFormat }}</span>
-            </template>
-          </el-table-column>
           <template #empty>
             <div
               style="width: 100%;height: 144px;display: flex;flex-direction: column;justify-content: center;align-items: center">