import {Component, Input, OnChanges, SimpleChanges} from '@angular/core';

interface ServicioAgenda {
	nombre_operador: string;
	hora_servicio: string;
	duracion_servicio: string;
	denominacion_cliente: string;
	start_day: string;
	end_day: string;
	color_estatus: string;
	nombre_estatus: string;
}

interface ServicioCelda extends ServicioAgenda {
	horaInicio: number;
	duracionHoras: number;
	rowSpan: number;
}

interface CeldaHora {
	hora: number;
	horaFormateada: string;
	servicios: { [operador: string]: ServicioCelda | null };
	ocupado: { [operador: string]: boolean };
}

@Component({
	selector: 'kt-agenda-medica',
	templateUrl: './agenda-medica.component.html',
	styleUrls: ['./agenda-medica.component.scss']
})
export class AgendaMedicaComponent implements OnChanges {

	@Input() serviciosRaw: ServicioAgenda[] = [];
	@Input() isLoading: boolean = false;

	operadores: string[] = [];
	horasDelDia: CeldaHora[] = [];
	horaInicio: number = 7;
	horaFin: number = 21;

	constructor() {}

	ngOnChanges(changes: SimpleChanges): void {
		if (changes.serviciosRaw) {
			this.procesarDatos();
		}
	}

	procesarDatos(): void {
		// Obtener operadores únicos
		const operadoresSet = new Set<string>();
		this.serviciosRaw.forEach(s => operadoresSet.add(s.nombre_operador || 'Sin asignar'));
		this.operadores = Array.from(operadoresSet).sort();

		// Generar estructura de horas
		this.horasDelDia = [];
		for (let hora = this.horaInicio; hora <= this.horaFin; hora++) {
			const celda: CeldaHora = {
				hora: hora,
				horaFormateada: this.formatearHora(hora),
				servicios: {},
				ocupado: {}
			};

			// Inicializar cada operador
			this.operadores.forEach(op => {
				celda.servicios[op] = null;
				celda.ocupado[op] = false;
			});

			this.horasDelDia.push(celda);
		}

		// Colocar servicios en las celdas
		this.serviciosRaw.forEach(servicio => {
			const operador = servicio.nombre_operador || 'Sin asignar';
			const startDate = new Date(servicio.start_day);
			const endDate = new Date(servicio.end_day);

			const horaInicioServicio = startDate.getHours();
			const duracionMinutos = (endDate.getTime() - startDate.getTime()) / (1000 * 60);
			const duracionHoras = Math.ceil(duracionMinutos / 60);

			// Encontrar la celda de inicio
			const celdaIndex = this.horasDelDia.findIndex(c => c.hora === horaInicioServicio);
			if (celdaIndex >= 0) {
				const servicioConInfo: ServicioCelda = {
					...servicio,
					horaInicio: horaInicioServicio,
					duracionHoras: duracionHoras,
					rowSpan: Math.min(duracionHoras, this.horasDelDia.length - celdaIndex)
				};

				this.horasDelDia[celdaIndex].servicios[operador] = servicioConInfo;

				// Marcar celdas siguientes como ocupadas
				for (let i = 1; i < servicioConInfo.rowSpan && (celdaIndex + i) < this.horasDelDia.length; i++) {
					this.horasDelDia[celdaIndex + i].ocupado[operador] = true;
				}
			}
		});
	}

	formatearHora(hora: number): string {
		if (hora === 0) return '12:00 AM';
		if (hora < 12) return `${hora}:00 AM`;
		if (hora === 12) return '12:00 PM';
		return `${hora - 12}:00 PM`;
	}

	getServicio(celda: CeldaHora, operador: string): ServicioCelda | null {
		return celda.servicios[operador];
	}

	esCeldaOcupada(celda: CeldaHora, operador: string): boolean {
		return celda.ocupado[operador];
	}

	getTotalServicios(): number {
		return this.serviciosRaw.length;
	}

	trackByHora(index: number, celda: CeldaHora): number {
		return celda.hora;
	}

	trackByOperador(index: number, operador: string): string {
		return operador;
	}
}
