From c76f10335ac0be1da34de8197cb117665a8bc62e Mon Sep 17 00:00:00 2001
From: liudianxin <liudianxin@bd-apaas.com>
Date: Mon, 17 Aug 2020 18:50:51 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B5=81=E7=A8=8B=E7=BC=96=E8=BE=91=E4=B8=80?=
 =?UTF-8?q?=E9=83=A8=E5=88=86=EF=BC=8C=E6=B5=81=E7=A8=8B=E5=9B=BE=E8=8A=82?=
 =?UTF-8?q?=E7=82=B9=E5=88=A0=E9=99=A4=E5=8A=9F=E8=83=BD=EF=BC=8C=E4=BE=A7?=
 =?UTF-8?q?=E8=BE=B9=E5=AF=BC=E8=88=AA=E6=A0=8F=E6=96=87=E6=9C=AC=E9=A2=9C?=
 =?UTF-8?q?=E8=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/imgs/lcsj_btn_node_delete.png      | Bin 0 -> 1479 bytes
 src/components/general/side-nav-bar-class.vue |   2 +-
 src/components/side-nav-bar.vue               |   2 +-
 src/components/work-flow/super-flow.vue       | 107 +++++++++++++++---
 .../process-design/edit.vue                   |   6 +-
 5 files changed, 98 insertions(+), 19 deletions(-)
 create mode 100644 src/assets/imgs/lcsj_btn_node_delete.png

