/**
 * 웹타입을 V2 컴포넌트 시스템으로 매핑하는 유틸리티
 */

export interface WebTypeMapping {
  webType: string;
  componentId: string;
  description: string;
}

export interface V2ComponentMapping {
  componentType: string; // v2-input, v2-select, v2-date 등
  config: Record<string, any>; // 컴포넌트별 기본 설정
}

/**
 * 웹타입 → V2 컴포넌트 매핑 테이블
 */
export const WEB_TYPE_V2_MAPPING: Record<string, V2ComponentMapping> = {
  // 텍스트 입력 계열 → V2Input
  text: {
    componentType: "v2-input",
    config: { inputType: "text", format: "none" },
  },
  email: {
    componentType: "v2-input",
    config: { inputType: "text", format: "email" },
  },
  password: {
    componentType: "v2-input",
    config: { inputType: "password" },
  },
  tel: {
    componentType: "v2-input",
    config: { inputType: "text", format: "tel" },
  },
  url: {
    componentType: "v2-input",
    config: { inputType: "text", format: "url" },
  },
  textarea: {
    componentType: "v2-input",
    config: { inputType: "textarea", rows: 3 },
  },

  // 숫자 입력 → V2Input
  number: {
    componentType: "v2-input",
    config: { inputType: "number" },
  },
  decimal: {
    componentType: "v2-input",
    config: { inputType: "number", step: 0.01 },
  },

  // 날짜/시간 → V2Date
  date: {
    componentType: "v2-date",
    config: { type: "date", format: "YYYY-MM-DD" },
  },
  datetime: {
    componentType: "v2-date",
    config: { type: "datetime", format: "YYYY-MM-DD HH:mm" },
  },
  time: {
    componentType: "v2-date",
    config: { type: "time", format: "HH:mm" },
  },

  // 선택 입력 → V2Select
  select: {
    componentType: "v2-select",
    config: { mode: "dropdown", source: "static", options: [] },
  },
  dropdown: {
    componentType: "v2-select",
    config: { mode: "dropdown", source: "static", options: [] },
  },
  radio: {
    componentType: "v2-select",
    config: { mode: "radio", source: "static", options: [] },
  },
  checkbox: {
    componentType: "v2-select",
    config: { mode: "checkbox", source: "static", options: [] },
  },
  boolean: {
    componentType: "v2-select",
    config: { mode: "toggle", source: "static" },
  },

  // 코드/참조 → V2Select (소스: code)
  code: {
    componentType: "v2-select",
    config: { mode: "dropdown", source: "code", codeGroup: "" },
  },

  // 엔티티/참조 테이블 → V2Select (소스: entity)
  entity: {
    componentType: "v2-select",
    config: { mode: "dropdown", source: "entity", searchable: true },
  },

  // 카테고리 → V2Select (소스: category)
  category: {
    componentType: "v2-select",
    config: { mode: "dropdown", source: "category" },
  },

  // 파일/이미지 → V2 파일 업로드
  file: {
    componentType: "v2-file-upload",
    config: { multiple: true, accept: "*/*", maxFiles: 10 },
  },
  image: {
    componentType: "v2-file-upload",
    config: { multiple: false, accept: "image/*", maxFiles: 1, showPreview: true },
  },
  img: {
    componentType: "v2-file-upload",
    config: { multiple: false, accept: "image/*", maxFiles: 1, showPreview: true },
  },

  // 버튼은 V2 컴포넌트에서 제외 (기존 버튼 시스템 사용)
  button: {
    componentType: "button-primary", // 레거시 유지
    config: {},
  },

  // 라벨/텍스트 표시 → V2Input (readonly)
  label: {
    componentType: "v2-input",
    config: { inputType: "text", readonly: true },
  },
};

/**
 * 레거시 매핑 테이블 (하위 호환성)
 */
export const WEB_TYPE_COMPONENT_MAPPING: Record<string, string> = {
  text: "v2-input",
  email: "v2-input",
  password: "v2-input",
  tel: "v2-input",
  url: "v2-input",
  number: "v2-input",
  decimal: "v2-input",
  textarea: "v2-input",
  date: "v2-date",
  datetime: "v2-date",
  time: "v2-date",
  select: "v2-select",
  dropdown: "v2-select",
  checkbox: "v2-select",
  radio: "v2-select",
  boolean: "v2-select",
  code: "v2-select",
  entity: "v2-select",
  category: "v2-select",
  file: "v2-file-upload",
  image: "v2-file-upload",
  img: "v2-file-upload",
  button: "button-primary",
  label: "v2-input",
};

/**
 * 웹타입을 V2 컴포넌트 ID로 변환
 */
export function getComponentIdFromWebType(webType: string): string {
  const mapping = WEB_TYPE_V2_MAPPING[webType];

  if (!mapping) {
    console.warn(`웹타입 "${webType}"에 대한 V2 매핑을 찾을 수 없습니다. 기본값 'v2-input' 사용`);
    return "v2-input";
  }

  console.log(`웹타입 "${webType}" → V2 컴포넌트 "${mapping.componentType}" 매핑`);
  return mapping.componentType;
}

/**
 * 웹타입에 대한 V2 컴포넌트 기본 설정 가져오기
 */
export function getV2ConfigFromWebType(webType: string): Record<string, any> {
  const mapping = WEB_TYPE_V2_MAPPING[webType];

  if (!mapping) {
    console.warn(`웹타입 "${webType}"에 대한 V2 설정을 찾을 수 없습니다. 기본 설정 사용`);
    return { inputType: "text" };
  }

  return { ...mapping.config };
}

