
<div class="container py-4">
    <div class="row justify-content-center">
        <div class="col-12 col-lg-10">
            <!-- Encabezado del mensaje -->
            <div class="mb-4">
                <div class="d-flex align-items-center mb-3">
                    <h1 class="h3 mb-0 flex-grow-1">Solicitud de Trámite #<?= htmlspecialchars($process->num_exped) ?></h1>
                    <span class="badge bg-primary text-white fs-6 px-3 py-2">
                        <?= htmlspecialchars($response->responseType()->description) ?>
                    </span>
                </div>

                <div class="d-flex align-items-center mb-3">
                    <span class="avatar avatar-sm" style="margin-right: 12px;">
                        <img src="/assets/profile/<?= htmlspecialchars($responsible->user()->profile_picture ?? 'default.jpg') ?>"  
                            onerror="this.onerror=null; this.src='/assets/profile/default.jpg';" 
                            class="avatar-img rounded-circle" 
                            alt="Foto de perfil"
                            style="width: 40px; height: 40px; object-fit: cover; aspect-ratio: 1/1;">
                    </span>
                    <div class="flex-grow-1">
                        <div class="fw-bold"><?= htmlspecialchars($responsible->subgroup() ? $responsible->subgroup()->description : $responsible->group()->description) ?></div>
                        <div class="text-muted small"><?= htmlspecialchars($responsible->email) ?></div>
                    </div>
                    <div class="text-muted small text-end">
                        <?= htmlspecialchars($formatedDate) ?>
                    </div>
                </div>

            </div>

            <hr class="my-4">

            <!-- Contenido del mensaje -->
            <div class="mb-4">
                <p>Estimado usuario,</p>

                <?php if ($response->isProveido()): ?>
                    <p>
                    <?php
                        $procedure = $response->process()->procedure();
                        $correctionDays = $procedure && isset($procedure->correction_days)
                            ? $procedure->correction_days
                            : 2;
                        ?>

                        <?= nl2br(htmlspecialchars($response->comment)) . '. TIENE UN PLAZO DE ' . $correctionDays . ' DÍAS HÁBILES PARA SUBSANAR.' ?>

                    </p>
                <?php elseif ($response->isResolution()): ?>
                    <p>
                        <?= nl2br(htmlspecialchars($response->comment)) . '.' ?>
                    </p>
                <?php else: ?>
                    <p><?= nl2br(htmlspecialchars($response->comment)) ?></p>
                <?php endif; ?>

                <p>Atentamente,<br><?= htmlspecialchars($response->user()->subgroup() ? $response->user()->subgroup()->description : $response->user()->group()->description) ?></p>
            </div>


            <!-- Detalles del trámite -->
            <div class="card mb-4 shadow-sm">
                <div class="card-header bg-white">
                    <h5 class="card-title mb-0">
                        <i class="fas fa-envelope me-2"></i>Detalles del Trámite
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row g-4 mb-3 custom-gap">
                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Número de Trámite</div>
                            <div><?= htmlspecialchars($process->num_exped) ?></div>
                        </div>         
                        
                        <?php
                        $badgeClass = 'secondary';

                        switch ($process->general_state) {
                            case 'EN PROCESO':
                                $badgeClass = 'warning';
                                break;
                            case 'OBSERVADO':
                                $badgeClass = 'danger';
                                break;
                            case 'RESUELTO':
                                $badgeClass = 'success';
                                break;
                        }
                        ?>

                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Estado</div>
                            <div>
                                <span class="badge badge-<?= $badgeClass ?>">
                                    <?= htmlspecialchars($process->general_state) ?>
                                </span>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Administrado</div>
                            <div><?= htmlspecialchars($user->name) . ' ' . htmlspecialchars($user->paternal_surname) . ' ' . htmlspecialchars($user->maternal_surname) ?></div>
                        </div>
                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Procedimiento</div>
                            <div><?= htmlspecialchars($process->procedure()->description ?? $process->custom_procedure ?? 'Sin procedimiento') ?></div>
                        </div>
                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Asunto</div>
                            <div><?= htmlspecialchars($process->subject) ?></div>
                        </div>
                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Folios</div>
                            <div><?= htmlspecialchars($process->folios) ?></div>
                        </div>
                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Fecha de ingreso</div>
                            <div><?= date('d/m/Y g:i A', strtotime($process->entry_date)) ?></div>
                        </div>
                        <div class="col-md-6">
                            <div class="text-muted small mb-1">Clave</div>
                            <div><?= htmlspecialchars($process->key) ?></div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Archivos adjuntos -->
            <div class="card shadow-sm">
                <div class="card-header bg-white">
                    <h5 class="card-title mb-0">
                        <i class="fas fa-file-alt me-2"></i> Archivos Adjuntos
                    </h5>
                </div>
                <div class="card-body">
                    <?php if (!empty($response->file_path)) : ?>
                        <div class="d-flex align-items-center border rounded p-3 mb-2 gap-3"> <!-- gap-3 para espacio -->
                            <div class="d-flex align-items-center justify-content-center bg-light rounded border" 
                                style="width: 48px; height: 48px;">
                                <i class="fe fe-file-text" style="font-size: 24px;"></i>
                            </div>
                            <div class="flex-grow-1" style="margin-left: 12px;"> <!-- margen manual -->
                                <div class="fw-medium"><?= htmlspecialchars($response->file_name) ?></div>
                                <div class="text-muted small">PDF</div>
                            </div>
                            <a href="javascript:void(0);" onclick="confirmarDescarga('<?= BASE_HREF . ltrim($response->file_path, '/') ?>', <?= $response->id ?>, '<?= htmlspecialchars($response->file_name) ?>')" 
                                class="btn btn-outline-secondary btn-sm">
                                <i class="fe fe-download" style="font-size: 18px;"></i>
                            </a>

                        </div>
                    <?php else : ?>
                        <p class="text-muted small">No hay archivos adjuntos disponibles.</p>
                    <?php endif; ?>
                </div>
            </div>

            <div class="d-flex justify-content-start mt-4">
                <a href="<?= BASE_HREF ?>inbox" class="btn btn-secondary">Volver a la Bandeja</a>
                <?php if ($response->isProveido() && $process->general_state == "OBSERVADO") : ?>
                    <a href="<?= BASE_HREF ?>processes/<?= $process->id ?>/amend" class="btn btn-warning" style="margin-left: 10px;">Ir a Subsanar</a>
                <?php endif; ?>
            </div>
        </div>
    </div>
</div>

<style>
    .custom-gap {
        row-gap: 1rem;
    }

</style>


<script>

    function confirmarDescarga(url, responseId, fileName) {
        Swal.fire({
            title: "Descarga de archivo",
            text: `Estás descargando el archivo "${fileName}". Su visualización quedará registrada a la fecha <?= date('d/m/Y') ?> a la hora <?= date('H:i A') ?>.`,
            icon: "info",
            showCancelButton: true,
            confirmButtonText: "Aceptar",
            cancelButtonText: "Cancelar"
        }).then((result) => {
            if (result.isConfirmed) {
                fetch(BASE_HREF +'register-download', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ response_id: responseId })
                }).then(() => {
                    const link = document.createElement('a');
                    link.href = url;
                    link.download = fileName;
                    document.body.appendChild(link);
                    link.click();
                    document.body.removeChild(link);
                }).catch(error => console.error('Error:', error));
            }
        });
    }
</script>

