useFlowForm

在任何地方调起流程表单

使用

import { useFlowForm } from '@yusui/flow-pages'

const { open, close } = useFlowForm({ type: 'drawer' })
function openFlow(row: FlowOps) {
  open({
    flowKey: row.flowKey,
    taskId: row.taskId,
    instanceId: row.flowInstanceId,
    onComplete() {
      close()
      getDataList()
    },
  })
}

类型定义

export type UseFlowFormType = 'dialog' | 'drawer' | 'window'

/** { [onXxx]?: Function } */
export type UseFlowFormEvents<K extends keyof FlowFormEmits = keyof FlowFormEmits> = {
  [P in `on${Capitalize<K>}`]?: (...args: Parameters<FlowFormEmits[K]>) => void
}

export type UseFlowFormProps = Partial<FlowFormProps> & UseFlowFormEvents

export interface UseFlowFormOptions extends UseFlowFormProps {
  /**
   * 弹窗类型
   * @default 'drawer'
   */
  type?: UseFlowFormType
  /**
   * window.open参数
   * @default ['', 'flow-form', 'left=0,top=0,width=1600,height=900']
   */
  window?: Parameters<typeof window.open>
  /**
   * 弹窗组件属性
   * @default { width: '80%', size: '80%', top: '100px', fullscreen: true, destroyOnClose: true }
   */
  overlay?: Partial<DialogProps | DrawerProps>
}

export type UseFlowFormReturn = ReturnType<typeof useFlowForm>