feat: 节点缩小
This commit is contained in:
parent
592ebddc25
commit
9a7afa8f6e
@ -127,6 +127,34 @@ export const formatTableData = (arr, data = {}) => {
|
||||
}
|
||||
|
||||
export const addNewEdge = (nodeId) => {
|
||||
const { edges } = lf.getGraphData();
|
||||
const ttt = edges.slice(); // 浅拷贝（比 JSON 深拷贝高效 10x+）
|
||||
|
||||
const edgesToDelete = ttt.filter(_edge =>
|
||||
_edge.sourceNodeId === nodeId || _edge.targetNodeId === nodeId
|
||||
);
|
||||
|
||||
edgesToDelete.forEach(edge => lf.deleteEdge(edge.id));
|
||||
|
||||
if (window.addNewEdgeTimer) {
|
||||
clearTimeout(window.addNewEdgeTimer); // 清理上一次未执行的定时器
|
||||
}
|
||||
|
||||
window.addNewEdgeTimer = setTimeout(() => {
|
||||
edgesToDelete.forEach(item => {
|
||||
lf.addEdge({
|
||||
type: "bezier",
|
||||
sourceNodeId: item.sourceNodeId,
|
||||
targetNodeId: item.targetNodeId,
|
||||
sourceAnchorId: item.sourceAnchorId,
|
||||
targetAnchorId: item.targetAnchorId
|
||||
});
|
||||
})
|
||||
delete window.addNewEdgeTimer;
|
||||
}, 50)
|
||||
}
|
||||
|
||||
export const newEdge = (nodeId) => {
|
||||
const { edges } = lf.getGraphData();
|
||||
const arr = JSON.parse(JSON.stringify(edges))
|
||||
arr.forEach(_edge => {
|
||||
|
||||
@ -2,27 +2,59 @@
|
||||
<div class="title__container">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<img :src="icon" alt="">
|
||||
<img :src="icon" alt="" />
|
||||
<div class="text__container">
|
||||
<div class="text__title" v-if="showTextTitle">
|
||||
<span class="text">{{ nodeName }}</span>
|
||||
<el-icon class="editIcon" @click="showTextTitle = false"><EditPen /></el-icon>
|
||||
<el-icon class="editIcon" @click="showTextTitle = false"
|
||||
><EditPen
|
||||
/></el-icon>
|
||||
</div>
|
||||
<div class="input_name_container" v-else>
|
||||
<el-input v-model="nodeName" />
|
||||
<el-button class="input_name_select" circle size="small" @click="confirmNodeName">
|
||||
<el-button
|
||||
class="input_name_select"
|
||||
circle
|
||||
size="small"
|
||||
@click="confirmNodeName"
|
||||
>
|
||||
<el-icon><Select /></el-icon>
|
||||
</el-button>
|
||||
<el-button class="input_name_closeBold" circle size="small" @click="cancelNodeName">
|
||||
<el-button
|
||||
class="input_name_closeBold"
|
||||
circle
|
||||
size="small"
|
||||
@click="cancelNodeName"
|
||||
>
|
||||
<el-icon><CloseBold /></el-icon>
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
:content="zoomState ? '缩小' : '放大'"
|
||||
placement="top"
|
||||
>
|
||||
<el-button v-if="showZoom" circle size="small" @click="zoom">
|
||||
<el-icon>
|
||||
<ZoomOut v-if="zoomState" />
|
||||
<ZoomIn v-else />
|
||||
</el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
content="删除"
|
||||
placement="top"
|
||||
>
|
||||
<el-button circle size="small" @click="deleteNode">
|
||||
<el-icon><Delete /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<div class="subTitle">{{ props.nodeDesc }}</div>
|
||||
@ -30,7 +62,7 @@
|
||||
</template>
|
||||
<script setup lang="js">
|
||||
import { ref } from 'vue'
|
||||
import { EditPen, Select, CloseBold, Delete } from '@element-plus/icons-vue'
|
||||
import { EditPen, Select, CloseBold, Delete, ZoomOut, ZoomIn } from '@element-plus/icons-vue'
|
||||
import { ElMessageBox } from 'element-plus'
|
||||
|
||||
const props = defineProps({
|
||||
@ -57,9 +89,19 @@ const props = defineProps({
|
||||
nodeType: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
showZoom: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
zoomState: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
const emits = defineEmits(['zoom'])
|
||||
|
||||
const showTextTitle = ref(true)
|
||||
const nodeName = ref(props.nodeProperties.name || props.nodeName)
|
||||
|
||||
@ -98,6 +140,10 @@ const deleteNode = () => {
|
||||
lf.deleteNode(props.nodeId);
|
||||
})
|
||||
}
|
||||
|
||||
const zoom = () => {
|
||||
emits('zoom', !props.zoomState)
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.title__container {
|
||||
@ -167,5 +213,5 @@ const deleteNode = () => {
|
||||
font-size: 12px;
|
||||
margin: 8px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -42,6 +42,11 @@ export const lfConfig = {
|
||||
// foldSize: 30, // 折叠后显示的图标尺寸
|
||||
// },
|
||||
edgeType: "bezier",
|
||||
zoomConfig: {
|
||||
min: 0.05, // 最小缩放比例（支持更小值，如 0.01，但不建议过小）
|
||||
max: 3, // 最大缩放比例（可自定义）
|
||||
step: 0.1 // 每次滚轮缩放的步长（默认 0.1）
|
||||
},
|
||||
style: {
|
||||
anchor: {
|
||||
show: true, // 强制全局锚点显示
|
||||
|
||||
@ -54,7 +54,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-container>
|
||||
<el-container class="container">
|
||||
<el-aside v-if="!flowStore.disableForm">
|
||||
<Aside />
|
||||
</el-aside>
|
||||
@ -79,7 +79,7 @@ import Aside from "./components/Aside.vue";
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { useFlowStore } from '@/store/modules/flow'
|
||||
import { emitter } from '@/utils/eventBus';
|
||||
import { recursiveFilter, addNewEdge, convertToTree } from '@/utils/flow'
|
||||
import { recursiveFilter, newEdge, convertToTree } from '@/utils/flow'
|
||||
import { flowDeploy, flowView, flowPause, flowResume, flowStop } from '@/api/device/flow'
|
||||
import { getDetect } from '@/api/test/detect'
|
||||
import { Location } from "@element-plus/icons-vue";
|
||||
@ -502,7 +502,6 @@ const initFlow = () => {
|
||||
const node = lf.getNodeModelById(item.id)
|
||||
node.updateSize()
|
||||
})
|
||||
|
||||
operationEdge(arr)
|
||||
});
|
||||
|
||||
@ -588,7 +587,7 @@ onMounted(() => {
|
||||
|
||||
const operationEdge = (arr) => {
|
||||
arr.forEach(item => {
|
||||
addNewEdge(item.id)
|
||||
newEdge(item.id)
|
||||
})
|
||||
}
|
||||
|
||||
@ -601,6 +600,7 @@ onUnmounted(() => {
|
||||
.page {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.page__container {
|
||||
width: 100%;
|
||||
@ -622,6 +622,10 @@ onUnmounted(() => {
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
height: calc(100% - 60px);
|
||||
}
|
||||
|
||||
.el-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@ -1,11 +1,18 @@
|
||||
<template>
|
||||
<div class="node__container">
|
||||
<div class="node__container" :class="props.model.id">
|
||||
<NodeState :state="nodeOperatingStatus">
|
||||
<template #input>
|
||||
<JsonViewer :value="inputJsonData" copyable boxed sort theme="light" />
|
||||
</template>
|
||||
<template #output>
|
||||
<JsonViewer v-if="props.properties.outputType === 'json'" :value="outputJsonData" copyable boxed sort theme="light" />
|
||||
<JsonViewer
|
||||
v-if="props.properties.outputType === 'json'"
|
||||
:value="outputJsonData"
|
||||
copyable
|
||||
boxed
|
||||
sort
|
||||
theme="light"
|
||||
/>
|
||||
<el-image
|
||||
v-if="props.properties.outputType === 'img'"
|
||||
v-for="item in outputJsonData.imageUrl"
|
||||
@ -16,7 +23,11 @@
|
||||
show-progress
|
||||
fit="fill"
|
||||
/>
|
||||
<IPlayer v-if="props.properties.outputType === 'video'" v-for="item in outputJsonData.videoUrl" :videoUrl="item" />
|
||||
<IPlayer
|
||||
v-if="props.properties.outputType === 'video'"
|
||||
v-for="item in outputJsonData.videoUrl"
|
||||
:videoUrl="item"
|
||||
/>
|
||||
</template>
|
||||
</NodeState>
|
||||
<NodeTitle
|
||||
@ -25,8 +36,10 @@
|
||||
:nodeProperties="props.properties"
|
||||
:nodeName="props.properties.name"
|
||||
:nodeDesc="props.properties.desc"
|
||||
:zoom-state="nodeZoom"
|
||||
@zoom="zoom"
|
||||
/>
|
||||
<div class="input__container">
|
||||
<div class="input__container" v-show="nodeZoom">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<div class="tag"></div>
|
||||
@ -57,7 +70,9 @@
|
||||
<el-form-item
|
||||
:label="index === 0 ? '参数名' : ''"
|
||||
:prop="`nodeParams.${index}.name`"
|
||||
:rules="[{ required: true, message: '请输入参数名', trigger: 'blur' }]"
|
||||
:rules="[
|
||||
{ required: true, message: '请输入参数名', trigger: 'blur' },
|
||||
]"
|
||||
>
|
||||
<el-input
|
||||
:disabled="property?.disabled || false"
|
||||
@ -71,33 +86,76 @@
|
||||
:label="index === 0 ? '参数值' : ''"
|
||||
:prop="`nodeParams.${index}.type`"
|
||||
>
|
||||
<el-select v-model="property.type" @change="handleTypeChange(index)">
|
||||
<el-select
|
||||
v-model="property.type"
|
||||
@change="handleTypeChange(index)"
|
||||
>
|
||||
<el-option label="引用" value="quote" />
|
||||
<el-option label="输入" value="input" />
|
||||
</el-select>
|
||||
<el-form-item
|
||||
v-if="property.type === 'input'"
|
||||
:rules="[{ required: true, message: '请输入参数值', trigger: 'blur' }]"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请输入参数值',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
:prop="`nodeParams.${index}.input`"
|
||||
>
|
||||
<el-input-number v-if="property.componentType === 'number'" v-model="property.input" :min="0" :controls="false" :step-strictly="true" placeholder="请输入" clearable />
|
||||
<el-select v-model="property.input" v-else-if="property.componentType === 'select'" >
|
||||
<el-option v-for="item in property.selectOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||
<el-input-number
|
||||
v-if="property.componentType === 'number'"
|
||||
v-model="property.input"
|
||||
:min="0"
|
||||
:controls="false"
|
||||
:step-strictly="true"
|
||||
placeholder="请输入"
|
||||
clearable
|
||||
/>
|
||||
<el-select
|
||||
v-model="property.input"
|
||||
v-else-if="property.componentType === 'select'"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in property.selectOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-input @keydown="handleInputKeydown" v-else v-model="property.input" placeholder="请输入" clearable />
|
||||
<el-input
|
||||
@keydown="handleInputKeydown"
|
||||
v-else
|
||||
v-model="property.input"
|
||||
placeholder="请输入"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-if="property.type === 'quote'"
|
||||
:rules="[{ required: true, message: '请选择参数值', trigger: 'blur' }]"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请选择参数值',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
:prop="`nodeParams.${index}.quote`"
|
||||
>
|
||||
<el-cascader
|
||||
:ref="el => { if (el) cascaderRefs[index] = el }"
|
||||
:ref="
|
||||
(el) => {
|
||||
if (el) cascaderRefs[index] = el;
|
||||
}
|
||||
"
|
||||
v-model="property.quote"
|
||||
:checkStrictly="true"
|
||||
:options="quoteOptions"
|
||||
placeholder="请选择"
|
||||
@visible-change="(visible) => visibleChange(visible, index, property.quote)"
|
||||
@visible-change="
|
||||
(visible) => visibleChange(visible, index, property.quote)
|
||||
"
|
||||
@change="(value) => cascaderChange(value, index)"
|
||||
/>
|
||||
</el-form-item>
|
||||
@ -107,13 +165,14 @@
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="output__container" v-if="props.properties?.outputParams?.length > 0">
|
||||
<div class="output__container" v-show="nodeZoom">
|
||||
<div v-if="props.properties?.outputParams?.length > 0">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<div class="tag"></div>
|
||||
<div class="text">输出</div>
|
||||
</div>
|
||||
<div class="right" >
|
||||
<div class="right">
|
||||
<el-button
|
||||
:disabled="flowStore.disableForm"
|
||||
@click="addOutputFormItem"
|
||||
@ -147,11 +206,12 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, onUnmounted } from "vue";
|
||||
import { getInput } from "@/utils/flow";
|
||||
import { getInput, addNewEdge } from "@/utils/flow";
|
||||
import { useFlowStore } from "@/store/modules/flow";
|
||||
import { Plus } from "@element-plus/icons-vue";
|
||||
import NodeTitle from "../../components/NodeTitle.vue";
|
||||
@ -172,7 +232,7 @@ const flowStore = useFlowStore();
|
||||
|
||||
const formData = reactive({
|
||||
nodeParams: [],
|
||||
outputParams: []
|
||||
outputParams: [],
|
||||
});
|
||||
|
||||
const rules = reactive({});
|
||||
@ -190,31 +250,31 @@ const handleTypeChange = (index) => {
|
||||
}
|
||||
};
|
||||
|
||||
const cascaderRefs = ref([])
|
||||
const cascaderRefs = ref([]);
|
||||
const outputRules = reactive({});
|
||||
const cascaderChange = (value, index) => {
|
||||
const selectedOptions = cascaderRefs.value[index].getCheckedNodes(true);
|
||||
formData.nodeParams[index].quote = value
|
||||
formData.nodeParams[index].quoteType = selectedOptions[0].data.type
|
||||
}
|
||||
formData.nodeParams[index].quote = value;
|
||||
formData.nodeParams[index].quoteType = selectedOptions[0].data.type;
|
||||
};
|
||||
|
||||
const addOutputFormItem = () => {
|
||||
formData.outputParams.push({
|
||||
name: '',
|
||||
type: '',
|
||||
desc: '',
|
||||
children: []
|
||||
})
|
||||
}
|
||||
name: "",
|
||||
type: "",
|
||||
desc: "",
|
||||
children: [],
|
||||
});
|
||||
};
|
||||
|
||||
const dynamicForm = ref();
|
||||
const outputFormRef = ref()
|
||||
const outputFormRef = ref();
|
||||
const setNodeProperties = async () => {
|
||||
try {
|
||||
const result = await dynamicForm.value.validate();
|
||||
let flag = true
|
||||
let flag = true;
|
||||
if (outputFormRef.value) {
|
||||
flag = await outputFormRef.value.validate()
|
||||
flag = await outputFormRef.value.validate();
|
||||
}
|
||||
|
||||
if (result && flag) {
|
||||
@ -287,7 +347,7 @@ const addFormItem = () => {
|
||||
|
||||
// 删除顶层表单项
|
||||
const deleteTopLevelItem = (fullPath) => {
|
||||
// 从顶层数据开始查找
|
||||
// 从顶层数据开始查找
|
||||
let currentLevel = formData.outputParams;
|
||||
|
||||
// 遍历路径（除最后一个索引，因为最后一个是要删除的项）
|
||||
@ -301,6 +361,22 @@ const deleteTopLevelItem = (fullPath) => {
|
||||
const lastIndex = fullPath[fullPath.length - 1];
|
||||
currentLevel.splice(lastIndex, 1);
|
||||
emits("contentChange");
|
||||
};
|
||||
|
||||
const nodeZoom = ref(true)
|
||||
const zoom = (flag) => {
|
||||
nodeZoom.value = flag
|
||||
const nodes = document.getElementsByClassName(props.model.id)
|
||||
if (nodes.length > 0) {
|
||||
const node = nodes[0]
|
||||
const parent = node.closest('.node__box');
|
||||
if (nodeZoom.value) {
|
||||
parent.style.width = '680px'
|
||||
} else {
|
||||
parent.style.width = '300px'
|
||||
}
|
||||
addNewEdge(props.model.id)
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
@ -313,7 +389,10 @@ watch(
|
||||
quoteOptions.value = option;
|
||||
}
|
||||
}
|
||||
if (props.properties.outputParams && props.properties.outputParams.length > 0) {
|
||||
if (
|
||||
props.properties.outputParams &&
|
||||
props.properties.outputParams.length > 0
|
||||
) {
|
||||
formData.outputParams = props.properties.outputParams;
|
||||
}
|
||||
},
|
||||
@ -327,10 +406,10 @@ const handleInputKeydown = (e) => {
|
||||
// 阻止事件冒泡到 Logic Flow 节点，避免被其事件拦截
|
||||
e.stopPropagation();
|
||||
// 可选：明确放行 Ctrl+V（增强兼容性）
|
||||
if ((e.ctrlKey || e.metaKey) && e.key === 'v') {
|
||||
if ((e.ctrlKey || e.metaKey) && e.key === "v") {
|
||||
e.returnValue = true; // 允许默认粘贴行为
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
emitter.on("changeNodeState", (data) => {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="node__container">
|
||||
<div class="node__container" :class="props.model.id">
|
||||
<keep-alive>
|
||||
<NodeState :state="nodeOperatingStatus">
|
||||
<template #input>
|
||||
@ -12,12 +12,29 @@
|
||||
</keep-alive>
|
||||
<div class="title__container">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<img src="../../icon/start.svg" alt="" />
|
||||
<span class="text">Start</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
:content="nodeZoom ? '缩小' : '放大'"
|
||||
placement="top"
|
||||
>
|
||||
<el-button circle size="small" @click="zoom">
|
||||
<el-icon>
|
||||
<ZoomOut v-if="nodeZoom" />
|
||||
<ZoomIn v-else />
|
||||
</el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<div class="subTitle">工作流的起始节点，用于设定启动工作流需要的信息</div>
|
||||
</div>
|
||||
<div class="input__container">
|
||||
<div class="input__container" v-show="nodeZoom">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<div class="tag"></div>
|
||||
@ -61,8 +78,9 @@
|
||||
|
||||
<script setup>
|
||||
import { watch, reactive, toRaw, ref, onMounted, onUnmounted } from "vue";
|
||||
import { Plus } from "@element-plus/icons-vue";
|
||||
import { Plus, ZoomOut, ZoomIn } from "@element-plus/icons-vue";
|
||||
import { useFlowStore } from "@/store/modules/flow";
|
||||
import { addNewEdge } from "@/utils/flow";
|
||||
import NodeState from "../../components/NodeState.vue";
|
||||
import "vue3-json-viewer/dist/index.css";
|
||||
import { emitter } from "@/utils/eventBus";
|
||||
@ -200,6 +218,22 @@ const validateForm = async () => {
|
||||
}
|
||||
};
|
||||
|
||||
const nodeZoom = ref(true)
|
||||
const zoom = () => {
|
||||
nodeZoom.value = !nodeZoom.value
|
||||
const nodes = document.getElementsByClassName(props.model.id)
|
||||
if (nodes.length > 0) {
|
||||
const node = nodes[0]
|
||||
const parent = node.closest('.node__box');
|
||||
if (nodeZoom.value) {
|
||||
parent.style.width = '680px'
|
||||
} else {
|
||||
parent.style.width = '300px'
|
||||
}
|
||||
addNewEdge(props.model.id)
|
||||
}
|
||||
}
|
||||
|
||||
onUnmounted(() => {
|
||||
emitter.off("changeNodeState");
|
||||
emitter.off("contentChange");
|
||||
@ -220,7 +254,9 @@ defineExpose({
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.left {
|
||||
img {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
@ -232,6 +268,7 @@ defineExpose({
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.subTitle {
|
||||
color: #737a87;
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
<template>
|
||||
<div class="group__container" @mouseleave="setNodeProperties">
|
||||
<div class="group__container" :class="props.model.id" @mouseleave="setNodeProperties">
|
||||
<NodeTitle
|
||||
:icon="loop"
|
||||
:nodeId="props.model.id"
|
||||
:nodeProperties="props.properties"
|
||||
:nodeName="props.properties?.name || '循环'"
|
||||
nodeDesc="循环执行一系列任务，直至输出所有结果"
|
||||
:showZoom="false"
|
||||
/>
|
||||
<div class="loop__container">
|
||||
<div>
|
||||
@ -24,7 +25,11 @@
|
||||
:label="index === 0 ? '参数名' : ''"
|
||||
:prop="`nodeParams.${index}.name`"
|
||||
:rules="[
|
||||
{ required: true, message: '请输入参数名', trigger: 'blur' },
|
||||
{
|
||||
required: true,
|
||||
message: '请输入参数名',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-input
|
||||
@ -87,7 +92,8 @@
|
||||
:options="quoteOptions"
|
||||
placeholder="请选择"
|
||||
@visible-change="
|
||||
(visible) => visibleChange(visible, index, property.quote)
|
||||
(visible) =>
|
||||
visibleChange(visible, index, property.quote)
|
||||
"
|
||||
@change="(value) => cascaderChange(value, index)"
|
||||
/>
|
||||
@ -99,7 +105,11 @@
|
||||
</div>
|
||||
</div>
|
||||
<div>循环体</div>
|
||||
<div class="child__container" @drop="handleDrop" @dragover="handleDragover">
|
||||
<div
|
||||
class="child__container"
|
||||
@drop="handleDrop"
|
||||
@dragover="handleDragover"
|
||||
>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="node__container">
|
||||
<div class="node__container" :class="props.model.id">
|
||||
<NodeState :state="nodeOperatingStatus">
|
||||
<template #input>
|
||||
<JsonViewer :value="inputJsonData" copyable boxed sort theme="light" />
|
||||
@ -25,8 +25,10 @@
|
||||
:nodeProperties="props.properties"
|
||||
:nodeName="props.properties.name"
|
||||
:nodeDesc="props.properties.desc"
|
||||
:zoom-state="nodeZoom"
|
||||
@zoom="zoom"
|
||||
/>
|
||||
<div class="input__container">
|
||||
<div class="input__container" v-show="nodeZoom">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<div class="tag"></div>
|
||||
@ -42,7 +44,7 @@
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form__container">
|
||||
<div class="form__container" v-show="nodeZoom">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:model="formData"
|
||||
@ -135,7 +137,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, onUnmounted } from "vue";
|
||||
import { getInput } from "@/utils/flow";
|
||||
import { getInput, addNewEdge } from "@/utils/flow";
|
||||
import { useFlowStore } from "@/store/modules/flow";
|
||||
import { Plus } from "@element-plus/icons-vue";
|
||||
import NodeTitle from "../../components/NodeTitle.vue";
|
||||
@ -228,6 +230,22 @@ const addFormItem = () => {
|
||||
emits("contentChange");
|
||||
};
|
||||
|
||||
const nodeZoom = ref(true)
|
||||
const zoom = (flag) => {
|
||||
nodeZoom.value = flag
|
||||
const nodes = document.getElementsByClassName(props.model.id)
|
||||
if (nodes.length > 0) {
|
||||
const node = nodes[0]
|
||||
const parent = node.closest('.node__box');
|
||||
if (nodeZoom.value) {
|
||||
parent.style.width = '680px'
|
||||
} else {
|
||||
parent.style.width = '300px'
|
||||
}
|
||||
addNewEdge(props.model.id)
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.properties,
|
||||
() => {
|
||||
|
||||
@ -8,36 +8,67 @@
|
||||
<JsonViewer :value="outputJsonData" copyable boxed sort theme="light" />
|
||||
</template>
|
||||
</NodeState>
|
||||
<NodeTitle :icon="switchSvg" :nodeId="props.model.id" :nodeProperties="props.properties" :nodeName="props.properties?.name || '分支'" nodeDesc="连接多个下游分支，根据设定的条件按照顺序查找的方式来匹配运行的分支，如果匹配到某条件则只运行该条件对应的分支，否则继续匹配下一条件直至结束" />
|
||||
<NodeTitle
|
||||
:icon="switchSvg"
|
||||
:nodeId="props.model.id"
|
||||
:nodeProperties="props.properties"
|
||||
:nodeName="props.properties?.name || '分支'"
|
||||
nodeDesc="连接多个下游分支，根据设定的条件按照顺序查找的方式来匹配运行的分支，如果匹配到某条件则只运行该条件对应的分支，否则继续匹配下一条件直至结束"
|
||||
/>
|
||||
<div class="condition_title_container">
|
||||
<div class="left">
|
||||
<div class="space"></div>
|
||||
<div class="title">所有条件</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-button :disabled="flowStore.disableForm" @click="addFormItem" class="addFormItem">
|
||||
<el-icon :size="20" ><Plus /></el-icon>
|
||||
<el-button
|
||||
:disabled="flowStore.disableForm"
|
||||
@click="addFormItem"
|
||||
class="addFormItem"
|
||||
>
|
||||
<el-icon :size="20"><Plus /></el-icon>
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-form :inline="true" :model="formData" :rules="rules" ref="dynamicForm" label-position="top" label-width="auto" :disabled="flowStore.disableForm">
|
||||
<div class="condition" v-for="(params, index) in formData.nodeParams" :id="params.id">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:model="formData"
|
||||
:rules="rules"
|
||||
ref="dynamicForm"
|
||||
label-position="top"
|
||||
label-width="auto"
|
||||
:disabled="flowStore.disableForm"
|
||||
>
|
||||
<div
|
||||
class="condition"
|
||||
v-for="(params, index) in formData.nodeParams"
|
||||
:id="params.id"
|
||||
>
|
||||
<div class="title__container">
|
||||
<div class="left">
|
||||
<div class="space"></div>
|
||||
<div class="title">{{ index ===0 ? 'If' : 'Else If' }}</div>
|
||||
<div class="title">{{ index === 0 ? "If" : "Else If" }}</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-button :disabled="flowStore.disableForm" circle size="small" @click="deleteFormItem(params.id, index)">
|
||||
<el-icon :size="16" ><Minus /></el-icon>
|
||||
<el-button
|
||||
:disabled="flowStore.disableForm"
|
||||
circle
|
||||
size="small"
|
||||
@click="deleteFormItem(params.id, index)"
|
||||
>
|
||||
<el-icon :size="16"><Minus /></el-icon>
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="withOr">
|
||||
<div class="title">条件</div>
|
||||
<div>
|
||||
<el-select v-model="params.withOr" placeholder="Select" style="width: 240px">
|
||||
<el-select
|
||||
v-model="params.withOr"
|
||||
placeholder="Select"
|
||||
style="width: 240px"
|
||||
>
|
||||
<el-option key="and" label="AND" value="and" />
|
||||
<el-option key="or" label="OR" value="or" />
|
||||
</el-select>
|
||||
@ -46,20 +77,61 @@
|
||||
<div class="form__container">
|
||||
<el-row v-for="(property, pIndex) in params.list">
|
||||
<!-- :prop="`nodeParams.${index}.list.${pIndex}.name`" :rules="[{ required: true, message: '请输入变量名', trigger: 'blur' }]" -->
|
||||
<el-form-item :label="pIndex === 0 ? '引用变量' : ''" :prop="`nodeParams.${index}.list.${pIndex}.nameType`">
|
||||
<el-form-item
|
||||
:label="pIndex === 0 ? '引用变量' : ''"
|
||||
:prop="`nodeParams.${index}.list.${pIndex}.nameType`"
|
||||
>
|
||||
<!-- <el-input v-model="property.name" placeholder="请输入" clearable /> -->
|
||||
<el-select v-model="property.nameType" @change="handleTypeChange(index, pIndex)">
|
||||
<el-select
|
||||
v-model="property.nameType"
|
||||
@change="handleTypeChange(index, pIndex)"
|
||||
>
|
||||
<el-option label="引用" value="quote" />
|
||||
<el-option label="输入" value="input" />
|
||||
</el-select>
|
||||
<el-form-item v-if="property.nameType === 'input'" :rules="[{ required: true, message: '请输入参数值', trigger: 'blur' }]" :prop="`nodeParams.${index}.list.${pIndex}.name`">
|
||||
<el-input v-model="property.name" placeholder="请输入" clearable />
|
||||
<el-form-item
|
||||
v-if="property.nameType === 'input'"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请输入参数值',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
:prop="`nodeParams.${index}.list.${pIndex}.name`"
|
||||
>
|
||||
<el-input
|
||||
v-model="property.name"
|
||||
placeholder="请输入"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="property.nameType === 'quote'" :rules="[{ required: true, message: '请选择参数值', trigger: 'blur' }]" :prop="`nodeParams.${index}.list.${pIndex}.nameQuote`">
|
||||
<el-cascader v-model="property.nameQuote" :options="quoteOptions" placeholder="请选择" @visible-change="visibleChange" />
|
||||
<el-form-item
|
||||
v-if="property.nameType === 'quote'"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请选择参数值',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
:prop="`nodeParams.${index}.list.${pIndex}.nameQuote`"
|
||||
>
|
||||
<el-cascader
|
||||
v-model="property.nameQuote"
|
||||
:options="quoteOptions"
|
||||
placeholder="请选择"
|
||||
@visible-change="visibleChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form-item>
|
||||
<el-form-item :label="pIndex === 0 ? '选择条件' : ''" :prop="`nodeParams.${index}.list.${pIndex}.condition`" :rules="[{ required: true, message: '请输入变量名', trigger: 'blur' }]">
|
||||
<el-form-item
|
||||
:label="pIndex === 0 ? '选择条件' : ''"
|
||||
:prop="`nodeParams.${index}.list.${pIndex}.condition`"
|
||||
:rules="[
|
||||
{ required: true, message: '请输入变量名', trigger: 'blur' },
|
||||
]"
|
||||
>
|
||||
<el-select v-model="property.condition">
|
||||
<el-option label="等于" value="equal" />
|
||||
<el-option label="不等于" value="notEqualTo" />
|
||||
@ -73,27 +145,71 @@
|
||||
<el-option label="小于等于" value="lessThanOrEqual" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="pIndex === 0 ? '比较值' : ''" :prop="`nodeParams.${index}.list.${pIndex}.type`" >
|
||||
<el-select v-model="property.type" @change="handleTypeChange(index, pIndex)">
|
||||
<el-form-item
|
||||
:label="pIndex === 0 ? '比较值' : ''"
|
||||
:prop="`nodeParams.${index}.list.${pIndex}.type`"
|
||||
>
|
||||
<el-select
|
||||
v-model="property.type"
|
||||
@change="handleTypeChange(index, pIndex)"
|
||||
>
|
||||
<el-option label="引用" value="quote" />
|
||||
<el-option label="输入" value="input" />
|
||||
</el-select>
|
||||
<el-form-item v-if="property.type === 'input'" :rules="[{ required: true, message: '请输入参数值', trigger: 'blur' }]" :prop="`nodeParams.${index}.list.${pIndex}.input`">
|
||||
<el-input v-model="property.input" placeholder="请输入" clearable />
|
||||
<el-form-item
|
||||
v-if="property.type === 'input'"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请输入参数值',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
:prop="`nodeParams.${index}.list.${pIndex}.input`"
|
||||
>
|
||||
<el-input
|
||||
v-model="property.input"
|
||||
placeholder="请输入"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="property.type === 'quote'" :rules="[{ required: true, message: '请选择参数值', trigger: 'blur' }]" :prop="`nodeParams.${index}.list.${pIndex}.quote`">
|
||||
<el-cascader v-model="property.quote" :options="quoteOptions" placeholder="请选择" @visible-change="visibleChange" />
|
||||
<el-form-item
|
||||
v-if="property.type === 'quote'"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请选择参数值',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
:prop="`nodeParams.${index}.list.${pIndex}.quote`"
|
||||
>
|
||||
<el-cascader
|
||||
v-model="property.quote"
|
||||
:options="quoteOptions"
|
||||
placeholder="请选择"
|
||||
@visible-change="visibleChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form-item>
|
||||
<el-form-item :label="pIndex === 0 ? '操作' : ''">
|
||||
<el-button :disabled="flowStore.disableForm" circle size="small" @click="addListItem(index)">
|
||||
<el-icon :size="12" ><Plus /></el-icon>
|
||||
<el-button
|
||||
:disabled="flowStore.disableForm"
|
||||
circle
|
||||
size="small"
|
||||
@click="addListItem(index)"
|
||||
>
|
||||
<el-icon :size="12"><Plus /></el-icon>
|
||||
</el-button>
|
||||
<el-button :disabled="flowStore.disableForm" circle size="small" @click="removeListItem(index, pIndex)">
|
||||
<el-icon :size="12" ><Minus /></el-icon>
|
||||
<el-button
|
||||
:disabled="flowStore.disableForm"
|
||||
circle
|
||||
size="small"
|
||||
@click="removeListItem(index, pIndex)"
|
||||
>
|
||||
<el-icon :size="12"><Minus /></el-icon>
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
@ -106,14 +222,14 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { nextTick, onMounted, onUnmounted, reactive, ref } from 'vue'
|
||||
import NodeTitle from '../../components/NodeTitle.vue'
|
||||
import { nextTick, onMounted, onUnmounted, reactive, ref } from "vue";
|
||||
import NodeTitle from "../../components/NodeTitle.vue";
|
||||
import NodeState from "../../components/NodeState.vue";
|
||||
import switchSvg from '../../icon/switch.svg'
|
||||
import { v4 as randomUUID } from 'uuid'
|
||||
import { useFlowStore } from '@/store/modules/flow'
|
||||
import { Plus, Minus } from '@element-plus/icons-vue'
|
||||
import { getInput, addNewEdge, removeSwitchEdge } from '@/utils/flow'
|
||||
import switchSvg from "../../icon/switch.svg";
|
||||
import { v4 as randomUUID } from "uuid";
|
||||
import { useFlowStore } from "@/store/modules/flow";
|
||||
import { Plus, Minus } from "@element-plus/icons-vue";
|
||||
import { getInput, addNewEdge, removeSwitchEdge } from "@/utils/flow";
|
||||
import { emitter } from "@/utils/eventBus";
|
||||
|
||||
const props = defineProps({
|
||||
@ -123,130 +239,137 @@ const props = defineProps({
|
||||
nowTime: Number,
|
||||
});
|
||||
|
||||
const emits = defineEmits(['addAnchor', 'removeAnchor', 'bindRef', 'changeAnchor'])
|
||||
const emits = defineEmits([
|
||||
"addAnchor",
|
||||
"removeAnchor",
|
||||
"bindRef",
|
||||
"changeAnchor",
|
||||
]);
|
||||
|
||||
const switchRef = ref()
|
||||
const dynamicForm = ref()
|
||||
const flowStore = useFlowStore()
|
||||
const switchRef = ref();
|
||||
const dynamicForm = ref();
|
||||
const flowStore = useFlowStore();
|
||||
|
||||
const formData = reactive({
|
||||
nodeParams: props.properties?.conditions || []
|
||||
})
|
||||
nodeParams: props.properties?.conditions || [],
|
||||
});
|
||||
|
||||
const addFormItem = () => {
|
||||
const rect = switchRef.value.getBoundingClientRect();
|
||||
addCondition(rect.height - 60)
|
||||
}
|
||||
addCondition(rect.height - 60);
|
||||
};
|
||||
|
||||
const deleteFormItem = (id, index) => {
|
||||
if (index === 0) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
formData.nodeParams.splice(index, 1)
|
||||
emits('removeAnchor', id)
|
||||
removeSwitchEdge(props.model.id, id)
|
||||
formData.nodeParams.splice(index, 1);
|
||||
emits("removeAnchor", id);
|
||||
removeSwitchEdge(props.model.id, id);
|
||||
nextTick(() => {
|
||||
changeFormItemHeight()
|
||||
})
|
||||
}
|
||||
changeFormItemHeight();
|
||||
});
|
||||
};
|
||||
|
||||
const quoteOptions = ref([])
|
||||
const quoteOptions = ref([]);
|
||||
const handleTypeChange = (pIndex, index) => {
|
||||
if (formData.nodeParams[pIndex].list[index].type === 'input') {
|
||||
formData.nodeParams[pIndex].list[index].quote = ""
|
||||
if (formData.nodeParams[pIndex].list[index].type === "input") {
|
||||
formData.nodeParams[pIndex].list[index].quote = "";
|
||||
} else {
|
||||
formData.nodeParams[pIndex].list[index].input = ""
|
||||
const option = getInput(props.model.id, false)
|
||||
formData.nodeParams[pIndex].list[index].input = "";
|
||||
const option = getInput(props.model.id, false);
|
||||
if (option) {
|
||||
quoteOptions.value = option
|
||||
quoteOptions.value = option;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const addCondition = (height) => {
|
||||
const id = randomUUID().replace(/-/g, '')
|
||||
const id = randomUUID().replace(/-/g, "");
|
||||
formData.nodeParams.push({
|
||||
id,
|
||||
withOr: 'and',
|
||||
list: [{
|
||||
name: '',
|
||||
nameQuote: '',
|
||||
nameType: 'input',
|
||||
type: 'input',
|
||||
input: '',
|
||||
quote: ''
|
||||
}]
|
||||
})
|
||||
emits('addAnchor', height, id)
|
||||
withOr: "and",
|
||||
list: [
|
||||
{
|
||||
name: "",
|
||||
nameQuote: "",
|
||||
nameType: "input",
|
||||
type: "input",
|
||||
input: "",
|
||||
quote: "",
|
||||
},
|
||||
],
|
||||
});
|
||||
emits("addAnchor", height, id);
|
||||
|
||||
setTimeout(() => {
|
||||
addNewEdge(props.model.id)
|
||||
}, 50)
|
||||
addNewEdge(props.model.id);
|
||||
}, 50);
|
||||
|
||||
nextTick(() => {
|
||||
changeFormItemHeight()
|
||||
})
|
||||
}
|
||||
changeFormItemHeight();
|
||||
});
|
||||
};
|
||||
|
||||
const addListItem = (pIndex, cIndex) => {
|
||||
formData.nodeParams[pIndex].list.push({
|
||||
name: '',
|
||||
nameQuote: '',
|
||||
nameType: 'input',
|
||||
type: 'input',
|
||||
input: '',
|
||||
quote: ''
|
||||
})
|
||||
name: "",
|
||||
nameQuote: "",
|
||||
nameType: "input",
|
||||
type: "input",
|
||||
input: "",
|
||||
quote: "",
|
||||
});
|
||||
nextTick(() => {
|
||||
changeFormItemHeight()
|
||||
})
|
||||
}
|
||||
changeFormItemHeight();
|
||||
});
|
||||
};
|
||||
|
||||
const removeListItem = (pIndex, cIndex) => {
|
||||
if (cIndex === 0) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
formData.nodeParams[pIndex].list.splice(cIndex, 1)
|
||||
formData.nodeParams[pIndex].list.splice(cIndex, 1);
|
||||
nextTick(() => {
|
||||
changeFormItemHeight()
|
||||
})
|
||||
}
|
||||
changeFormItemHeight();
|
||||
});
|
||||
};
|
||||
|
||||
const changeFormItemHeight = () => {
|
||||
formData.nodeParams.forEach(item => {
|
||||
const node = document.getElementById(item.id)
|
||||
emits('changeAnchor', node.offsetTop, item.id)
|
||||
formData.nodeParams.forEach((item) => {
|
||||
const node = document.getElementById(item.id);
|
||||
emits("changeAnchor", node.offsetTop, item.id);
|
||||
});
|
||||
|
||||
const node = document.getElementById("".concat(props.model.id, "_else"))
|
||||
emits('changeAnchor', node.offsetTop, "".concat(props.model.id, "_else"))
|
||||
}
|
||||
const node = document.getElementById("".concat(props.model.id, "_else"));
|
||||
emits("changeAnchor", node.offsetTop, "".concat(props.model.id, "_else"));
|
||||
};
|
||||
|
||||
const setNodeProperties = async () => {
|
||||
try {
|
||||
const valid = await dynamicForm.value.validate()
|
||||
const valid = await dynamicForm.value.validate();
|
||||
if (valid) {
|
||||
const data = toRaw(formData)
|
||||
const properties = lf.getProperties(props.model.id)
|
||||
const data = toRaw(formData);
|
||||
const properties = lf.getProperties(props.model.id);
|
||||
lf.setProperties(props.model.id, {
|
||||
...properties,
|
||||
...data
|
||||
})
|
||||
emits('contentChange')
|
||||
...data,
|
||||
});
|
||||
emits("contentChange");
|
||||
}
|
||||
} catch (error) {
|
||||
dynamicForm.value.clearValidate()
|
||||
dynamicForm.value.clearValidate();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const visibleChange = (value) => {
|
||||
if (value) {
|
||||
const option = getInput(props.model.id)
|
||||
const option = getInput(props.model.id);
|
||||
if (option) {
|
||||
quoteOptions.value = option
|
||||
quoteOptions.value = option;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const nodeOperatingStatus = ref("NORMAL");
|
||||
const inputJsonData = ref({});
|
||||
@ -256,22 +379,23 @@ watch(
|
||||
() => props.properties,
|
||||
() => {
|
||||
if (props.properties.nodeParams && props.properties.nodeParams.length > 0) {
|
||||
formData.nodeParams = props.properties.nodeParams
|
||||
formData.nodeParams = props.properties.nodeParams;
|
||||
} else {
|
||||
if (formData.nodeParams.length === 0) {
|
||||
addCondition(100)
|
||||
addCondition(100);
|
||||
}
|
||||
}
|
||||
}, {
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
emits('addAnchor', 280, "".concat(props.model.id, "_else"))
|
||||
emits("addAnchor", 280, "".concat(props.model.id, "_else"));
|
||||
|
||||
emits('bindRef', dynamicForm.value)
|
||||
emits("bindRef", dynamicForm.value);
|
||||
|
||||
emitter.on("changeNodeState", (data) => {
|
||||
if (data.nodeId === props.model.id) {
|
||||
@ -301,15 +425,12 @@ onMounted(() => {
|
||||
emits("contentChange");
|
||||
}
|
||||
});
|
||||
|
||||
})
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
emitter.off("changeNodeState");
|
||||
emitter.off("contentChange");
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.node__container {
|
||||
@ -346,8 +467,6 @@ onUnmounted(() => {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.el-button {
|
||||
border: none;
|
||||
}
|
||||
@ -397,7 +516,6 @@ onUnmounted(() => {
|
||||
}
|
||||
|
||||
:deep(.form__container) {
|
||||
|
||||
.el-form-item {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
@ -35,8 +35,8 @@ export default defineConfig(({mode, command}) => {
|
||||
//杨 http://192.168.0.10:13080
|
||||
//赵 http://10.148.108.58:13080
|
||||
// dev http://10.148.20.34:13080
|
||||
// target: VITE_API_URL,
|
||||
target: command === 'build' ? VITE_API_URL : 'http://192.168.0.10:13080',
|
||||
target: VITE_API_URL,
|
||||
// target: command === 'build' ? VITE_API_URL : 'http://192.168.0.10:13080',
|
||||
changeOrigin: true,
|
||||
rewrite: (p) => p.replace(/^\/dev-api/, '')
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user