import React, { useState, useEffect, useCallback } from 'react';
import { Modal, Box, Typography, Button, CircularProgress, Alert, Select, MenuItem, FormControl, InputLabel, List, ListItem, ListItemText, IconButton, Divider, type SelectChangeEvent, TextField } from '@mui/material';
import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline';
import DeleteIcon from '@mui/icons-material/Delete';
import type { SuscripcionDto } from '../../../models/dtos/Suscripciones/SuscripcionDto';
import type { PromocionDto } from '../../../models/dtos/Suscripciones/PromocionDto';
import type { PromocionAsignadaDto } from '../../../models/dtos/Suscripciones/PromocionAsignadaDto';
import type { AsignarPromocionDto } from '../../../models/dtos/Suscripciones/AsignarPromocionDto';
import suscripcionService from '../../../services/Suscripciones/suscripcionService';

const modalStyle = {
    position: 'absolute' as 'absolute',
    top: '50%',
    left: '50%',
    transform: 'translate(-50%, -50%)',
    width: { xs: '95%', sm: '80%', md: '600px' },
    bgcolor: 'background.paper',
    border: '2px solid #000',
    boxShadow: 24,
    p: 4,
    maxHeight: '90vh',
    overflowY: 'auto'
};

interface GestionarPromocionesSuscripcionModalProps {
    open: boolean;
    onClose: () => void;
    suscripcion: SuscripcionDto | null;
}

