style(接口测试): 导出报告行距样式优化

This commit is contained in:
fit2-zhao 2023-02-16 15:22:06 +08:00 committed by fit2-zhao
parent 44f4587bae
commit 085f826ce6
4 changed files with 60 additions and 50 deletions

View File

@ -110,7 +110,9 @@ public class MsScenario extends MsTestElement {
}
if (config != null && StringUtils.equals(this.getId(), config.getScenarioId())) {
config.setTransferVariables(this.variables);
ElementUtil.setHeader(scenarioTree, this.headers, this.getName());
if (CollectionUtils.isNotEmpty(this.headers)) {
ElementUtil.setHeader(scenarioTree, this.headers, this.getName());
}
}
if (config != null && !config.getExcludeScenarioIds().contains(this.getId())) {
scenarioTree = MsCriticalSectionController.createHashTree(tree, this.getName(), this.isEnable());

View File

@ -703,6 +703,9 @@ export default {
}
}
}
if(this.content.scenarios && this.content.scenarios[0].requestResults){
this.content.scenarios[0].requestResults.push({responseResult: {}});
}
this.reportExportVisible = true;
let reset = this.exportReportReset;
let name = this.report.name;

View File

@ -9,62 +9,64 @@
<ms-metric-chart :content="content" :is-export="true" :totalTime="totalTime" :report="report" />
<div class="scenario-result" v-for="(scenario, index) in content.scenarios" :key="index" :scenario="scenario">
<el-card>
<template v-slot:header> {{ $t('api_report.scenario_name') }}{{ scenario.name }} </template>
<template v-slot:header> {{ $t('api_report.scenario_name') }}{{ scenario.name }}</template>
<div
class="ms-border clearfix"
v-for="(request, index) in scenario.requestResults"
:key="index"
:request="request">
<div class="request-top">
<div>
{{ getName(request.name) }}
<div v-if="index != scenario.requestResults.length -1" style="min-height: 165px;">
<div class="request-top">
<div>
{{ getName(request.name) }}
</div>
<div class="url">
{{ request.url }}
</div>
</div>
<div class="url">
{{ request.url }}
<el-divider />
<div class="request-middle">
<api-report-request-header-item :title="$t('api_test.request.method')">
<span class="method"> {{ request.method }}</span>
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.response_time')">
{{ request.responseResult.responseTime }} ms
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.latency')">
{{ request.responseResult.latency }} ms
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.request_size')">
{{ request.requestSize }} bytes
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.response_size')">
{{ request.responseResult.responseSize }} bytes
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.error')">
{{ request.error }}
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.assertions')">
{{ request.passAssertions + ' / ' + request.totalAssertions }}
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.response_code')" style="width: 200px">
{{ request.responseResult.responseCode }}
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.result')" style="width: 50px">
<el-tag v-if="request.unexecute">Pending</el-tag>
<el-tag v-else-if="!request.success && request.status && request.status === 'PENDING'">Pending</el-tag>
<el-tag v-else-if="request.errorCode" class="ms-test-error_code"> FakeError</el-tag>
<el-tag size="mini" type="success" v-else-if="request.success"> Success</el-tag>
<el-tag size="mini" type="danger" v-else> Error</el-tag>
</api-report-request-header-item>
</div>
</div>
<el-divider />
<div class="request-middle">
<api-report-request-header-item :title="$t('api_test.request.method')">
<span class="method"> {{ request.method }}</span>
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.response_time')">
{{ request.responseResult.responseTime }} ms
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.latency')">
{{ request.responseResult.latency }} ms
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.request_size')">
{{ request.requestSize }} bytes
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.response_size')">
{{ request.responseResult.responseSize }} bytes
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.error')">
{{ request.error }}
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.assertions')">
{{ request.passAssertions + ' / ' + request.totalAssertions }}
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.response_code')" style="width: 200px">
{{ request.responseResult.responseCode }}
</api-report-request-header-item>
<api-report-request-header-item :title="$t('api_report.result')" style="width: 50px">
<el-tag v-if="request.unexecute">Pending </el-tag>
<el-tag v-else-if="!request.success && request.status && request.status === 'PENDING'">Pending </el-tag>
<el-tag v-else-if="request.errorCode" class="ms-test-error_code"> FakeError </el-tag>
<el-tag size="mini" type="success" v-else-if="request.success"> Success </el-tag>
<el-tag size="mini" type="danger" v-else> Error </el-tag>
</api-report-request-header-item>
</div>
</div>
</el-card>
</div>
@ -162,6 +164,7 @@ export default {
:deep(.report-left) {
float: none;
}
:deep(.metric-box-total) {
min-width: 100px;
}

View File

@ -278,7 +278,9 @@ export default {
onClose(e) {
},
listenScreenChange() {
this.size = document.body.clientWidth;
if(this.size != 600) {
this.size = document.body.clientWidth;
}
},
showTaskCenter() {
this.getTaskRunning();