fix(接口测试): 修复报告计算中&数据统一问题&模板不能编辑

This commit is contained in:
xinxin.wu 2024-04-08 19:47:42 +08:00 committed by Craftsman
parent 3d5dea9f20
commit 071905f089
10 changed files with 109 additions and 67 deletions

View File

@ -41,7 +41,7 @@
<div class="mr-2 text-[var(--color-text-4)]">{{ item.label }}</div>
</div>
<div class="count">{{ item.count || 0 }}</div>
<div class="count">{{ item.rote || 0 }}%</div>
<div class="count">{{ item.rote || 0 }} <span v-if="String(item.rote) !== 'Calculating'">%</span></div>
</div>
</div>
</div>

View File

@ -8,7 +8,11 @@
<!-- 请求分析 -->
<div class="request-analyze min-h-[110px]">
<div class="block-title mb-4">{{ t('report.detail.api.requestAnalysis') }}</div>
<SetReportChart :legend-data="legendData" :options="charOptions" :request-total="getIndicators(detail.total)" />
<SetReportChart
:legend-data="legendData"
:options="charOptions"
:request-total="getIndicators(detail.total) || 0"
/>
</div>
<!-- 耗时分析 -->
<div class="time-analyze">
@ -17,13 +21,13 @@
<MsIcon type="icon-icon_time_outlined" class="mr-[4px] text-[var(--color-text-4)]" size="16" />
<span class="time-card-item-title">{{ t('report.detail.api.totalTime') }}</span>
<a-popover position="bottom" content-class="response-popover-content">
<span class="count">{{ getTotalTime.split('-')[0] || 0 }}</span
<span class="count">{{ getTotalTime.split('-')[0] }}</span
><span class="time-card-item-title">{{ getTotalTime.split('-')[1] || 'ms' }}</span>
<template #content>
<div class="min-w-[140px] max-w-[400px] p-4 text-[14px]">
<div class="text-[var(--color-text-4)]">{{ t('report.detail.api.totalTime') }}</div>
<div class="mt-2 text-[var(--color-text-1)]">
<span class="text-[18px] font-medium">{{ getTotalTime.split('-')[0] || '-' }}</span
<span class="text-[18px] font-medium">{{ getTotalTime.split('-')[0] }}</span
>{{ getTotalTime.split('-')[1] || 'ms' }}</div
>
</div>
@ -36,7 +40,7 @@
<a-popover position="bottom" content-class="response-popover-content">
<div class="flex items-center">
<div class="count">{{
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '-'
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '0'
}}</div
><div class="time-card-item-title">{{
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[1] : 'ms'
@ -48,7 +52,7 @@
<div class="text-[var(--color-text-4)]">{{ t('report.detail.api.requestTotalTime') }}</div>
<div class="mt-2 text-[var(--color-text-1)]">
<span class="text-[18px] font-medium">{{
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '-'
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '0'
}}</span
>{{
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[1] : 'ms'
@ -68,10 +72,27 @@
{{ t('report.detail.api.executionRate') }}
</div>
<div class="flex items-center">
<span class="count"> {{ getExcuteRate() }} %</span>
<a-divider direction="vertical" class="!h-[16px]" :margin="8"></a-divider>
<span>{{ getIndicators(getRequestEacuteCount) }}</span>
<span class="mx-1 text-[var(--color-text-4)]">/ {{ getIndicators(getRequestTotalCount) }}</span>
<a-popover position="bottom" content-class="response-popover-content">
<div class="count one-line-text max-w-[80px]"> {{ getExcuteRate() }} </div
><span v-show="getExcuteRate() !== 'Calculating'">%</span>
<a-divider direction="vertical" class="!h-[16px]" :margin="8"></a-divider>
<span>{{ getIndicators(getRequestEacuteCount) }}</span>
<span class="mx-1 text-[var(--color-text-4)]">/ {{ getIndicators(getRequestTotalCount) }}</span>
<template #content>
<div class="min-w-[190px] max-w-[400px] p-4 text-[14px]">
<div class="text-[var(--color-text-4)]">{{ t('report.detail.api.executionRate') }}</div>
<div class="mt-2 flex items-center justify-between">
<div class="count text-[18px] font-medium">
{{ getExcuteRate() }} <span v-show="getExcuteRate() !== 'Calculating'">%</span>
</div>
<div>
<span>{{ getIndicators(getRequestEacuteCount) }}</span>
<span class="mx-1 text-[var(--color-text-4)]">/ {{ getIndicators(getRequestTotalCount) }}</span>
</div>
</div>
</div>
</template>
</a-popover>
</div>
</div>
<div class="time-card-item-rote">
@ -83,20 +104,20 @@
<div class="flex items-center">
<a-popover position="bottom" content-class="response-popover-content">
<div class="flex items-center">
<div class="count one-line-text max-w-[80px]">{{
detail.assertionPassRate === 'Calculating' ? '-' : detail.assertionPassRate || '0.00'
}}</div
>%
<div class="count one-line-text max-w-[80px]">{{ detail.assertionPassRate || '0.00' }}</div
><span v-show="detail.assertionPassRate !== 'Calculating'" class="ml-1">%</span>
<a-divider direction="vertical" class="!h-[16px]" :margin="8"></a-divider>
<div class="one-line-text max-w-[80px]">{{
getIndicators(detail.assertionSuccessCount) === '-'
? '-'
: addCommasToNumber(detail.assertionSuccessCount || 0)
getIndicators(detail.assertionSuccessCount) !== 'Calculating'
? addCommasToNumber(detail.assertionSuccessCount || 0)
: getIndicators(detail.assertionSuccessCount)
}}</div>
<span class="mx-1 text-[var(--color-text-4)]">/</span>
<div class="one-line-text max-w-[80px]">
{{
getIndicators(detail.assertionCount) === '-' ? '-' : addCommasToNumber(detail.assertionCount) || 0
getIndicators(detail.assertionCount) !== 'Calculating'
? addCommasToNumber(detail.assertionCount)
: getIndicators(detail.assertionCount)
}}</div
>
</div>
@ -106,20 +127,21 @@
<div class="text-[var(--color-text-4)]">{{ t('report.detail.api.assertPass') }}</div>
<div class="mt-2 flex items-center justify-between">
<div class="text-[18px] font-medium text-[var(--color-text-1)]"
>{{ getIndicators(detail.assertionPassRate) }} <span>%</span></div
>{{ getIndicators(detail.assertionPassRate) }}
<span v-show="detail.assertionPassRate !== 'Calculating'">%</span></div
>
<div>
<span class="text-[var(--color-text-1)]">{{
getIndicators(detail.assertionSuccessCount) === '-'
? '-'
: addCommasToNumber(detail.assertionSuccessCount || 0)
getIndicators(detail.assertionSuccessCount) !== 'Calculating'
? addCommasToNumber(detail.assertionSuccessCount || 0)
: getIndicators(detail.assertionSuccessCount)
}}</span>
<span class="text-[var(--color-text-4)]"
><span class="mx-1">/</span>
{{
getIndicators(detail.assertionCount) === '-'
? '-'
: addCommasToNumber(detail.assertionCount) || 0
getIndicators(detail.assertionCount) !== 'Calculating'
? addCommasToNumber(detail.assertionCount)
: getIndicators(detail.assertionCount)
}}</span
>
</div>
@ -219,9 +241,9 @@
if (endTime && startTime && endTime !== 0 && startTime !== 0) {
return formatDuration(endTime - startTime);
}
return '-';
return '0';
}
return '-';
return '0';
});
const legendData = ref<LegendData[]>([]);
@ -287,9 +309,10 @@
const activeTab = ref<'tiled' | 'tab'>('tiled');
function getExcuteRate() {
return 100 - Number(detail.value.requestPendingRate)
? (100 - Number(detail.value.requestPendingRate)).toFixed(2)
: '0.00';
if (detail.value.requestPendingRate && detail.value.requestPendingRate !== 'Calculating') {
return (100 - Number(detail.value.requestPendingRate)).toFixed(2);
}
return getIndicators(detail.value.requestPendingRate);
}
//
@ -359,8 +382,8 @@
return {
...item,
label: t(item.label),
count: detail.value[item.value] === 'Calculating' ? '-' : detail.value[item.value] || 0,
rote: detail.value[item.rateKey] === 'Calculating' ? '-' : detail.value[item.rateKey],
count: detail.value[item.value] || 0,
rote: detail.value[item.rateKey] || 0,
};
});
}

