/* eslint-disable @typescript-eslint/no-explicit-any */

import { CommonModule } from '@angular/common';
import { HttpClient } from '@angular/common/http';
import { Component, ViewChild } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
import { MatSnackBar } from '@angular/material/snack-bar';
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
import { Router, RouterLink } from '@angular/router';
import { map } from 'rxjs/internal/operators/map';
import { IUtilisateur } from 'src/app/_interfaces/utilisateur/user';
import { UserService } from 'src/app/_services/utilisateur/user.service';
import * as XLSX from 'xlsx';

@Component({
  selector: 'bgui-view-user',
  standalone: true,
  imports: [
    CommonModule,
    MatTableModule,
    MatInputModule,
    MatIconModule,
    RouterLink,
    FormsModule,
    MatPaginatorModule,
  ],
  templateUrl: './view-user.component.html',
  styleUrl: './view-user.component.scss',
})
export class ViewUserComponent {
  constructor(
    private http: HttpClient,
    private router: Router,
    private snackBar: MatSnackBar,
    private dialog: MatDialog,
    private userService: UserService
  ) {}

  user: IUtilisateur[] = [];
  dataTypePaiements: any[] = [];
  operateurs: any;

  dataSource = new MatTableDataSource<IUtilisateur>();
  @ViewChild(MatPaginator) paginator!: MatPaginator;

  onSearch() {
    throw new Error('Method not implemented.');
  }
  selectedOperateur: string = 'OM';
  startDate: any;
  endDate: any;

  ngOnInit(): void {
    this.userService
      .getAllUsers()
      .pipe(map((data: IUtilisateur[]) => JSON.stringify(data)))
      .subscribe((jsonData: string) => {
        const userData = JSON.parse(jsonData);
        const results = userData.results;
        console.log('UserData==> Results:', results);
        this.dataSource.data = userData.results;
      });
  }

  ngAfterViewInit() {
    this.dataSource.paginator = this.paginator;
    this.dataSource.paginator.pageIndex = this.paginator.pageSize;
  }

  displayedColumns: string[] = [
    // 'id',
    'username',
    'first_name',
    'last_name',
    'email',
    'role',
    // 'profile_photo',
    'actions',
  ];

  applyFilter(event: Event) {
    const filterValue = (event.target as HTMLInputElement).value;
    this.dataSource.filter = filterValue.trim().toLowerCase();
  }

  onDelete(id: number): void {
    this.userService.deleteUser(id).subscribe(
      () => {
        console.log(`Utilisateur avec l'ID ${id} supprimé.`);
        this.ngOnInit();
        this.snackBar.open('Utilisateur supprimé avec succès', 'Fermer', {
          duration: 3000,
        });
      },
      error => {
        console.error('Erreur lors de la suppression de :', error);
        this.snackBar.open(
          'Erreur lors de la suppression du service',
          'Fermer',
          {
            duration: 3000,
          }
        );
      }
    );
  }

  onExport() {
    const worksheet = XLSX.utils.json_to_sheet(this.user);
    const workbook = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(workbook, worksheet, 'Utilisateurs');
    XLSX.writeFile(workbook, 'user.xlsx');
  }
}