fix(接口测试,测试跟踪): 首页样式优化

首页样式优化
This commit is contained in:
song-tianyang 2022-07-19 11:44:32 +08:00 committed by 建国
parent 7aa7dc8549
commit 0f937df60f
8 changed files with 61 additions and 49 deletions

View File

@ -8,11 +8,11 @@
</div> </div>
<!-- 数量统计 --> <!-- 数量统计 -->
<el-container> <el-container>
<el-aside width="34%"> <el-aside width="120px">
<count-rectangle-chart :content="testCaseCountData.allApiDataCountNumber"/> <count-rectangle-chart :content="testCaseCountData.allApiDataCountNumber"/>
</el-aside> </el-aside>
<el-main style="padding-left: 0px;padding-right: 0px"> <el-main style="padding-left: 0px;padding-right: 0px;display: block">
<div style="width: 185px; float:right;margin:0 auto"> <div style="width: 185px; float:right;margin:0 auto;overflow: auto">
<el-row align="center" class="hidden-lg-and-down"> <el-row align="center" class="hidden-lg-and-down">
<el-col :span="6" <el-col :span="6"
style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;"> style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;">

View File

@ -8,12 +8,11 @@
</div> </div>
<!-- 数值统计 --> <!-- 数值统计 -->
<el-container> <el-container>
<el-aside width="34%"> <el-aside width="120px">
<count-rectangle-chart :content="apiCountData.allApiDataCountNumber"/> <count-rectangle-chart :content="apiCountData.allApiDataCountNumber"/>
</el-aside> </el-aside>
<el-main style="padding-left: 0px;padding-right: 0px;"> <el-main style="padding-left: 0px;padding-right: 0px;display: block">
<div style="width: 185px; float:right;margin:0 auto"> <div style="width: 185px; float:right;margin:0 auto;overflow: auto">
<el-row align="right"> <el-row align="right">
<el-col :span="6" <el-col :span="6"
style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;"> style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;">

View File

