// tabs.component.ts
import { Component, OnInit } from "@angular/core";
import { CommonModule } from "@angular/common";
import { TitleService } from "../../shared/services/theme/title.service";
import { GenericTabFormComponent } from "../../shared/components/generic-tab-form/generic-tab-form.component";
import { TabFormConfig } from "../../shared/interfaces/generic-tab-form.interface";
import { TabFormConfigService } from "../../shared/components/tab-system/services/tab-form-config.service";
import { ProfileService, ProfileUser } from "./profile.service";
import { AuthService } from "../../shared/services/auth/auth.service";

@Component({
  selector: "app-profile",
  standalone: true,
  imports: [CommonModule, GenericTabFormComponent],
  templateUrl: "./profile.component.html",
  styleUrls: ["./profile.component.scss"],
})
export class ProfileComponent implements OnInit {
  tabFormConfig!: TabFormConfig;
  currentUserData: any = null; // Inicializar como null para melhor controle
  isLoading = true; // Adicionar estado de loading
  
  constructor(
    private titleService: TitleService,
    private tabFormConfigService: TabFormConfigService,
    private profileService: ProfileService,
    private authService: AuthService
  ) {}

  ngOnInit(): void {
    this.titleService.setTitle("Meu Perfil");
    
    // Registrar configuração específica do profile
    this.registerProfileFormConfig();
    
    // Obter configuração registrada
    this.tabFormConfig = this.tabFormConfigService.getFormConfig('profile');
    
    // Carregar dados do usuário atual
    this.loadCurrentUserData();
  }

  private registerProfileFormConfig(): void {
    this.tabFormConfigService.registerFormConfig('profile', () => this.getProfileFormConfig());
  }

  private getProfileFormConfig(): TabFormConfig {
    return {
      title: 'Meu Perfil',
      entityType: 'profile',
      fields: [], // Campos globais vazios
      
      // 🎨 CONFIGURAÇÃO DO SIDECARD
      sideCard: this.getSideCardConfig(),
      
      subTabs: [
        {
          id: 'dados',
          label: 'Dados Pessoais',
          icon: 'fa-user',
          enabled: true,
          order: 1,
          templateType: 'fields',
          fields: [
            {
              key: 'name',
              label: 'Nome Completo',
              type: 'text',
              required: true,
              placeholder: 'Seu nome completo'
            },
            {
              key: 'email',
              label: 'Email',
              type: 'email',
              required: true,
              readOnly: true, // Email geralmente não muda
              placeholder: 'seu@email.com'
            },
            {
              key: 'phone',
              label: 'Telefone',
              type: 'tel',
              mask: '(00) 00000-0000',
              placeholder: '(00) 00000-0000'
            },
            {
              key: 'current_password',
              label: 'Senha Atual',
              type: 'password',
              placeholder: 'Digite sua senha atual para alterações'
            },
            {
              key: 'new_password',
              label: 'Nova Senha',
              type: 'password',
              placeholder: 'Digite uma nova senha (opcional)'
            },
            {
              key: 'confirm_password',
              label: 'Confirmar Nova Senha',
              type: 'password',
              placeholder: 'Confirme a nova senha'
            }
          ]
        },
        {
          id: 'photos',
          label: 'Fotos',
          icon: 'fa-camera',
          enabled: true,
          order: 3,
          templateType: 'fields', // 🎯 Renderiza campos específicos
          // requiredFields: ['photoIds'],
          fields: [
            {
              key: 'photoIds',
              label: 'Fotos do perfil',
              type: 'send-image',
              required: false,
              
              imageConfiguration: {
                maxImages: 1,
                maxSizeMb: 5,
                allowedTypes: ['image/jpeg', 'image/png', 'image/webp'],
                existingImages: [] // Será preenchido dinamicamente
              }
            }
          ]
        },
        // {
        //   id: 'seguranca',
        //   label: 'Segurança',
        //   icon: 'fa-shield-alt',
        //   enabled: true,
        //   order: 3,
        //   templateType: 'fields',
        //   fields: [
        //     {
        //       key: 'two_factor_enabled',
        //       label: 'Autenticação de Dois Fatores (2FA)',
        //       type: 'checkbox',
        //       defaultValue: false
        //     },
        //     {
        //       key: 'login_notifications',
        //       label: 'Notificações de Login por Email',
        //       type: 'checkbox',
        //       defaultValue: true
        //     },
        //     {
        //       key: 'session_timeout',
        //       label: 'Timeout da Sessão (minutos)',
        //       type: 'number',
        //       defaultValue: 30,
        //       min: 15,
        //       max: 480,
        //       placeholder: 'Entre 15 e 480 minutos'
        //     }
        //   ]
        // },
        {
          id: 'logs',
          label: 'Histórico de Acesso',
          icon: 'fa-history',
          enabled: true,
          order: 4,
          templateType: 'component',
          comingSoon: true // Por enquanto em desenvolvimento
        }
      ],
      submitLabel: 'Salvar Perfil',
      showCancelButton: false
    };
  }

