From 7f6eb671e3adaa3579f6127e2d202159cc8bfb63 Mon Sep 17 00:00:00 2001
From: haha <lj7788@126.com>
Date: Fri, 26 Jul 2024 23:55:09 +0800
Subject: [PATCH] update code

---
 .env.development                            |   4 +-
 src/views/connection/edit.vue               | 819 ++++++++++----------
 src/views/connection/editFlow.vue           | 238 +++---
 src/views/simulationEvaluation/addStep2.vue |   2 +-
 src/views/simulationEvaluation/addStep3.vue |   7 +-
 5 files changed, 549 insertions(+), 521 deletions(-)

diff --git a/.env.development b/.env.development
index acfda19..151dc2e 100644
--- a/.env.development
+++ b/.env.development
@@ -3,9 +3,9 @@ VITE_APP_PORT = 3000
 
 # 代理前缀
 VITE_APP_BASE_API = '/api'
-# VITE_APP_API_URL = http://62.234.3.186/mk/ai/api
+VITE_APP_API_URL = http://62.234.3.186/mk/ai/api
 # 线上接口地址
-VITE_APP_API_URL = http://10.5.1.137:8800
+#VITE_APP_API_URL = http://10.5.1.137:8800
 # 开发接口地址
 # VITE_APP_API_URL = http://localhost:8989
 
diff --git a/src/views/connection/edit.vue b/src/views/connection/edit.vue
index ef6a077..4f52e26 100644
--- a/src/views/connection/edit.vue
+++ b/src/views/connection/edit.vue
@@ -1,124 +1,127 @@
 <template>
-    <div class="app-container connection-edit">
-        <el-card>
-            <template #header>
-                互联信息</template>
+  <div class="app-container connection-edit">
+    <el-card>
+      <template #header>
+        互联信息</template>
 
-            <el-form ref="editForm" :model="upForm" :rules="upRules" label-width="120">
-                <el-row>
-                    <el-col :span="12">
-                        <el-form-item label="模型名称">
-                            <el-input disabled v-model="upForm.model_name" placeholder="目标分类模型" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="模型版本">
-                            <el-input disabled v-model="upForm.model_version" placeholder="v1.0" />
-                        </el-form-item>
-                    </el-col>
-                </el-row>
-                <el-row>
-                    <el-col :span="12">
-                        <el-form-item label="互联名称" prop="connection_name">
-                            <el-input v-model="upForm.connection_name" placeholder="请输入互联名称" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="标签" prop="connection_label">
-                            <el-input v-model="upForm.connection_label" placeholder="请输入标签" />
-                        </el-form-item>
-                    </el-col>
-                </el-row>
-                <el-row>
-                    <el-col :span="24">
-                        <el-form-item label="互联说明" prop="connection_desc">
-                            <el-input v-model="upForm.connection_desc" type="textarea" style="width:100%;" :rows="4"
-                                placeholder="请输入互联说明" />
-                        </el-form-item>
-                    </el-col>
+      <el-form ref="editForm" :model="upForm" :rules="upRules" label-width="120">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="模型名称">
+              <el-input disabled v-model="upForm.model_name" placeholder="目标分类模型" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="模型版本">
+              <el-input disabled v-model="upForm.model_version" placeholder="v1.0" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="互联名称" prop="connection_name">
+              <el-input v-model="upForm.connection_name" placeholder="请输入互联名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="标签" prop="connection_label">
+              <el-input v-model="upForm.connection_label" placeholder="请输入标签" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="互联说明" prop="connection_desc">
+              <el-input v-model="upForm.connection_desc" type="textarea" style="width:100%;" :rows="4"
+                placeholder="请输入互联说明" />
+            </el-form-item>
+          </el-col>
 
