宜搭(子表单增加一项序号加1)

最新推荐文章于 2024-08-05 18:28:04 发布

∂∂∂∂

最新推荐文章于 2024-08-05 18:28:04 发布

阅读量369

点赞数 3

文章标签：低代码

本文链接：https://blog.csdn.net/2301_80286061/article/details/135922500

版权

该篇文章介绍了如何在Vue项目中，使用`setOrderNum`函数为表格组件中的字段设置动态序号，包括普通序号、带前缀和后缀的序号。主要关注点在于处理表格数据的更新和页面加载时的序号初始化。

摘要由CSDN通过智能技术生成

// 生成子表单序号
// tableFieldId：子表单组件唯一标识
// orderFieldId：序号字段唯一标识
// beforeText：序号前缀文案
// afterText：序号后缀文案
export function setOrderNum(tableFieldId, orderFieldId, beforeText = '', afterText = '') {
  if (!tableFieldId || !orderFieldId) { return };
  const tableField = this.$(tableFieldId);
  const items = tableField.getItems();
  items.forEach((item, index) => {
    const updateObject = {};
    updateObject[orderFieldId] = `${beforeText}${index + 1}${afterText}`;
    tableField.updateItemValue(item, updateObject);
  });
}

export function onTableChange({ value, extra }) {
  const { formGroupId, from, changes = {}, tableFieldId } = extra || {};
  // 必须，避免使用 updateItemValue 更新子表数据后，再次触发 onChange 陷入死循环
  if (from === 'setItemValue' || from === 'form_change') { return };
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvb'); // 普通序号
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvc', '前文案-'); // 带前缀序号
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvd', '', '-后文案'); // 带后缀序号
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvg', '前文案-', '-后文案'); // 带前后缀序号
}

// 当页面渲染完毕后马上调用下面的函数，这个函数是在当前页面 - 设置 - 生命周期 - 页面加载完成时中被关联的。
export function didMount() {
  // 详情页不触发
  if (!this.utils.isSubmissionPage()) { return };
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvb'); // 普通序号
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvc', '前文案-'); // 带前缀序号
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvd', '', '-后文案'); // 带后缀序号
  this.setOrderNum('tableField_lblkphmo', 'textField_lblyqnvg', '前文案-', '-后文案'); // 带前后缀序号
}