  private getSideCardConfig(): any {
    return {
      enabled: true,
      title: 'Resumo do Perfil',
      imageField: 'photoId',
      imageIndex: 0, // 🎯 Usar posição 0 do array de imagens
      fallbackImage: '/assets/imagens/driver.placeholder.svg',
      
      displayFields: [
        {
          key: 'name',
          label: 'Nome',
          icon: 'fa-user',
          type: 'text',
          highlight: true
        },
        {
          key: 'access_level',
          label: 'Nível de Acesso',
          icon: 'fa-shield-alt',
          type: 'badge',
          badgeClass: 'access-level-badge',
          format: (value: string) => this.formatAccessLevel(value)
        },
        {
          key: 'last_login',
          label: 'Último Login',
          icon: 'fa-clock',
          type: 'datetime',
          format: 'dd/MM/yyyy HH:mm'
        },
        {
          key: 'login_location',
          label: 'Local de Acesso',
          icon: 'fa-map-marker-alt',
          type: 'text',
          format: (value: any) => value ? `${value.city}, ${value.country}` : 'Não disponível'
        },
        {
          key: 'records_modified_today',
          label: 'Registros Alterados Hoje',
          icon: 'fa-edit',
          type: 'counter',
          highlight: true,
          color: 'primary'
        },
        {
          key: 'session_duration',
          label: 'Tempo de Sessão Atual',
          icon: 'fa-hourglass-half',
          type: 'duration',
          format: (minutes: number) => this.formatDuration(minutes)
        },
        {
          key: 'security_score',
          label: 'Score de Segurança',
          icon: 'fa-shield-check',
          type: 'progress',
          format: (score: number) => `${score}%`,
          color: (score: number) => score >= 80 ? 'success' : score >= 60 ? 'warning' : 'danger'
        }
      ],
      
      // 🚀 AÇÕES RÁPIDAS NO SIDECARD
      actions: [
        {
          icon: 'fa-key',
          label: 'Alterar Senha',
          action: () => this.focusPasswordField(),
          color: 'primary'
        },
        {
          icon: 'fa-shield-alt',
          label: 'Configurar 2FA',
          action: () => this.setup2FA(),
          color: 'accent'
        },
        {
          icon: 'fa-download',
          label: 'Baixar Dados',
          action: () => this.downloadUserData(),
          color: 'basic'
        }
      ],
      
      // 🔔 ALERTAS CONTEXTUAIS
      alerts: [
        {
          type: 'warning',
          icon: 'fa-exclamation-triangle',
          message: 'Ative a autenticação de dois fatores para maior segurança',
          show: () => !this.currentUserData.two_factor_enabled,
          action: () => this.setup2FA()
        },
        {
          type: 'info',
          icon: 'fa-clock',
          message: 'Último login há mais de 7 dias',
          show: () => this.isLastLoginOld(),
          action: () => this.showLoginHistory()
        }
      ]
    };
  }

  private loadCurrentUserData(): void {
    // 🚀 VERIFICAR se usuário está logado
    if (!this.authService.isAuthenticated()) {
      console.error('Usuário não está logado');
      this.isLoading = false;
      this.authService.logout();
      return;
    }

    // 🚀 CARREGAR dados reais do usuário via API usando ID do AuthService
    this.profileService.getCurrentUserProfile().subscribe({
      next: (profile: ProfileUser) => {
        this.currentUserData = {
          ...profile,
          // 🖼️ Garantir que profile_photo seja array para o sistema de imagens
          photoId: profile.photoId || [] 
        };
        this.isLoading = false;
        console.log('✅ Perfil do usuário carregado:', this.currentUserData);
      },
      error: (error) => {
        console.error('❌ Erro ao carregar perfil do usuário:', error);
        
        // 🔄 FALLBACK: Usar dados do AuthService se disponível
        const authUser = this.authService.getCurrentUser();
        if (authUser) {
        
          this.currentUserData = {
            id: authUser.id,
            name: authUser.name,
            email: authUser.email,
            access_level: authUser.access_level,
            last_login: new Date(Date.now() - 2 * 60 * 60 * 1000), // 2 horas atrás
            login_location: {
              city: 'São Paulo',
              country: 'Brasil',
              ip: '192.168.1.100'
            },
            records_modified_today: 15,
            session_duration: 127, // minutos
            security_score: 85,
            two_factor_enabled: false,
            login_notifications: true,
            session_timeout: 30,
            photoId: [] // Array vazio para o sistema de imagens
          };
          this.isLoading = false;
          console.log('🔄 Usando dados do AuthService como fallback');
        } else {
          // Se nem AuthService tem dados, redirecionar para login
          this.isLoading = false;
          this.authService.logout();
        }
      }
    });
  }