-                </el-row>
-            </el-form>
-        </el-card>
-        <el-card style="margin-top: 12px;margin-bottom: 80px;" class="flow-card">
-            <template #header>算子互联</template>
-            <div class="edit-content" style="position: relative;">
-                <div class="item" style="position: relative;width:380px;">
-                    <div class="line-arrow"
-                        style="position: absolute;left: 100%;margin-left:10px; width: 80px;border-bottom: solid 1px #409eff;top: 250px;">
-                        <i-ep-arrow-right style="color:#409eff;position: absolute;right: -7px;top: -9px;" />
-                    </div>
-                    <div class="div-title" style="display: none;">
-                        <i-ep-office-building /><span>可用算子</span>
-                    </div>
-                    <div class="div-nodes">
-                        <nodePanel :lf="lf" ref="ndPanel" />
-                    </div>
-                </div>
-                <div style="flex-grow: 1;">
-                    <editFlow ref="edFlow" @initLf="doInitLf" @updateNode="doUpdateNode" @nodeClick="doNodeClick" />
-                </div>
-                <div class="item flow-info" style="margin-left: 100px;" v-if="selNode.info">
-                    <div class="div-title">
-                        <i-ep-document /><span>算子基本信息</span>
-                    </div>
-                    <div class="div-info">
-                        <div class="row">
-                            <span class="sp-label">算子名称:</span>
-                            <span class="sp-text">{{ selNode.info.operator_name }}</span>
-                        </div>
-                        <div class="row">
-                            <span class="sp-label">算子版本:</span>
-                            <span class="sp-text">{{ selNode.info.operator_version }}</span>
-                        </div>
-                        <div class="row">
-                            <span class="sp-label">算子说明:</span>
-                            <span class="sp-text">{{ selNode.info.operator_desc }}</span>
-                        </div>
-                        <div class="row" v-if="selNode.info.parameters && selNode.info.parameters.inputs">
-                            <span class="sp-label">输入参数:</span>
-                            <div class="div-param">
-                            <div v-if="selNode.info.parameters.inputs.length>1" class="div-navs">
-                                <span v-for="(it,idx) in selNode.info.parameters.inputs" @click="doInputSelected(idx)" :key="idx" class="sp-nav" :class="it.selected?'active':''">{{ it.input_id }}</span>
-                            </div>
-                            <span class="sp-text  sp-paramter scroll" @click="doEdit(selNode.info, '输入参数', 'i')">                                
-                                <span v-for="(it, idx) in selNode.info.parameters.inputs " :key="idx" v-show="it.selected"
-                                    class="param-item">
-                                    <paramShow :paramInfo="it"></paramShow>
-                                </span>
-                            </span>
-                            </div>
-                        </div>
-                        <div class="row" style="margin-top:4px;" v-if="selNode.info.parameters && selNode.info.parameters.outputs">
-                            <span class="sp-label">输出参数:</span>
-                            <div class="div-param" >
-                            <div v-if="selNode.info.parameters.outputs.length>1" class="div-navs">
-                                <span v-for="(it,idx) in selNode.info.parameters.outputs" @click="doOutputSelected(idx)"  :key="idx" class="sp-nav" :class="it.selected?'active':''">{{ it.output_id }}</span>
-                            </div>
-                                <span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info, '输出参数', 'o')">                               
-                                    <span v-for="(it, idx) in selNode.info.parameters.outputs " :key="idx" v-show="it.selected"
-                                        class="param-item">
-                                        <paramShow :paramInfo="it"></paramShow>
-                                    </span>
-                                </span>
-                            </div>
-                        </div>
-                        <div class="row" style="margin-top:4px;" v-if="selNode.info.parameters && selNode.info.parameters.process">
-                            <span class="sp-label">处理参数:</span>
-                            <span class="sp-text  sp-paramter scroll" @click="doEdit(selNode.info, '处理参数', 'p')" v-if="selNode.info.parameters.process">
-                                <paramShow :paramInfo="selNode.info.parameters.process"></paramShow>
-                            </span>
-                        </div>
-                    </div>
-                </div>
+        </el-row>
+      </el-form>
+    </el-card>
+    <el-card style="margin-top: 12px;margin-bottom: 80px;" class="flow-card">
+      <template #header>算子互联</template>
+      <div class="edit-content" style="position: relative;">
+        <div class="item" style="position: relative;width:380px;">
+          <div class="line-arrow"
+            style="position: absolute;left: 100%;margin-left:10px; width: 80px;border-bottom: solid 1px #409eff;top: 250px;">
+            <i-ep-arrow-right style="color:#409eff;position: absolute;right: -7px;top: -9px;" />
+          </div>
+          <div class="div-title" style="display: none;">
+            <i-ep-office-building /><span>可用算子</span>
+          </div>
+          <div class="div-nodes">
+            <nodePanel :lf="lf" ref="ndPanel" />
+          </div>
+        </div>
+        <div style="flex-grow: 1;">
+          <editFlow ref="edFlow" @initLf="doInitLf" @updateNode="doUpdateNode" @nodeClick="doNodeClick" />
+        </div>
+        <div class="item flow-info" style="margin-left: 100px;" v-if="selNode.info">
+          <div class="div-title">
+            <i-ep-document /><span>算子基本信息</span>
+          </div>
+          <div class="div-info">
+            <div class="row">
+              <span class="sp-label">算子名称:</span>
+              <span class="sp-text">{{ selNode.info.operator_name }}</span>
             </div>
