Commit c76f1033 authored by 刘殿昕's avatar 刘殿昕

流程编辑一部分,流程图节点删除功能,侧边导航栏文本颜色

parent 2bf63b6e
...@@ -96,7 +96,7 @@ export default { ...@@ -96,7 +96,7 @@ export default {
border-left: 5px solid #0d1847; border-left: 5px solid #0d1847;
font-size: 14px; font-size: 14px;
line-height: 24px; line-height: 24px;
color: #e6ebfe; color: #6573ae;
cursor: pointer; cursor: pointer;
} }
.side_nav_bar_list > li:hover, .side_nav_bar_list > li:hover,
......
...@@ -78,7 +78,7 @@ export default { ...@@ -78,7 +78,7 @@ export default {
border-left: 5px solid #0d1847; border-left: 5px solid #0d1847;
font-size: 14px; font-size: 14px;
line-height: 24px; line-height: 24px;
color: #e6ebfe; color: #6573ae;
cursor: pointer; cursor: pointer;
} }
.side_nav_bar_list > li:hover, .side_nav_bar_list > li:hover,
......
...@@ -35,16 +35,18 @@ ...@@ -35,16 +35,18 @@
onLineColor="#94a8c8" onLineColor="#94a8c8"
:origin="origin" :origin="origin"
> >
<template v-slot:node="{meta}"> <template v-slot:node="node">
<div <div
:class="{'flow-node-begin': nodeParams(meta.id).type == 1, 'flow-node-end': nodeParams(meta.id).type == 2, 'flow-node-default': nodeParams(meta.id).type == 3 && meta.id != nodeItem.id, 'flow-node-default-active': nodeParams(meta.id).type == 3 && meta.id == nodeItem.id }" :class="{'flow-node-begin': nodeParams(node.meta.id).type == 1, 'flow-node-end': nodeParams(node.meta.id).type == 2, 'flow-node-default': nodeParams(node.meta.id).type == 3 && node.meta.id != nodeItem.id, 'flow-node-default-active': nodeParams(node.meta.id).type == 3 && node.meta.id == nodeItem.id }"
:id="meta.id" :id="node.meta.id"
> >
<div <div
class="node_span" class="node_span"
@click="clickItem(meta.id)" @click="clickItem(node.meta.id)"
@blur="blurItem" @blur="blurItem"
>{{nodeParams(meta.id).name}}</div> :title="nodeParams(node.meta.id).name"
>{{nodeParams(node.meta.id).name}}</div>
<div class="node_del" @click="delNode(node.meta.node_id)"></div>
</div> </div>
</template> </template>
</super-flow> </super-flow>
...@@ -792,9 +794,42 @@ export default { ...@@ -792,9 +794,42 @@ export default {
self.dialog_general = true; self.dialog_general = true;
} }
}, },
showInterfacePlugin(query) { showInterfacePlugin() {
if (this.checkNodeCouldEdit()) { let self = this;
this.dialog_interface = true; if (self.checkNodeCouldEdit()) {
let meta = self.nodeParamsList.find((item) => {
return item.id == self.nodeItem.id;
});
if (meta) {
let index = meta.plugins.findIndex((item) => {
return item.plugin_type === 1;
});
if (index !== -1) {
let data = meta.plugins[index];
let arr0 = JSON.parse(data.body_fields);
let arr1 = JSON.parse(data.query_fields);
let arr_res = JSON.parse(data.response_fields);
self.serviceUrl = data.url;
self.activeName = "0";
self.sqfsVal = data.auth_method;
self.tokenVal = data.auth_token;
self.noSearchUrl = "";
self.datasQqcs = arr0.length != 0 ? arr0 : arr1;
self.datasFhcs = arr_res;
self.resSuccess = true;
self.resultShow = true;
self.dataType = arr0.length != 0 ? "body" : "param";
self.body_fields = arr0;
self.param_fields = arr1;
self.select = data.req_type;
self.getUrl(self.serviceUrl);
} else {
self.refleshItem();
}
} else {
self.refleshItem();
}
self.dialog_interface = true;
} }
}, },
nodeParams(id) { nodeParams(id) {
...@@ -825,7 +860,6 @@ export default { ...@@ -825,7 +860,6 @@ export default {
}); });
} }
} }
self.dialog_general = false; self.dialog_general = false;
}, },
clickTab() {}, clickTab() {},
...@@ -914,8 +948,8 @@ export default { ...@@ -914,8 +948,8 @@ export default {
this.$api.workbench.fwzcFwcs(query).then((response) => { this.$api.workbench.fwzcFwcs(query).then((response) => {
if (response.data.success == 1) { if (response.data.success == 1) {
let data = response.data.data; let data = response.data.data;
this.body_fields = data.body_fields; this.body_fields = data.body_fields || [];
this.param_fields = data.param_fields; this.param_fields = data.param_fields || [];
if (data.body_fields && data.body_fields.length != 0) { if (data.body_fields && data.body_fields.length != 0) {
this.datasQqcs = data.body_fields; this.datasQqcs = data.body_fields;
this.dataType = "body"; this.dataType = "body";
...@@ -933,7 +967,7 @@ export default { ...@@ -933,7 +967,7 @@ export default {
} }
}); });
}, },
interfaceCancel() { refleshItem() {
this.serviceUrl = ""; this.serviceUrl = "";
this.activeName = "0"; this.activeName = "0";
this.sqfsVal = ""; this.sqfsVal = "";
...@@ -949,6 +983,10 @@ export default { ...@@ -949,6 +983,10 @@ export default {
this.param_fields = []; this.param_fields = [];
this.request_fields = []; this.request_fields = [];
this.response_fields = []; this.response_fields = [];
this.select = 1;
},
interfaceCancel() {
this.refleshItem();
this.dialog_interface = false; this.dialog_interface = false;
}, },
interfaceSubmit() { interfaceSubmit() {
...@@ -1007,7 +1045,6 @@ export default { ...@@ -1007,7 +1045,6 @@ export default {
response_fields: JSON.stringify(self.response_fields), response_fields: JSON.stringify(self.response_fields),
}; };
} }
console.log(self.nodeParamsList);
self.interfaceCancel(); self.interfaceCancel();
} else if (this.requestRules != 0) { } else if (this.requestRules != 0) {
this.$message.error("请完善请求参数信息中的字段名称"); this.$message.error("请完善请求参数信息中的字段名称");
...@@ -1112,6 +1149,28 @@ export default { ...@@ -1112,6 +1149,28 @@ export default {
}); });
this.nodeParamsList[index].plugins.split(plugin_index, 1); this.nodeParamsList[index].plugins.split(plugin_index, 1);
}, },
delNode(item) {
console.log(item);
let obj = this.$refs.superFlow.toJSON();
let nodes = obj.nodeList;
let links = obj.linkList;
for (let i = 0; i < nodes.length; i++) {
console.log(nodes[i]);
if (nodes[i].id == item) {
nodes.splice(i, 1);
}
}
for (let i = 0; i < links.length; i++) {
console.log(links[i]);
if (links[i].startId == item || links[i].endId == item) {
links.splice(i, 1);
i--;
}
}
this.nodeList = nodes;
this.linkList = links;
console.log(this.nodeList, this.linkList);
},
}, },
}; };
</script> </script>
...@@ -1225,7 +1284,7 @@ export default { ...@@ -1225,7 +1284,7 @@ export default {
} }
.checked_item { .checked_item {
margin-top: 20px; margin-top: 20px;
cursor: pointer; cursor: default;
position: relative; position: relative;
&:hover { &:hover {
color: #515fe7; color: #515fe7;
...@@ -1236,6 +1295,7 @@ export default { ...@@ -1236,6 +1295,7 @@ export default {
} }
.checked_item_del { .checked_item_del {
position: absolute; position: absolute;
cursor: pointer;
width: 12px; width: 12px;
height: 12px; height: 12px;
top: -4px; top: -4px;
...@@ -1495,6 +1555,21 @@ export default { ...@@ -1495,6 +1555,21 @@ export default {
padding: 0 20px; padding: 0 20px;
} }
} }
.node_del {
width: 18px;
height: 18px;
background: url("~@/assets/imgs/lcsj_btn_node_delete.png") no-repeat center
center;
cursor: pointer;
display: none;
position: absolute;
top: -12px;
right: -12px;
z-index: 1999;
}
.super-flow__node:hover .node_del {
display: block;
}
</style> </style>
<style lang="less"> <style lang="less">
.super-flow { .super-flow {
...@@ -1518,6 +1593,7 @@ export default { ...@@ -1518,6 +1593,7 @@ export default {
border: solid 3px #109e93; border: solid 3px #109e93;
background-color: #25bdb1; background-color: #25bdb1;
color: #ffffff; color: #ffffff;
position: relative;
} }
.flow-node-end { .flow-node-end {
width: 100%; width: 100%;
...@@ -1528,6 +1604,7 @@ export default { ...@@ -1528,6 +1604,7 @@ export default {
background-color: #f78181; background-color: #f78181;
border: solid 3px #e86262; border: solid 3px #e86262;
color: #ffffff; color: #ffffff;
position: relative;
} }
.flow-node-default { .flow-node-default {
width: 100%; width: 100%;
...@@ -1537,6 +1614,7 @@ export default { ...@@ -1537,6 +1614,7 @@ export default {
border-radius: 8px; border-radius: 8px;
background-color: #fff; background-color: #fff;
border: solid 3px #b4c6f5; border: solid 3px #b4c6f5;
position: relative;
} }
.flow-node-default-active { .flow-node-default-active {
width: 100%; width: 100%;
...@@ -1548,6 +1626,7 @@ export default { ...@@ -1548,6 +1626,7 @@ export default {
box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.8); box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.8);
background-color: #515fe7; background-color: #515fe7;
color: #fff; color: #fff;
position: relative;
} }
} }
} }
......
...@@ -58,7 +58,7 @@ ...@@ -58,7 +58,7 @@
class="apaas_step" class="apaas_step"
> >
<div class="step_in"> <div class="step_in">
<WorkFlow ref="workFlow" class="work_flow" /> <WorkFlow ref="workFlow" :node_list="node_list" :link_list="link_list" :node_params_list="node_params_list" class="work_flow" />
<div class="btn_footer"> <div class="btn_footer">
<el-button class="cancel" @click="cancel">取消</el-button> <el-button class="cancel" @click="cancel">取消</el-button>
<div> <div>
...@@ -271,8 +271,8 @@ export default { ...@@ -271,8 +271,8 @@ export default {
this.basic_form.name = data.name; this.basic_form.name = data.name;
this.basic_form.workplace = data.workarea; this.basic_form.workplace = data.workarea;
this.basic_form.desc = data.describe; this.basic_form.desc = data.describe;
this.node_list = []; this.node_list = data.nodeList;
this.link_list = []; this.link_list = data.linkList;
this.node_params_list = []; this.node_params_list = [];
this.node_list.forEach((item) => { this.node_list.forEach((item) => {
item.meta.id = item.meta.id =
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment