/* eslint-disable prettier/prettier */
/* eslint-disable @typescript-eslint/no-unused-vars */
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { CarouselComponent } from '../shared/carousel/carousel.component';
import { MatSelectChange, MatSelectModule } from '@angular/material/select';
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
import { MatFormFieldModule } from '@angular/material/form-field';
import { CommonModule } from '@angular/common';
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';

interface EmpFilter {
  name: string;
  options: string[];
  defaultValue: string;
}

interface filterOption {
  name: string;
  value: string;
  isdefault: boolean;
}

interface Employee {
  id: number;
  firstname: string;
  lastname: string;
  email: string;
  gender: string;
  jobtitle: string;
  department: string;
  date: string;
}

@Component({
  selector: 'bgui-compte-associe',
  standalone: true,
  imports: [
    CommonModule,
    MatCardModule,
    MatTableModule,
    MatButtonModule,
    CarouselComponent,
    MatFormFieldModule,
    MatSelectModule,
    MatPaginatorModule,
    // Ajoutez ici les modules MatTableModule et MatSelectModule s'ils ne sont pas déjà inclus
  ],
  templateUrl: './compte-associe.component.html',
  styleUrls: ['./compte-associe.component.scss'], // Correction de 'styleUrl' à 'styleUrls'
})
export class CompteAssocieComponent implements OnInit {

  displayedColumns: string[] = [
    'id',
    'firstname',
    'lastname',
    'email',
    'gender',
    'jobtitle',
    'department',
    'date',
  ];
EmpData: Employee[] = [
 {
    id: 1,
    firstname: 'Mellie',
    lastname: 'Gabbott',
    email: 'mgabbott0@indiatimes.com',
    gender: 'Female',
    department: 'Support',
    jobtitle: 'Support Analyst',
    date: '01/01/2024', // Date spécifique pour le premier employé
  },
  {
    id: 2,
    firstname: 'Yehudi',
    lastname: 'Ainsby',
    email: 'yainsby1@w3.org',
    gender: 'Female',
    department: 'Support',
    jobtitle: 'Support Analyst',
    date: '15/03/2024', // Date spécifique pour le deuxième employé
  },
  {
    id: 3,
    firstname: 'Noellyn',
    lastname: 'Primett',
    email: 'nprimett2@ning.com',
    gender: 'Female',
    department: 'Human Resources',
    jobtitle: 'Project Manager',
    date: '20/05/2024', // Date spécifique pour le troisième employé
  },
  {
    id: 4,
    firstname: 'Stefanie',
    lastname: 'Yurenin',
    email: 'syurenin3@boston.com',
    gender: 'Female',
    department: 'Marketing',
    jobtitle: 'Senior officer',
    date: '01/01/2024', // Date spécifique pour tous les employés
  },
  {
    id: 5,
    firstname: 'Stormi',
    lastname: "O'Lunny",
    email: 'solunny4@patch.com',
    gender: 'Female',
    department: 'Engineering',
    jobtitle: 'Software Engineer',
    date: '01/01/2024', // Date spécifique pour tous les employés
  },
  {
    id: 6,
    firstname: 'Keelia',
    lastname: 'Giraudy',
    email: 'kgiraudy5@nba.com',
    gender: 'Male',
    department: 'Marketing',
    jobtitle: 'Senior officer',
    date: '01/01/2024', // Date spécifique pour tous les employés
  },
  {
    id: 7,
    firstname: 'Ikey',
    lastname: 'Laight',
    email: 'ilaight6@wiley.com',
    gender: 'Male',
    department: 'Support',
    jobtitle: 'Support Analyst',
    date: '01/02/2024', // Date spécifique pour tous les employés
  },
  {
    id: 8,
    firstname: 'Adrianna',
    lastname: 'Ruddom',
    email: 'aruddom7@seattletimes.com',
    gender: 'Male',
    department: 'Marketing',
    jobtitle: 'Senior officer',
    date: '27/02/2024', // Date spécifique pour tous les employés
  },
  {
    id: 9,
    firstname: 'Dionysus',
    lastname: 'McCory',
    email: 'dmccory8@ox.ac.uk',
    gender: 'Male',
    department: 'Engineering',
    jobtitle: 'Software Engineer',
    date: '01/01/2024', // Date spécifique pour tous les employés
  },
  {
    id: 10,
    firstname: 'Claybourne',
    lastname: 'Shellard',
    email: 'cshellard9@rediff.com',
    gender: 'Male',
    department: 'Engineering',
    jobtitle: 'Software Engineer',
    date: '08/04/2024', // Date spécifique pour tous les employés
  },
];


  genders: string[] = ['All', 'Male', 'Female'];
  jobtitles: string[] = [
    'All',
    'Support Analyst',
    'Project Manager',
    'Senior officer',
    'Software Engineer',
  ];
  departments: string[] = [
    'All',
    'Support',
    'Human Resources',
    'Marketing',
    'Engineering',
  ];
  empFilters: EmpFilter[] = [];

  defaultValue = 'All';

  filterDictionary = new Map<string, string>();

  dataSource = new MatTableDataSource(this.EmpData);
  dataSourceFilters = new MatTableDataSource(this.EmpData);
  @ViewChild(MatPaginator) paginator: MatPaginator | undefined;

  constructor() {}

  ngOnInit(): void {
    this.empFilters.push({
      name: 'gender',
      options: this.genders,
      defaultValue: this.defaultValue,
    });
    this.empFilters.push({
      name: 'jobtitle',
      options: this.jobtitles,
      defaultValue: this.defaultValue,
    });
    this.empFilters.push({
      name: 'department',
      options: this.departments,
      defaultValue: this.defaultValue,
    });

    this.dataSourceFilters.filterPredicate = function (record, filter) {
      const map = new Map(JSON.parse(filter));
      let isMatch = false;
      for (const [key, value] of map) {
        isMatch = value === 'All' || record[key as keyof Employee] === value;
        if (!isMatch) return false;
      }
      return isMatch;
    };
  }

  applyEmpFilter(ob: MatSelectChange, empfilter: EmpFilter) {
    this.filterDictionary.set(empfilter.name, ob.value);

    const jsonString = JSON.stringify(
      Array.from(this.filterDictionary.entries())
    );

    this.dataSourceFilters.filter = jsonString;
  }

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