/**
 * 웹타입에 대한 전체 V2 매핑 정보 가져오기
 */
export function getV2MappingFromWebType(webType: string): V2ComponentMapping {
  const mapping = WEB_TYPE_V2_MAPPING[webType];

  if (!mapping) {
    return {
      componentType: "v2-input",
      config: { inputType: "text" },
    };
  }

  return {
    componentType: mapping.componentType,
    config: { ...mapping.config },
  };
}

/**
 * 컬럼 정보를 기반으로 V2 컴포넌트 설정 생성
 */
export function createV2ConfigFromColumn(column: {
  widgetType: string;
  columnName: string;
  columnLabel?: string;
  codeCategory?: string;
  inputType?: string;
  required?: boolean;
  detailSettings?: string | Record<string, any>; // 테이블 타입 관리의 detail_settings
  // 직접 저장된 참조 정보 (column_labels 테이블)
  referenceTable?: string;
  referenceColumn?: string;
  displayColumn?: string;
}): { componentType: string; componentConfig: Record<string, any> } {
  const mapping = getV2MappingFromWebType(column.widgetType);

  // detailSettings 파싱 (문자열이면 JSON 파싱)
  let parsedDetailSettings: Record<string, any> = {};
  if (column.detailSettings) {
    if (typeof column.detailSettings === "string") {
      try {
        parsedDetailSettings = JSON.parse(column.detailSettings);
      } catch (e) {
        // JSON이 아닌 문자열일 수 있음 (예: "참조테이블: 회사관리")
        console.warn("detail_settings 파싱 실패 (문자열일 수 있음):", column.detailSettings);
      }
    } else {
      parsedDetailSettings = column.detailSettings;
    }
  }

  const componentConfig: Record<string, any> = {
    ...mapping.config,
    webType: column.widgetType, // 원본 웹타입 보존
    // DB의 input_type이 있으면 사용, 없으면 매핑에서 가져온 값 유지
    inputType: column.inputType || mapping.config.inputType || "text",
    placeholder: parsedDetailSettings.placeholder || column.columnLabel || column.columnName,
  };

  // 코드 타입인 경우 코드 카테고리 추가
  if (column.widgetType === "code" && column.codeCategory) {
    componentConfig.codeGroup = column.codeCategory;
    componentConfig.codeCategory = column.codeCategory;
  }

  // 엔티티 타입인 경우 참조 테이블/컬럼 정보 추가
  if (column.widgetType === "entity") {
    componentConfig.searchable = parsedDetailSettings.searchable ?? true;
    
    // 다양한 필드명 지원 (레거시 호환)
    // referenceTable / entityTable 둘 다 지원
    const refTable = 
      parsedDetailSettings.referenceTable || 
      parsedDetailSettings.entityTable || 
      column.referenceTable;
    
    // referenceColumn / entityCodeColumn / entityValueColumn 지원
    const refColumn = 
      parsedDetailSettings.referenceColumn || 
      parsedDetailSettings.entityCodeColumn || 
      parsedDetailSettings.entityValueColumn ||
      column.referenceColumn || 
      "id";
    
    // displayColumn / entityLabelColumn 지원
    const dispColumn = 
      parsedDetailSettings.displayColumn || 
      parsedDetailSettings.entityLabelColumn ||
      column.displayColumn || 
      "name";
    
    console.log("🎯 엔티티 매핑:", {
      columnName: column.columnName,
      widgetType: column.widgetType,
      parsedDetailSettings,
      refTable,
      refColumn,
      dispColumn,
      "column.referenceTable": column.referenceTable,
    });
    
    if (refTable) {
      componentConfig.entityTable = refTable;
      componentConfig.entityValueColumn = refColumn;
      componentConfig.entityLabelColumn = dispColumn;
    }
  }

  // 카테고리 타입인 경우 추가 설정
  if (column.widgetType === "category") {
    componentConfig.searchable = true;
  }

  // select 타입인 경우: 해당 테이블의 해당 컬럼에서 DISTINCT 값 조회
  if (column.widgetType === "select" || column.inputType === "select") {
    componentConfig.source = "select"; // DISTINCT 조회 모드
    componentConfig.searchable = true;
  }

  return {
    componentType: mapping.componentType,
    componentConfig,
  };
}

/**
 * 컴포넌트 ID를 웹타입으로 역변환 (필요한 경우)
 */
export function getWebTypeFromComponentId(componentId: string): string {
  const entry = Object.entries(WEB_TYPE_COMPONENT_MAPPING).find(([_, id]) => id === componentId);
  return entry ? entry[0] : "text";
}

/**
 * 지원되는 모든 웹타입 목록 조회
 */
export function getSupportedWebTypes(): string[] {
  return Object.keys(WEB_TYPE_V2_MAPPING);
}

/**
 * 지원되는 모든 V2 컴포넌트 ID 목록 조회
 */
export function getSupportedComponentIds(): string[] {
  return [...new Set(Object.values(WEB_TYPE_V2_MAPPING).map((m) => m.componentType))];
}

/**
 * 매핑 정보 조회
 */
export function getWebTypeMappings(): WebTypeMapping[] {
  return Object.entries(WEB_TYPE_V2_MAPPING).map(([webType, mapping]) => ({
    webType,
    componentId: mapping.componentType,
    description: `${webType} → ${mapping.componentType}`,
  }));
}
