事件API

事件API

一、流程表单的API

二、流程引擎传来的参数

• 例：办理时返回的参数
  

• 代码例子：

<template>
  <el-form :model="form">
  </el-form>
</template>

<script>

export default {
  props: {
    // 流程的数据
    data: {
      default() {
        return {}
      },
    },
    // 表单状态
    state: {
      default() {
        return 'add'
      },
    },
  },
  data() {
    return {
      form: {},
    }
  },
  watch: {
    data: {
      handler() {},
      deep: true,
    },
  },
  mounted() {
    let id = this.data.id

    if (id) {
      this.form.id = id
      this.loadData()
    }
  },
  methods: {
    loadData() {
      // todo 重新加载业务数据，回显
      this.$REQUEST({
        url: `/xxx-api/v1/contracts/query`,
        method: 'GET',
        params: { id: this.form.id },
      }).then((res) => {
        this.form = res.data
        this.$emit('form', this.form)
      })
    },

    // 提交表单保存
    submit(type) {
      if (type == 'start') {
        // todo 调用保存业务数据接口
        this.$REQUEST({
          url: `/xxx-api/v1/contracts/xxxx/add`,
          method: 'POST',
          data: this.form,
        }).then((res) => {
          this.form = res.data

          // 必需-回调 id
          this.$emit('next', this.form)
        })
      } else {
        // todo 调用保存业务数据接口
      }
    },

    // 最终节点执行
    endSubmit() {
      // todo 非必需 - 调用业务接口
    },
  },
}
</script>

<style lang="less" scoped>
</style>

三、节点规则，所必需数据，否则规则无法判断

• 回调数据，办理时，需把业务数据传到 流程中心 , 否则规则无法判断

• 在 index.vue 传到父级

     if (!this.data.id) {
       return
     }
     // 根据id获取详情
     this.$REQUEST({
       url: `/xxx-api/v1/contracts/query`,
       method: 'GET',
       params: { id: this.data.id },
     }).then((res) => {
       this.form = res.data
       this.$emit('form', this.form)
     })

四、注意点

• 请求的方法
  1/ this.$REQUEST
  2/ fetch()
  注：不能使用axios；不能import @/api文件里的。部分ES6语法不可用

• 创建表单建模 / mate绑定formId / 创建流程服务 / 绑定表单js

• 预览表单 — /xx路由/preview

• 流程服务 编辑 / 更新js / 沙箱安装 / 控制台 / 应用套件 / 编辑流程 / 发布