diff --git a/src/assets/imgs/lcsj_btn_node_delete.png b/src/assets/imgs/lcsj_btn_node_delete.png
new file mode 100644
index 0000000000000000000000000000000000000000..a5890b34360b2d968221d7825f5459fc3d4cb82b
GIT binary patch
literal 1479
zcmaJ>eM}o=9KJwd1g?&u86Si3=9nAP(Yq^cfg9cWMWu!^WMtI12-mwS?Vxwv-9gJn
zX5k{+qE2Qsq7H3f&de+uVWLJEL)gMJ=tve9wkc%D5>S-58TOG4yfQ%l5HGoVKk_`!
z@A-Y?4wn=^r;JUBg&;_2E3}l#YeM*qiI%^+emGJtFUewoL)^)^L_f(hkdfw`46u30
zDyEbn>H59jGWie`nc*pOhz@%ZL2+Ic8OEprUZ2c{p#1FtA4yd+B5*QQ9#)Uce0?4P
z9$Jr-YweibXJ*`<!hJlmb6;^8wXd4Wqmk{~Kz@Lb1-y(%f`GS%6^MWyS<ofqefSzh
zzyd_9)+3KiIqW6C%<&A+s&rWtuE_;Cc`96|!LoH*fEvT|P%Ib4v$HUqz;uK*2P{5_
z9F3=4M5)EP7)w6s5w|G%2o&}E{VIR9isP$LJTFhyP@`&fmW;>}>RFKtWU)fVl7fX1
zDBj}}Jsb<dilmdP74?Yh^l=Ja-?A(#ES5<w7#bjbD6Yc7DJ=o*_Wy@^y~}7pEM@-j
z`=7!>S-p=zOBsQy<te#wu8eRfA7SPhQsnqDj;mR!Vu_m*Il;~OfLgW$GRr+I&H07R
z3k18Ju(5(jvJ_*p=n+{$<?+x&fhId!YtdQ@Fr5|03yemSMr$&etfm|zZc-aHOI!;_
z)p{9LT;kHpTphL|H#`eopB&l3@SZw`w(^`8EaXghR`z09QE!n;ujoZvup$?g&7k4V
z{;ShVSMvCTx65-YAC@PdVdZh><++~yrTjw(iXdzjV_D$3^Wpsb_DCYWgxecYdeZ>6
z-wO4=84RSypLyUr>q5U;Z>6PRv>Q4(Wti>@rl&&VMWMzV430=~u0F1d#LsksL~~tx
zo^-I|8L6uYbIkoAeF1Ns9dor3^BV?k+#NHRK586EbdMOnG?u)3400Z*$Wb<*^!CCH
zJ=2c1+f#RTG#~r*d-#L8rnEb24rLis)I@o;OTiy$R5a}VF?sEdCzwk5!VKE7Y5ew8
ztY$Py2TwrHZUi@BwPK=eD(yg}dFY%AOWpb?W&mnw{rGZG=lh=Ddtt=18<24=$w2Bi
z^nB*n8U6D5L;eTr&h_b#b<s}g!h@9jZyH*zpHc{|Vp8OAwLf@o{?>2kT!z%~$@;nS
z&nKg<fK$$Ecjrf@4rcB-J=$<T{dgiB9XG6bvE}He&m)<mo$7Zehi0>4I@TJhSZj}U
zb!v{9U+8GhgsJbEdS;*Whvo*?O`d;c{?)U_XniEkj_sG)V<yv@?>+49bHJn{7f+h(
z>V^j|hpc_lV0z`yCLk3zI$pXv+P^2}(pJFr!{#HwwpHvvcQE2c+EbOG;G@6pugZ;o
z<L47j#g;7*Lp>*?YoHtGhx_Wxww6$tGPbfSVFOk#nKWzO{>hjCqCz#nxZuS2otw?U
zuEK;%aL;>Juh^8S7lGEF-b0P_&a9m)dTrP1LkBnRZ-6G+ET=BUyhVoM`Ka-D_cq1T
pBNc{+NrzTP{+R+smCA%%C<cQhq0m`tH4KD*t+s+<%V|?()8F;A7PJ5W

literal 0
HcmV?d00001

diff --git a/src/components/general/side-nav-bar-class.vue b/src/components/general/side-nav-bar-class.vue
index 440a676..c371381 100644
--- a/src/components/general/side-nav-bar-class.vue
+++ b/src/components/general/side-nav-bar-class.vue
@@ -96,7 +96,7 @@ export default {
   border-left: 5px solid #0d1847;
   font-size: 14px;
   line-height: 24px;
-  color: #e6ebfe;
+  color: #6573ae;
   cursor: pointer;
 }
 .side_nav_bar_list > li:hover,
diff --git a/src/components/side-nav-bar.vue b/src/components/side-nav-bar.vue
index f4e2508..a918dae 100644
--- a/src/components/side-nav-bar.vue
+++ b/src/components/side-nav-bar.vue
@@ -78,7 +78,7 @@ export default {
   border-left: 5px solid #0d1847;
   font-size: 14px;
   line-height: 24px;
-  color: #e6ebfe;
+  color: #6573ae;
   cursor: pointer;
 }
 .side_nav_bar_list > li:hover,
diff --git a/src/components/work-flow/super-flow.vue b/src/components/work-flow/super-flow.vue
index 3bcf069..5a93e3c 100644
--- a/src/components/work-flow/super-flow.vue
+++ b/src/components/work-flow/super-flow.vue
@@ -35,16 +35,18 @@
         onLineColor="#94a8c8"
         :origin="origin"
       >
-        <template v-slot:node="{meta}">
+        <template v-slot:node="node">
           <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 }"
-            :id="meta.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="node.meta.id"
           >
             <div
               class="node_span"
-              @click="clickItem(meta.id)"
+              @click="clickItem(node.meta.id)"
               @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>
         </template>
       </super-flow>
@@ -792,9 +794,42 @@ export default {
         self.dialog_general = true;
       }
     },
-    showInterfacePlugin(query) {
-      if (this.checkNodeCouldEdit()) {
-        this.dialog_interface = true;
+    showInterfacePlugin() {
+      let self = this;
+      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) {
@@ -825,7 +860,6 @@ export default {
           });
         }
       }
-
       self.dialog_general = false;
     },
     clickTab() {},
@@ -914,8 +948,8 @@ export default {
       this.$api.workbench.fwzcFwcs(query).then((response) => {
         if (response.data.success == 1) {
           let data = response.data.data;
-          this.body_fields = data.body_fields;
-          this.param_fields = data.param_fields;
+          this.body_fields = data.body_fields || [];
+          this.param_fields = data.param_fields || [];
           if (data.body_fields && data.body_fields.length != 0) {
             this.datasQqcs = data.body_fields;
             this.dataType = "body";
@@ -933,7 +967,7 @@ export default {
         }
       });
     },
-    interfaceCancel() {
+    refleshItem() {
       this.serviceUrl = "";
       this.activeName = "0";
       this.sqfsVal = "";
@@ -949,6 +983,10 @@ export default {
       this.param_fields = [];
       this.request_fields = [];
       this.response_fields = [];
+      this.select = 1;
+    },
+    interfaceCancel() {
+      this.refleshItem();
       this.dialog_interface = false;
     },
     interfaceSubmit() {
@@ -1007,7 +1045,6 @@ export default {
               response_fields: JSON.stringify(self.response_fields),
             };
           }
-          console.log(self.nodeParamsList);
           self.interfaceCancel();
         } else if (this.requestRules != 0) {
           this.$message.error("请完善请求参数信息中的字段名称");
@@ -1112,6 +1149,28 @@ export default {
       });
       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>
@@ -1225,7 +1284,7 @@ export default {
     }
     .checked_item {
       margin-top: 20px;
-      cursor: pointer;
+      cursor: default;
       position: relative;
       &:hover {
         color: #515fe7;
@@ -1236,6 +1295,7 @@ export default {
       }
       .checked_item_del {
         position: absolute;
+        cursor: pointer;
         width: 12px;
         height: 12px;
         top: -4px;
@@ -1495,6 +1555,21 @@ export default {
     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 lang="less">
 .super-flow {
@@ -1518,6 +1593,7 @@ export default {
       border: solid 3px #109e93;
       background-color: #25bdb1;
       color: #ffffff;
+      position: relative;
     }
     .flow-node-end {
       width: 100%;
@@ -1528,6 +1604,7 @@ export default {
       background-color: #f78181;
       border: solid 3px #e86262;
       color: #ffffff;
+      position: relative;
     }
     .flow-node-default {
       width: 100%;
@@ -1537,6 +1614,7 @@ export default {
       border-radius: 8px;
       background-color: #fff;
       border: solid 3px #b4c6f5;
+      position: relative;
     }
     .flow-node-default-active {
       width: 100%;
@@ -1548,6 +1626,7 @@ export default {
       box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.8);
       background-color: #515fe7;
       color: #fff;
+      position: relative;
     }
   }
 }
diff --git a/src/pages/workbench/component-center/process-management/process-design/edit.vue b/src/pages/workbench/component-center/process-management/process-design/edit.vue
index 516c1bc..1b6be6f 100644
--- a/src/pages/workbench/component-center/process-management/process-design/edit.vue
+++ b/src/pages/workbench/component-center/process-management/process-design/edit.vue
@@ -58,7 +58,7 @@
           class="apaas_step"
         >
           <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">
               <el-button class="cancel" @click="cancel">取消</el-button>
               <div>
@@ -271,8 +271,8 @@ export default {
             this.basic_form.name = data.name;
             this.basic_form.workplace = data.workarea;
             this.basic_form.desc = data.describe;
-            this.node_list = [];
-            this.link_list = [];
+            this.node_list = data.nodeList;
+            this.link_list = data.linkList;
             this.node_params_list = [];
             this.node_list.forEach((item) => {
               item.meta.id =
-- 
2.26.0