perfil-usuario.component.ts

import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core';
import { MostrarOcultarService } from '../../../../services/mostrar-ocultar.service';
import { Perfil } from '../../../../Models/perfil';
import { PerfilService } from '../../../../services/perfiles/perfil.service';
import { Observable, Subscription } from 'rxjs';
import { Router } from '@angular/router';
import { MatTableDataSource } from '@angular/material/table';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { ConfirmacionEliminacionComponent } from '../../../programa/opciones/ConfirmacionEliminacion/ConfirmacionEliminacion.component';
import { MatDialog } from '@angular/material/dialog';

@Component({
  selector: 'app-perfil-usuario',
  templateUrl: './perfil-usuario.component.html',
  styleUrls: ['./perfil-usuario.component.css']
})
export class PerfilUsuarioComponent implements OnInit {

  terminoBusqueda: string = '';
  perfil!: Perfil[];
  parametrosSubscription: Subscription;
  dataSource: MatTableDataSource<Perfil>;
  displayedColumns: string[] = [
    'Nro',
    'Nombre de Perfil',
    'Acciones',
  ];

  @ViewChild(MatPaginator) paginator!: MatPaginator;
  @ViewChild(MatSort) sort!: MatSort;

  filtroGeneral: string = '';


  constructor(
    public mostrarOcultarService: MostrarOcultarService,
    private router: Router,
    private perfilService: PerfilService,
    private dialog: MatDialog
  ) {
    this.dataSource = new MatTableDataSource<Perfil>([]);
  }


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

    this.dataSource.filterPredicate = (data: Perfil) => {
      const nombre = data.uzytperfil_nombre.toLowerCase();

      // Filtrar por todos los campos (nombre de institución, dirección, representante y parroquia)
      return (
        nombre.includes(this.filtroGeneral.toLowerCase())
      );
    };
  }

  ngAfterViewInit() {
    this.dataSource.paginator = this.paginator;
    this.dataSource.sort = this.sort;
  }

  AgregarParametro() {
    this.router.navigate(['main/AddPerfilUsuario']);
  }

  editParametros(id: number) {
    console.log("id perfil ", id)
    const registroSeleccionado = this.perfil.find(
      (perfil) => perfil.id === id
    );
    this.mostrarOcultarService.perfilEditado = registroSeleccionado;
    this.router.navigate(['main/EditPerfilUsuario', id]);
  }


  eliminarParametro(id: number) {
    this.openModalDelete('¿Estás seguro de eliminar el Perfil?').subscribe(result => {
      if (result) {
        console.log("id", id);
        this.perfilService.eliminarParametros(id).subscribe(
          () => {
            // Manejar la eliminación exitosa
            console.log('Registro eliminado correctamente');
            this.obtenerRegistros();
          },
          (error) => {
            // Manejar el error en caso de que ocurra
            console.error('Error al eliminar el registro', error);
          }
        );
      }
    });
  }

  formularioEnviado:boolean;
  openModalDelete(mensaje: string): Observable<string>{
    const dialogRef = this.dialog.open(ConfirmacionEliminacionComponent, {
      disableClose: true,
      data: { mensaje: mensaje }
    });

    return dialogRef.afterClosed();
  }

  volver() {
    this.router.navigate(['main/PrincipalUsuarios']);
  }

  obtenerRegistros() {
    this.parametrosSubscription = this.perfilService.obtenerParametros().subscribe((data) => {
      this.perfil = data;
      this.dataSource.data = this.perfil;
    });
  }

  ngOnInit() {
    this.obtenerRegistros();

  }

  ngOnDestroy() {
    // Desuscribirse para evitar fugas de memoria
    this.parametrosSubscription.unsubscribe();
  }


}