jbxl-workflow/src/mixins/node.mixins.js

流程图

import {inject, ref, getCurrentInstance, watch} from "vue";
import {deepClone} from "@/utils/common";
export const useNode = () => {
    // /**
    //  * 通过该方法去处理所有上游节点的运行结果，根据当前节点的paramsData，如果选用了上游节点的输出参数，那么就需要将上游节点的输出参数的值赋值给当前节点的输入参数
    //  * */
    const basicNode = ref()
    const componentMethods = ref({})
    // 注册方法的函数
    const registerMethod = (methodName, method) => {
        componentMethods.value[methodName] = method
    }
    // 调试表单引用
    const debugFormRef = ref()
    const debugModel = ref({})
    // 输入参数的抽屉
    const debugDrawerVisible = ref(false)
    // 单节点运行
    const singleRunDebug = async (cb) => {
        if (cb && typeof cb === "function") {
            if (await cb() === true) {
                debugDrawerVisible.value = true
                if (selfNode.value) {
                    const list = deepClone(selfNode.value.paramsData?.list)
                    // 单节点运行， 每个表单项都是必填
                    debugParamsList.value = list.map(item => {
                        item.required = true
                        return item
                    })
                }
            }
        }
    }
    // 点击单节点运行抽屉确定
    const singleRunSubmit = () => {
        if (debugFormRef.value) {
            debugFormRef.value.runDebug(({model, list}) => {
                const {handleSingleRunDebug} = componentMethods.value || {}
                if (handleSingleRunDebug && typeof handleSingleRunDebug === 'function') {
                    handleSingleRunDebug({model, list})
                }
            })
        }
    }
    const setShowParamsResult = (show) => {
        basicNode.value?.setShowParamsResult?.(show)
    }
    // 调试参数列表
    const debugParamsList = ref([])
    const inputParamsRef = ref()
    // const getNode = ref()
    // 自定义业务数据对象
    const selfNode = ref()
    // 当前节点对象
    const node = ref()
    // 标题
    const title = ref()
    // 是否全部开启
    const allIsOpen = ref()
    // 描述
    const description = ref()
    // 参数数据
    const paramsData = ref()
    // 输出参数数据
    const outputParamsData = ref()
    // 是否选中当前节点
    const selected = ref(false)
    // 当前节点未选中时的 z-index
    let zIndex
    const handleAdd = () => {
        paramsData.value.add()
    }
    const validate = async () => {
        // return inputParamsRef.value?.validate;
        //
        if (!inputParamsRef.value?.validate) return true
        return await inputParamsRef.value.validate()
    }
    const setZIndex = (index) => {
        console.log('node', node.value)
        // console.log('node.setZIndex', node.setZIndex)
        node.value.setZIndex(index)
        const zIndex = node.value.getZIndex()
        console.log('zIndex', zIndex)
    }
    const mounted = (cb) => {
        const getNode = inject('getNode')
        node.value = getNode()
        const data = getNode().getData()
        selfNode.value = data.self
        selfNode.value.vueInstance = getCurrentInstance()
        title.value = data.title
        description.value = data.description
        allIsOpen.value = data.allIsOpen
        paramsData.value = data.self.paramsData
        outputParamsData.value = data.self.outputParamsData
        globalThis._graph?.eventBus?.on('inner-event:selectNode', (selectedNodeList) => {
            selected.value = selectedNodeList.map(item => item.id)?.includes(node.value.id)
            if (selected.value) {
                if (!zIndex) {
                    zIndex = node.value?.getZIndex()
                }
                // node.value?.setZIndex(9999)
                node.value?.toFront({deep: true})
            } else {
                if (zIndex) {
                    node.value?.setZIndex(zIndex)
                }
            }
        })
        cb && cb(getNode())
    }
    // 设置运行结果状态
    const setRunResultStatus = (status) => {
        basicNode.value?.setRunResultStatus?.(status)
    }
    // 显示运行样式
    const showResult = (show = true) => {
        basicNode.value?.showResult?.(show)
    }
    // 设置运行时间
    const setTime = (time) => {
        basicNode.value?.setTime?.(time)
    }
    // 设置运行出参
    const setOutputParams = (params) => {
        basicNode.value?.setOutputParams?.(params)
    }
    // 设置运行入参
    const setInputParams = (params) => {
        basicNode.value?.setInputParams?.(params)
    }

    return {
        setTime, setOutputParams, setInputParams,
        showResult,
        basicNode,
        // changeShowResult,
        // getGraph,
        mounted,
        node,
        title,
        description,
        paramsData,
        allIsOpen,
        handleAdd,
        selfNode,
        outputParamsData,
        inputParamsRef,
        selected,
        validate,
        setRunResultStatus,
        debugParamsList,
        debugDrawerVisible,
        singleRunDebug,
        singleRunSubmit,
        debugFormRef,
        debugModel,
        registerMethod,
        setShowParamsResult,
        setZIndex
    }
}