# 线上项目流程升级

# 计价项目

# 审批按钮点击前审批按钮点击前回调方法--可用于校验业务表单

1、@adam/flow版本

  • 升级到固定版本 1.0.11

2、技术栈

使用eventBus中央事件总线传递方法:审批按钮点击时发送事件,业务系统接收。

注意:接收事件采用同步。

// @adam/flow组件 源码
eventBus
    .emit(BEFORE_TRANSACTION_APPROVE_EVENT)
    .then(() => {
    // 通过
    this[flag]()
    console.log('校验通过')
})
    .catch(reject => {
    this.$message.warning('请先处理表单!')
    // 失败
    console.log('校验失败')
})
1
2
3
4
5
6
7
8
9
10
11
12
13

3、抛出方法和参数:

eventBus // 中央事件总线方法
BEFORE_TRANSACTION_APPROVE_EVENT // 事件名称
1
2

业务系统接收事件后,必须返回一个Promise对象,以确保能够同步进行

4、示例:业务系统使用,此处仅为示例

// 引入eventBus和事件名称
import { eventBus, BEFORE_TRANSACTION_APPROVE_EVENT } from '@adam/flow'

// 接收事件传递,常在created、mounted中
eventBus.on(
    BEFORE_TRANSACTION_APPROVE_EVENT,
    () => {
 // !!! 此处需返回一个Promise !!!
 // 接收到后做业务系统操作,此处仅为示例
    return this.transactionAgree()
    },
    true // 同步参数,必须传递
)

// 调用校验方法:
transactionAgree() {
    return new Promise((resolve, reject) => {
        this.$refs.form.validate((valid, formData) => {
            if (valid) {
                resolve(formData)
            } else {
             reject(valid)
            }
        })
    })
}

// 销毁事件,在beforeDestroy中
eventBus.off(BEFORE_TRANSACTION_APPROVE_EVENT)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29