-        </el-card>
-        <el-card class="card-footer">
-            <el-button type="primary" @click="doSave">保存</el-button>
-            <el-button @click="doCancel">取消</el-button>
-        </el-card>
-        <EditParamDlg ref="editDlg" @success="doEditSuccess" />
-    </div>
+            <div class="row">
+              <span class="sp-label">算子版本:</span>
+              <span class="sp-text">{{ selNode.info.operator_version }}</span>
+            </div>
+            <div class="row">
+              <span class="sp-label">算子说明:</span>
+              <span class="sp-text">{{ selNode.info.operator_desc }}</span>
+            </div>
+            <div class="row" v-if="selNode.info.parameters && selNode.info.parameters.inputs">
+              <span class="sp-label">输入参数:</span>
+              <div class="div-param">
+                <div v-if="selNode.info.parameters.inputs.length > 1" class="div-navs">
+                  <span v-for="(it, idx) in selNode.info.parameters.inputs" @click="doInputSelected(idx)" :key="idx"
+                    class="sp-nav" :class="it.selected ? 'active' : ''">{{ it.input_id }}</span>
+                </div>
+                <span class="sp-text  sp-paramter scroll" @click="doEdit(selNode.info, '输入参数', 'i')">
+                  <span v-for="(it, idx) in selNode.info.parameters.inputs " :key="idx" v-show="it.selected"
+                    class="param-item">
+                    <paramShow :paramInfo="it"></paramShow>
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div class="row" style="margin-top:4px;" v-if="selNode.info.parameters && selNode.info.parameters.outputs">
+              <span class="sp-label">输出参数:</span>
+              <div class="div-param">
+                <div v-if="selNode.info.parameters.outputs.length > 1" class="div-navs">
+                  <span v-for="(it, idx) in selNode.info.parameters.outputs" @click="doOutputSelected(idx)" :key="idx"
+                    class="sp-nav" :class="it.selected ? 'active' : ''">{{ it.output_id }}</span>
+                </div>
+                <span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info, '输出参数', 'o')">
+                  <span v-for="(it, idx) in selNode.info.parameters.outputs " :key="idx" v-show="it.selected"
+                    class="param-item">
+                    <paramShow :paramInfo="it"></paramShow>
+                  </span>
+                </span>
+              </div>
+            </div>
+            <div class="row" style="margin-top:4px;" v-if="selNode.info.parameters && selNode.info.parameters.process">
+              <span class="sp-label">处理参数:</span>
+              <span class="sp-text  sp-paramter scroll" @click="doEdit(selNode.info, '处理参数', 'p')"
+                v-if="selNode.info.parameters.process">
+                <paramShow :paramInfo="selNode.info.parameters.process"></paramShow>
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-card>
+    <el-card class="card-footer">
+      <el-button type="primary" @click="doSave">保存</el-button>
+      <el-button @click="doCancel">取消</el-button>
+    </el-card>
+    <EditParamDlg ref="editDlg" @success="doEditSuccess" />
+  </div>
 </template>
 
 <script setup>
@@ -131,354 +134,366 @@ const router = useRouter();
 const editForm = ref(ElForm)
 const route = useRoute()
 const upForm = reactive({
-    model_name: '',
-    model_version: '',
-    connection_name: '',
-    connection_label: '',
-    connection_desc: ''
+  model_name: '',
+  model_version: '',
+  connection_name: '',
+  connection_label: '',
+  connection_desc: ''
 });
 const upRules = computed(() => {
-    return {
-        connection_name: [{ required: true, trigger: "blur", message: "请输入互联名称", },],
-        connection_label: [{ required: true, trigger: "blur", message: "请输入标签", },],
-        connection_desc: [{ required: true, trigger: "blur", message: "请输入互联说明", },],
-    }
+  return {
+    connection_name: [{ required: true, trigger: "blur", message: "请输入互联名称", },],
+    connection_label: [{ required: true, trigger: "blur", message: "请输入标签", },],
+    connection_desc: [{ required: true, trigger: "blur", message: "请输入互联说明", },],
+  }
 });
 const editDlg = ref()
 const info = reactive({
-    connInfo: null,
-    nodes: [],
-    editObj: null,
+  connInfo: null,
+  nodes: [],
+  editObj: null,
 })
 const selNode = reactive({
-    info: null,
-    node:null,
+  info: null,
+  node: null,
 })
 let lf = ref(null)
 let edFlow = ref()
 const ndPanel = ref()