@ -9,11 +9,11 @@
<!-- 数量统计 --> <!-- 数量统计 -->
<el-container> <el-container>
<el-aside width="34%"> <el-aside width="120px">
<count-rectangle-chart :content="sceneCountData.allApiDataCountNumber"/> <count-rectangle-chart :content="sceneCountData.allApiDataCountNumber"/>
</el-aside> </el-aside>
<el-main style="padding-left: 0px;padding-right: 0px; margin-right: 5px"> <el-main style="padding-left: 0px;padding-right: 0px; margin-right: 5px;display: block">
<div style="width: 185px; float:right;margin:0 auto"> <div style="width: 185px; float:right;margin:0 auto;overflow: auto">
<el-row align="right"> <el-row align="right">
<span style="text-align: right;display:block;margin-top: 4px"> <span style="text-align: right;display:block;margin-top: 4px">
{{ {{

View File

@ -9,11 +9,11 @@
<!-- 数量统计 --> <!-- 数量统计 -->
<el-container> <el-container>
<el-aside width="34%"> <el-aside width="120px">
<count-rectangle-chart :content="scheduleTaskCountData.allApiDataCountNumber"/> <count-rectangle-chart :content="scheduleTaskCountData.allApiDataCountNumber"/>
</el-aside> </el-aside>
<el-main style="padding-left: 0px;padding-right: 0px; margin-right: 5px"> <el-main style="padding-left: 0px;padding-right: 0px; margin-right: 5px;display: block">
<div style="width: 185px; float:right;margin:0 auto"> <div style="width: 185px; float:right;margin:0 auto;overflow: auto">
<el-row align="right"> <el-row align="right">
<span style="text-align: right;display:block;margin-top: 4px"> <span style="text-align: right;display:block;margin-top: 4px">
{{ {{

View File

@ -81,7 +81,7 @@
</span> </span>
</div> </div>
<div style="float: right;margin-right: 10px;"> <div style="float: right;margin-right: 10px;">
<div v-if="projectEnvMap" type="flex"> <div v-if="showProjectEnv" type="flex">
<span> {{ $t('commons.environment') + ':' }} </span> <span> {{ $t('commons.environment') + ':' }} </span>
<div v-for="(values,key) in projectEnvMap" :key="key" style="margin-right: 10px"> <div v-for="(values,key) in projectEnvMap" :key="key" style="margin-right: 10px">
{{ key + ":" }} {{ key + ":" }}
@ -241,6 +241,11 @@ export default {
application: {} application: {}
}; };
}, },
computed:{
showProjectEnv() {
return this.projectEnvMap && JSON.stringify(this.projectEnvMap) !== '{}';
},
},
methods: { methods: {
showAllProjectInfo() { showAllProjectInfo() {
this.$refs.projectEnvDialog.open(this.allProjectEnvMap); this.$refs.projectEnvDialog.open(this.allProjectEnvMap);

View File

@ -6,7 +6,7 @@
</span> </span>
</div> </div>
<el-container> <el-container>
<el-aside width="150px"> <el-aside width="120px">
<count-rectangle-chart :content="bugTotalSize"/> <count-rectangle-chart :content="bugTotalSize"/>
<div> <div>
{{ $t('test_track.home.percentage') }} {{ $t('test_track.home.percentage') }}

View File

@ -1,5 +1,5 @@
<template> <template>
<el-card class="table-card" v-loading="result.loading" body-style="padding:10px;"> <el-card class="table-card" v-loading="result.loading" body-style="padding:16px 5px 16px 5px;" style="height: 350px;margin-top: 5px">
<div slot="header"> <div slot="header">
<span class="title"> <span class="title">
{{ $t('test_track.home.case_count') }} {{ $t('test_track.home.case_count') }}
@ -7,25 +7,25 @@
</div> </div>
<!--数值统计--> <!--数值统计-->
<el-container> <el-container>
<el-aside width="34%"> <el-aside width="120px">
<count-rectangle-chart :content="trackCountData.allCaseCountNumber"/> <count-rectangle-chart :content="trackCountData.allCaseCountNumber"/>
</el-aside> </el-aside>
<el-main style="padding-left: 0px;padding-right: 0px;"> <el-main style="padding-left: 0px;padding-right: 0px;display: block">
<div style="width: 200px;margin:0 auto"> <div style="width:200px;float:right;margin:0;overflow: auto">
<el-row align="center"> <el-row align="right">
<el-col :span="6" <el-col :span="6"
style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;"> style="border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;">
<div class="count-info-div" v-html="trackCountData.p0CountStr"></div> <div class="count-info-div" v-html="trackCountData.p0CountStr"></div>
</el-col> </el-col>
<el-col :span="6" <el-col :span="6"
style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;"> style="border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;">
<div class="count-info-div" v-html="trackCountData.p1CountStr"></div> <div class="count-info-div" v-html="trackCountData.p1CountStr"></div>
</el-col> </el-col>
<el-col :span="6" <el-col :span="6"
style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;"> style="border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;">
<div class="count-info-div" v-html="trackCountData.p2CountStr"></div> <div class="count-info-div" v-html="trackCountData.p2CountStr"></div>
</el-col> </el-col>
<el-col :span="6" style="padding: 5px;"> <el-col :span="6" style="">
<div class="count-info-div" v-html="trackCountData.p3CountStr"></div> <div class="count-info-div" v-html="trackCountData.p3CountStr"></div>
</el-col> </el-col>
</el-row> </el-row>
@ -132,12 +132,23 @@ export default {
<style scoped> <style scoped>
.el-aside {
line-height: 100px;
text-align: center;
}
.rows-count-number {
font-family: 'ArialMT', 'Arial', sans-serif;
font-size: 14px;
color: var(--count_number) !important;
}
.detail-container { .detail-container {
margin-top: 30px; margin-top: 20px
} }
.default-property { .default-property {
font-size: 14px font-size: 14px;
} }
.main-property { .main-property {

View File

@ -1,5 +1,5 @@
<template> <template>
<el-card class="table-card" v-loading="result.loading" body-style="padding:10px;"> <el-card class="table-card" v-loading="result.loading" body-style="padding:16px 5px 16px 5px;" style="height: 350px;margin-top: 5px">
<div slot="header"> <div slot="header">
<span class="title"> <span class="title">
{{ $t('test_track.home.relevance_case') }} {{ $t('test_track.home.relevance_case') }}
@ -10,20 +10,22 @@
<el-aside width="120px"> <el-aside width="120px">
<count-rectangle-chart :content="relevanceCountData.allRelevanceCaseCount"/> <count-rectangle-chart :content="relevanceCountData.allRelevanceCaseCount"/>
</el-aside> </el-aside>
<el-main style="padding-left: 0px;padding-right: 0px;"> <el-main style="padding-left: 0px;padding-right: 0px;display: block">
<el-row align="center"> <div style="width:200px;float:right;margin:0 auto;overflow: auto">
<el-row align="right">
<el-col :span="8" <el-col :span="8"
style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;"> style="border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;">
<div class="count-info-div" v-html="relevanceCountData.apiCaseCountStr"></div> <div class="count-info-div" v-html="relevanceCountData.apiCaseCountStr"></div>
</el-col> </el-col>
<el-col :span="8" <el-col :span="8"
style="padding: 5px;border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;"> style="border-right-style: solid;border-right-width: 1px;border-right-color: #ECEEF4;">
<div class="count-info-div" v-html="relevanceCountData.scenarioCaseStr"></div> <div class="count-info-div" v-html="relevanceCountData.scenarioCaseStr"></div>
</el-col> </el-col>
<el-col :span="8" style="padding: 5px;"> <el-col :span="8" style="">
<div class="count-info-div" v-html="relevanceCountData.performanceCaseCountStr"></div> <div class="count-info-div" v-html="relevanceCountData.performanceCaseCountStr"></div>
</el-col> </el-col>
</el-row> </el-row>
</div>
</el-main> </el-main>
</el-container> </el-container>
@ -114,8 +116,9 @@ export default {
</script> </script>
<style scoped> <style scoped>
.detail-container { .detail-container {
margin-top: 30px margin-top: 30px;
} }
.default-property { .default-property {
@ -131,14 +134,8 @@ export default {
border-bottom: 0px solid #EBEEF5; border-bottom: 0px solid #EBEEF5;
} }
.el-card >>> .el-card__body {
padding-right: 0;
}
.count-info-div { .count-info-div {
margin-top: 3px; margin: 3px;
margin-bottom: 3px;
text-align: center;
} }
.count-info-div >>> p { .count-info-div >>> p {