test-version22
/
MeterSphere
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

style(接口测试): 接口自动化样式调整

This commit is contained in:
RubyLiu 2023-06-26 19:53:12 +08:00 committed by 刘瑞斌
parent 3ff5c7d548
commit e901a35105
3 changed files with 90 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
api-test/frontend/src/business/automation/report/components/MetricChart.vue
View File

@ -401,8 +401,6 @@ export default {
} }
.metric-icon-box { .metric-icon-box {
text-align: left;
height: 20px;
margin: 0 10px; margin: 0 10px;
} }

155
api-test/frontend/src/business/automation/scenario/EditApiScenario.vue
View File

@ -84,8 +84,8 @@
<el-card> <el-card>
<!-- header 调试部分 --> <!-- header 调试部分 -->
<div class="ms-debug-div" @click="showAll" ref="debugHeader"> <div class="ms-debug-div" @click="showAll" ref="debugHeader">
<el-row style="margin: 5px"> <div class="debug-header" style="margin: 5px">
<el-col :span="1" class="ms-col-one ms-font" v-show="scenarioDefinition.length > 1"> <div class="ms-col-one mt-2" v-show="scenarioDefinition.length > 1">
<el-tooltip <el-tooltip
:content="$t('test_track.case.batch_operate')" :content="$t('test_track.case.batch_operate')"
placement="top" placement="top"
@ -105,28 +105,27 @@
v-prevent-re-click v-prevent-re-click
@click="cancelBatchProcessing" /> @click="cancelBatchProcessing" />
</el-tooltip> </el-tooltip>
</el-col> </div>
<el-col :span="2" class="ms-col-one ms-font"> <div class="ms-col-one mt-2">
{{ $t('api_test.automation.step_total') }}：{{ scenarioDefinition.length }} <div class="ml-10">{{ $t('api_test.automation.step_total') }}：{{ scenarioDefinition.length }}</div>
</el-col> <div class="ml-10">
<el-col :span="2" class="ms-col-one ms-font"> <el-link class="head" @click="showScenarioParameters"
<el-link class="head" @click="showScenarioParameters" >{{ $t('api_test.automation.scenario_total') }}
>{{ $t('api_test.automation.scenario_total') }} </el-link>
</el-link> ：{{ getVariableSize() }}
：{{ getVariableSize() }} </div>
</el-col> <div class="ml-10">
<el-col :span="2" class="ms-col-one ms-font"> <el-checkbox v-model="enableCookieShare">
<el-checkbox v-model="enableCookieShare"> <span style="font-size: 13px">{{ $t('api_test.scenario.share_cookie') }}</span>
<span style="font-size: 13px">{{ $t('api_test.scenario.share_cookie') }}</span> </el-checkbox>
</el-checkbox> </div>
</el-col> <div class="ml-10">
<el-col :span="3" class="ms-col-one ms-font"> <el-checkbox v-model="onSampleError">
<el-checkbox v-model="onSampleError"> <span style="font-size: 13px">{{ $t('commons.failure_continues') }}</span>
<span style="font-size: 13px">{{ $t('commons.failure_continues') }}</span> </el-checkbox>
</el-checkbox> </div>
</el-col> </div>
<div class="ms-col-one">
<el-col :span="13">
<env-popover <env-popover
:env-map="projectEnvMap" :env-map="projectEnvMap"
:project-ids="projectIds" :project-ids="projectIds"
@ -142,8 +141,10 @@
@saveRefresh="setDomain" @saveRefresh="setDomain"
:has-option-group="true" :has-option-group="true"
ref="envPopover" ref="envPopover"
class="ms-message-right" /> class="ml-10"
<el-tooltip v-if="!debugLoading" content="Ctrl + R" placement="top"> />
<el-tooltip class="mt-2 ml-10" v-if="!debugLoading" content="Ctrl + R" placement="top">
<el-dropdown <el-dropdown
split-button split-button
type="primary" type="primary"
@ -152,20 +153,20 @@
size="mini" size="mini"
:disabled="scenarioDefinition.length < 1" :disabled="scenarioDefinition.length < 1"
@command="handleCommand" @command="handleCommand"
v-permission="[ v-permission="['PROJECT_API_SCENARIO:READ+DEBUG', 'PROJECT_API_SCENARIO:READ+RUN']">
'PROJECT_API_SCENARIO:READ+DEBUG',
'PROJECT_API_SCENARIO:READ+RUN'
]">
{{ $t('api_test.request.debug') }} {{ $t('api_test.request.debug') }}
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>{{ $t('api_test.automation.generate_report') }}</el-dropdown-item> <el-dropdown-item>{{ $t('api_test.automation.generate_report') }}</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</el-tooltip> </el-tooltip>
<el-button size="mini" type="primary" v-else @click="stop">{{ $t('report.stop_btn') }}</el-button> <el-button class="mt-2" size="mini" type="primary" v-else @click="stop">{{
$t('report.stop_btn')
}}</el-button>
<el-button <el-button
id="inputDelay" id="inputDelay"
class="ml-10"
type="primary" type="primary"
size="mini" size="mini"
v-prevent-re-click v-prevent-re-click
@ -201,7 +202,6 @@
margin-right: 5px; margin-right: 5px;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
top: 3px;
" "
@click="saveFollow" /> @click="saveFollow" />
</el-tooltip> </el-tooltip>
@ -226,26 +226,30 @@
>{{ $t('operating_log.change_history') }} >{{ $t('operating_log.change_history') }}
</el-link> </el-link>
<!-- 版本历史 --> <!-- 版本历史 -->
<mx-version-history <div class="history">
v-xpack <mx-version-history
ref="versionHistory" v-xpack
:version-data="versionData" ref="versionHistory"
:current-id="currentScenario.id" :version-data="versionData"
:has-latest="hasLatest" :current-id="currentScenario.id"
@setLatest="setLatest" :has-latest="hasLatest"
@compare="compare" @setLatest="setLatest"
@checkout="checkout" @compare="compare"
@create="create" @checkout="checkout"
@del="del" /> @create="create"
</el-col> @del="del" />
</div>
</div>
</div>
<div class="ms-full-screen">
<el-tooltip <el-tooltip
effect="dark" effect="dark"
:content="$t('commons.full_screen_editing')" :content="$t('commons.full_screen_editing')"
placement="top-start" placement="top-start"
style="margin-top: 6px"> class="ms-full-screen">
<font-awesome-icon class="alt-ico" :icon="['fa', 'expand-alt']" size="lg" @click="fullScreen" /> <font-awesome-icon class="alt-ico" :icon="['fa', 'expand-alt']" size="lg" @click="fullScreen" />
</el-tooltip> </el-tooltip>
</el-row> </div>
</div> </div>
<div class="card-content"> <div class="card-content">
@ -1114,7 +1118,7 @@ export default {
} }
}, },
evaluationParent(node, status) { evaluationParent(node, status) {
if(node.data.code === "ERROR") { if (node.data.code === 'ERROR') {
return; return;
} }
if (node.data.code === 'FAKE_ERROR') { if (node.data.code === 'FAKE_ERROR') {
@ -1138,7 +1142,7 @@ export default {
let id = item.data.id || item.data.resourceId; let id = item.data.id || item.data.resourceId;
if (id + '_' + item.data.parentIndex === resourceId) { if (id + '_' + item.data.parentIndex === resourceId) {
item.data.testing = false; item.data.testing = false;
item.data.code = status ? "SUCCESS" : "ERROR"; item.data.code = status ? 'SUCCESS' : 'ERROR';
this.evaluationParent(item.parent, status); this.evaluationParent(item.parent, status);
} }
if (item.childNodes && item.childNodes.length > 0) { if (item.childNodes && item.childNodes.length > 0) {
@ -1721,7 +1725,7 @@ export default {
}); });
}, },
runDebug(runScenario) { runDebug(runScenario) {
if (!hasPermissions('PROJECT_API_SCENARIO:READ+DEBUG','PROJECT_API_SCENARIO:READ+RUN')) { if (!hasPermissions('PROJECT_API_SCENARIO:READ+DEBUG', 'PROJECT_API_SCENARIO:READ+RUN')) {
return; return;
} }
this.mergeScenario(this.scenarioDefinition); this.mergeScenario(this.scenarioDefinition);
@ -1803,7 +1807,7 @@ export default {
} else { } else {
this.debugLoading = false; this.debugLoading = false;
let hasRequest = runScenario && runScenario.hasRequest; let hasRequest = runScenario && runScenario.hasRequest;
if (hasRequest && runScenario.hashTree) { if (hasRequest && runScenario.hashTree) {
runScenario.hashTree[0].requestResult = []; runScenario.hashTree[0].requestResult = [];
runScenario.hashTree[0].testing = false; runScenario.hashTree[0].testing = false;
} }
@ -1964,7 +1968,7 @@ export default {
return new Promise((resolve) => { return new Promise((resolve) => {
const encoder = new TextEncoder(); const encoder = new TextEncoder();
const bytes = encoder.encode(definition, 'utf-8'); const bytes = encoder.encode(definition, 'utf-8');
getApiScenarioEnv(bytes ).then((res) => { getApiScenarioEnv(bytes).then((res) => {
if (res.data && res.data.data) { if (res.data && res.data.data) {
this.projectIds = new Set(res.data.data.projectIds); this.projectIds = new Set(res.data.data.projectIds);
this.projectIds.add(this.projectId); this.projectIds.add(this.projectId);
@ -2195,7 +2199,7 @@ export default {
this.message = 'stop'; this.message = 'stop';
this.debugData = {}; this.debugData = {};
let hasRequest = this.runScenario && this.runScenario.hasRequest; let hasRequest = this.runScenario && this.runScenario.hasRequest;
if (hasRequest && this.runScenario.hashTree) { if (hasRequest && this.runScenario.hashTree) {
this.runScenario.hashTree[0].requestResult = []; this.runScenario.hashTree[0].requestResult = [];
this.runScenario.hashTree[0].testing = false; this.runScenario.hashTree[0].testing = false;
} }
@ -2624,7 +2628,7 @@ export default {
}; };
</script> </script>
<style scoped> <style lang="scss" scoped>
.card-content { .card-content {
height: calc(100vh - 170px); height: calc(100vh - 170px);
overflow-y: auto; overflow-y: auto;
@ -2635,19 +2639,34 @@ export default {
} }
.ms-debug-div { .ms-debug-div {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
border: 1px #dcdfe6 solid; border: 1px #dcdfe6 solid;
border-radius: 4px; border-radius: 4px;
margin-right: 0px; margin-right: 0px;
}
.ms-font { .debug-header {
color: #303133; display: flex;
font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', Arial, sans-serif; flex-flow: row nowrap;
font-size: 13px; align-items: center;
} justify-content: space-between;
.ms-col-one {
.ms-col-one { display: flex;
margin-top: 5px; align-items: center;
color: #303133;
font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', Arial, sans-serif;
font-size: 13px;
.history {
display: flex;
align-items: center;
}
}
}
.ms-full-screen {
margin-top: 0px;
}
} }
#fab { #fab {
@ -2759,11 +2778,15 @@ export default {
height: 20px; height: 20px;
float: right; float: right;
} }
.ml-10 {
.ms-message-right { margin-left: 10px;
margin-right: 10px; }
.ml-5 {
margin-left: 5px;
}
.mt-2 {
margin-top: 2px;
} }
.custom-node_e { .custom-node_e {
color: #7c3985; color: #7c3985;
font-size: 20px; font-size: 20px;

1
api-test/frontend/src/business/automation/scenario/maximize/MaximizeScenario.vue
View File

@ -1457,6 +1457,7 @@ export default {
height: 36px; height: 36px;
background-color: #fff; background-color: #fff;
font-size: 12px; font-size: 12px;
padding-left: 5px;
} }
.ms-div { .ms-div {