sxyanzhu
/
AIManage
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/flow/nodes/BaseNode.js
View File

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

164
src/views/connection/edit.vue
View File

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

11
src/views/connection/editFlow.vue
View File

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

4
src/views/connection/nodePanel.vue
View File

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