<?php
/**
 * TechShop Perú - Panel Admin: Gestión de Tickets de Soporte
 */
define('SECURE_ACCESS', true);
require_once __DIR__ . '/../includes/config.php';
require_once __DIR__ . '/../includes/database.php';
require_once __DIR__ . '/../includes/functions.php';

require_admin();
$db = db();

/* ----- RESPONDER TICKET ----- */
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['responder'])) {
    if (!csrf_verify()) { set_flash('error', 'Token inválido.'); redirect('panel-admin-tech/tickets.php'); }
    $tid      = (int)($_POST['ticket_id'] ?? 0);
    $respuesta= trim($_POST['respuesta'] ?? '');
    // Whitelist de valores (evita guardar estados/prioridades inválidos)
    $estado   = in_array($_POST['estado'] ?? '', ['abierto','en_revision','resuelto','cerrado'], true) ? $_POST['estado'] : 'en_revision';
    $prioridad= in_array($_POST['prioridad'] ?? '', ['baja','normal','alta','urgente'], true) ? $_POST['prioridad'] : 'normal';
    
    if ($tid && $respuesta) {
        $stmt = $db->prepare('UPDATE tickets_soporte SET respuesta=?,estado=?,prioridad=? WHERE id=?');
        $stmt->execute([$respuesta, $estado, $prioridad, $tid]);
        set_flash('success', 'Respuesta enviada al cliente exitosamente.');
    }
    csrf_regenerate();
    redirect('panel-admin-tech/tickets.php');
}

/* ----- CAMBIAR ESTADO (vía GET con token CSRF: previene CSRF forjando <img>) ----- */
if (isset($_GET['estado']) && isset($_GET['id'])) {
    if (!csrf_verify_get()) {
        set_flash('error', 'Token de seguridad inválido.');
    } else {
        $estados_validos = ['abierto','en_revision','resuelto','cerrado'];
        $est = $_GET['estado'];
        if (in_array($est, $estados_validos)) {
            $db->prepare('UPDATE tickets_soporte SET estado=? WHERE id=?')->execute([$est, (int)$_GET['id']]);
        }
    }
    redirect('panel-admin-tech/tickets.php');
}

/* ----- CARGAR DATOS ----- */
$filter_estado = $_GET['estado_filter'] ?? '';
$where = $filter_estado ? 'WHERE ts.estado = ?' : '';
$params = $filter_estado ? [$filter_estado] : [];

