test/MeterSphere
1
0
Fork 0
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git synced 2024-12-03 12:39:12 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

refactor(接口测试): 场景步骤重构优化

Browse Source
This commit is contained in:
fit2-zhao 2022-03-04 17:45:32 +08:00 committed by fit2-zhao
parent 5b104fc009
commit e66d1de772
3 changed files with 150 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
frontend/src/business/components/api/automation/scenario/EditApiScenario.vue
View File

@ -196,39 +196,47 @@
@node-expand="nodeExpand"
@node-collapse="nodeCollapse"
:allow-drop="allowDrop" @node-drag-end="allowDrag" @node-click="nodeClick" draggable ref="stepTree" v-if="showHideTree">
<span class="custom-tree-node father" slot-scope="{node, data}" style="width: 96%">
<!-- 步骤组件-->
<ms-component-config
:scenario-definition="scenarioDefinition"
:message="message"
:type="data.type"
:scenario="data"
:response="response"
:currentScenario="currentScenario"
:expandedNode="expandedNode"
:currentEnvironmentId="currentEnvironmentId"
:node="node"
:project-list="projectList"
:env-map="projectEnvMap"
:env-group-id="envGroupId"
:environment-type="environmentType"
@remove="remove"
@copyRow="copyRow"
@suggestClick="suggestClick"
@refReload="refReload"
@runScenario="runDebug"
@stopScenario="stop"
@setDomain="setDomain"
@openScenario="openScenario"
@editScenarioAdvance="editScenarioAdvance"
v-if="stepFilter.get('ALlSamplerStep').indexOf(data.type) ===-1
|| (!node.parent || !node.parent.data || stepFilter.get('AllSamplerProxy').indexOf(node.parent.data.type) === -1)"/>
<div v-else class="el-tree-node is-hidden is-focusable is-leaf" style="display: none;">
{{ hideNode(node) }}
</div>
</span>
<el-row class="custom-tree-node" :gutter="18" type="flex" align="middle" slot-scope="{node, data}" style="width: 100%">
<el-col class="custom-tree-node-col" style="padding-left:0px;padding-right:0px" v-if="node && data.hashTree && data.hashTree.length > 0 && !data.isLeaf">
<span v-if="!node.expanded" class="el-icon-circle-plus-outline custom-node_e" @click="openOrClose(node)"/>
<span v-else class="el-icon-remove-outline custom-node_e" @click="openOrClose(node)"/>
</el-col>
<el-col class="custom-tree-node-col" style="padding-left:0px;padding-right:0px" v-else>
</el-col>
<el-col>
<!-- 步骤组件-->
<ms-component-config
:scenario-definition="scenarioDefinition"
:message="message"
:type="data.type"
:scenario="data"
:response="response"
:currentScenario="currentScenario"
:expandedNode="expandedNode"
:currentEnvironmentId="currentEnvironmentId"
:node="node"
:project-list="projectList"
:env-map="projectEnvMap"
:env-group-id="envGroupId"
:environment-type="environmentType"
@remove="remove"
@copyRow="copyRow"
@suggestClick="suggestClick"
@refReload="refReload"
@runScenario="runDebug"
@stopScenario="stop"
@setDomain="setDomain"
@openScenario="openScenario"
@editScenarioAdvance="editScenarioAdvance"
v-if="stepFilter.get('ALlSamplerStep').indexOf(data.type) ===-1
|| (!node.parent || !node.parent.data || stepFilter.get('AllSamplerProxy').indexOf(node.parent.data.type) === -1)"
/>
<div v-else class="el-tree-node is-hidden is-focusable is-leaf" style="display: none;">
{{ hideNode(node) }}
</div>
</el-col>
</el-row>
</el-tree>
</div>
</el-col>
@ -443,6 +451,7 @@ export default {
showConfigButtonWithOutPermission: false,
props: {
label: "label",
isLeaf: "isLeaf",
children: "hashTree"
},
moduleObj: {
@ -601,6 +610,14 @@ export default {
}
},
methods: {
openOrClose(node) {
node.expanded = !node.expanded;
if (node.expanded) {
this.nodeExpand(node.data);
} else {
this.nodeCollapse(node.data);
}
},
hideNode(node) {
node.isLeaf = true;
node.visible = false;
@ -608,15 +625,14 @@ export default {
hideTreeNode(node, array) {
let isLeaf = true;
array.forEach(item => {
if (!item.isLeaf && !isLeaf) {
if (this.stepFilter.get('ALlSamplerStep').indexOf(item.type) === -1) {
isLeaf = false;
}
if (item.childNodes && item.childNodes.length > 0) {
this.hideTreeNode(item, item.childNodes);
if (item.hashTree && item.hashTree.length > 0) {
this.hideTreeNode(item, item.hashTree);
}
})
node.isLeaf = isLeaf;
node.clazzName = '.is-leaf';
},
currentUser: () => {
return getCurrentUser();
@ -655,9 +671,6 @@ export default {
} else {
this.$store.state.currentApiCase = {resetDataSource: getUUID()};
}
if (this.$refs.stepTree && this.$refs.stepTree.root && this.$refs.stepTree.root.childNodes) {
this.hideTreeNode(this.$refs.stepTree.root, this.$refs.stepTree.root.childNodes);
}
}
}
})
@ -1106,6 +1119,7 @@ export default {
// 添加debug结果
stepArray[i].parentIndex = fullPath ? fullPath + "_" + stepArray[i].index : stepArray[i].index;
if (stepArray[i].hashTree && stepArray[i].hashTree.length > 0) {
this.hideTreeNode(stepArray[i], stepArray[i].hashTree);
this.stepSize += stepArray[i].hashTree.length;
this.sort(stepArray[i].hashTree, stepArray[i].projectId, stepArray[i].parentIndex);
}
@ -1530,9 +1544,6 @@ export default {
this.resetResourceId(this.scenarioDefinition);
}
this.$store.state.scenarioMap.set(this.currentScenario.id, 0);
if (this.$refs.stepTree && this.$refs.stepTree.root && this.$refs.stepTree.root.childNodes) {
this.hideTreeNode(this.$refs.stepTree.root, this.$refs.stepTree.root.childNodes);
}
})
}
},
@ -2002,8 +2013,9 @@ export default {
}
.ms-tree >>> .el-icon-caret-right:before {
content: '\e723';
font-size: 20px;
/*content: '\e723';*/
padding: 0;
content: "";
}
.ms-tree >>> .el-tree-node__expand-icon.is-leaf {
@ -2016,8 +2028,9 @@ export default {
.ms-tree >>> .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
color: #7C3985;
content: "\e722";
font-size: 20px;
/* content: "\e722";*/
padding: 0;
content: "";
}
.ms-sc-variable-header >>> .el-dialog__body {
@ -2081,4 +2094,13 @@ export default {
z-index: 999;
}
.custom-node_e {
color: #7C3985;
font-size: 20px;
}
.custom-tree-node-col {
width: 20px;
padding: 0px;
}
</style>

7
frontend/src/business/components/api/automation/scenario/common/ApiBaseComponent.vue
View File

@ -32,10 +32,11 @@
<slot name="message"></slot>
<slot name="debugStepCode"></slot>
<el-tooltip :content="$t('test_resource_pool.enable_disable')" placement="top" v-if="showBtn">
<el-switch v-model="data.enable" class="enable-switch" size="mini" :disabled="data.disabled && !data.root&&!showVersion" style="width: 30px"/>
<el-switch v-model="data.enable" class="enable-switch" size="mini" :disabled="(data.disabled && !data.root) || !showVersion" style="width: 30px"/>
</el-tooltip>
<slot name="button" v-if="showVersion"></slot>
<el-button v-if="showVersion" size="mini" icon="el-icon-copy-document" circle @click="copyRow" style="padding: 5px" :disabled="data.disabled && !data.root"/>
<slot name="button"></slot>
<el-button v-if="showVersion" size="mini" icon="el-icon-copy-document" circle @click="copyRow" style="padding: 5px"
:disabled="(data.disabled && !data.root) || !showVersion "/>
<el-button v-if="showVersion && stepFilter.get('ALlSamplerStep').indexOf(data.type) !==-1" size="mini" icon="el-icon-delete" type="danger" style="padding: 5px" circle @click="remove"/>
<step-extend-btns style="display: contents"

103
frontend/src/business/components/api/automation/scenario/maximize/MaximizeScenario.vue
View File

@ -34,26 +34,40 @@
highlight-current
@node-expand="nodeExpand"
@node-collapse="nodeCollapse"
:allow-drop="allowDrop" @node-drag-end="allowDrag" @node-click="nodeClick">
<span class="custom-tree-node father" slot-scope="{ node, data}" style="width: 96%">
:allow-drop="allowDrop" @node-drag-end="allowDrag" @node-click="nodeClick" class="ms-tree">
<el-row class="custom-tree-node" :gutter="18" type="flex" align="middle" slot-scope="{node, data}" style="width: 100%">
<el-col class="custom-tree-node-col" style="padding-left:0px;padding-right:0px" v-if="node && data.hashTree && data.hashTree.length > 0 && !data.isLeaf">
<span v-if="!node.expanded" class="el-icon-circle-plus-outline custom-node_e" @click="openOrClose(node)"/>
<span v-else class="el-icon-remove-outline custom-node_e" @click="openOrClose(node)"/>
</el-col>
<el-col class="custom-tree-node-col" style="padding-left:0px;padding-right:0px" v-else>
</el-col>
<el-col>
<!-- 步骤组件-->
<ms-component-config
:isMax="true"
:type="data.type"
:scenario="data"
:response="response"
:currentScenario="currentScenario"
:currentEnvironmentId="currentEnvironmentId"
:node="node"
:project-list="projectList"
:env-map="projectEnvMap"
:message="message"
@remove="remove" @copyRow="copyRow"
@runScenario="runScenario"
@stopScenario="stopScenario"
@suggestClick="suggestClick"
@refReload="refReload" @openScenario="openScenario"/>
</span>
<ms-component-config
:isMax="true"
:type="data.type"
:scenario="data"
:response="response"
:currentScenario="currentScenario"
:currentEnvironmentId="currentEnvironmentId"
:node="node"
:project-list="projectList"
:env-map="projectEnvMap"
:message="message"
@remove="remove" @copyRow="copyRow"
@runScenario="runScenario"
@stopScenario="stopScenario"
@suggestClick="suggestClick"
@refReload="refReload" @openScenario="openScenario"
v-if="stepFilter.get('ALlSamplerStep').indexOf(data.type) ===-1
|| (!node.parent || !node.parent.data || stepFilter.get('AllSamplerProxy').indexOf(node.parent.data.type) === -1)"
/>
<div v-else class="el-tree-node is-hidden is-focusable is-leaf" style="display: none;">
{{ hideNode(node) }}
</div>
</el-col>
</el-row>
</el-tree>
<div @click="fabClick">
<vue-fab id="fab" mainBtnColor="#783887" size="small" :global-options="globalOptions"
@ -109,7 +123,7 @@
:draggable="false"
@remove="remove" @copyRow="copyRow" @suggestClick="suggestClick"
@refReload="refReload" @openScenario="openScenario"
v-if="selectedTreeNode && selectedNode"/>
v-if="selectedTreeNode && selectedNode && stepFilter.get('ALlSamplerStep').indexOf(item.type) ===-1"/>
</div>
</div>
</div>
@ -414,6 +428,7 @@ export default {
arr[i].projectId = scenarioProjectId ? scenarioProjectId : this.projectId;
}
if (arr[i].hashTree != undefined && arr[i].hashTree.length > 0) {
this.hideTreeNode(arr[i], arr[i].hashTree);
this.recursiveSorting(arr[i].hashTree, arr[i].projectId);
}
// 添加debug结果
@ -422,6 +437,30 @@ export default {
}
}
},
openOrClose(node) {
node.expanded = !node.expanded;
if (node.expanded) {
this.nodeExpand(node.data);
} else {
this.nodeCollapse(node.data);
}
},
hideNode(node) {
node.isLeaf = true;
node.visible = false;
},
hideTreeNode(node, array) {
let isLeaf = true;
array.forEach(item => {
if (this.stepFilter.get('ALlSamplerStep').indexOf(item.type) === -1) {
isLeaf = false;
}
if (item.hashTree && item.hashTree.length > 0) {
this.hideTreeNode(item, item.hashTree);
}
})
node.isLeaf = isLeaf;
},
sort() {
for (let i in this.scenarioDefinition) {
// 排序
@ -437,6 +476,7 @@ export default {
}
if (this.scenarioDefinition[i].hashTree != undefined && this.scenarioDefinition[i].hashTree.length > 0) {
this.hideTreeNode(this.scenarioDefinition[i], this.scenarioDefinition[i].hashTree);
this.recursiveSorting(this.scenarioDefinition[i].hashTree, this.scenarioDefinition[i].projectId);
}
// 添加debug结果
@ -899,7 +939,7 @@ export default {
runScenario(scenario) {
this.$emit('runScenario', scenario);
},
stopScenario(){
stopScenario() {
this.$emit('stopScenario');
},
editScenarioAdvance(data) {
@ -996,14 +1036,16 @@ export default {
z-index: 9;
}
.ms-tree >>> .el-tree-node__expand-icon.expanded {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
.ms-tree >>> .el-icon-caret-right:before {
content: '\e723';
font-size: 20px;
/*content: '\e723';*/
padding: 0;
content: "";
}
.ms-tree >>> .el-tree-node__expand-icon.is-leaf {
@ -1016,8 +1058,9 @@ export default {
.ms-tree >>> .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
color: #7C3985;
content: "\e722";
font-size: 20px;
/* content: "\e722";*/
padding: 0;
content: "";
}
.ms-sc-variable-header >>> .el-dialog__body {
@ -1092,4 +1135,14 @@ export default {
.ms-aside-container {
height: calc(100vh - 50px) !important;
}
.custom-node_e {
color: #7C3985;
font-size: 20px;
}
.custom-tree-node-col {
width: 20px;
padding: 0px;
}
</style>