import React, { useState } from 'react';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { Upload, FileText, Download, X, Check, Eye, Info } from 'lucide-react';
import { toast } from 'sonner';
import { usePrompts } from '@/hooks/usePrompts';
import * as XLSX from 'xlsx';
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
} from '@/components/ui/dialog';
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from '@/components/ui/select';

interface ProcessedData {
  headers: string[];
  rows: any[][];
  totalRows: number;
  totalColumns: number;
  rawData: any[]; // Dados originais para processamento
}

const FileImporter: React.FC = () => {
  const { prompts, loading: promptsLoading } = usePrompts();
  const [file, setFile] = useState<File | null>(null);
  const [processing, setProcessing] = useState(false);
  const [processingPP, setProcessingPP] = useState(false);
  const [processedData, setProcessedData] = useState<ProcessedData | null>(null);
  const [showPreview, setShowPreview] = useState(false);
  const [selectedPrompt, setSelectedPrompt] = useState<string>('');
  const [generating, setGenerating] = useState(false);

  const handleFileSelect = (event: React.ChangeEvent<HTMLInputElement>) => {
    const selectedFile = event.target.files?.[0];
    if (selectedFile) {
      const validTypes = [
        'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet', // .xlsx
        'application/vnd.ms-excel', // .xls
        'text/csv', // .csv
        'application/pdf' // .pdf
      ];
      
      if (!validTypes.includes(selectedFile.type) && 
          !selectedFile.name.toLowerCase().endsWith('.csv')) {
        toast.error('Formato de arquivo inválido. Selecione um arquivo .xlsx, .xls, .csv ou .pdf');
        return;
      }
      
      setFile(selectedFile);
      setProcessedData(null);
    }
  };

  const processFile = async (onlyPP = false) => {
    if (!file) return;

    if (onlyPP) {
      setProcessingPP(true);
    } else {
      setProcessing(true);
    }

    try {
      let processedResult: ProcessedData;

      if (file.type === 'application/pdf') {
        // Para PDF, ainda simulamos o processamento
        await new Promise(resolve => setTimeout(resolve, 2000));
        processedResult = {
          headers: ['Marca', 'Perfil', 'Quantidade', 'Peso Unit.', 'Peso Total', 'Material'],
          rows: [
            ['P1', 'VS 200x30x5,0', '2', '15,8', '31,6', 'ASTM A36'],
            ['P2', 'VS 150x25x4,0', '4', '12,3', '49,2', 'ASTM A36'],
            ['P3', 'L 50x50x5,0', '8', '3,77', '30,16', 'ASTM A36'],
            ['P4', 'CH 100x50x17,0', '6', '17,0', '102,0', 'ASTM A36'],
            ['P5', 'FL 200x8,0', '3', '12,56', '37,68', 'ASTM A36']
          ],
          totalRows: 5,
          totalColumns: 6,
          rawData: []
        };
      } else {
        // Processar arquivos Excel/CSV usando xlsx
        const buffer = await file.arrayBuffer();
        const workbook = XLSX.read(buffer, { type: 'array' });
        
        // Pegar a primeira planilha
        const firstSheetName = workbook.SheetNames[0];
        const worksheet = workbook.Sheets[firstSheetName];
        
        // Converter para JSON com chaves como nomes das colunas
        const jsonDataWithHeaders = XLSX.utils.sheet_to_json(worksheet) as any[];
        
        // Converter para formato de array para visualização
        const jsonArrayData = XLSX.utils.sheet_to_json(worksheet, { 
          header: 1,
          defval: '',
          raw: false
        }) as any[][];

        if (jsonDataWithHeaders.length === 0) {
          throw new Error('Nenhum dado encontrado no arquivo');
        }

        console.log('Dados JSON com headers:', jsonDataWithHeaders);
        console.log('Dados em array:', jsonArrayData);

        // Se for processamento PP, filtrar apenas linhas onde a coluna "Pos." está vazia
        let filteredJsonData = jsonDataWithHeaders;
        let filteredArrayData = jsonArrayData;

        if (onlyPP) {
          // Filtrar dados JSON com headers
          filteredJsonData = jsonDataWithHeaders.filter(row => {
            const posValue = extrairValor(row, ['Pos.', 'Pos', 'pos', 'POS']);
            return !posValue || posValue.toString().trim() === '';
          });

          // Filtrar dados em array (manter header + linhas filtradas)
          const headerRow = jsonArrayData[0];
          const dataRows = jsonArrayData.slice(1);
          
          // Encontrar índice da coluna Pos.
          const posColumnIndex = headerRow.findIndex(header => 
            ['Pos.', 'Pos', 'pos', 'POS'].includes(header?.toString() || '')
          );

          const filteredDataRows = dataRows.filter(row => {
            if (posColumnIndex === -1) return true; // Se não encontrar coluna Pos., incluir todas
            const posValue = row[posColumnIndex];
            return !posValue || posValue.toString().trim() === '';
          });

          filteredArrayData = [headerRow, ...filteredDataRows];
        }

        // Determinar o número máximo de colunas
        const maxColumns = Math.max(...filteredArrayData.map(row => row.length));
        
        // Padronizar todas as linhas para ter o mesmo número de colunas
        const normalizedData = filteredArrayData.map(row => {
          const normalizedRow = [...row];
          while (normalizedRow.length < maxColumns) {
            normalizedRow.push('');
          }
          return normalizedRow;
        });

        // Primeira linha como headers
        const headers = normalizedData[0].map((header, index) => 
          header || `Coluna ${index + 1}`
        );
        
        // Resto como dados para visualização
        const rows = normalizedData.slice(1);

        processedResult = {
          headers,
          rows,
          totalRows: rows.length,
          totalColumns: headers.length,
          rawData: filteredJsonData // Dados originais filtrados para processamento
        };

        console.log('Dados processados:', {
          totalRows: processedResult.totalRows,
          totalColumns: processedResult.totalColumns,
          headers: processedResult.headers,
          rawDataCount: processedResult.rawData.length,
          onlyPP: onlyPP
        });
      }
      
      setProcessedData(processedResult);
      setShowPreview(true);
      
      const processType = onlyPP ? ' (apenas peças principais)' : '';
      toast.success(`Arquivo processado com sucesso${processType}! ${processedResult.totalRows} linhas e ${processedResult.totalColumns} colunas coletadas.`);
    } catch (error) {
      console.error('Erro ao processar arquivo:', error);
      toast.error('Erro ao processar arquivo. Verifique se o arquivo não está corrompido.');
    } finally {
      if (onlyPP) {
        setProcessingPP(false);
      } else {
        setProcessing(false);
      }
    }
  };

  const generateCSV = async () => {
    if (!processedData || !selectedPrompt || !file) return;

    setGenerating(true);
    try {
      const selectedPromptData = prompts.find(p => p.id === selectedPrompt);
      console.log('Processando com prompt:', selectedPromptData?.name);
      console.log('Dados originais para processar:', processedData.rawData);
      
      // Processar os dados usando a lógica do prompt
      const csvContent = processSpreadsheetToCsv(file.name, processedData.rawData);
      
      // Gerar e baixar CSV
      const BOM = '\uFEFF';
      const blob = new Blob([BOM + csvContent], { type: 'text/csv;charset=utf-8;' });
      const link = document.createElement('a');
      const csvFileName = file.name.replace(/\.(xlsx|xls|pdf)$/i, '_processado.csv');
      
      link.href = URL.createObjectURL(blob);
      link.download = csvFileName;
      link.click();
      URL.revokeObjectURL(link.href);
      
      toast.success(`CSV gerado com sucesso usando o prompt: ${selectedPromptData?.name}`);
      setShowPreview(false);
      setFile(null);
      setProcessedData(null);
      setSelectedPrompt('');
    } catch (error) {
      console.error('Erro ao gerar CSV:', error);
      toast.error('Erro ao gerar CSV. Verifique as instruções do prompt e os dados.');
    } finally {
      setGenerating(false);
    }
  };

  const processSpreadsheetToCsv = (fileName: string, data: any[]): string => {
    console.log('Processando arquivo:', fileName);
    console.log('Total de linhas:', data.length);
    
    // Extrair metadados do nome do arquivo
    const fileNameParts = fileName.replace(/\.(xlsx|xls|pdf)$/i, '').split('-');
    const ofNumber = fileNameParts[0] || '';
    const etapaFase = fileNameParts[1] || '';

    console.log('OF Number:', ofNumber);
    console.log('Etapa/Fase:', etapaFase);

    const csvHeader = 'of_number,etapa_fase,marca,descricao,quantidade,peso_unitario,peso_total,tratamento_superficial,material,perfil_principal,tem_componentes,marca_componente,descricao_componente,perfil_componente,peso_unitario_componente,quantidade_por_peca';
    
    const csvRows: string[] = [csvHeader];
    let currentPecaMae: any = null;
    const componentes: any[] = [];

    // Log das colunas disponíveis
    if (data.length > 0) {
      console.log('Colunas disponíveis:', Object.keys(data[0]));
    }

    // Processar dados linha por linha
    for (let i = 0; i < data.length; i++) {
      const row = data[i];
      console.log(`Processando linha ${i + 1}:`, row);
      
      // Verificar se é uma peça-mãe (tem valor na coluna Marca)
      const marcaValue = extrairValor(row, ['Marca', 'marca', 'MARCA']);
      
      if (marcaValue && marcaValue.toString().trim() !== '') {
        console.log('Encontrou peça-mãe:', marcaValue);
        
        // Processar peça-mãe anterior se existir
        if (currentPecaMae) {
          processarPecaMae(currentPecaMae, componentes, csvRows, ofNumber, etapaFase);
        }
        
        // Nova peça-mãe
        currentPecaMae = row;
        componentes.length = 0; // Limpar componentes
      } else {
        // Verificar se é um componente através da coluna Pos.
        const posValue = extrairValor(row, ['Pos.', 'Pos', 'pos', 'POS']);
        
        if (posValue && posValue.toString().trim() !== '') {
          const posString = posValue.toString();
          console.log('Verificando Pos.:', posString);
          
          // Extrair o último número após o último hífen
          const lastNumber = posString.split('-').pop();
          
          if (lastNumber && parseInt(lastNumber) >= 1000 && parseInt(lastNumber) <= 9999) {
            console.log('Componente encontrado:', posString);
            componentes.push(row);
          }
        }
      }
    }

    // Processar última peça-mãe
    if (currentPecaMae) {
      processarPecaMae(currentPecaMae, componentes, csvRows, ofNumber, etapaFase);
    }

    console.log('Total de linhas CSV geradas:', csvRows.length - 1);
    return csvRows.join('\n');
  };

  const processarPecaMae = (pecaMae: any, componentes: any[], csvRows: string[], ofNumber: string, etapaFase: string) => {
    console.log('Processando peça-mãe:', pecaMae);
    console.log('Com componentes:', componentes);
    
    // Extrair dados da peça-mãe com diferentes variações de nomes de colunas
    const marcaCompleta = extrairValor(pecaMae, ['Marca', 'marca', 'MARCA'])?.toString() || '';
    const marca = marcaCompleta.split('-').pop() || marcaCompleta;
    const descricao = extrairValor(pecaMae, ['Descrição', 'Descricao', 'descrição', 'descricao', 'DESCRIÇÃO', 'DESCRICAO']) || '';
    const quantidade = extrairValor(pecaMae, ['Qtde', 'Quantidade', 'qtde', 'quantidade', 'QTDE', 'QUANTIDADE']) || '';
    const pesoUnitario = formatarNumero(extrairValor(pecaMae, ['P.Un.', 'PesoUnitario', 'Peso Unitário', 'peso_unitario', 'PESO_UNITARIO']));
    const pesoTotal = formatarNumero(extrairValor(pecaMae, ['P.Tot.', 'PesoTotal', 'Peso Total', 'peso_total', 'PESO_TOTAL']));
    const material = extrairValor(pecaMae, ['Mat', 'Material', 'mat', 'material', 'MAT', 'MATERIAL']) || '';
    const perfilPrincipal = material;

    console.log('Dados extraídos - Marca:', marca, 'Descrição:', descricao, 'Qtd:', quantidade);

    if (componentes.length === 0) {
      // Peça-mãe sem componentes
      const csvRow = [
        escapeCSV(ofNumber),
        escapeCSV(etapaFase),
        escapeCSV(marca),
        escapeCSV(descricao),
        escapeCSV(quantidade),
        escapeCSV(pesoUnitario),
        escapeCSV(pesoTotal),
        escapeCSV('-'), // tratamento_superficial
        escapeCSV(material),
        escapeCSV(perfilPrincipal),
        'false', // tem_componentes
        '', // marca_componente
        '', // descricao_componente
        '', // perfil_componente
        '', // peso_unitario_componente
        ''  // quantidade_por_peca
      ].join(',');
      csvRows.push(csvRow);
    } else {
      // Peça-mãe com componentes
      componentes.forEach(componente => {
        const posValue = extrairValor(componente, ['Pos.', 'Pos', 'pos', 'POS'])?.toString() || '';
        const marcaComponente = posValue.split('-').pop() || '';
        const descricaoComponente = extrairValor(componente, ['Descrição', 'Descricao', 'descrição', 'descricao', 'DESCRIÇÃO', 'DESCRICAO']) || '';
        const perfilComponente = extrairValor(componente, ['Mat', 'Material', 'mat', 'material', 'MAT', 'MATERIAL']) || '';
        const pesoUnitarioComponente = formatarNumero(extrairValor(componente, ['P.Un.', 'PesoUnitario', 'Peso Unitário', 'peso_unitario', 'PESO_UNITARIO']));
        const quantidadePorPeca = extrairValor(componente, ['Qtde', 'Quantidade', 'qtde', 'quantidade', 'QTDE', 'QUANTIDADE']) || '';

        const csvRow = [
          escapeCSV(ofNumber),
          escapeCSV(etapaFase),
          escapeCSV(marca),
          escapeCSV(descricao),
          escapeCSV(quantidade),
          escapeCSV(pesoUnitario),
          escapeCSV(pesoTotal),
          escapeCSV('-'), // tratamento_superficial
          escapeCSV(material),
          escapeCSV(perfilPrincipal),
          'true', // tem_componentes
          escapeCSV(marcaComponente),
          escapeCSV(descricaoComponente),
          escapeCSV(perfilComponente),
          escapeCSV(pesoUnitarioComponente),
          escapeCSV(quantidadePorPeca)
        ].join(',');
        csvRows.push(csvRow);
      });
    }
  };

  const extrairValor = (objeto: any, nomes: string[]): any => {
    for (const nome of nomes) {
      if (objeto[nome] !== undefined && objeto[nome] !== null && objeto[nome] !== '') {
        return objeto[nome];
      }
    }
    return '';
  };

  const escapeCSV = (valor: any): string => {
    if (valor === null || valor === undefined) return '';
    const str = valor.toString();
    if (str.includes(',') || str.includes('"') || str.includes('\n')) {
      return `"${str.replace(/"/g, '""')}"`;
    }
    return str;
  };

  const formatarNumero = (valor: any): string => {
    if (!valor) return '';
    const numeroStr = valor.toString().replace(',', '.');
    const numero = parseFloat(numeroStr);
    return isNaN(numero) ? '' : numero.toFixed(1);
  };

  const handleCancel = () => {
    setShowPreview(false);
    setProcessedData(null);
  };

  return (
    <>
      <Card className="bg-slate-700/50 border-slate-600">
        <CardHeader>
          <CardTitle className="text-white text-lg flex items-center gap-2">
            <Upload className="w-5 h-5" />
            Importar Arquivo
          </CardTitle>
        </CardHeader>
        <CardContent className="space-y-4">
          <div>
            <Label htmlFor="file-upload" className="text-white mb-2 block">
              Selecionar Arquivo
            </Label>
            <Input
              id="file-upload"
              type="file"
              accept=".xlsx,.xls,.csv,.pdf"
              onChange={handleFileSelect}
              className="bg-slate-600 border-slate-500 text-white file:bg-slate-500 file:text-white file:border-0 file:mr-4 file:py-2 file:px-4 file:rounded"
            />
            <p className="text-slate-400 text-xs mt-1">
              Formatos suportados: .xlsx, .xls, .csv, .pdf
            </p>
          </div>

          {file && (
            <div className="p-3 bg-slate-800/50 rounded border border-slate-600">
              <div className="flex items-center justify-between">
                <div className="flex items-center gap-2">
                  <FileText className="w-4 h-4 text-blue-400" />
                  <span className="text-white text-sm">{file.name}</span>
                  <span className="text-slate-400 text-xs">
                    ({(file.size / 1024 / 1024).toFixed(2)} MB)
                  </span>
                </div>
                <div className="flex gap-2">
                  <Button
                    onClick={() => processFile(false)}
                    disabled={processing || processingPP}
                    size="sm"
                    className="bg-blue-600 hover:bg-blue-700"
                  >
                    {processing ? (
                      <>
                        <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2" />
                        Processando...
                      </>
                    ) : (
                      <>
                        <Eye className="w-4 h-4 mr-2" />
                        Processar
                      </>
                    )}
                  </Button>
                  <Button
                    onClick={() => processFile(true)}
                    disabled={processing || processingPP}
                    size="sm"
                    className="bg-green-600 hover:bg-green-700"
                  >
                    {processingPP ? (
                      <>
                        <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2" />
                        Processando PP...
                      </>
                    ) : (
                      <>
                        <Eye className="w-4 h-4 mr-2" />
                        Processar PP
                      </>
                    )}
                  </Button>
                </div>
              </div>
            </div>
          )}

          <div className="text-slate-300 text-sm">
            <h4 className="font-medium mb-2">Como funciona:</h4>
            <ul className="space-y-1 text-xs">
              <li>1. Selecione um arquivo (.xlsx, .xls, .csv ou .pdf)</li>
              <li>2. O sistema extrairá todas as tabelas e dados</li>
              <li>3. Visualize os dados processados</li>
              <li>4. Escolha um prompt para guiar a conversão</li>
              <li>5. Gere e baixe o arquivo CSV final</li>
            </ul>
            <div className="mt-2 p-2 bg-green-800/20 rounded border border-green-600">
              <p className="text-green-400 text-xs font-medium">Processar PP:</p>
              <p className="text-green-300 text-xs">Processa apenas linhas onde a coluna "Pos." está vazia (peças principais).</p>
            </div>
          </div>
        </CardContent>
      </Card>

      <Dialog open={showPreview} onOpenChange={setShowPreview}>
        <DialogContent className="bg-slate-800 border-slate-700 max-w-4xl max-h-[80vh]">
          <DialogHeader>
            <DialogTitle className="text-white">Dados Processados</DialogTitle>
            <DialogDescription className="text-slate-400">
              Visualize os dados extraídos do arquivo e selecione um prompt para gerar o CSV
            </DialogDescription>
          </DialogHeader>

          <div className="space-y-4">
            <div>
              <Label className="text-white mb-2 block">Selecionar Prompt</Label>
              <Select value={selectedPrompt} onValueChange={setSelectedPrompt}>
                <SelectTrigger className="bg-slate-700 border-slate-600 text-white">
                  <SelectValue placeholder="Escolha um prompt para guiar a conversão" />
                </SelectTrigger>
                <SelectContent className="bg-slate-700 border-slate-600">
                  {prompts.map((prompt) => (
                    <SelectItem key={prompt.id} value={prompt.id} className="text-white">
                      {prompt.name}
                    </SelectItem>
                  ))}
                </SelectContent>
              </Select>
              {prompts.length === 0 && (
                <p className="text-yellow-400 text-xs mt-1">
                  Nenhum prompt encontrado. Crie um prompt primeiro.
                </p>
              )}
            </div>

            {processedData && (
              <>
                <div className="flex items-center gap-4 p-3 bg-blue-900/30 rounded border border-blue-600">
                  <Info className="w-5 h-5 text-blue-400" />
                  <div className="text-blue-100 text-sm">
                    <span className="font-medium">Dados coletados:</span>
                    <span className="ml-2">
                      {processedData.totalRows} linhas × {processedData.totalColumns} colunas
                    </span>
                  </div>
                </div>

                <div className="border border-slate-600 rounded overflow-auto max-h-60">
                  <table className="w-full text-sm">
                    <thead className="bg-slate-700">
                      <tr>
                        {processedData.headers.map((header, index) => (
                          <th key={index} className="px-3 py-2 text-left text-white font-medium whitespace-nowrap">
                            {header}
                          </th>
                        ))}
                      </tr>
                    </thead>
                    <tbody>
                      {processedData.rows.map((row, rowIndex) => (
                        <tr key={rowIndex} className="border-t border-slate-600">
                          {row.map((cell, cellIndex) => (
                            <td key={cellIndex} className="px-3 py-2 text-slate-300 whitespace-nowrap">
                              {cell}
                            </td>
                          ))}
                        </tr>
                      ))}
                    </tbody>
                  </table>
                </div>
              </>
            )}
          </div>

          <DialogFooter>
            <Button variant="outline" onClick={handleCancel}>
              <X className="w-4 h-4 mr-2" />
              Cancelar
            </Button>
            <Button 
              onClick={generateCSV} 
              disabled={!selectedPrompt || generating}
              className="bg-green-600 hover:bg-green-700"
            >
              {generating ? (
                <>
                  <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2" />
                  Gerando...
                </>
              ) : (
                <>
                  <Check className="w-4 h-4 mr-2" />
                  Aceitar e Gerar CSV
                </>
              )}
            </Button>
          </DialogFooter>
        </DialogContent>
      </Dialog>
    </>
  );
};

export default FileImporter;