$tickets = $db->prepare("
    SELECT ts.*, u.nombres, u.apellidos, u.email,
           p.numero_pedido
    FROM tickets_soporte ts
    JOIN usuarios u ON ts.usuario_id = u.id
    LEFT JOIN pedidos p ON ts.pedido_id = p.id
    $where
    ORDER BY 
        CASE ts.prioridad WHEN 'urgente' THEN 1 WHEN 'alta' THEN 2 WHEN 'normal' THEN 3 ELSE 4 END,
        ts.fecha_creacion DESC
    LIMIT 200
");
$tickets->execute($params);
$tickets = $tickets->fetchAll();

/* Stats */
$stats = $db->query("SELECT estado, COUNT(*) as total FROM tickets_soporte GROUP BY estado")->fetchAll(PDO::FETCH_KEY_PAIR);

$page_title = 'Tickets de Soporte';
require_once __DIR__ . '/views/layout.php';
?>

<div class="d-flex justify-content-between align-items-center mb-4">
  <h5 class="fw-bold mb-0"><i class="bi bi-headset me-2 text-primary"></i>Tickets de Soporte (<?= count($tickets) ?>)</h5>
</div>

<!-- Resumen de estados -->
<div class="row g-3 mb-4">
  <?php
  $card_states = [
    ['abierto','Abiertos','bi-envelope-open','primary'],
    ['en_revision','En Revisión','bi-search','warning'],
    ['resuelto','Resueltos','bi-check-circle','success'],
    ['cerrado','Cerrados','bi-archive','secondary'],
  ];
  foreach ($card_states as [$key, $label, $icon, $color]): ?>
  <div class="col-md-3">
    <a href="?estado_filter=<?= $key ?>" class="text-decoration-none">
      <div class="admin-stat-card d-flex align-items-center gap-3 <?= $filter_estado === $key ? 'border-primary border-2' : '' ?>">
        <div class="stat-icon stat-<?= $color ?> flex-shrink-0">
          <i class="bi <?= $icon ?>"></i>
        </div>
        <div>
          <div class="fs-4 fw-bold"><?= $stats[$key] ?? 0 ?></div>
          <div class="small text-muted"><?= $label ?></div>
        </div>
      </div>
    </a>
  </div>
  <?php endforeach; ?>
</div>

<?php if ($filter_estado): ?>
  <a href="?estado_filter=" class="btn btn-sm btn-outline-secondary mb-3"><i class="bi bi-x me-1"></i>Limpiar filtro</a>
<?php endif; ?>

<!-- Tabla de tickets -->
<div class="table-responsive bg-white rounded shadow-sm">
  <table class="table table-hover align-middle mb-0">
    <thead class="table-dark">
      <tr>
        <th>Ticket</th><th>Cliente</th><th>Tipo</th><th>Asunto</th>
        <th>Prioridad</th><th>Estado</th><th>Fecha</th><th>Acción</th>
      </tr>
    </thead>
    <tbody>
      <?php if (empty($tickets)): ?>
        <tr><td colspan="8" class="text-center py-4 text-muted">No hay tickets con este filtro.</td></tr>
      <?php endif; ?>
      <?php foreach ($tickets as $t):
        $p_colors = ['urgente'=>'danger','alta'=>'warning','normal'=>'info','baja'=>'secondary'];
        $e_colors = ['abierto'=>'primary','en_revision'=>'warning','resuelto'=>'success','cerrado'=>'secondary'];
      ?>
      <tr>
        <td><code class="text-primary"><?= e($t['numero_ticket']) ?></code></td>
        <td>
          <div class="fw-medium"><?= e($t['nombres'].' '.$t['apellidos']) ?></div>
          <small class="text-muted"><?= e($t['email']) ?></small>
        </td>
        <td><span class="badge bg-light text-dark border"><?= ucfirst($t['tipo']) ?></span></td>
        <td class="fw-medium" style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"><?= e($t['asunto']) ?></td>
        <td><span class="badge bg-<?= $p_colors[$t['prioridad']] ?? 'secondary' ?>"><?= ucfirst($t['prioridad']) ?></span></td>
        <td><span class="badge bg-<?= $e_colors[$t['estado']] ?? 'secondary' ?>"><?= ucfirst(str_replace('_',' ',$t['estado'])) ?></span></td>
        <td><small class="text-muted"><?= date('d/m/Y H:i', strtotime($t['fecha_creacion'])) ?></small></td>
        <td>
          <button class="btn btn-sm btn-primary" onclick="abrirTicket(<?= htmlspecialchars(json_encode($t), ENT_QUOTES) ?>)">
            <i class="bi bi-reply me-1"></i>Responder
          </button>
        </td>
      </tr>
      <?php endforeach; ?>
    </tbody>
  </table>
</div>

<!-- MODAL RESPONDER TICKET -->
<div class="modal fade" id="modalResponder" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <form method="POST">
      <?= csrf_field() ?>
      <input type="hidden" name="responder" value="1">
      <input type="hidden" name="ticket_id" id="tkt_id" value="">
      <div class="modal-content">
        <div class="modal-header bg-primary text-white">
          <h5 class="modal-title" id="tktTitle">Responder Ticket</h5>
          <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
        </div>
        <div class="modal-body p-4">
          <div class="bg-light p-3 rounded mb-3">
            <strong>Asunto:</strong> <span id="tktAsunto"></span><br>
            <strong>Cliente:</strong> <span id="tktCliente"></span><br>
            <strong>Mensaje del cliente:</strong>
            <div class="bg-white p-2 rounded mt-2 border" id="tktMensaje" style="max-height:120px;overflow-y:auto;"></div>
          </div>
          <div class="row g-3">
            <div class="col-md-6">
              <label class="form-label fw-medium">Cambiar Estado</label>
              <select class="form-select" name="estado" id="tktEstado">
                <option value="abierto">Abierto</option>
                <option value="en_revision">En Revisión</option>
                <option value="resuelto">Resuelto</option>
                <option value="cerrado">Cerrado</option>
              </select>
            </div>
            <div class="col-md-6">
              <label class="form-label fw-medium">Prioridad</label>
              <select class="form-select" name="prioridad" id="tktPrioridad">
                <option value="baja">Baja</option>
                <option value="normal" selected>Normal</option>
                <option value="alta">Alta</option>
                <option value="urgente">Urgente</option>
              </select>
            </div>
            <div class="col-12">
              <label class="form-label fw-medium">Tu Respuesta al Cliente <span class="text-danger">*</span></label>
              <textarea class="form-control" name="respuesta" id="tktRespuesta" rows="5" required placeholder="Escribe aquí la respuesta o solución para el cliente..."></textarea>
            </div>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
          <button type="submit" class="btn btn-primary"><i class="bi bi-send me-1"></i>Enviar Respuesta</button>
        </div>
      </div>
    </form>
  </div>
</div>

<script>
function abrirTicket(t) {
  document.getElementById('tkt_id').value = t.id;
  document.getElementById('tktTitle').textContent = '🎫 ' + t.numero_ticket;
  document.getElementById('tktAsunto').textContent = t.asunto;
  document.getElementById('tktCliente').textContent = t.nombres + ' ' + t.apellidos + ' (' + t.email + ')';
  document.getElementById('tktMensaje').textContent = t.mensaje;
  document.getElementById('tktEstado').value = t.estado;
  document.getElementById('tktPrioridad').value = t.prioridad;
  document.getElementById('tktRespuesta').value = t.respuesta || '';
  new bootstrap.Modal(document.getElementById('modalResponder')).show();
}
</script>
