'use client';

import { useState } from 'react';
import { X, Download, Upload, CheckCircle2, XCircle } from 'lucide-react';
import { toast } from '@/lib/toast';
import { useTranslation } from '@/hooks/useTranslation';
import * as XLSX from 'xlsx';

// ============================================
// 类型定义
// ============================================

/**
 * Excel 字段定义
 */
export interface ExcelFieldConfig {
  /** 字段唯一标识 */
  key: string;
  /** 显示标签（支持国际化函数） */
  label: string | (() => string);
  /** 字段描述（支持国际化函数） */
  description?: string | (() => string);
  /** 是否必填 */
  required?: boolean;
  /** 字段验证函数 */
  validate?: (value: any, row: any) => string | null; // 返回错误消息或 null
  /** 字段转换函数（用于数据类型转换） */
  transform?: (value: any) => any;
}

/**
 * 批量导入配置
 */
export interface BatchImportConfig<T = any> {
  /** 模块名称（用于文件名） */
  moduleName: string;
  /** Excel 字段配置 */
  fields: ExcelFieldConfig[];
  /** 模板示例数据 */
  templateData: any[];
  /** 是否支持层级关系（父子关系） */
  supportHierarchy?: boolean;
  /** 层级关系配置 */
  hierarchyConfig?: {
    /** 父级字段 key */
    parentKey: string;
    /** 子级如何关联父级（返回父级的唯一标识） */
    getParentIdentifier: (row: any) => string | undefined;
    /** 如何从父级记录中提取唯一标识 */
    extractIdentifier: (row: any) => string;
  };
  /** 批量创建 API 调用 */
  batchCreateFn: (items: T[]) => Promise<{
    total: number;
    successCount: number;
    failedCount: number;
    results: {
      success: Array<{ code?: string; name?: string; id: string }>;
      failed: Array<{ code?: string; name?: string; error: string }>;
    };
  }>;
  /** 转换解析后的数据为 API 所需格式 */
  transformToApiFormat: (row: any, context?: any) => T;
  /** 国际化文本配置 */
  i18n: {
    title: string | (() => string);
    downloadTemplate: string | (() => string);
    uploadTitle: string | (() => string);
    uploadPlaceholder: string | (() => string);
    validData: string | (() => string);
    invalidData: string | (() => string);
    importSuccess: string | ((count: number) => string);
    importPartial: string | ((success: number, failed: number) => string);
    importFailed: string | (() => string);
  };
}

/**
 * 组件 Props
 */
export interface BatchImportDialogProps<T = any> {
  isOpen: boolean;
  onClose: () => void;
  onSuccess: () => void;
  config: BatchImportConfig<T>;
  /** 额外的上下文数据（如当前组织ID） */
  context?: any;
}

/**
 * 解析后的数据行
 */
interface ParsedRow {
  original: any; // 原始数据
  transformed: any; // 转换后的数据
  error?: string; // 错误信息
}

// ============================================
// 通用批量导入组件
// ============================================