-const doOutputSelected=idx=>{
-    selNode.info.parameters.outputs.forEach((it,i)=>{
-        it.selected=i==idx;
-    });
+const doOutputSelected = idx => {
+  selNode.info.parameters.outputs.forEach((it, i) => {
+    it.selected = i == idx;
+  });
 }
-const doInputSelected=idx=>{
-    selNode.info.parameters.inputs.forEach((it,i)=>{
-        it.selected=i==idx;
-    });
+const doInputSelected = idx => {
+  selNode.info.parameters.inputs.forEach((it, i) => {
+    it.selected = i == idx;
+  });
 }
 const doEditSuccess = (obj) => {
-    let t = info.editObj.type;    
-    if (t == 'i') {
-        obj.forEach(o=>{
-            let cobjs=selNode.info.parameters.inputs.filter(d=>d.input_id==o.id);
-            if(cobjs.length>0){
-                let cobj=cobjs[0];
-                o.attrs.forEach(oo=>{
-                    if(oo.name=="oper_inout_data_type"){
-                        cobj.oper_inout_data_type=oo.value;
-                    }else{
-                        cobj[oo.name].value=oo.value;
-                    }
-                });
-            }
-        })
-    }
-    if (t == 'o') {
-        obj.forEach(o=>{
-            let cobjs=selNode.info.parameters.outputs.filter(d=>d.output_id==o.id);
-            if(cobjs.length>0){
-                let cobj=cobjs[0];
-                o.attrs.forEach(oo=>{
-                    if(oo.name=="oper_inout_data_type"){
-                        cobj.oper_inout_data_type=oo.value;
-                    }else{
-                        cobj[oo.name].value=oo.value;
-                    }
-                });
-            }
-        })
-    }
-    if (t == 'p') {
-        obj[0].attrs.forEach(o=>{
-            selNode.info.parameters.process[o.name]["value"]=o.value;
+  let t = info.editObj.type;
+  if (t == 'i') {
+    obj.forEach(o => {
+      let cobjs = selNode.info.parameters.inputs.filter(d => d.input_id == o.id);
+      if (cobjs.length > 0) {
+        let cobj = cobjs[0];
+        o.attrs.forEach(oo => {
+          if (oo.name == "oper_inout_data_type") {
+            cobj.oper_inout_data_type = oo.value;
+          } else {
+            cobj[oo.name].value = oo.value;
+          }
         });
-    }
-    let tmps = info.nodes.filter(d => d.id == selNode.info.id);
-    if (tmps.length == 0) {
-        info.nodes.push(selNode.info)
-    } else {
-        tmps[0].inputs = selNode.info.parameters.inputs;
-        tmps[0].outputs = selNode.info.parameters.outputs;
-        tmps[0].process = selNode.info.parameters.process;
-    }
-    edFlow.value.updateNode(selNode.info,selNode.node);
+      }
+    })
+  }
+  if (t == 'o') {
+    obj.forEach(o => {
+      let cobjs = selNode.info.parameters.outputs.filter(d => d.output_id == o.id);
+      if (cobjs.length > 0) {
+        let cobj = cobjs[0];
+        o.attrs.forEach(oo => {
+          if (oo.name == "oper_inout_data_type") {
+            cobj.oper_inout_data_type = oo.value;
+          } else {
+            cobj[oo.name].value = oo.value;
+          }
+        });
+      }
+    })
+  }
+  if (t == 'p') {
+    obj[0].attrs.forEach(o => {
+      selNode.info.parameters.process[o.name]["value"] = o.value;
+    });
+  }
+  let tmps = info.nodes.filter(d => d.id == selNode.info.id);
+  if (tmps.length == 0) {
+    info.nodes.push(selNode.info)
+  } else {
+    tmps[0].inputs = selNode.info.parameters.inputs;
+    tmps[0].outputs = selNode.info.parameters.outputs;
+    tmps[0].process = selNode.info.parameters.process;
+  }
+  edFlow.value.updateNode(selNode.info, selNode.node);
 };
 const doEdit = (obj, title, t) => {
-    info.editObj = {
-        obj: obj,
-        title: title,
-        type: t
-    }
-    editDlg.value.showDialog({
-        type:t,
-        obj: t == 'i' ? obj.parameters.inputs : t == 'o' ? obj.parameters.outputs : obj.parameters.process,
-        title: title
-    });
+  info.editObj = {
+    obj: obj,
+    title: title,
+    type: t
+  }
+  editDlg.value.showDialog({
+    type: t,
+    obj: t == 'i' ? obj.parameters.inputs : t == 'o' ? obj.parameters.outputs : obj.parameters.process,
+    title: title
+  });
 }
 const objToArr = (obj, t) => {
-    let arr = [];
-    for (let k in obj) {
-        arr.push({ key: k, value: obj[k] })
-    }
-    return arr;
+  let arr = [];
+  for (let k in obj) {
+    arr.push({ key: k, value: obj[k] })
+  }
+  return arr;
 }
 const doUpdateNode = (data) => {
-    if (ndPanel && ndPanel.value) {
-        ndPanel.value.updateNode(data)
-    }
+  if (ndPanel && ndPanel.value) {
+    ndPanel.value.updateNode(data)
+  }
 }
-const doNodeClick = (node) => {    
-    if (node) {        
-        selNode.info = node.data.properties.data;      
-        selNode.node=node; 
-        let tmps = info.nodes.filter(d => d.id == selNode.info.id);
-        if (tmps.length == 0) {
-            info.nodes.push(selNode.info);
-        } else {
-            selNode.info.parameters.inputs = tmps[0].parameters.inputs;
-            selNode.info.parameters.outputs = tmps[0].parameters.outputs;
-            selNode.info.parameters.process = tmps[0].parameters.process;
-        }
-
-        selNode.info.parameters.inputs.forEach(d=>{
-            d.selected=false;
-        });
-        selNode.info.parameters.outputs.forEach(d=>{
-            d.selected=false;
-        });
-        if(selNode.info.parameters.inputs.length>0){
-            selNode.info.parameters.inputs[0].selected=true;
-        }
-        if(selNode.info.parameters.outputs.length>0){
-            selNode.info.parameters.outputs[0].selected=true;
-        }
-
+const doNodeClick = (node) => {
+  if (node) {
+    selNode.info = node.data.properties.data;
+    selNode.node = node;
+    let tmps = info.nodes.filter(d => d.id == selNode.info.id);
+    if (tmps.length == 0) {
+      info.nodes.push(selNode.info);
+    } else {
+      selNode.info.parameters.inputs = tmps[0].parameters.inputs;
+      selNode.info.parameters.outputs = tmps[0].parameters.outputs;
+      selNode.info.parameters.process = tmps[0].parameters.process;
     }
-    else {
-        selNode.info = null;
+
+    selNode.info.parameters.inputs.forEach(d => {
+      d.selected = false;
+    });
+    selNode.info.parameters.outputs.forEach(d => {
+      d.selected = false;
+    });
+    if (selNode.info.parameters.inputs.length > 0) {
+      selNode.info.parameters.inputs[0].selected = true;
     }
+    if (selNode.info.parameters.outputs.length > 0) {
+      selNode.info.parameters.outputs[0].selected = true;
+    }
+
+  }
+  else {
+    selNode.info = null;
+  }
 }
 const doInitLf = (o) => {
-    lf.value = o.value
+  lf.value = o.value
 }
 const doSave = () => {
-    let flowData = lf.value.getGraphData();    
-    if (flowData.nodes.length < 3) {
-        ElMessage.error("请绘制算子互联流程图!");
-        return;
+  let flowData = lf.value.getGraphData();
+  if (flowData.nodes.length < 3) {
+    ElMessage.error("请绘制算子互联流程图!");
+    return;
+  }
+  let isNoConnect = false;
+  let nodeObj = {};
+  let operator_list = [];
+  flowData.nodes.forEach(n => {
+    nodeObj[n.id] = n.properties.data;
+    let node = info.nodes.filter(nd => nd.id == n.properties.data.id);
+    let oper = {
+      operator_id: n.properties.data.id,
+      parameters: {}
     }
-    let isNoConnect=false;    
-    let nodeObj={};
-    let operator_list=[];
-    flowData.nodes.forEach(n=>{
-        nodeObj[n.id]=n.properties.data;
-        let node=info.nodes.filter(nd=>nd.id==n.properties.data.id);
-        let oper={
-            operator_id:n.properties.data.id,
-            parameters:{}
-        }
-        if(node.length>0){
-            oper.parameters.inputs=node[0].inputs;
-            oper.parameters.outputs=node[0].outputs;
-            oper.parameters.process=node[0].process;
-        }   
-        operator_list.push(oper);
-        let tmps=flowData.edges.filter(e=>e.sourceNodeId==n.id||e.targetNodeId==n.id);
-        if(tmps.length==0){
-            isNoConnect=true;
-        }
-    });    
-
-    if(isNoConnect){
-        ElMessage.error("请在流程图中连接各个算子!");
-        return;
+    if (node.length > 0) {
+      oper.parameters.inputs = node[0].inputs;
+      oper.parameters.outputs = node[0].outputs;
+      oper.parameters.process = node[0].process;
     }
-    let operator_connection_list=[];
-    flowData.edges.forEach(e=>{
-        operator_connection_list.push({
-            start_oper_id:nodeObj[e.sourceNodeId].id,
-            end_oper_id:nodeObj[e.targetNodeId].id,
-        });
-    });
-    editForm.value?.validate(valid => {
-        if (valid) {
-            let postData={
-                connection_name:upForm.connection_name,
-                connection_label:upForm.connection_label,
-                connection_desc:upForm.connection_desc,
-                operator_list:operator_list,
-                operator_connection_list:operator_connection_list,
-                operator_connection_nodes:flowData.nodes,
-                operator_connection_edges:flowData.edges
-            };
-            ConnApi.add(postData).then(d=>{
-                if(d.data.code==0){
-                    ElMessage.success("增加模型成功!");
-                    router.push({ path: "/connection/index" })
-                }
-            });
+    operator_list.push(oper);
+    let tmps = flowData.edges.filter(e => e.sourceNodeId == n.id || e.targetNodeId == n.id);
+    if (tmps.length == 0) {
+      isNoConnect = true;
+    }
+  });
 
-        }
+  if (isNoConnect) {
+    ElMessage.error("请在流程图中连接各个算子!");
+    return;
+  }
+  let operator_connection_list = [];
+  flowData.edges.forEach(e => {
+    operator_connection_list.push({
+      start_oper_id: nodeObj[e.sourceNodeId].id,
+      end_oper_id: nodeObj[e.targetNodeId].id,
     });
+  });
+  operator_list = flowData.nodes.map(it => it.properties.data);
+  operator_connection_list = flowData.edges.map(it => {
+    let obj = {
+      start_oper_id: nodeObj[it.sourceNodeId].id,
+      end_oper_id: nodeObj[it.targetNodeId].id,
+      start_oper_output_id: it.properties.sourceAnchorId,
+      end_oper_input_id: it.properties.targetAnchorId,
+    };
+    return obj;
+  })
+  editForm.value?.validate(valid => {
+    if (valid) {
+      let postData = {
+        connection_name: upForm.connection_name,
+        connection_label: upForm.connection_label,
+        connection_desc: upForm.connection_desc,
+        operator_list: operator_list,
+        operator_connection_list: operator_connection_list,
+        operator_connection_nodes: flowData.nodes,
+        operator_connection_edges: flowData.edges
+      };
+      ConnApi.add(postData).then(d => {
+        if (d.data.code == 0) {
+          ElMessage.success("增加模型成功!");
+          router.push({ path: "/connection/index" })
+        }
+      });
+
+    }
+  });
 
 }
 const doCancel = () => {
-    router.push({ path: "/connection/index" })
+  router.push({ path: "/connection/index" })
 }
 const initData = () => {
-    let id = route.query.id;
-    ConnApi.detail(id).then(d => {
-        info.connInfo = d.data?.data || {};
-        upForm.model_name = info.connInfo.model_name;
-        upForm.model_version = info.connInfo.model_version;
-        upForm.model_name = info.connInfo.model_name;
-        upForm.model_name = info.connInfo.model_name;
-    });
+  let id = route.query.id;
+  ConnApi.detail(id).then(d => {
+    info.connInfo = d.data?.data || {};
+    upForm.model_name = info.connInfo.model_name;
+    upForm.model_version = info.connInfo.model_version;
+    upForm.model_name = info.connInfo.model_name;
+    upForm.model_name = info.connInfo.model_name;
+  });
 };
 onMounted(() => {
-    initData();
-    window.xapp = getCurrentInstance();
+  initData();
+  window.xapp = getCurrentInstance();
 });
 </script>
 <style scoped lang='scss'>
 .connection-edit {
-    :deep(.el-card__header) {
-        padding: 8px 12px;
-        display: flex;
-        align-items: center;
-        font-weight: bold;
-    }
+  :deep(.el-card__header) {
+    padding: 8px 12px;
+    display: flex;
+    align-items: center;
+    font-weight: bold;
+  }
 
-    :deep(.anchors-end) {
-        fill: red;
-    }
+  :deep(.anchors-end) {
+    fill: red;
+  }
 
-    :deep(.anchors-start) {
-        fill: green;
-    }
+  :deep(.anchors-start) {
+    fill: green;
+  }
 
-    .sp-paramter {
-        height: 100px;
-        border: solid 1px #409EFF;
-        overflow-y: auto;
-        padding: 4px;
-        cursor: pointer;
+  .sp-paramter {
+    height: 100px;
+    border: solid 1px #409EFF;
+    overflow-y: auto;
+    padding: 4px;
+    cursor: pointer;
 
-        .param-item {
-            display: block;
-        }
+    .param-item {
+      display: block;
     }
+  }
 }
 
 .card-footer {
-    position: fixed;
-    width: calc(100% - 215px);
-    bottom: 0px;
+  position: fixed;
+  width: calc(100% - 215px);
+  bottom: 0px;
 
-    :deep(.el-card__body) {
-        padding: 10px;
+  :deep(.el-card__body) {
+    padding: 10px;
 
-        .el-pagination {
-            justify-content: end;
-        }
+    .el-pagination {
+      justify-content: end;
     }
+  }
 }
 
 .flow-card {
-    :deep(.el-card__body) {
-        padding: 0px;
-    }
+  :deep(.el-card__body) {
+    padding: 0px;
+  }
 }
 
 .edit-content {
-    display: flex;
+  display: flex;
 
-    .item {
-        width: 300px;
+  .item {
+    width: 300px;
 
-        &.flow-info {
-            position: absolute;
-            top: 10px;
-            right: 10px;
-            background: #fff;
+    &.flow-info {
+      position: absolute;
+      top: 10px;
+      right: 10px;
+      background: #fff;
 
-            .div-info {
-                min-height: unset;
-                height: auto;
-            }
-        }
-
-        .div-title {
-            color: #409EFF;
-            display: flex;
-            align-items: center;
-            font-size: 12px;
-        }
-
-        .div-nodes {
-            border: solid 1px #409EFF;
-            min-height: 600px;
-            height: 600px;
-
-            :deep(.el-tabs--border-card) {
-                border: none;
-            }
-        }
-
-        .div-chart {
-            border: solid 1px #409EFF;
-            min-height: 600px;
-            height: 600px;
-        }
-
-        .div-info {
-            border: dotted 1px #409EFF;
-            min-height: 600px;
-            height: 600px;
-            padding: 10px;
-            font-size: 12px;
-
-            .row {
-                display: flex;
-
-                .sp-label {
-                    color: #888;
-                    display: block;
-                    white-space: nowrap;
-                }
-
-                .sp-text {
-                    flex-grow: 1;
-                    display: block;
-                    margin-left:4px;
-                }
-                .div-param{
-                    .div-navs{
-                        .sp-nav{
-                            display: inline-block;
-                            line-height:24px;
-                            padding:0px 12px;
-                            cursor: pointer;
-                            &.active{
-                                background-color: #409EFF;
-                                color:#fff;
-                            }
-                        }
-                    }
-                }
-            }
-        }
+      .div-info {
+        min-height: unset;
+        height: auto;
+      }
     }
+
+    .div-title {
+      color: #409EFF;
+      display: flex;
+      align-items: center;
+      font-size: 12px;
+    }
+
+    .div-nodes {
+      border: solid 1px #409EFF;
+      min-height: 600px;
+      height: 600px;
+
+      :deep(.el-tabs--border-card) {
+        border: none;
+      }
+    }
+
+    .div-chart {
+      border: solid 1px #409EFF;
+      min-height: 600px;
+      height: 600px;
+    }
+
+    .div-info {
+      border: dotted 1px #409EFF;
+      min-height: 600px;
+      height: 600px;
+      padding: 10px;
+      font-size: 12px;
+
+      .row {
+        display: flex;
+
+        .sp-label {
+          color: #888;
+          display: block;
+          white-space: nowrap;
+        }
+
+        .sp-text {
+          flex-grow: 1;
+          display: block;
+          margin-left: 4px;
+        }
+
+        .div-param {
+          .div-navs {
+            .sp-nav {
+              display: inline-block;
+              line-height: 24px;
+              padding: 0px 12px;
+              cursor: pointer;
+
+              &.active {
+                background-color: #409EFF;
+                color: #fff;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/connection/editFlow.vue b/src/views/connection/editFlow.vue
index a5dffe1..85d82f1 100644
--- a/src/views/connection/editFlow.vue
+++ b/src/views/connection/editFlow.vue
@@ -1,7 +1,7 @@
 <template>
-    <div class="flow-demo1">
-        <div ref="flow" class="viewport" id="flowMain" />
-    </div>
+  <div class="flow-demo1">
+    <div ref="flow" class="viewport" id="flowMain" />
+  </div>
 </template>
 
 <script setup>
@@ -11,28 +11,28 @@ import '@logicflow/core/dist/style/index.css';
 import { Menu } from "@logicflow/extension";
 import AiNodeExtension from '@/components/flow/index'
 import RegisteMenu from '@/components/flow/menu.js'
-const emit=defineEmits(["initLf","updateNode","nodeClick"])
+const emit = defineEmits(["initLf", "updateNode", "nodeClick"])
 const themeApprove = {
-    rect: { // 矩形样式
-        radius: 8,
-        stroke: '#3CB371'
-    },
-    circle: {
-        r: 25,
-        stroke: '#FF6347'
-    },
-    polygon: {
-        stroke: '#6495ED',
-    },
-    polyline: {
-        strokeWidth: 1,
-        stroke: '#6495ED'
-    },
-    edgeText: {
-        background: {
-            fill: 'white',
-        },
+  rect: { // 矩形样式
+    radius: 8,
+    stroke: '#3CB371'
+  },
+  circle: {
+    r: 25,
+    stroke: '#FF6347'
+  },
+  polygon: {
+    stroke: '#6495ED',
+  },
+  polyline: {
+    strokeWidth: 1,
+    stroke: '#6495ED'
+  },
+  edgeText: {
+    background: {
+      fill: 'white',
     },
+  },
 }
 
 const config = {
@@ -48,141 +48,155 @@ const config = {
   },
   keyboard: { enabled: true },
   style: themeApprove,
-  plugins: [AiNodeExtension,Menu]
+  plugins: [AiNodeExtension, Menu]
 };
 const flow = ref()
 let lf = ref(null)
-let showProp=ref(false)
-let nodeData=reactive(null)
-let nodePropKey=ref(1)
-const initEvent=(lf)=>{
-  lf.on("blank:click",node=>{    
-    emit("nodeClick",null)
+let showProp = ref(false)
+let nodeData = reactive(null)
+let nodePropKey = ref(1)
+const initEvent = (lf) => {
+  lf.on("blank:click", node => {
+    emit("nodeClick", null)
   });
-  lf.on("element:click",node=>{
-    nodeData=node.data
-    showProp.value=true
+  lf.on("element:click", node => {
+    nodeData = node.data
+    showProp.value = true
     nodePropKey.value++
-    emit("nodeClick",node)
+    emit("nodeClick", node)
   });
-  lf.on("node:dnd-add",data=>{    
-    nodeData=data.data;
-    showProp.value=true
+  lf.on("node:dnd-add", data => {
+    nodeData = data.data;
+    showProp.value = true
     nodePropKey.value++
     doUpdateState()
   });
-  lf.on("connection:not-allowed",(a,b,c)=>{    
-    if(a.msg=="不允许添加连线"){
+  lf.on("anchor:dragend", (a, b, c) => {
+    updateEdges(a, b, c);
+  });
+  lf.on("connection:not-allowed", (a, b, c) => {
+    if (a.msg == "不允许添加连线") {
       ElMessage.error("开始结点只能连接结束节点!");
-    }else{
+    } else {
       ElMessage.error(a.msg);
     }
   });
-  lf.on("node:delete",data=>{
-    if(data.data.text.value=="目标绘图"){
-      ElMessage.error("目标绘图节点不能删除");      
+  lf.on("node:delete", data => {
+    if (data.data.text.value == "目标绘图") {
+      ElMessage.error("目标绘图节点不能删除");
       setTimeout(() => {
-            lf.undo();
-          }, 400);
+        lf.undo();
+      }, 400);
       return;
     }
     doUpdateState()
   });
-  lf.on("node:contextmenu",(d)=>{
-    if(d.data.text.value=="目标绘图"){
-      setTimeout(()=>{
-        document.querySelector(".lf-menu").style.display="none";
-      },0)
+  lf.on("node:contextmenu", (d) => {
+    if (d.data.text.value == "目标绘图") {
+      setTimeout(() => {
+        document.querySelector(".lf-menu").style.display = "none";
+      }, 0)
     }
   });
 }
-const doEdit=(n)=>{
+const updateEdges = (a, b, c) => {
+  let edges = lf.value.getGraphData().edges.filter(d => d.sourceNodeId == a.edgeModel.sourceNodeId && d.targetNodeId == a.edgeModel.targetNodeId);
+  if (edges.length > 0) {
+    //edges[0].properties.edgeModel = a.edgeModel
+    lf.value.setProperties(edges[0].id, {
+      sourceAnchorId: a.edgeModel.sourceAnchorId.split("_")[0],
+      targetAnchorId: a.edgeModel.targetAnchorId.split("_")[0],
+    })
+  }
+
 }
-const doUpdateState=()=>{  
+const doEdit = (n) => {
+}
+const doUpdateState = () => {
   //nodePanel.value.updateNode(lf.value.getGraphData());
-    emit("updateNode",lf.value.getGraphData())
+  emit("updateNode", lf.value.getGraphData())
 }
 
-const getFlowData=()=>{
+const getFlowData = () => {
   return lf.value.getGraphData();
 }
 onMounted(() => {
-    const logicFlow = new LogicFlow({
-        ...config,
-        container: flow.value
-    })
-    lf.value = logicFlow
-    logicFlow.setDefaultEdgeType("ai-link");
-    RegisteMenu(logicFlow)
-    initEvent(logicFlow);
-    emit("initLf",lf);
-    window.lf = lf;
-    logicFlow.render({
+  const logicFlow = new LogicFlow({
+    ...config,
+    container: flow.value
+  })
+  lf.value = logicFlow
+  logicFlow.setDefaultEdgeType("ai-link");
+  RegisteMenu(logicFlow)
+  initEvent(logicFlow);
+  emit("initLf", lf);
+  window.lf = lf;
+  logicFlow.render({
     nodes: [],
     edges: []
   })
-  doUpdateState();  
+  doUpdateState();
 });
-const updateNode=(info,node)=>{
-  lf.value.setProperties(node.data.id,{
-    data:info
+const updateNode = (info, node) => {
+  lf.value.setProperties(node.data.id, {
+    data: info
   })
 }
 defineExpose({
-  doEdit,    
+  doEdit,
   getFlowData,
   updateNode
 })
 </script>
 <style scoped lang='scss'>
 .flow-demo1 {
-    height: 100%;
+  height: 100%;
+  overflow: hidden;
+  padding: 0px;
+
+  .viewport {
+    height: 600px;
     overflow: hidden;
-    padding: 0px;
+  }
 
-    .viewport {
-        height: 600px;
-        overflow: hidden;
+  .custom-anchor {
+    stroke: #999;
+    stroke-width: 1;
+    fill: #d9d9d9;
+    cursor: crosshair;
+    rx: 3;
+    ry: 3;
+  }
+
+  .custom-anchor:hover {
+    fill: #ff7f0e;
+    stroke: #ff7f0e;
+  }
+
+  .flow-card {
+    height: 80%;
+    width: calc(100% - 450px);
+
+    .el-card__body {
+      height: 100%;
+      padding: 4px;
     }
 
-    .custom-anchor {
-        stroke: #999;
-        stroke-width: 1;
-        fill: #d9d9d9;
-        cursor: crosshair;
-        rx: 3;
-        ry: 3;
+    margin: 0px 12px;
+  }
+
+  .node-panel {
+    width: 240px;
+
+    .el-tabs__item {
+      padding: 0px 10px !important;
     }
+  }
 
-    .custom-anchor:hover {
-        fill: #ff7f0e;
-        stroke: #ff7f0e;
-    }
-
-    .flow-card {
-        height: 80%;
-        width: calc(100% - 450px);
-
-        .el-card__body {
-            height: 100%;
-            padding: 4px;
-        }
-
-        margin: 0px 12px;
-    }
-
-    .node-panel {
-        width: 240px;
-
-        .el-tabs__item {
-            padding: 0px 10px !important;
-        }
-    }
-
-    .card-prop {
-        height: 300px;
-        width: 200px;
-        min-width: 200px;
-    }
+  .card-prop {
+    height: 300px;
+    width: 200px;
+    min-width: 200px;
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/views/simulationEvaluation/addStep2.vue b/src/views/simulationEvaluation/addStep2.vue
index ec01236..90d4ff0 100644
--- a/src/views/simulationEvaluation/addStep2.vue
+++ b/src/views/simulationEvaluation/addStep2.vue
@@ -53,7 +53,7 @@ function handleQuery(a) {
   //ElMessage.success("查询成功");
   loading.value = true;
   connApi.list(queryParams).then(d => {
-    loading.value = false; debugger
+    loading.value = false; 
     info.data = (d.data?.data?.connection_list || []).map(it => {
 
       it.id = it.model_id;
diff --git a/src/views/simulationEvaluation/addStep3.vue b/src/views/simulationEvaluation/addStep3.vue
index 96d2309..b82a437 100644
--- a/src/views/simulationEvaluation/addStep3.vue
+++ b/src/views/simulationEvaluation/addStep3.vue
@@ -10,7 +10,7 @@
         <span>模型类型:</span>
         <span>{{
           modelInfo.modl_main_type_name + "/" + modelInfo.modl_sub_type_name
-        }}</span>
+          }}</span>
       </el-col>
       <el-col :span="8">
         <span>互联名称:</span>
@@ -50,14 +50,14 @@
         <template #default="scope">
           <span class="args-state state-2 command" @click.stop="doChoice(scope.row)">{{
             scope.row.tool_params_name ? scope.row.tool_params_name : "请选择"
-          }}</span>
+            }}</span>
         </template>
       </el-table-column>
       <el-table-column label="设备状态" align="center" width="100">
         <template #default="scope">
           <span :class="'device-state state-'">{{
             scope.row.available ? "可用" : "不可用"
-          }}</span>
+            }}</span>
         </template>
       </el-table-column>
     </el-table>
@@ -117,7 +117,6 @@ const doChoiceSuccess = item => {
 function handleQuery() {
   loading.value = true;
   let m = props.modelInfo;
-  debugger
   taskApi
     .availableDevices({
       connection_id: m.connection_id,