View File

@ -17,25 +17,25 @@
<div class="countItem">
<div class="mb-[2px] mr-[4px] h-[6px] w-[6px] rounded-full bg-[rgb(var(--success-6))]"></div>
<div class="mr-2 text-[var(--color-text-4)]">{{ t('report.detail.successCount') }}</div>
{{ getIndicators(detail.stepSuccessCount) }}
{{ detail.stepSuccessCount || 0 }}
</div>
<!-- 误报 -->
<div class="countItem">
<div class="mb-[2px] mr-[4px] h-[6px] w-[6px] rounded-full bg-[rgb(var(--warning-6))]"></div>
<div class="mr-2 text-[var(--color-text-4)]">{{ t('report.detail.fakeErrorCount') }}</div>
{{ getIndicators(detail.stepFakeErrorCount) }}
{{ detail.stepFakeErrorCount || 0 }}
</div>
<!-- 失败 -->
<div class="countItem">
<div class="mb-[2px] mr-[4px] h-[6px] w-[6px] rounded-full bg-[rgb(var(--danger-6))]"></div>
<div class="mr-2 text-[var(--color-text-4)]">{{ t('report.detail.errorCount') }}</div>
{{ getIndicators(detail.stepErrorCount) }}
{{ detail.stepErrorCount || 0 }}
</div>
<!-- 未执行 -->
<div class="countItem">
<div class="mb-[2px] mr-[4px] h-[6px] w-[6px] rounded-full bg-[var(--color-text-input-border)]"></div>
<div class="mr-2 text-[var(--color-text-4)]">{{ t('report.detail.pendingCount') }}</div>
{{ getIndicators(detail.stepPendingCount) }}
{{ detail.stepPendingCount || 0 }}
</div>
</div>
<StepProgress :report-detail="detail" height="8px" radius="var(--border-radius-mini)" />
@ -49,7 +49,7 @@
<a-popover position="bottom" content-class="response-popover-content">
<div class="flex items-center">
<div class="one-line-text ml-4 max-w-[80px] text-[18px] font-medium">{{
getTotalTime.split('-')[0] || '-'
getTotalTime.split('-')[0]
}}</div>
<div class="ml-1 text-[var(--color-text-4)]">{{ getTotalTime.split('-')[1] || 'ms' }}</div>
</div>
@ -57,7 +57,7 @@
<div class="min-w-[140px] max-w-[400px] p-4 text-[14px]">
<div class="text-[var(--color-text-4)]">{{ t('report.detail.api.totalTime') }}</div>
<div class="mt-2 text-[var(--color-text-1)]">
<span class="text-[18px] font-medium">{{ getTotalTime.split('-')[0] || '-' }}</span
<span class="text-[18px] font-medium">{{ getTotalTime.split('-')[0] }}</span
>{{ getTotalTime.split('-')[1] || 'ms' }}</div
>
</div>
@ -73,7 +73,7 @@
<div>
<a-popover position="bottom" content-class="response-popover-content">
<span class="one-line-text ml-4 inline-block max-w-[80px] align-middle text-[18px] font-medium">{{
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '-'
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '0'
}}</span>
<span class="ml-1 text-[var(--color-text-4)]">{{
@ -84,7 +84,7 @@
<div class="text-[var(--color-text-4)]">{{ t('report.detail.api.requestTotalTime') }}</div>
<div class="mt-2 text-[var(--color-text-1)]">
<span class="text-[18px] font-medium">{{
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '-'
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[0] : '0'
}}</span
>{{
detail.requestDuration !== null ? formatDuration(detail.requestDuration).split('-')[1] : 'ms'
@ -103,19 +103,21 @@
<a-popover position="bottom" content-class="response-popover-content">
<div class="flex flex-nowrap items-center">
<div class="one-line-text max-w-[80px] text-[18px] font-medium text-[var(--color-text-1)]"
>{{ getIndicators(detail.assertionPassRate) }}
>{{ detail.assertionPassRate || 0 }}
</div>
<span>%</span>
<span v-show="detail.assertionPassRate !== 'Calculating'" class="ml-1">%</span>
<a-divider direction="vertical" :margin="0" class="!mx-2 h-[16px]"></a-divider>
<div class="one-line-text max-w-[80px] text-[var(--color-text-1)]">{{
getIndicators(detail.assertionSuccessCount) === '-'
? '-'
: addCommasToNumber(detail.assertionSuccessCount || 0)
getIndicators(detail.assertionSuccessCount) !== 'Calculating'
? addCommasToNumber(detail.assertionSuccessCount)
: getIndicators(detail.assertionSuccessCount)
}}</div>
<span class="mx-1">/</span>
<div class="one-line-text max-w-[80px] text-[var(--color-text-4)]">
{{
getIndicators(detail.assertionCount) === '-' ? '-' : addCommasToNumber(detail.assertionCount) || 0
getIndicators(detail.assertionCount) !== 'Calculating'
? addCommasToNumber(detail.assertionCount)
: getIndicators(detail.assertionCount)
}}</div
>
</div>
@ -124,20 +126,21 @@
<div class="text-[var(--color-text-4)]">{{ t('report.detail.api.assertPass') }}</div>
<div class="mt-2 flex items-center justify-between">
<div class="text-[18px] font-medium text-[var(--color-text-1)]"
>{{ getIndicators(detail.assertionPassRate) }} <span>%</span></div
>{{ getIndicators(detail.assertionPassRate) }}
<span v-show="detail.assertionPassRate !== 'Calculating'">%</span></div
>
<div>
<span class="text-[var(--color-text-1)]">{{
getIndicators(detail.assertionSuccessCount) === '-'
? '-'
: addCommasToNumber(detail.assertionSuccessCount || 0)
getIndicators(detail.assertionSuccessCount) !== 'Calculating'
? addCommasToNumber(detail.assertionSuccessCount || 0)
: getIndicators(detail.assertionSuccessCount)
}}</span>
<span class="text-[var(--color-text-4)]"
><span class="mx-1">/</span>
{{
getIndicators(detail.assertionCount) === '-'
? '-'
: addCommasToNumber(detail.assertionCount) || 0
getIndicators(detail.assertionCount) !== 'Calculating'
? addCommasToNumber(detail.assertionCount)
: getIndicators(detail.assertionCount)
}}</span
>
</div>
@ -154,7 +157,7 @@
<SetReportChart
:legend-data="legendData"
:options="charOptions"
:request-total="getIndicators(detail.requestTotal)"
:request-total="getIndicators(detail.requestTotal) || 0"
/>
</div>
</div>
@ -245,9 +248,9 @@
if (endTime && startTime && endTime !== 0 && startTime !== 0) {
return formatDuration(endTime - startTime);
}
return '-';
return '0';
}
return '-';
return '0';
});
const legendData = ref<LegendData[]>([]);
@ -357,8 +360,8 @@
return {
...item,
label: t(item.label),
count: detail.value[item.value] === 'Calculating' ? '-' : detail.value[item.value] || 0,
rote: detail.value[item.rateKey] === 'Calculating' ? '-' : detail.value[item.rateKey],
count: detail.value[item.value] || 0,
rote: detail.value[item.rateKey] || 0,
};
});
}

