# 根据当前用户在视图行内动态显示“审批流程”按钮

# 1. 场景介绍

以订单审批流程为例，讲解在低开视图的行记录中增加“审批流程”按钮，用于当前用户执行自己名下的待办任务。

# 2. 效果展示

效果展示如下：

# 3. 实现思路

添加“视图查询后”事件，获取视图所有数据；而后根据接口：/api/bfp/framework/actions/biz/process-info，获取业务主键对应的流程信息，如当前用户下的工作项信息；最后根据工作项信息判断按钮显隐。

# 4. 操作步骤

# 4.1 视图内添加变量

添加视图变量：this.v_result，用于传递数据，接收“视图查询后”事件的数据结果，供给行内按钮做显隐判断。

# 4.2 添加“视图查询后”事件

获取视图所有数据，并遍历获取每行数据对应的流程信息。代码示例如下：

// 请求获取视图所有数据
const url =
    'http://192.168.16.179:8081/AFCENTER/api/lowcode/models/actions/query-with-page?entityName=com.sample.suppliermgr.supplierdata.OrderWarehousingentry';
const headers = {
    "Content-Type": "application/json"
};
const responseData = await this.Ajax.post(url, {}, {
    headers: headers
});

// 提取视图数据中的业务主键id并返回id数组
const ids = responseData.data.map(item => item.id);

// 遍历id数组请求接口，获取业务主键对应流程信息，如当前用户下的工作项信息
const results = [];
for (let id of ids) {
    const bizIds = [id];
    const url = "http://192.168.16.179:8081/AFCENTER/api/bfp/framework/actions/biz/process-info";
    const params = {
        bizIds: bizIds,
        entityName: "com.sample.suppliermgr.supplierdata.OrderWarehousingentry"
    };
    try {
        const response = await this.Ajax.post(url, params);
        if (response && response.length > 0) {
            results.push(response[0]);
        }
    }
    catch (error) {
        console.error('请求失败:', error);
    }
}

// 处理返回结果，并赋给变量 this.v_result
this.v_result = {}
for (let item of results) {
    if (item.workItemIds != null && item.workItemIds.length > 0) {
        this.v_result[item.bizId] = true
    }
    else {
        this.v_result[item.bizId] = false
    }
}

# 4.3 添加行内按钮“审批流程”

# 4.3.1 设置行内按钮的动作

// 获取行数据对应的workItemId
const bizIds = [formData.id];
const url = "http://192.168.16.179:8081/AFCENTER/api/bfp/framework/actions/biz/process-info";
const params = {
  bizIds: bizIds,
  entityName: "com.sample.suppliermgr.supplierdata.OrderWarehousingentry"
};
this.Ajax.post(url, params).then(response => {
  if (response && Array.isArray(response) && response.length > 0) {
    const workItemId = response[0].workItemIds[0];
    // 根据 workItemId 打开对应待办流程弹窗
    this.Api.openDialog({
      "dialog": {
        "title": '审批流程',
        "width": '90%',
        "top": '10px',
        "modal": true,
        "mode": 'dialog'
      },
      "props": {
        "url": "/module/bfp/page/bfp_proc_framework",
        "pageType": 'handle',
        "flowType": 'todo',
        "workItemID": workItemId,
        "appName": 'AFCENTER',
        "signWorkItem": 'true',
        "_blank": 'true',
        "shortTitle": 'Afcenter',
        "openMode": "component"
      }
    })
  }
});

# 4.3.2 设置行内按钮的控制

v_result && v_result[formData.id]