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

This commit is contained in:
chenjianxing 2022-11-24 14:04:30 +08:00 committed by jianxing
parent 3bded248d0
commit 71ceeb36de
3 changed files with 82 additions and 23 deletions

View File

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

View File

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

View File

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