diff --git a/src/store/modules/flow.js b/src/store/modules/flow.js index 287ae45..c7652d3 100644 --- a/src/store/modules/flow.js +++ b/src/store/modules/flow.js @@ -1,22 +1,22 @@ -import { defineStore } from 'pinia' - -export const useFlowStore = defineStore('flow', { - state: () => ({ - disableForm: false, - deviceList: [] - }), - actions: { - updateDisableForm(value) { - this.disableForm = value - }, - - async getDeviceList() { - const data = await new Promise((resolve, reject) => { - resolve( ['cam1', 'cam2', 'cam3', 'cam4']) - }) - this.deviceList = data - return data - } - } -} -) +import { defineStore } from 'pinia' + +export const useFlowStore = defineStore('flow', { + state: () => ({ + disableForm: false, + deviceList: [] + }), + actions: { + updateDisableForm(value) { + this.disableForm = value + }, + + async getDeviceList() { + const data = await new Promise((resolve, reject) => { + resolve( ['cam1', 'cam2', 'cam3', 'cam4']) + }) + this.deviceList = data + return data + } + } +} +) diff --git a/src/views/flow/components/NodeState.vue b/src/views/flow/components/NodeState.vue index 572c702..7c4b40d 100644 --- a/src/views/flow/components/NodeState.vue +++ b/src/views/flow/components/NodeState.vue @@ -1,51 +1,57 @@ \ No newline at end of file +} + +.nodeState-RUNNING { + display: block; + background-color: #f4f7ff; + + .el-icon { + color: #68a2e4; + font-size: 16px; + animation: rotateAnimation 2s linear infinite; + } +} + diff --git a/src/views/flow/index.vue b/src/views/flow/index.vue index f0f173b..d7d4b35 100644 --- a/src/views/flow/index.vue +++ b/src/views/flow/index.vue @@ -8,21 +8,12 @@
+ 清除上一次运行结果 分组 - 试运行 - 暂停 - 恢复 - 终止 + 试运行 + 暂停 + 恢复 + 终止
发布 - 发布 + 发布
取消 - - 确定 - + 确定
@@ -203,7 +186,7 @@ import { flowPause, flowResume, flowStop, - flowAction + flowAction, } from "@/api/device/flow"; import { getDetect } from "@/api/test/detect"; import { Location } from "@element-plus/icons-vue"; @@ -233,9 +216,11 @@ const drop = (e) => { }, }); - if (!["selectArea", 'branch', 'stopLoop', 'subStart', 'subEnd'].includes(newNode.type)) { + if ( + !["selectArea", "branch", "stopLoop", "subStart", "subEnd"].includes(newNode.type) + ) { showParamsDrawer.value = true; - console.log('newNode', newNode) + console.log("newNode", newNode); paramsDrawerData.value = newNode; } }; @@ -444,8 +429,7 @@ const loopFlowView = async (instId, taskId = null) => { } else { if (!flowInfoData.value.isLog) { if (["PAUSED", "STOPPED"].includes(arr[arr.length - 1]?.status)) { - flowState.value = - arr[arr.length - 1]?.status === "PAUSED" ? "pause" : "stop"; + flowState.value = arr[arr.length - 1]?.status === "PAUSED" ? "pause" : "stop"; } else { flowState.value = "testRunError"; flowStore.updateDisableForm(false); @@ -562,10 +546,7 @@ const initFlow = () => { keys: ["backspace", "delete"], // 覆盖删除键 callback: () => { const activeElem = document.activeElement; - if ( - activeElem.tagName === "INPUT" || - activeElem.tagName === "TEXTAREA" - ) { + if (activeElem.tagName === "INPUT" || activeElem.tagName === "TEXTAREA") { return; // 不处理输入框内的删除 } @@ -657,10 +638,12 @@ const initFlow = () => { }); lf.on("node:dbclick", ({ data, e }) => { - if (["selectArea", 'branch', 'stopLoop', 'subStart', 'subEnd'].includes(data.type)) { + if ( + ["selectArea", "branch", "stopLoop", "subStart", "subEnd"].includes(data.type) + ) { return; } - console.log('data', data) + console.log("data", data); showParamsDrawer.value = true; paramsDrawerData.value = data; }); @@ -734,55 +717,65 @@ const fitView = () => { }; const nodeName = ref(""); -const visible = ref(false) +const visible = ref(false); const formData = reactive({ nodeParams: [], -}) -const rules = reactive({}) -const executeForm = ref() -const nodeAction = ref('') +}); +const rules = reactive({}); +const executeForm = ref(); +const nodeAction = ref(""); const singleNodeExecution = (e) => { const { name, nodeType, nodeParams, action } = e.detail; nodeName.value = name; visible.value = true; - nodeAction.value = action - if (nodeType === 'EDGE') { + nodeAction.value = action; + if (nodeType === "EDGE") { formData.nodeParams = [ { disabled: true, input: "", name: "terminalId", - type: "input" + type: "input", }, - ...nodeParams - ] + ...nodeParams, + ]; } else { - formData.nodeParams = nodeParams + formData.nodeParams = nodeParams; } }; const execute = async () => { const result = await executeForm.value.validate(); if (result) { - const obj = {} - formData.nodeParams.forEach(item => { - obj[item.name] = item.input - }) + const obj = {}; + formData.nodeParams.forEach((item) => { + obj[item.name] = item.input; + }); const res = await flowAction({ action: nodeAction.value, - payload: obj - }) + payload: obj, + }); if (res.code === 200) { - ElMessage.success('执行成功') + ElMessage.success("执行成功"); } else { - ElMessage.error(res.msg) + ElMessage.error(res.msg); } } -} +}; const showParamsDrawer = ref(false); -const paramsDrawerData = ref({}) +const paramsDrawerData = ref({}); + +const clearRun = () => { + const { nodes } = lf.getGraphData(); + nodes.forEach((item) => { + const node = lf.getNodeModelById(item.id); + if (node.closePopover) { + node.closePopover(); + } + }); +} onMounted(() => { justLoadFlow(); @@ -876,8 +869,6 @@ onUnmounted(() => { } } } - - diff --git a/src/views/flow/nodes/common/serviceNode.js b/src/views/flow/nodes/common/serviceNode.js index b351ef7..529dbb8 100644 --- a/src/views/flow/nodes/common/serviceNode.js +++ b/src/views/flow/nodes/common/serviceNode.js @@ -144,16 +144,10 @@ class ServiceNodeHtmlModel extends HtmlNodeModel { this.componentInstance = instance; } - // 验证表单 - async validateForm() { - const result = this.componentInstance.validateForm() - return result + closePopover() { + this.componentInstance.closePopover() } - // setCustomProperties() { - // this.componentInstance.setNodeProperties() - // } - /** * 设置节点属性 * 包括宽度、高度、文本编辑属性等 diff --git a/src/views/flow/nodes/common/serviceNode.vue b/src/views/flow/nodes/common/serviceNode.vue index 0a29d39..db8b26f 100644 --- a/src/views/flow/nodes/common/serviceNode.vue +++ b/src/views/flow/nodes/common/serviceNode.vue @@ -1,6 +1,6 @@