update code

main
haha 2024-07-10 00:04:23 +08:00
parent 9668e29ad9
commit 62ced44829
4 changed files with 131 additions and 54 deletions

View File

@ -95,7 +95,7 @@ class RedNode extends RectNode {
viewBox:"0 0 1139 1024" ,
width:20,
height:20,
x: x - 10,
x: x - 8,
y: y - 16,
},
h("path",{

View File

@ -4,7 +4,7 @@
<template #header>
互联信息</template>
<el-form ref="uploadForm" :model="upForm" label-width="120">
<el-form ref="editForm" :model="upForm" :rules="upRules" label-width="120">
<el-row>
<el-col :span="12">
<el-form-item label="模型名称">
@ -19,19 +19,19 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="互联名称">
<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="标签">
<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="互联说明">
<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>
@ -77,8 +77,9 @@
</div>
<div class="row">
<span class="sp-label">输入参数:</span>
<span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info,'输入参数','i')">
<span v-for="(it,idx) in objToArr(selNode.info.inputParams) " :key="idx" class="param-item">
<span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info, '输入参数', 'i')">
<span v-for="(it, idx) in objToArr(selNode.info.inputParams) " :key="idx"
class="param-item">
<span>{{ it.key }}:</span>
<span>{{ it.value }}</span>
</span>
@ -86,8 +87,9 @@
</div>
<div class="row" style="margin-top:4px;">
<span class="sp-label">输出参数:</span>
<span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info,'输出参数','o')">
<span v-for="(it,idx) in objToArr(selNode.info.outputParams) " :key="idx" class="param-item">
<span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info, '输出参数', 'o')">
<span v-for="(it, idx) in objToArr(selNode.info.outputParams) " :key="idx"
class="param-item">
<span>{{ it.key }}:</span>
<span>{{ it.value }}</span>
</span>
@ -95,8 +97,8 @@
</div>
<div class="row" style="margin-top:4px;">
<span class="sp-label">处理参数:</span>
<span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info,'处理参数','p')">
<span v-for="(it,idx) in objToArr(selNode.info.process) " :key="idx" class="param-item">
<span class="sp-text sp-paramter scroll" @click="doEdit(selNode.info, '处理参数', 'p')">
<span v-for="(it, idx) in objToArr(selNode.info.processParams) " :key="idx" class="param-item">
<span>{{ it.key }}:</span>
<span>{{ it.value }}</span>
</span>
@ -110,7 +112,7 @@
<el-button type="primary" @click="doSave"></el-button>
<el-button @click="doCancel"></el-button>
</el-card>
<EditParamDlg ref="editDlg" @success="doEditSuccess"/>
<EditParamDlg ref="editDlg" @success="doEditSuccess" />
</div>
</template>
@ -120,7 +122,7 @@ import editFlow from './editFlow.vue'
import ConnApi from '@/api/connection'
import EditParamDlg from './editParamDlg.vue'
const router = useRouter();
const uploadForm = ref(ElForm)
const editForm = ref(ElForm)
const route = useRoute()
const upForm = reactive({
model_name: '',
@ -129,11 +131,18 @@ const upForm = reactive({
connection_label: '',
connection_desc: ''
});
const editDlg=ref()
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: "请输入互联说明", },],
}
});
const editDlg = ref()
const info = reactive({
connInfo: null,
nodes: [],
editObj:null,
editObj: null,
})
const selNode = reactive({
info: null
@ -148,20 +157,20 @@ const doFlowInput = () => {
} else {
tmps[0].inputParams = selNode.info.inputParams;
tmps[0].outputParams = selNode.info.outputParams;
tmps[0].process = selNode.info.process;
tmps[0].processParams = selNode.info.processParams;
}
}
const doEditSuccess=(obj)=>{
let t=info.editObj.type;
if(t=='i'){
selNode.info.inputParams=obj;
const doEditSuccess = (obj) => {
let t = info.editObj.type;
if (t == 'i') {
selNode.info.inputParams = obj;
}
if(t=='o'){
selNode.info.outputParams=obj;
if (t == 'o') {
selNode.info.outputParams = obj;
}
if(t=='p'){
selNode.info.process=obj;
if (t == 'p') {
selNode.info.processParams = obj;
}
let tmps = info.nodes.filter(d => d.id == selNode.info.id);
if (tmps.length == 0) {
@ -169,24 +178,24 @@ const doEditSuccess=(obj)=>{
} else {
tmps[0].inputParams = selNode.info.inputParams;
tmps[0].outputParams = selNode.info.outputParams;
tmps[0].process = selNode.info.process;
tmps[0].processParams = selNode.info.processParams;
}
};
const doEdit=(obj,title,t)=>{
info.editObj={
obj:obj,
title:title,
type:t
const doEdit = (obj, title, t) => {
info.editObj = {
obj: obj,
title: title,
type: t
}
editDlg.value.showDialog({
obj:t=='i'?obj.inputParams:t=='o'?obj.outputParams:obj.process,
title:title
obj: t == 'i' ? obj.inputParams : t == 'o' ? obj.outputParams : obj.processParams,
title: title
});
}
const objToArr=(obj,t)=>{
let arr=[];
for(let k in obj){
arr.push({key:k,value:obj[k]})
const objToArr = (obj, t) => {
let arr = [];
for (let k in obj) {
arr.push({ key: k, value: obj[k] })
}
return arr;
}
@ -204,7 +213,7 @@ const doNodeClick = (node) => {
} else {
selNode.info.inputParams = tmps[0].inputParams;
selNode.info.outputParams = tmps[0].outputParams;
selNode.info.process = tmps[0].process;
selNode.info.processParams = tmps[0].processParams;
}
}
else {
@ -215,7 +224,66 @@ const doInitLf = (o) => {
lf.value = o.value
}
const doSave = () => {
router.replace({ path: "/connection/index" })
let flowData = lf.value.getGraphData();
if (flowData.nodes.length < 3) {
ElMessage.error("请绘制算子互联流程图!");
return;
}
debugger
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.inputParams=node[0].inputParams;
oper.parameters.outputParams=node[0].outputParams;
oper.parameters.processParams=node[0].processParams;
}
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,
});
});
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.replace({ path: "/connection/index" })
}
});
}
});
}
const doCancel = () => {
router.replace({ path: "/connection/index" })
@ -243,20 +311,24 @@ onMounted(() => {
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{
.sp-paramter {
height: 60px;
border:solid 1px #409EFF;
border: solid 1px #409EFF;
overflow-y: auto;
padding:4px;
padding: 4px;
cursor: pointer;
.param-item{
display:block;
.param-item {
display: block;
}
}
}

View File

@ -99,9 +99,10 @@ const doUpdateState=()=>{
//nodePanel.value.updateNode(lf.value.getGraphData());
emit("updateNode",lf.value.getGraphData())
}
defineExpose({
doEdit,
})
const getFLowData=()=>{
return lf.value.getGraphData();
}
onMounted(() => {
const logicFlow = new LogicFlow({
...config,
@ -142,8 +143,12 @@ onMounted(() => {
]
})
doUpdateState();
doUpdateState();
});
defineExpose({
doEdit,
getFLowData
})
</script>
<style scoped lang='scss'>
.flow-demo1 {

View File

@ -98,7 +98,7 @@ const doEdit=(nd)=>{
if(tmps.length>0){
tmps[0].inputParams=nd.inputParams;
tmps[0].outputParams=nd.inputParams;
tmps[0].process=nd.process;
tmps[0].processParams=nd.processParams;
}
}
defineExpose({
@ -117,7 +117,7 @@ const initData = () => {
a2:10,b2:20,c2:30,d2:40,e2:50,
};
it.outputParams={};
it.process={};
it.processParams={};
return it;
});
info.all=tmps;