fix(接口自动化) 修复场景步骤收起问题

【【github#6454】场景的步骤展开后,无法“一键收起”】
https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001006910
This commit is contained in:
fit2-zhao 2021-09-26 10:36:14 +08:00 committed by fit2-zhao
parent 62f00ae020
commit ab3c42e2f0
3 changed files with 61 additions and 103 deletions

View File

@ -196,7 +196,7 @@
highlight-current highlight-current
@node-expand="nodeExpand" @node-expand="nodeExpand"
@node-collapse="nodeCollapse" @node-collapse="nodeCollapse"
:allow-drop="allowDrop" @node-drag-end="allowDrag" @node-click="nodeClick" draggable ref="stepTree"> :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%"> <span class="custom-tree-node father" slot-scope="{ node, data}" style="width: 96%">
<!-- 步骤组件--> <!-- 步骤组件-->
<ms-component-config <ms-component-config
@ -405,6 +405,7 @@ export default {
levels: PRIORITY, levels: PRIORITY,
scenario: {}, scenario: {},
loading: false, loading: false,
showHideTree: true,
apiListVisible: false, apiListVisible: false,
customizeVisible: false, customizeVisible: false,
isBtnHide: false, isBtnHide: false,
@ -1120,6 +1121,12 @@ export default {
this.loading = false this.loading = false
}); });
}, },
showHide() {
this.showHideTree = false
this.$nextTick(() => {
this.showHideTree = true
});
},
runDebug() { runDebug() {
if (this.scenarioDefinition.length < 1) { if (this.scenarioDefinition.length < 1) {
return; return;
@ -1221,7 +1228,6 @@ export default {
allowDrag(draggingNode, dropNode, dropType) { allowDrag(draggingNode, dropNode, dropType) {
if (dropNode && draggingNode && dropType) { if (dropNode && draggingNode && dropType) {
this.sort(); this.sort();
this.reload();
} }
}, },
nodeExpand(data, node) { nodeExpand(data, node) {
@ -1494,7 +1500,7 @@ export default {
this.expandedStatus = false; this.expandedStatus = false;
this.expandedNode = []; this.expandedNode = [];
this.changeNodeStatus(this.scenarioDefinition); this.changeNodeStatus(this.scenarioDefinition);
this.reload(); this.showHide();
}, },
stepStatus(nodes) { stepStatus(nodes) {
for (let i in nodes) { for (let i in nodes) {

View File

@ -60,29 +60,7 @@
</script> </script>
<style scoped> <style scoped>
.width-100 {
width: 40%
}
.ms-api-col {
background-color: #F2F9EE;
border-color: #67C23A;
margin-right: 10px;
color: #67C23A;
}
.ms-title-buttion {
background-color: #F2F9EE;
color: #67C23A;
margin-right: 20px;
}
/deep/ .el-card__body {
padding: 15px;
}
.time-input { .time-input {
width: 30%; width: 30%;
/*margin-left: 20px;*/
} }
</style> </style>

View File

@ -33,7 +33,7 @@
highlight-current highlight-current
@node-expand="nodeExpand" @node-expand="nodeExpand"
@node-collapse="nodeCollapse" @node-collapse="nodeCollapse"
:allow-drop="allowDrop" @node-drag-end="allowDrag" @node-click="nodeClick" v-if="!loading" draggable> :allow-drop="allowDrop" @node-drag-end="allowDrag" @node-click="nodeClick" draggable v-if="showHideTree">
<span class="custom-tree-node father" slot-scope="{ node, data}"> <span class="custom-tree-node father" slot-scope="{ node, data}">
<!-- 步骤组件--> <!-- 步骤组件-->
<ms-component-config <ms-component-config
@ -218,6 +218,7 @@ export default {
levels: PRIORITY, levels: PRIORITY,
scenario: {}, scenario: {},
loading: false, loading: false,
showHideTree: true,
apiListVisible: false, apiListVisible: false,
customizeVisible: false, customizeVisible: false,
scenarioVisible: false, scenarioVisible: false,
@ -551,8 +552,13 @@ export default {
} }
this.sort(); this.sort();
this.reload(); this.reload();
} },
, showHide() {
this.showHideTree = false
this.$nextTick(() => {
this.showHideTree = true
});
},
reload() { reload() {
this.loading = true this.loading = true
this.$nextTick(() => { this.$nextTick(() => {
@ -642,7 +648,6 @@ export default {
allowDrag(draggingNode, dropNode, dropType) { allowDrag(draggingNode, dropNode, dropType) {
if (dropNode && draggingNode && dropType) { if (dropNode && draggingNode && dropType) {
this.sort(); this.sort();
this.reload();
} }
}, },
nodeExpand(data) { nodeExpand(data) {
@ -818,30 +823,12 @@ export default {
this.debugResult = result; this.debugResult = result;
this.sort() this.sort()
}, },
shrinkTreeNode() {
//
for (let i in this.scenarioDefinition) {
if (i > 30 && this.expandedStatus) {
continue;
}
if (this.scenarioDefinition[i]) {
if (this.expandedStatus) {
this.expandedNode.push(this.scenarioDefinition[i].resourceId);
}
this.scenarioDefinition[i].active = this.expandedStatus;
if (this.scenarioDefinition[i].hashTree && this.scenarioDefinition[i].hashTree.length > 0) {
this.changeNodeStatus(this.scenarioDefinition[i].hashTree);
}
}
}
},
changeNodeStatus(nodes) { changeNodeStatus(nodes) {
for (let i in nodes) { for (let i in nodes) {
if (nodes[i]) { if (nodes[i]) {
if (this.expandedStatus) { if (this.expandedStatus) {
this.expandedNode.push(nodes[i].resourceId); this.expandedNode.push(nodes[i].resourceId);
} }
nodes[i].active = this.expandedStatus;
if (nodes[i].hashTree != undefined && nodes[i].hashTree.length > 0) { if (nodes[i].hashTree != undefined && nodes[i].hashTree.length > 0) {
this.changeNodeStatus(nodes[i].hashTree); this.changeNodeStatus(nodes[i].hashTree);
} }
@ -849,28 +836,15 @@ export default {
} }
}, },
openExpansion() { openExpansion() {
if (this.scenarioDefinition && this.scenarioDefinition.length > 30) {
this.$alert(this.$t('api_test.definition.request.step_message'), '', {
confirmButtonText: this.$t('commons.confirm'),
callback: (action) => {
if (action === 'confirm') {
this.expandedNode = []; this.expandedNode = [];
this.expandedStatus = true; this.expandedStatus = true;
this.shrinkTreeNode(); this.changeNodeStatus(this.scenarioDefinition);
}
}
});
} else {
this.expandedNode = [];
this.expandedStatus = true;
this.shrinkTreeNode();
}
}, },
closeExpansion() { closeExpansion() {
this.expandedStatus = false; this.expandedStatus = false;
this.expandedNode = []; this.expandedNode = [];
this.shrinkTreeNode(); this.changeNodeStatus(this.scenarioDefinition);
this.reload(); this.showHide();
}, },
stepNode() { stepNode() {
// //