const GestionarPromocionesSuscripcionModal: React.FC<GestionarPromocionesSuscripcionModalProps> = ({ open, onClose, suscripcion }) => {
    const [asignadas, setAsignadas] = useState<PromocionAsignadaDto[]>([]);
    const [disponibles, setDisponibles] = useState<PromocionDto[]>([]);
    const [loading, setLoading] = useState(false);
    const [error, setError] = useState<string | null>(null);

    const [selectedPromo, setSelectedPromo] = useState<number | string>('');
    const [vigenciaDesde, setVigenciaDesde] = useState('');
    const [vigenciaHasta, setVigenciaHasta] = useState('');

    const cargarDatos = useCallback(async () => {
        if (!suscripcion) return;
        setLoading(true);
        setError(null);
        try {
            const [asignadasData, disponiblesData] = await Promise.all([
                suscripcionService.getPromocionesAsignadas(suscripcion.idSuscripcion),
                suscripcionService.getPromocionesDisponibles(suscripcion.idSuscripcion)
            ]);
            setAsignadas(asignadasData);
            setDisponibles(disponiblesData);
        } catch (err) {
            setError("Error al cargar las promociones.");
        } finally {
            setLoading(false);
        }
    }, [suscripcion]);

    useEffect(() => {
        if (open && suscripcion) {
            cargarDatos();
            setSelectedPromo('');
            setVigenciaDesde(suscripcion.fechaInicio);
            setVigenciaHasta('');
        }
    }, [open, suscripcion]);

    const handleAsignar = async () => {
        if (!suscripcion || !selectedPromo || !vigenciaDesde) {
            setError("Debe seleccionar una promoción y una fecha de inicio.");
            return;
        }
        setError(null);
        try {
            const dto: AsignarPromocionDto = {
                idPromocion: Number(selectedPromo),
                vigenciaDesde: vigenciaDesde,
                vigenciaHasta: vigenciaHasta || null
            };
            await suscripcionService.asignarPromocion(suscripcion.idSuscripcion, dto);
            setSelectedPromo('');
            setVigenciaDesde(suscripcion.fechaInicio);
            setVigenciaHasta('');
            cargarDatos();
        } catch (err: any) {
            setError(err.response?.data?.message || "Error al asignar la promoción.");
        }
    };

    const handleQuitar = async (idPromocion: number) => {
        if (!suscripcion) return;
        setError(null);
        if (window.confirm("¿Está seguro de que desea quitar esta promoción de la suscripción?")) {
            try {
                await suscripcionService.quitarPromocion(suscripcion.idSuscripcion, idPromocion);
                cargarDatos();
            } catch (err: any) {
                setError(err.response?.data?.message || "Error al quitar la promoción.");
            }
        }
    };

    const formatDate = (dateString?: string | null) => {
        if (!dateString) return 'Indefinida';
        const parts = dateString.split('-');
        return `${parts[2]}/${parts[1]}/${parts[0]}`;
    };

    const formatSecondaryText = (promo: PromocionAsignadaDto): string => {
        let text = '';
        switch (promo.tipoEfecto) {
            case 'DescuentoPorcentajeTotal': text = `Descuento Total: ${promo.valorEfecto}%`; break;
            case 'DescuentoMontoFijoTotal': text = `Descuento Total: $${promo.valorEfecto.toFixed(2)}`; break;
            case 'BonificarEntregaDia': text = 'Bonificación de Día'; break;
            default: text = 'Tipo desconocido';
        }
        return text;
    };

    if (!suscripcion) return null;

    return (
        <Modal open={open} onClose={onClose}>
            <Box sx={modalStyle}>
                <Typography variant="h6">Gestionar Promociones</Typography>
                <Typography variant="body2" color="text.secondary" gutterBottom>
                    Suscripción a: <strong>{suscripcion.nombrePublicacion}</strong>
                </Typography>
                {error && <Alert severity="error" sx={{ my: 2 }}>{error}</Alert>}
                {loading ? <CircularProgress sx={{ display: 'block', margin: '20px auto' }} /> : (
                    <>
                        <Typography sx={{ mt: 2, fontWeight: 'medium' }}>Promociones Asignadas</Typography>
                        <List dense>
                            {asignadas.length === 0 && <ListItem><ListItemText primary="No hay promociones asignadas." /></ListItem>}
                            {asignadas.map(p => (
                                <ListItem key={p.idPromocion} secondaryAction={<IconButton edge="end" onClick={() => handleQuitar(p.idPromocion)}><DeleteIcon /></IconButton>}>
                                    <ListItemText
                                        primary={p.descripcion}
                                        secondary={`Vigente del ${formatDate(p.vigenciaDesdeAsignacion)} al ${formatDate(p.vigenciaHastaAsignacion)} - ${formatSecondaryText(p)}`}
                                    />
                                </ListItem>
                            ))}
                        </List>
                        <Divider sx={{ my: 2 }} />
                        <Typography>Asignar Nueva Promoción</Typography>
                        <Box sx={{ mt: 1 }}>
                            <FormControl fullWidth size="small" sx={{ mb: 2 }}>
                                <InputLabel>Promociones Disponibles</InputLabel>
                                <Select value={selectedPromo} label="Promociones Disponibles" onChange={(e: SelectChangeEvent<number | string>) => setSelectedPromo(e.target.value)}>
                                    {disponibles.map(p => <MenuItem key={p.idPromocion} value={p.idPromocion}>{p.descripcion}</MenuItem>)}
                                </Select>
                            </FormControl>
                            <Box sx={{ display: 'flex', gap: 2 }}>
                                <TextField label="Vigencia Desde" type="date" value={vigenciaDesde} onChange={(e) => setVigenciaDesde(e.target.value)} required fullWidth size="small" InputLabelProps={{ shrink: true }} />
                                <TextField label="Vigencia Hasta (Opcional)" type="date" value={vigenciaHasta} onChange={(e) => setVigenciaHasta(e.target.value)} fullWidth size="small" InputLabelProps={{ shrink: true }} />
                            </Box>
                            <Button variant="contained" onClick={handleAsignar} disabled={!selectedPromo} sx={{ mt: 2 }} startIcon={<AddCircleOutlineIcon />}>
                                Asignar
                            </Button>
                        </Box>
                    </>
                )}
                <Box sx={{ mt: 3, textAlign: 'right' }}>
                    <Button onClick={onClose}>Cerrar</Button>
                </Box>
            </Box>
        </Modal>
    );
};

export default GestionarPromocionesSuscripcionModal;