  // 🎨 MÉTODOS DE FORMATAÇÃO
  formatAccessLevel(level: string): string {
    const levels: { [key: string]: string } = {
      'admin': '🔴 Administrador',
      'manager': '🟡 Gerente',
      'operator': '🟢 Operador',
      'viewer': '🔵 Visualizador'
    };
    return levels[level] || level;
  }

  formatDuration(minutes: number): string {
    if (!minutes) return '0m';
    const hours = Math.floor(minutes / 60);
    const mins = minutes % 60;
    return hours > 0 ? `${hours}h ${mins}m` : `${mins}m`;
  }

  // 🚀 AÇÕES DO SIDECARD
  focusPasswordField(): void {
    // Navegar para aba de cadastro e focar no campo de senha
    console.log('Focando no campo de senha...');
    // TODO: Implementar lógica de foco no campo
  }

  setup2FA(): void {
    // Abrir modal ou navegar para configuração de 2FA
    console.log('Configurar autenticação de dois fatores');
    // TODO: Implementar modal de configuração 2FA
  }

  downloadUserData(): void {
    // Implementar download dos dados do usuário (LGPD compliance)
    console.log('Baixando dados do usuário...');
    // TODO: Implementar download de dados
  }

  isLastLoginOld(): boolean {
    if (!this.currentUserData.last_login) return false;
    const lastLogin = new Date(this.currentUserData.last_login);
    const weekAgo = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000);
    return lastLogin < weekAgo;
  }

  showLoginHistory(): void {
    // Navegar para aba de logs ou abrir modal
    console.log('Mostrando histórico de login...');
    // TODO: Implementar visualização de histórico
  }

  onFormSubmit(data: any): void {
    console.log('💾 Salvando perfil do usuário:', data);
    
    // 🔐 Verificar se usuário está logado
    if (!this.authService.isAuthenticated()) {
      console.error('❌ Usuário não está logado');
      this.authService.logout();
      return;
    }

    // // 🔐 Verificar se há mudança de senha
    // if (data.new_password && data.current_password) {
    //   if (data.new_password !== data.confirm_password) {
    //     console.error('❌ Nova senha e confirmação não coincidem');
    //     return;
    //   }
      
    //   // Alterar senha primeiro
    //   const userId = this.authService.getCurrentUserId();
    //   if (!userId) {
    //     console.error('❌ ID do usuário não encontrado');
    //     return;
    //   }

    //   this.profileService.changePassword(
    //     userId,
    //     data.current_password,
    //     data.new_password
    //   ).subscribe({
    //     next: (success) => {
    //       if (success) {
    //         console.log('✅ Senha alterada com sucesso!');
    //         // Continuar com atualização dos outros dados
    //         this.updateProfileData(data);
    //       }
    //     },
    //     error: (error) => {
    //       console.error('❌ Erro ao alterar senha:', error);
    //     }
    //   });
    // } else {
    //   // Apenas atualizar dados do perfil
    //   this.updateProfileData(data);
    // }
    this.updateProfileData(data);
  }

  private updateProfileData(data: any): void {
    // 🧹 Limpar campos de senha dos dados a serem salvos
    const profileData = { ...data };
    delete profileData.current_password;
    delete profileData.new_password;
    delete profileData.confirm_password;
    profileData.new_password ? profileData.password = profileData.new_password : null;

    // 🚀 Usar método do ProfileService que já pega o ID do AuthService
    this.profileService.updateCurrentUserProfile(profileData).subscribe({
      next: (updatedProfile) => {
        console.log('✅ Perfil atualizado com sucesso!', updatedProfile);
        
        // 🔄 Atualizar dados locais
        this.currentUserData = { ...this.currentUserData, ...updatedProfile };
        
        // 🎯 Atualizar dados no AuthService também
        this.authService.updateUserData({
          name: updatedProfile.name,
          email: updatedProfile.email,
          access_level: updatedProfile.access_level
        });
        
        console.log('🔄 Dados sincronizados com AuthService');
      },
      error: (error) => {
        console.error('❌ Erro ao atualizar perfil:', error);
      }
    });
  }

  onFormCancel(): void {
    // Profile geralmente não precisa de cancelar
    // Mas pode implementar reset dos dados se necessário
    console.log('Cancelando edição do perfil...');
  }
}
