import {Component, Input, OnInit} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {environment} from '../../../../../../environments/environment';

interface HistorialItem {
	id: number;
	campo: string;
	campo_legible: string;
	valor_anterior: string;
	valor_nuevo: string;
	accion: string;
	usuario_completo: string;
	tiempo_transcurrido: string;
	created_at: string;
}

@Component({
	selector: 'kt-historial-cambios',
	templateUrl: './historial-cambios.component.html',
	styleUrls: ['./historial-cambios.component.scss']
})
export class HistorialCambiosComponent implements OnInit {

	@Input() servicioDetId: number;

	historial: HistorialItem[] = [];
	isLoading = false;
	error: string = null;

	constructor(private http: HttpClient) {}

	ngOnInit() {
		if (this.servicioDetId) {
			this.cargarHistorial();
		}
	}

	cargarHistorial(): void {
		this.isLoading = true;
		this.error = null;

		this.http.get<any>(`${environment.API}atencionclientes/solicitud_servicios/${this.servicioDetId}/historial`)
			.subscribe(
				(response) => {
					this.historial = response.data || response;
					this.isLoading = false;
				},
				(err) => {
					this.error = 'Error al cargar el historial';
					this.isLoading = false;
					console.error('Error:', err);
				}
			);
	}

	getIconoAccion(accion: string): string {
		switch (accion) {
			case 'crear':
				return 'add_circle';
			case 'actualizar':
				return 'edit';
			case 'eliminar':
				return 'delete';
			default:
				return 'info';
		}
	}

	getColorAccion(accion: string): string {
		switch (accion) {
			case 'crear':
				return '#4caf50';
			case 'actualizar':
				return '#2196f3';
			case 'eliminar':
				return '#f44336';
			default:
				return '#9e9e9e';
		}
	}
}