View File

@ -93,7 +93,7 @@
const cascaderOptions = ref<CascaderOption[]>([
{
value: ScenarioStepType.API_SCENARIO,
label: t('report.detail.api.scenario'),
label: t('report.detail.api.step'),
children: createChildOption(ScenarioStepType.API_SCENARIO),
},
{

View File

@ -71,11 +71,10 @@
const colorData = computed(() => {
if (
props.reportDetail.status === 'ERROR' ||
(props.reportDetail.successCount === 0 &&
props.reportDetail.errorCount === 0 &&
props.reportDetail.fakeErrorCount === 0 &&
props.reportDetail.pendingCount === 0)
props.reportDetail.successCount === 0 &&
props.reportDetail.errorCount === 0 &&
props.reportDetail.fakeErrorCount === 0 &&
props.reportDetail.pendingCount === 0
) {
return [
{

View File

@ -70,6 +70,7 @@ export default {
'report.detail.api.scriptError': 'Script error',
'report.detail.api.scriptErrorTip': 'Script error',
'report.detail.api.scenario': 'scenario',
'report.detail.api.step': 'step',
'report.detail.api.request': 'request',
'report.detail.api.globalWaitingTime': 'Scenario global waiting time',
'report.detail.api.executeEnv': 'Running environment',

View File

@ -69,6 +69,7 @@ export default {
'report.detail.api.scriptError': '脚本错误',
'report.detail.api.scriptErrorTip': '脚本报错',
'report.detail.api.scenario': '场景',
'report.detail.api.step': '步骤',
'report.detail.api.request': '请求',
'report.detail.api.globalWaitingTime': '场景全局等待时间',
'report.detail.api.executeEnv': '运行环境',

View File

@ -13,6 +13,13 @@ export function addFoldField(node: ScenarioItemType) {
// 是否为计算中
export function getIndicators(value: any) {
return value === 'Calculating' ? '-' : value || 0;
if (value === 'Calculating') {
return 'Calculating';
}
if (value === null) {
return 0;
}
return value;
}
export default {};

View File

@ -15,7 +15,15 @@
set: (value: any) => {
store.currentEnvDetailInfo.config.commonVariables = value;
},
get: () => store.currentEnvDetailInfo.config?.commonVariables || [],
get: () => {
return store.currentEnvDetailInfo.config?.commonVariables.map((e: any) => {
return {
...e,
tags: e.tags || [],
description: e.description || '',
};
});
},
});
</script>

View File

@ -6,7 +6,7 @@
:ok-loading="drawerLoading"
:width="800"
:show-continue="!isEdit && data.length < 20"
:ok-disabled="data.length >= 20"
:ok-disabled="data.length >= 20 && !isEdit"
@confirm="handleDrawerConfirm"
@continue="saveAndContinue"
@cancel="handleDrawerCancel"