/**
 * 表单字段渲染器
 * 递归渲染表单字段，处理普通字段、栅格布局、布局组件
 */

import React from 'react';
import { Form, Input } from 'antd';
import type { FieldConfig, FormConfig } from '../types';
import type { FieldState } from '../utils/linkageHelper';
import { mergeValidationRules } from '../utils/validationHelper';
import { computeFieldState, FieldClassifier } from '../utils/fieldStateHelper';
import FieldRenderer from './FieldRenderer';
import GridFieldPreview from './GridFieldPreview';

/**
 * 隐藏字段组件（内部使用）
 * 用于渲染隐藏字段（不显示任何 UI，但参与表单提交）
 */
const HiddenField: React.FC<{ fieldName: string }> = ({ fieldName }) => {
  return (
    <Form.Item name={fieldName} noStyle>
      <Input type="hidden" />
    </Form.Item>
  );
};

export interface FormFieldsRendererProps {
  /** 字段列表 */
  fields: FieldConfig[];
  /** 表单配置 */
  formConfig: FormConfig;
  /** 字段状态（来自联动规则） */
  fieldStates: Record<string, FieldState>;
}

/**
 * 表单字段渲染器组件
 * 
 * 功能：
 * - 递归渲染所有字段
 * - 处理布局组件（文本、分割线）
 * - 处理栅格布局
 * - 应用联动规则的字段状态
 * - 应用验证规则
 */
const FormFieldsRenderer: React.FC<FormFieldsRendererProps> = ({
  fields,
  formConfig,
  fieldStates,
}) => {
  const renderFields = (fieldList: FieldConfig[]): React.ReactNode => {
    return fieldList.map((field) => {
      // 使用访问者模式：根据字段类型分类处理
      const fieldType = FieldClassifier.classify(field);
      
      // 布局组件：文本、分割线
      if (fieldType === 'layout') {
        return (
          <div key={field.id} style={{ marginBottom: 8 }}>
            <FieldRenderer field={field} isPreview={true} />
          </div>
        );
      }

      // 栅格布局：使用专门的预览组件
      if (fieldType === 'grid') {
        return (
          <GridFieldPreview
            key={field.id}
            field={field}
            formConfig={formConfig}
            fieldStates={fieldStates} // ✅ 传递 fieldStates 以支持栅格内字段的联动规则
          />
        );
      }

      // 计算字段最终状态（统一处理 hidden, readonly, disabled, visible, required）
      const fieldState = fieldStates[field.name] || {};
      const computedState = computeFieldState(field, fieldState);

      // 如果字段被隐藏，使用隐藏字段组件
      if (!computedState.isVisible) {
        return (
          <HiddenField
            key={field.id}
            fieldName={field.name}
          />
        );
      }

      // 合并验证规则
      const allRules = mergeValidationRules(field, computedState.isRequired);

      // 普通表单组件使用 Form.Item 包裹
      return (
        <Form.Item
          key={field.id}
          label={field.label}
          name={field.name}
          colon={true}
          rules={allRules}
        >
          <FieldRenderer
            field={{ 
              ...field, 
              disabled: computedState.isDisabled, 
              readonly: computedState.isReadonly 
            }}
            isPreview={true}
          />
        </Form.Item>
      );
    });
  };

  return <>{renderFields(fields)}</>;
};

export default FormFieldsRenderer;

