Fill in the subform with multiple select subforms associated with the form

JS 动作面板 - 前端代码开放 | 钉钉宜搭·帮助中心

能力免费版轻享版专业版专属版页面JS代码不支持不支持支持支持1. 功能概述用户可以通过宜搭中的「动作面板」去写 JS 代码，从而实现自己的业务逻辑或逻辑判断。通过动作面板，您可以「更加方便的组织和复用代码」、「实现复杂交互」。JS 面板注意：通过JS面板编写的逻辑一般情况下是不会对历史数据生效...

https://docs.aliwork.com/docs/yida_support/lbtl0t/ocmxyv

1. Usage scenarios

This example describes how to fill the subform data of other pages into the subform of the current page on the YIDA form page.

2. Implement functions

2.1. Create form page

2.2. Configure a data source

Reference documents:Query Form instance details based on form instance ID

The interface configuration is as follows:

2.3. Copy the following code to Page JS

Note that you modify the values of the following option parameters.

export async function onChange({ value }) {
  const option = {
    target: 'tableField_lbafn35n', // 目标子表单组件唯一标识
    current: 'tableField_lbaft5oa', // 当前子表单组件唯一标识
    relation: [
      // 字段映射关系 targetField：目标子表单字段唯一标识， currentField：当前子表单字段唯一标识
      {
        targetField: 'textField_lbafn35q',
        currentField: 'textField_lbaft5ob' // 菜品名
      }, {
        targetField: 'numberField_lbafn35r',
        currentField: 'numberField_lbaft5oc' // 价格
      }
    ]
  };
  const { target, current, relation } = option;
  if (value.length) {
    const closeLoading = this.utils.toast({
      title: '数据获取中...',
      type: 'loading'
    });
    const tableData = [];
    const failedInstId = [];
    for (let i = 0; i < value.length; i++) {
      const delay = i === 0 ? 0 : 200;
      await new Promise((resolve => {
        // 注意节流，每次请求间隔 200 ms
        setTimeout(async () => {
          try {
            await this.dataSourceMap.getDataById.load({
              formInstId: value[i].instanceId
            }).then(res => {
              tableData.push(...res.formData[target]);
            }).catch(error => {
              closeLoading();
              this.utils.toast({
                title: error.message,
                type: 'error'
              });
            });
          } catch (e) {
            // 把失败的实例 id 收集起来
            failedInstId.push(value[i].instanceId);
          }
          resolve();
        }, delay);
      }));
    };
    const result = [];
    for (let j = 0; j < tableData.length; j++) {
      let itemObj = {}
      for (let k = 0; k < relation.length; k++) {
        itemObj[relation[k].currentField] = tableData[j][relation[k].targetField]
      };
      result.push(itemObj);
    };
    closeLoading();
    this.$(current).setValue(result);
  } else {
    this.$(current).reset();
  };
}

2.4. Component event binding

3. Effect

4. Try it online

示例中心 | 开发者赋能平台

AI智能体时代，全新宜搭。业务创新，一搭就行。

https://www.aliwork.com/o/coc?tplUuid=TPL_TQEPBW95MEQA0IYKRX14&from=yuque_subject

5. Upgrade the associated form function

2023.10.30 版本更新-基础产品力升级 | 钉钉宜搭·帮助中心

能力发布新增：子表单默认值整体支持数据联动新增：关联表单数据填充升级支持设置子表筛选条件及批量添加数据新增：关联表单数据源支持子表且支持子表填充新增：自动化更新流程数据新增：导入/导出整体功能升级数据导入链路优化及Excel模板更新适配更多高频场景的导入组件支持多种导出数据展示方式及批量查看图...

https://docs.aliwork.com/docs/yida_updates/augw2gdkfco8glqq#mZa14