update 增加互联

main
haha 2024-08-02 23:37:42 +08:00
parent e3b440c689
commit 3f2741c473
6 changed files with 117 additions and 135 deletions

View File

@ -49,7 +49,6 @@ const download=(id)=>{
} }
//上传数据文件 //上传数据文件
const upload = (file) => { const upload = (file) => {
debugger
const formData = new FormData(); const formData = new FormData();
formData.append("file_name", file.name); formData.append("file_name", file.name);
formData.append("file_content",file) formData.append("file_content",file)

View File

@ -20,28 +20,23 @@
<span class="sp-title">互联名称:</span> <span class="sp-title">互联名称:</span>
<span class="sp-text">{{ info.data.connection_name }}</span> <span class="sp-text">{{ info.data.connection_name }}</span>
</td> </td>
<td style="width: 50%;">
<span class="sp-title">标签:</span>
<span class="sp-text">{{ info.data.connection_label }}</span>
</td>
</tr>
<tr>
<td style="width: 50%;"> <td style="width: 50%;">
<span class="sp-title">创建用户:</span> <span class="sp-title">创建用户:</span>
<span class="sp-text">{{ info.data.user_name }}</span> <span class="sp-text">{{ info.data.user_name }}</span>
</td> </td>
</tr>
<tr>
<td style="width: 50%;"> <td style="width: 50%;">
<span class="sp-title">创建时间:</span> <span class="sp-title">创建时间:</span>
<span class="sp-text">{{ info.data.create_time }}</span> <span class="sp-text">{{ info.data.create_time }}</span>
</td> </td>
</tr> <td style="width: 50%;" colspan="2">
<tr>
<td style="width: 100%;" colspan="2">
<span class="sp-title">互联说明:</span> <span class="sp-title">互联说明:</span>
<span class="sp-text">{{ info.data.connection_desc }}</span> <span class="sp-text">{{ info.data.connection_desc }}</span>
</td> </td>
</tr> </tr>
</table> </table>
</el-card> </el-card>
<el-card style="margin-top: 12px;margin-bottom: 60px;"> <el-card style="margin-top: 12px;margin-bottom: 60px;">

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="flow-demo1"> <div class="flow-demo1">
<div ref="flow" class="viewport" id="flowMain" /> <div ref="flow" class="viewport" id="flowMain" />
</div> </div>
</template> </template>
<script setup> <script setup>
@ -13,142 +13,136 @@ import AiNodeExtension from '@/components/flow/index'
import RegisteMenu from '@/components/flow/menu.js' import RegisteMenu from '@/components/flow/menu.js'
const themeApprove = { const themeApprove = {
rect: { // rect: { //
radius: 8, radius: 8,
stroke: '#3CB371' stroke: '#3CB371'
}, },
circle: { circle: {
r: 25, r: 25,
stroke: '#FF6347' stroke: '#FF6347'
}, },
polygon: { polygon: {
stroke: '#6495ED', stroke: '#6495ED',
}, },
polyline: { polyline: {
strokeWidth: 1, strokeWidth: 1,
stroke: '#6495ED' stroke: '#6495ED'
}, },
edgeText: { edgeText: {
background: { background: {
fill: 'white', fill: 'white',
},
}, },
},
} }
const props = defineProps({ const props = defineProps({
operInfo: { operInfo: {
type: Object, type: Object,
require: true, require: true,
default: {} default: {}
} }
}) })
const info=reactive({ const info = reactive({
nodes:[], nodes: [],
opers:[], opers: [],
edges:[], edges: [],
}) })
const emit = defineEmits(["nodeClick"]); const emit = defineEmits(["nodeClick"]);
const flow = ref() const flow = ref()
let lf = ref(null) let lf = ref(null)
const config = { const config = {
stopScrollGraph: true, stopScrollGraph: true,
stopZoomGraph: true, stopZoomGraph: true,
isSilentMode: true, isSilentMode: true,
grid: { grid: {
size: 10, size: 10,
visible: false, visible: false,
type: 'mesh', type: 'mesh',
config: { config: {
color: '#DCDCDC', color: '#DCDCDC',
} }
}, },
keyboard: { enabled: false }, keyboard: { enabled: false },
style: themeApprove, style: themeApprove,
plugins: [AiNodeExtension, Menu] plugins: [AiNodeExtension, Menu]
}; };
const showFlow=(o)=>{ const showFlow = (o) => {
info.opers=o.operator_list; info.opers = o.operator_list;
info.edges=o.operator_edges; info.edges = o.operator_node_data.edges || [];
info.nodes=o.operator_nodes.map(it=>{ info.nodes = o.operator_node_data.nodes || [];
let tmps=info.opers.filter(d=>d.operator_id==it.properties.node);
if(tmps.length>0){ let data = { nodes: info.nodes, edges: info.edges };
it.text.value=tmps[0].operator_name; lf.value.render(data)
}
return it;
});
let data={nodes:info.nodes,edges:info.edges};
lf.value.render(data)
} }
defineExpose({ defineExpose({
showFlow, showFlow,
}) })
const initEvent=(lf)=>{ const initEvent = (lf) => {
lf.on("element:click",node=>{ lf.on("element:click", node => {
emit("nodeClick",node.data); emit("nodeClick", node.data);
}); });
} }
onMounted(() => { onMounted(() => {
const logicFlow = new LogicFlow({ const logicFlow = new LogicFlow({
...config, ...config,
container: flow.value container: flow.value
}) })
initEvent(logicFlow); initEvent(logicFlow);
lf.value = logicFlow lf.value = logicFlow
window.lf = lf; window.lf = lf;
}); });
</script> </script>
<style scoped lang='scss'> <style scoped lang='scss'>
.flow-demo1 { .flow-demo1 {
height: 100%;
overflow: hidden;
padding: 20px 0px 10px;
.viewport {
height: 100%; height: 100%;
height: 600px;
overflow: hidden; overflow: hidden;
}
padding: 20px 0px 10px;
.viewport { .custom-anchor {
height: 100%; stroke: #999;
height: 600px; stroke-width: 1;
overflow: hidden; 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 { margin: 0px 12px;
stroke: #999; }
stroke-width: 1;
fill: #d9d9d9; .node-panel {
cursor: crosshair; width: 240px;
rx: 3;
ry: 3; .el-tabs__item {
padding: 0px 10px !important;
} }
}
.custom-anchor:hover { .card-prop {
fill: #ff7f0e; height: 300px;
stroke: #ff7f0e; width: 200px;
} min-width: 200px;
}
.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;
}
} }
</style> </style>

View File

@ -18,16 +18,11 @@
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="24">
<el-form-item label="互联名称" prop="connection_name"> <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-form-item label="标签" prop="connection_label">
<el-input v-model="upForm.connection_label" placeholder="请输入标签" />
</el-form-item>
</el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
@ -139,13 +134,11 @@ const upForm = reactive({
model_name: '', model_name: '',
model_version: '', model_version: '',
connection_name: '', connection_name: '',
connection_label: '',
connection_desc: '' connection_desc: ''
}); });
const upRules = computed(() => { const upRules = computed(() => {
return { return {
connection_name: [{ required: true, trigger: "blur", message: "请输入互联名称", },], connection_name: [{ required: true, trigger: "blur", message: "请输入互联名称", },],
connection_label: [{ required: true, trigger: "blur", message: "请输入标签", },],
connection_desc: [{ required: true, trigger: "blur", message: "请输入互联说明", },], connection_desc: [{ required: true, trigger: "blur", message: "请输入互联说明", },],
} }
}); });
@ -336,8 +329,10 @@ const doSave = () => {
connection_desc: upForm.connection_desc, connection_desc: upForm.connection_desc,
operator_list: operator_list, operator_list: operator_list,
operator_connection_list: operator_connection_list, operator_connection_list: operator_connection_list,
operator_connection_nodes: flowData.nodes, operator_node_data: {
operator_connection_edges: flowData.edges nodes: flowData.nodes,
edges: flowData.edges
}
}; };
if (info.type == "add") { if (info.type == "add") {
ConnApi.add(postData).then(d => { ConnApi.add(postData).then(d => {

View File

@ -36,7 +36,7 @@
<template #default="scope"> <template #default="scope">
<el-button text type="primary" size="small" @click="doShowDetail(scope.row)"><i-ep-edit />查看</el-button> <el-button text type="primary" size="small" @click="doShowDetail(scope.row)"><i-ep-edit />查看</el-button>
<el-button text type="primary" size="small" style="margin:0px;" <el-button text type="primary" size="small" style="margin:0px;"
@click="doEdit(scope.row.connection_id)"><i-ep-link />修改互联</el-button> @click="doEdit(scope.row)"><i-ep-link />修改互联</el-button>
<el-button text type="primary" size="small" @click="doAdd(scope.row)" <el-button text type="primary" size="small" @click="doAdd(scope.row)"
style="margin:0px;"><i-ep-plus />新建互联</el-button> style="margin:0px;"><i-ep-plus />新建互联</el-button>
<el-button text type="primary" size="small" @click="handleDelete(scope.row)" <el-button text type="primary" size="small" @click="handleDelete(scope.row)"

View File

@ -294,7 +294,6 @@ function handleFileChange(file, b) {
name: file.file.name, name: file.file.name,
serverName: res.data.data.file_name serverName: res.data.data.file_name
}) })
debugger
upForm.model_file_list = listOpt.upFiles.map(it => it.serverName); upForm.model_file_list = listOpt.upFiles.map(it => it.serverName);
}); });