kintone-helper-extenstion/src/page/detail/field-label-processor.js

/**
 * 详情页面字段标签处理器模块
 * 负责处理不同页面上的字段和间距标签
 */

import {
  getColumnWidths,
  safelyInsertLabel,
  safelyAppendLabel
} from '@/utils/dom-utils.js';
import {
  createFieldWithLabels,
  createFieldLabels
} from './dom.js';
import { FieldTypeChecker } from '@/utils/field-utils.js';
import { STYLES } from '@/features/add-field-label/settings.js';
import { LAYOUT_TYPES } from '@/utils/constants.js';

/**
 * 用于处理不同页面上字段和间距标签的字段标签处理器类
 */
export class FieldLabelProcessor {
  /**
   * 构造函数
   * @param {Object} options - 配置选项
   * @param {number} options.appId - App ID
   * @param {string} options.pageType - 页面类型上下文（例如，'detail'，'edit'）
   */
  constructor(options = {}) {
    this.appId = options.appId;
    this.pageType = options.pageType;
  }

  /**
   * 返回是否为预览模式
   * @returns {boolean} 是否预览
   */
  isPreview() {
    return false;
  }

  beforeProcess(rawFieldsMap, rawLayout, fields, spacers) {

  }

  /**
   * 创建表类型标签元素
   * @param {Object} field - 字段配置
   * @returns {HTMLElement} 标签元素
   */
  createTableLabel(field) {
    const tableCodeLabel = createFieldWithLabels({
      code: field.code,
      type: field.type,
    });
    tableCodeLabel.style.display = 'block';
    return tableCodeLabel;
  }

  /**
   * 为子表字段元素添加标签
   * @param {Object} field - 字段配置信息
   * @param {HTMLElement} fieldElement - 字段 DOM 元素
   */
  addSubtableLabel(field, fieldElement) {
    // 在表上方添加字段代码标签
    const tableCodeLabel = this.createTableLabel(field);
    safelyInsertLabel(fieldElement, tableCodeLabel);

    // 添加列标签
    const fieldNames = Object.keys(field.fields);
    const columnWidths = getColumnWidths(fieldElement, field.type);
    const columnLabels = createFieldLabels(fieldNames, columnWidths, field.type);

    safelyInsertLabel(fieldElement, columnLabels);
  }

  /**
   * 为引用表字段元素添加标签
   * @param {Object} field - 字段配置信息
   * @param {HTMLElement} fieldElement - 字段 DOM 元素
   */
  addReferenceTableLabel(field, fieldElement) {
    // 在引用表上方添加字段代码标签
    safelyInsertLabel(fieldElement, this.createTableLabel(field));

    // 添加显示字段标签（如果存在）
    if (field.referenceTable?.displayFields) {
      const displayFields = field.referenceTable.displayFields;
      const columnWidths = getColumnWidths(fieldElement, field.type);
      const hasData = !!fieldElement.querySelector('tbody > tr');
      const displayLabels = createFieldLabels(displayFields, columnWidths, field.type, hasData);

      safelyInsertLabel(fieldElement, displayLabels);
    }
  }

  /**
   * 为组字段元素添加标签
   * @param {Object} field - 字段配置信息
   * @param {HTMLElement} fieldElement - 字段 DOM 元素
   */
  addGroupLabel(field, fieldElement) {
    const parentElement = fieldElement.parentElement;
    if (!parentElement) {
      console.warn(`[Kintone Helper Extension] Parent element for group field ${field.code} does not exist`);
      return;
    }

    const groupLabel = createFieldWithLabels({
      code: field.code,
      type: field.type,
    });

    safelyInsertLabel(parentElement, groupLabel);
  }

  /**
   * 为标准字段元素添加标签
   * @param {Object} field - 字段配置信息
   * @param {HTMLElement} fieldElement - 字段 DOM 元素
   */
  addStandardFieldLabel(field, fieldElement) {
      const fieldLabel = createFieldWithLabels({
        code: field.code,
        type: field.type,
      });

      safelyInsertLabel(fieldElement, fieldLabel);
  }

  /**
   * 处理并为页面上的所有字段元素添加标签
   * @param {Array} fieldsWithLabels - 已处理的字段对象数组
   */
  processFieldLabels(fieldsWithLabels) {
    try {
      // 统计处理结果
      let processedCount = 0;
      let skippedCount = 0;

      for (const field of fieldsWithLabels) {
        try {
          // 获取字段元素
          const fieldElement = kintone.app.record.getFieldElement(field.code);

          if (!fieldElement) {
            skippedCount++;
            continue;
          }

          // 根据字段类型选择合适的标签添加方法
          if (FieldTypeChecker.isSubtable(field)) {
            this.addSubtableLabel(field, fieldElement);
          } else if (FieldTypeChecker.isReferenceTable(field)) {
            this.addReferenceTableLabel(field, fieldElement);
          } else if (FieldTypeChecker.isGroup(field)) {
            this.addGroupLabel(field, fieldElement);
          } else {
            this.addStandardFieldLabel(field, fieldElement);
          }

          processedCount++;

        } catch (fieldError) {
          console.error(`[Kintone Helper Extension] Error occurred while processing label for field ${field.code}:`, fieldError);
          skippedCount++;
        }
      }

      console.log(`[Kintone Helper Extension] Field label processing completed: ${processedCount} successful, ${skippedCount} skipped`);

    } catch (error) {
      console.error('[Kintone Helper Extension] Error occurred while processing field labels:', error);
      throw error;
    }
  }

  /**
   * 处理并为页面上的间距元素添加标签
   * @param {Array} spacerElements - 间距元素配置数组
   */
  processSpacerLabels(spacerElements) {
    try {
      // 统计处理结果
      let processedCount = 0;
      let skippedCount = 0;

      for (const spacer of spacerElements) {
        try {
          // 获取间距元素
          const spacerElement = kintone.app.record.getSpaceElement(spacer.elementId);

          if (!spacerElement) {
            skippedCount++;
            continue;
          }
          // 添加标签并设置边框
          const spacerLabel = createFieldWithLabels({
            code: spacer.elementId,
            type: spacer.type,
          });

          safelyAppendLabel(spacerElement, spacerLabel);

          // 添加红色虚线边框
          spacerElement.style.border = STYLES.SPACER_BORDER;

          processedCount++;

        } catch (spacerError) {
          console.error(`[Kintone Helper Extension] Error occurred while processing label for spacer element ${spacer.elementId}:`, spacerError);
          skippedCount++;
        }
      }

      document.querySelectorAll('.spacer-cybozu:not([id])').forEach(spacerElement => {
        spacerElement.style.border = STYLES.SPACER_BORDER;
        safelyAppendLabel(spacerElement, createFieldWithLabels({
          code: '',
          type: LAYOUT_TYPES.SPACER,
        }));
      });

  } catch (error) {
    console.error('[Kintone Helper Extension] Error occurred while processing spacer element labels:', error);
    throw error;
  }
  }
}