update code
parent
0ba5405ef4
commit
bcecf05a25
|
@ -5,7 +5,11 @@ const makeX = (arr) => {
|
|||
let i = len % 2 == 0 ? (len / 2) * -1 : ((len - 1) / 2) * -1;
|
||||
let res = [];
|
||||
for (let j = i; j <= i * -1; j++) {
|
||||
res.push(30 * j);
|
||||
if(len%2==0 && j==0){
|
||||
|
||||
}else{
|
||||
res.push(30 * j);
|
||||
}
|
||||
}
|
||||
return res;
|
||||
};
|
||||
|
|
|
@ -75,33 +75,38 @@
|
|||
<span class="sp-label">算子说明:</span>
|
||||
<span class="sp-text">{{ selNode.info.operator_desc }}</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="row" v-if="selNode.info.parameters && selNode.info.parameters.inputs">
|
||||
<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"
|
||||
<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">
|
||||
<span>{{ it.key }}:</span>
|
||||
<span>{{ it.value }}</span>
|
||||
<paramShow :paramInfo="it"></paramShow>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-top:4px;">
|
||||
<div class="row" style="margin-top:4px;" v-if="selNode.info.parameters && selNode.info.parameters.outputs">
|
||||
<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>{{ it.key }}:</span>
|
||||
<span>{{ it.value }}</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>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-top:4px;">
|
||||
<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')">
|
||||
<span v-for="(it, idx) in objToArr(selNode.info.processParams) " :key="idx" class="param-item">
|
||||
<span>{{ it.key }}:</span>
|
||||
<span>{{ it.value }}</span>
|
||||
</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>
|
||||
|
@ -121,6 +126,7 @@ import nodePanel from './nodePanel.vue'
|
|||
import editFlow from './editFlow.vue'
|
||||
import ConnApi from '@/api/connection'
|
||||
import EditParamDlg from './editParamDlg.vue'
|
||||
import paramShow from './paramShow.vue'
|
||||
const router = useRouter();
|
||||
const editForm = ref(ElForm)
|
||||
const route = useRoute()
|
||||
|
@ -150,35 +156,34 @@ const selNode = reactive({
|
|||
let lf = ref(null)
|
||||
let edFlow = ref()
|
||||
const ndPanel = ref()
|
||||
const doFlowInput = () => {
|
||||
let tmps = info.nodes.filter(d => d.id == selNode.info.id);
|
||||
if (tmps.length == 0) {
|
||||
info.nodes.push(selNode.info)
|
||||
} else {
|
||||
tmps[0].inputParams = selNode.info.inputParams;
|
||||
tmps[0].outputParams = selNode.info.outputParams;
|
||||
tmps[0].processParams = selNode.info.processParams;
|
||||
|
||||
}
|
||||
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 doEditSuccess = (obj) => {
|
||||
let t = info.editObj.type;
|
||||
if (t == 'i') {
|
||||
selNode.info.inputParams = obj;
|
||||
selNode.info.inputs = obj;
|
||||
}
|
||||
if (t == 'o') {
|
||||
selNode.info.outputParams = obj;
|
||||
selNode.info.outputs = obj;
|
||||
}
|
||||
if (t == 'p') {
|
||||
selNode.info.processParams = obj;
|
||||
selNode.info.process = obj;
|
||||
}
|
||||
let tmps = info.nodes.filter(d => d.id == selNode.info.id);
|
||||
if (tmps.length == 0) {
|
||||
info.nodes.push(selNode.info)
|
||||
} else {
|
||||
tmps[0].inputParams = selNode.info.inputParams;
|
||||
tmps[0].outputParams = selNode.info.outputParams;
|
||||
tmps[0].processParams = selNode.info.processParams;
|
||||
tmps[0].inputs = selNode.info.parameters.inputs;
|
||||
tmps[0].outputs = selNode.info.parameters.outputs;
|
||||
tmps[0].process = selNode.info.parameters.process;
|
||||
}
|
||||
};
|
||||
const doEdit = (obj, title, t) => {
|
||||
|
@ -188,7 +193,7 @@ const doEdit = (obj, title, t) => {
|
|||
type: t
|
||||
}
|
||||
editDlg.value.showDialog({
|
||||
obj: t == 'i' ? obj.inputParams : t == 'o' ? obj.outputParams : obj.processParams,
|
||||
obj: t == 'i' ? obj.inputs : t == 'o' ? obj.outputs : obj.process,
|
||||
title: title
|
||||
});
|
||||
}
|
||||
|
@ -204,17 +209,31 @@ const doUpdateNode = (data) => {
|
|||
ndPanel.value.updateNode(data)
|
||||
}
|
||||
}
|
||||
const doNodeClick = (node) => {
|
||||
if (node) {
|
||||
selNode.info = node.data.properties.data;
|
||||
const doNodeClick = (node) => {
|
||||
if (node) {
|
||||
selNode.info = node.data.properties.data;
|
||||
let tmps = info.nodes.filter(d => d.id == selNode.info.id);
|
||||
if (tmps.length == 0) {
|
||||
info.nodes.push(selNode.info);
|
||||
} else {
|
||||
selNode.info.inputParams = tmps[0].inputParams;
|
||||
selNode.info.outputParams = tmps[0].outputParams;
|
||||
selNode.info.processParams = tmps[0].processParams;
|
||||
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;
|
||||
}
|
||||
|
||||
}
|
||||
else {
|
||||
selNode.info = null;
|
||||
|
@ -229,7 +248,6 @@ const doSave = () => {
|
|||
ElMessage.error("请绘制算子互联流程图!");
|
||||
return;
|
||||
}
|
||||
debugger
|
||||
let isNoConnect=false;
|
||||
let nodeObj={};
|
||||
let operator_list=[];
|
||||
|
@ -241,9 +259,9 @@ const doSave = () => {
|
|||
parameters:{}
|
||||
}
|
||||
if(node.length>0){
|
||||
oper.parameters.inputParams=node[0].inputParams;
|
||||
oper.parameters.outputParams=node[0].outputParams;
|
||||
oper.parameters.processParams=node[0].processParams;
|
||||
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);
|
||||
|
@ -414,6 +432,20 @@ onMounted(() => {
|
|||
flex-grow: 1;
|
||||
display: block;
|
||||
}
|
||||
.div-param{
|
||||
.div-navs{
|
||||
.sp-nav{
|
||||
display: inline-block;
|
||||
line-height:24px;
|
||||
padding:0px 12px;
|
||||
cursor: pointer;
|
||||
&.active{
|
||||
background-color: #409EFF;
|
||||
color:#fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -92,13 +92,12 @@ const updateNode = (nodes) => {
|
|||
|
||||
}
|
||||
|
||||
const doEdit=(nd)=>{
|
||||
debugger
|
||||
const doEdit=(nd)=>{
|
||||
let tmps=info.all.filter(d=>d.id==nd.id);
|
||||
if(tmps.length>0){
|
||||
tmps[0].inputParams=nd.inputParams;
|
||||
tmps[0].outputParams=nd.inputParams;
|
||||
tmps[0].processParams=nd.processParams;
|
||||
tmps[0].inputs=nd.inputs;
|
||||
tmps[0].outputs=nd.outputs;
|
||||
tmps[0].process=nd.process;
|
||||
}
|
||||
}
|
||||
defineExpose({
|
||||
|
|
|
@ -0,0 +1,34 @@
|
|||
<template>
|
||||
<div v-for="(it, idx) in objToArr(paramInfo)" :key="idx" style="word-break: break-all;">
|
||||
<span style="color:#00E5FF;font-weight: bold;">{{ it.name }}</span> :
|
||||
<span style="color: #283593;">{{ it.value }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
paramInfo: {
|
||||
type: Object,
|
||||
require: true,
|
||||
default: null
|
||||
}
|
||||
})
|
||||
const objToArr = obj => {
|
||||
let arr = [];
|
||||
if (obj != null) {
|
||||
for (let k in obj) {
|
||||
let v = obj[k];
|
||||
if (k != 'selected') {
|
||||
if (v['value']) {
|
||||
arr.push({ name: k, value: v['value'] })
|
||||
} else {
|
||||
arr.push({ name: k, value: v })
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
</script>
|
||||
<style lang='scss'></style>
|
Loading…
Reference in New Issue