export default function BatchImportDialog<T = any>({
  isOpen,
  onClose,
  onSuccess,
  config,
  context,
}: BatchImportDialogProps<T>) {
  const { t } = useTranslation();
  const [file, setFile] = useState<File | null>(null);
  const [isUploading, setIsUploading] = useState(false);
  const [parseResult, setParseResult] = useState<{
    valid: ParsedRow[];
    invalid: ParsedRow[];
  } | null>(null);

  if (!isOpen) return null;

  // 获取国际化文本
  const getText = (text: string | (() => string)): string => {
    return typeof text === 'function' ? text() : text;
  };

  // 下载模板
  const handleDownloadTemplate = () => {
    // 构建模板列标题
    const headers: any = {};
    config.fields.forEach(field => {
      const label = getText(field.label);
      const key = field.required ? `${label} *` : label;
      headers[key] = config.templateData[0]?.[field.key] || '';
    });

    // 创建模板数据
    const templateData = config.templateData.map(row => {
      const rowData: any = {};
      config.fields.forEach(field => {
        const label = getText(field.label);
        const key = field.required ? `${label} *` : label;
        rowData[key] = row[field.key] || '';
      });
      return rowData;
    });

    // 创建工作簿
    const wb = XLSX.utils.book_new();
    const ws = XLSX.utils.json_to_sheet(templateData);

    // 设置列宽
    ws['!cols'] = config.fields.map(() => ({ wch: 20 }));

    XLSX.utils.book_append_sheet(wb, ws, `${config.moduleName}导入模板`);

    // 下载文件
    XLSX.writeFile(wb, `批量导入${config.moduleName}模板.xlsx`);
    toast.success(getText(config.i18n.downloadTemplate));
  };

  // 解析Excel文件
  const handleFileChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
    const selectedFile = e.target.files?.[0];
    if (!selectedFile) return;

    setFile(selectedFile);

    const reader = new FileReader();
    reader.onload = (event) => {
      try {
        const data = event.target?.result;
        const workbook = XLSX.read(data, { type: 'binary' });
        const sheetName = workbook.SheetNames[0];
        const worksheet = workbook.Sheets[sheetName];
        const jsonData = XLSX.utils.sheet_to_json(worksheet) as any[];

        const valid: ParsedRow[] = [];
        const invalid: ParsedRow[] = [];

        jsonData.forEach((excelRow) => {
          // 将 Excel 行数据转换为标准格式
          const row: any = {};
          let hasError = false;
          let errorMessage = '';

          // 映射字段
          config.fields.forEach(field => {
            const label = getText(field.label);
            const requiredLabel = `${label} *`;
            
            // 尝试匹配必填标记的列名和不带标记的列名
            let value = excelRow[requiredLabel] || excelRow[label] || '';
            
            // 应用转换函数
            if (field.transform) {
              value = field.transform(value);
            }
            
            row[field.key] = value;

            // 必填验证
            if (field.required && !value) {
              hasError = true;
              errorMessage = `缺少必填字段: ${label}`;
              return;
            }

            // 自定义验证
            if (field.validate && value) {
              const validationError = field.validate(value, row);
              if (validationError) {
                hasError = true;
                errorMessage = validationError;
                return;
              }
            }
          });

          const parsedRow: ParsedRow = {
            original: excelRow,
            transformed: row,
            error: hasError ? errorMessage : undefined,
          };

          if (hasError) {
            invalid.push(parsedRow);
          } else {
            valid.push(parsedRow);
          }
        });

        setParseResult({ valid, invalid });

        if (invalid.length > 0) {
          toast.warning(`文件解析完成，发现 ${invalid.length} 条无效数据`);
        } else {
          toast.success(`文件解析成功，共 ${valid.length} 条有效数据`);
        }
      } catch (error) {
        console.error('解析文件失败:', error);
        toast.error('文件解析失败，请检查文件格式');
      }
    };
    reader.readAsBinaryString(selectedFile);
  };

  // 提交导入
  const handleSubmit = async () => {
    if (!parseResult || parseResult.valid.length === 0) {
      toast.error('没有有效的数据');
      return;
    }

    setIsUploading(true);

    try {
      if (config.supportHierarchy && config.hierarchyConfig) {
        // 支持层级关系的导入
        await handleHierarchicalImport();
      } else {
        // 简单的批量导入
        await handleSimpleImport();
      }
    } catch (error: any) {
      console.error('批量导入失败:', error);
      toast.error(error.message || getText(config.i18n.importFailed));
    } finally {
      setIsUploading(false);
    }
  };

  // 简单批量导入
  const handleSimpleImport = async () => {
    const items = parseResult!.valid.map(row => 
      config.transformToApiFormat(row.transformed, context)
    );

    const result = await config.batchCreateFn(items);

    if (result.failedCount === 0) {
      const message = typeof config.i18n.importSuccess === 'function'
        ? config.i18n.importSuccess(result.successCount)
        : getText(config.i18n.importSuccess);
      toast.success(message);
      onSuccess();
      onClose();
    } else {
      const message = typeof config.i18n.importPartial === 'function'
        ? config.i18n.importPartial(result.successCount, result.failedCount)
        : getText(config.i18n.importPartial);
      toast.warning(message);
      
      // 更新解析结果，显示失败信息
      setParseResult({
        valid: parseResult!.valid.filter(row => 
          !result.results.failed.some(f => f.name === row.transformed.name)
        ),
        invalid: [
          ...parseResult!.invalid,
          ...result.results.failed.map(f => ({
            original: {},
            transformed: f,
            error: f.error,
          })),
        ],
      });
    }
  };

  // 层级关系批量导入
  const handleHierarchicalImport = async () => {
    const { hierarchyConfig } = config;
    if (!hierarchyConfig) return;

    const identifierMap = new Map<string, string>();
    
    // 第一步：创建顶级项（没有父级的）
    const topLevel = parseResult!.valid.filter(row => 
      !hierarchyConfig.getParentIdentifier(row.transformed)
    );
    const children = parseResult!.valid.filter(row => 
      hierarchyConfig.getParentIdentifier(row.transformed)
    );

    // 创建顶级项
    if (topLevel.length > 0) {
      const items = topLevel.map(row => 
        config.transformToApiFormat(row.transformed, context)
      );
      const result = await config.batchCreateFn(items);
      
      // 记录成功创建的项
      result.results.success.forEach(item => {
        const identifier = hierarchyConfig.extractIdentifier(item as any);
        identifierMap.set(identifier, item.id);
      });
    }

    // 第二步：创建子项
    let childResult: any = { 
      successCount: 0, 
      failedCount: 0, 
      results: { success: [], failed: [] } 
    };
    
    if (children.length > 0) {
      const childItems: T[] = [];
      const failedChildren: ParsedRow[] = [];

      children.forEach(row => {
        const parentIdentifier = hierarchyConfig.getParentIdentifier(row.transformed);
        const parentId = parentIdentifier ? identifierMap.get(parentIdentifier) : undefined;
        
        if (parentId) {
          // 将父级 ID 添加到上下文
          const itemContext = { ...context, parentId };
          childItems.push(config.transformToApiFormat(row.transformed, itemContext));
        } else {
          failedChildren.push({
            ...row,
            error: `找不到父级: ${parentIdentifier}`,
          });
        }
      });

      if (childItems.length > 0) {
        childResult = await config.batchCreateFn(childItems);
      }

      childResult.results.failed.push(...failedChildren.map(r => ({
        name: r.transformed.name,
        error: r.error!,
      })));
      childResult.failedCount += failedChildren.length;
    }

    // 汇总结果
    const totalSuccess = topLevel.length + childResult.successCount;
    const totalFailed = childResult.failedCount;

    if (totalFailed === 0) {
      const message = typeof config.i18n.importSuccess === 'function'
        ? config.i18n.importSuccess(totalSuccess)
        : getText(config.i18n.importSuccess);
      toast.success(message);
      onSuccess();
      onClose();
    } else {
      const message = typeof config.i18n.importPartial === 'function'
        ? config.i18n.importPartial(totalSuccess, totalFailed)
        : getText(config.i18n.importPartial);
      toast.warning(message);
    }
  };

  return (
    <div className="fixed inset-0 z-50 flex items-center justify-center">
      {/* 背景遮罩 */}
      <div className="absolute inset-0 bg-black/50" onClick={onClose} />

      {/* 对话框 */}
      <div className="relative bg-white rounded-xl shadow-2xl w-full max-w-3xl max-h-[90vh] overflow-hidden">
        {/* 头部 */}
        <div className="flex items-center justify-between px-6 py-4 border-b" style={{ borderColor: '#e5e6eb' }}>
          <h2 className="text-lg font-semibold text-gray-900">{getText(config.i18n.title)}</h2>
          <button
            onClick={onClose}
            className="p-1 rounded-lg hover:bg-gray-100 transition-colors"
          >
            <X className="w-5 h-5 text-gray-500" />
          </button>
        </div>

        {/* 内容 */}
        <div className="p-6 overflow-y-auto max-h-[calc(90vh-140px)]">
          {/* 字段说明 */}
          <div className="mb-6">
            <h3 className="text-sm font-medium text-gray-900 mb-3">📝 字段说明</h3>
            <div className="bg-gray-50 rounded-lg p-4 text-sm text-gray-700 space-y-2">
              {config.fields.map(field => (
                <p key={field.key}>
                  <strong>{getText(field.label)}{field.required ? ' *' : ''}</strong>
                  {field.description && `：${getText(field.description)}`}
                </p>
              ))}
            </div>
          </div>

          {/* 下载模板按钮 */}
          <div className="mb-6">
            <button
              onClick={handleDownloadTemplate}
              className="w-full h-12 px-4 rounded-lg text-sm font-medium transition-all hover:shadow-md flex items-center justify-center gap-2"
              style={{ 
                background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
                color: 'white',
              }}
            >
              <Download className="w-5 h-5" />
              <span>下载导入模板</span>
            </button>
          </div>

          {/* 文件上传 */}
          <div className="mb-6">
            <label className="block text-sm font-medium text-gray-700 mb-2">
              {getText(config.i18n.uploadTitle)}
            </label>
            <div className="border-2 border-dashed border-gray-300 rounded-lg p-6 text-center hover:border-blue-500 transition-colors">
              <input
                type="file"
                accept=".xlsx,.xls"
                onChange={handleFileChange}
                className="hidden"
                id="batch-import-file"
              />
              <label htmlFor="batch-import-file" className="cursor-pointer">
                <Upload className="w-12 h-12 text-gray-400 mx-auto mb-3" />
                <p className="text-sm text-gray-600 mb-1">
                  {file ? file.name : getText(config.i18n.uploadPlaceholder)}
                </p>
                <p className="text-xs text-gray-500">
                  支持 .xlsx 和 .xls 格式
                </p>
              </label>
            </div>
          </div>

          {/* 解析结果 */}
          {parseResult && (
            <div className="space-y-4">
              {/* 有效数据 */}
              {parseResult.valid.length > 0 && (
                <div className="border border-green-200 rounded-lg overflow-hidden">
                  <div className="bg-green-50 px-4 py-2 flex items-center gap-2">
                    <CheckCircle2 className="w-4 h-4 text-green-600" />
                    <span className="text-sm font-medium text-green-900">
                      {getText(config.i18n.validData)} ({parseResult.valid.length} 条)
                    </span>
                  </div>
                  <div className="p-4 max-h-48 overflow-y-auto">
                    <div className="text-sm text-gray-700">
                      {parseResult.valid.slice(0, 5).map((row, idx) => (
                        <div key={idx} className="py-1">
                          {config.fields.slice(0, 3).map(field => (
                            <span key={field.key} className="mr-4">
                              {row.transformed[field.key]}
                            </span>
                          ))}
                        </div>
                      ))}
                      {parseResult.valid.length > 5 && (
                        <p className="text-gray-500 mt-2">...还有 {parseResult.valid.length - 5} 条</p>
                      )}
                    </div>
                  </div>
                </div>
              )}

              {/* 无效数据 */}
              {parseResult.invalid.length > 0 && (
                <div className="border border-red-200 rounded-lg overflow-hidden">
                  <div className="bg-red-50 px-4 py-2 flex items-center gap-2">
                    <XCircle className="w-4 h-4 text-red-600" />
                    <span className="text-sm font-medium text-red-900">
                      {getText(config.i18n.invalidData)} ({parseResult.invalid.length} 条)
                    </span>
                  </div>
                  <div className="p-4 max-h-48 overflow-y-auto">
                    <div className="text-sm space-y-2">
                      {parseResult.invalid.map((row, idx) => (
                        <div key={idx} className="text-red-600">
                          <span className="font-medium">
                            {config.fields.slice(0, 2).map(field => 
                              row.transformed[field.key]
                            ).filter(Boolean).join(' - ')}
                          </span>
                          <span className="ml-2 text-xs">: {row.error}</span>
                        </div>
                      ))}
                    </div>
                  </div>
                </div>
              )}
            </div>
          )}
        </div>

        {/* 底部按钮 */}
        <div className="flex items-center justify-end gap-3 px-6 py-4 border-t" style={{ borderColor: '#e5e6eb' }}>
          <button
            onClick={onClose}
            disabled={isUploading}
            className="px-4 py-2 rounded-lg text-sm font-medium text-gray-700 hover:bg-gray-100 transition-colors disabled:opacity-50"
          >
            取消
          </button>
          <button
            onClick={handleSubmit}
            disabled={!parseResult || parseResult.valid.length === 0 || isUploading}
            className="px-6 py-2 rounded-lg text-sm font-medium text-white transition-all hover:shadow-lg disabled:opacity-50 disabled:cursor-not-allowed"
            style={{ 
              background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
            }}
          >
            {isUploading ? '导入中...' : `确认导入 (${parseResult?.valid.length || 0})`}
          </button>
        </div>
      </div>
    </div>
  );
}