<?php
require_once __DIR__ . '/../../config/app.php';
require_once __DIR__ . '/../../includes/auth.php';
require_once __DIR__ . '/../../includes/functions.php';
require_once __DIR__ . '/../../includes/flash.php';
requireRol(ROL_GESTOR_PPP);
$idInst = instId();
$user = currentUser(); $db = getDB(); $pageTitle = 'Bitácoras — Gestor PPP';

// Validar / observar bitácora
if ($_SERVER['REQUEST_METHOD']==='POST') {
    $idBit  = (int)($_POST['id_bitacora'] ?? 0);
    $accion = $_POST['accion'] ?? '';
    $obs    = trim($_POST['observacion'] ?? '');

    if ($idBit && in_array($accion, ['validar','observar'])) {
        $nuevoEstado = $accion==='validar' ? 'validada' : 'observada';
        $db->prepare("UPDATE bitacoras SET estado=:e, comentario_tutor=:o, updated_at=NOW() WHERE id_bitacora=:id")
           ->execute([':e'=>$nuevoEstado,':o'=>$obs,':id'=>$idBit]);

        if ($accion==='validar') {
            // Actualizar horas_cumplidas en la práctica
            $bit = $db->prepare("SELECT id_practica FROM bitacoras WHERE id_bitacora=:id");
            $bit->execute([':id'=>$idBit]);
            $bit = $bit->fetch();
            if ($bit) {
                $db->prepare("UPDATE practicas SET horas_cumplidas=(SELECT COALESCE(SUM(horas_semana),0) FROM bitacoras WHERE id_practica=:pid AND estado='validada') WHERE id_practica=:pid2")
                   ->execute([':pid'=>$bit['id_practica'],':pid2'=>$bit['id_practica']]);
            }
        }
        flashSet('ok', $accion==='validar' ? 'Bitácora validada correctamente.' : 'Observación registrada.');
    }
    header('Location: bitacoras.php'); exit;
}

$filtroEstado = $_GET['estado'] ?? 'enviada';
$pagina     = max(1, (int)($_GET['pag'] ?? 1));
$porPagina  = 10;
$offset     = ($pagina - 1) * $porPagina;

// Catálogos
$periodos    = $db->query("SELECT id_periodo, nombre FROM periodos_academicos WHERE 1=1" . instCond() . " ORDER BY id_periodo DESC")->fetchAll();
$pa          = $db->query("SELECT id_periodo FROM periodos_academicos WHERE 1=1" . instCond() . " AND activo=1 LIMIT 1")->fetch();
$idPerActivo = $pa ? $pa['id_periodo'] : ($periodos[0]['id_periodo'] ?? 0);
$carreras    = $db->query("SELECT id_carrera, nombre FROM carreras WHERE 1=1" . instCond() . " ORDER BY nombre")->fetchAll();

// Filtros
$filtroPeriodo = (int)($_GET['periodo'] ?? $idPerActivo);
$filtroCarrera = (int)($_GET['carrera'] ?? 0);

// WHERE dinámico
$wConds = ['1=1'];
$wVals  = [];
if ($filtroEstado) { $wConds[] = 'b.estado = :est'; $wVals[':est'] = $filtroEstado; }
if ($filtroPeriodo) { $wConds[] = 'p.id_periodo = :per'; $wVals[':per'] = $filtroPeriodo; }
if ($filtroCarrera) { $wConds[] = 'est.id_carrera = :car'; $wVals[':car'] = $filtroCarrera; }
$whereSQL = 'WHERE ' . implode(' AND ', $wConds);

// Total para paginación
$stCount = $db->prepare("
    SELECT COUNT(*) FROM bitacoras b
    JOIN practicas p     ON p.id_practica    = b.id_practica
    JOIN estudiantes est ON est.id_estudiante = p.id_estudiante
    JOIN usuarios u      ON u.id_usuario     = est.id_usuario
    JOIN carreras c      ON c.id_carrera     = est.id_carrera
    JOIN empresas em     ON em.id_empresa    = p.id_empresa
    $whereSQL
");
$stCount->execute($wVals);
$total = (int)$stCount->fetchColumn();

$totalPags = max(1, (int)ceil($total / $porPagina));
if ($pagina > $totalPags) $pagina = $totalPags;

$stBit = $db->prepare("
    SELECT b.id_bitacora, b.semana_numero, b.fecha_inicio_semana, b.fecha_fin_semana,
           b.horas_semana, b.actividades, b.logros, b.dificultades, b.estado,
           b.comentario_tutor AS observaciones, b.updated_at,
           CONCAT(u.apellidos,' ',u.nombres) AS estudiante,
           u.cedula,
           em.razon_social AS empresa, c.nombre AS carrera,
           p.id_practica, p.horas_requeridas, p.horas_cumplidas,
           pa.nombre AS periodo
    FROM bitacoras b
    JOIN practicas p     ON p.id_practica    = b.id_practica
    JOIN estudiantes est ON est.id_estudiante = p.id_estudiante
    JOIN usuarios u      ON u.id_usuario     = est.id_usuario
    JOIN carreras c      ON c.id_carrera     = est.id_carrera
    JOIN empresas em     ON em.id_empresa    = p.id_empresa
    JOIN periodos_academicos pa ON pa.id_periodo = p.id_periodo
    $whereSQL
    ORDER BY b.estado = 'enviada' DESC, b.updated_at DESC
    LIMIT :lim OFFSET :off
");
foreach ($wVals as $k => $v) $stBit->bindValue($k, $v);
$stBit->bindValue(':lim', $porPagina, PDO::PARAM_INT);
$stBit->bindValue(':off', $offset,    PDO::PARAM_INT);
$stBit->execute();
$bitacoras = $stBit->fetchAll();

$conteos = $db->query("SELECT estado, COUNT(*) AS n FROM bitacoras GROUP BY estado")->fetchAll();
$cnts = array_column($conteos,'n','estado');
?>
<?php $paginaActual = 'bitacoras'; ?>
<!DOCTYPE html>
<html lang="es">
<head><?php include __DIR__ . '/../../includes/head.php'; ?>
<link rel="stylesheet" href="<?= BASE_URL ?>/assets/css/sidebar.css">
<link rel="stylesheet" href="<?= BASE_URL ?>/assets/css/sidebar-gestor-ppp.css">
</head>
<body>
<?php include __DIR__ . '/../../includes/navbar.php'; ?>
<div class="app-shell">
  <?php include __DIR__ . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . '..' . DIRECTORY_SEPARATOR . 'includes' . DIRECTORY_SEPARATOR . 'sidebar-gestor-ppp.php'; ?>
  <main class="main-area">
    <?= flashHtml() ?>
    <div class="page-header"><h4><i class="fa fa-book-open me-2" style="color:var(--accent);"></i>Bitácoras</h4><p>Validar o hacer observaciones al diario de trabajo</p></div>

    <!-- Filtros período + carrera -->
    <form method="GET" style="background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:12px 16px;margin-bottom:14px;">
      <input type="hidden" name="estado" value="<?= htmlspecialchars($filtroEstado) ?>">
      <div class="row g-2 align-items-end">
        <div class="col-sm-6 col-md-4">
          <label class="form-label">Período</label>
          <select name="periodo" class="form-select form-select-sm" onchange="this.form.submit()">
            <option value="0">— Todos —</option>
            <?php foreach($periodos as $p): ?>
            <option value="<?= $p['id_periodo'] ?>" <?= $filtroPeriodo==$p['id_periodo']?'selected':'' ?>>
              <?= htmlspecialchars($p['nombre']) ?><?= $p['id_periodo']==$idPerActivo?' ★':'' ?>
            </option>
            <?php endforeach; ?>
          </select>
        </div>
        <div class="col-sm-6 col-md-4">
          <label class="form-label">Carrera</label>
          <select name="carrera" class="form-select form-select-sm" onchange="this.form.submit()">
            <option value="0">— Todas —</option>
            <?php foreach($carreras as $c): ?>
            <option value="<?= $c['id_carrera'] ?>" <?= $filtroCarrera==$c['id_carrera']?'selected':'' ?>><?= htmlspecialchars($c['nombre']) ?></option>
            <?php endforeach; ?>
          </select>
        </div>
        <div class="col-auto d-flex gap-2 align-items-end">
          <button type="submit" class="btn btn-primary btn-sm"><i class="fa fa-filter me-1"></i>Filtrar</button>
          <a href="bitacoras.php" class="btn btn-outline-secondary btn-sm">Limpiar</a>
        </div>
      </div>
      <?php if($filtroPeriodo||$filtroCarrera): ?>
      <div style="margin-top:8px;font-size:11px;color:var(--text-2);">
        <i class="fa fa-filter me-1" style="color:var(--accent);"></i>
        <?php foreach($periodos as $p){ if($p['id_periodo']==$filtroPeriodo){ echo '<strong style="color:var(--text);">'.htmlspecialchars($p['nombre']).'</strong>'; break; } } ?>
        <?php if($filtroCarrera): foreach($carreras as $c){ if($c['id_carrera']==$filtroCarrera){ echo ' · <strong style="color:var(--text);">'.htmlspecialchars($c['nombre']).'</strong>'; break; } } endif; ?>
        · <strong style="color:var(--accent);"><?= $total ?></strong> bitácora(s)
      </div>
      <?php endif; ?>
    </form>

    <!-- Filtros por estado -->
    <div class="d-flex gap-2 mb-4 flex-wrap">
      <?php foreach([''=>'Todas','enviada'=>'Pendientes','validada'=>'Validadas','observada'=>'Observadas','borrador'=>'Borrador'] as $k=>$lbl):
        $activo = $filtroEstado === $k;
        $cnt = $k ? ($cnts[$k]??0) : array_sum($cnts);
      ?>
      <a href="?estado=<?= $k ?>&periodo=<?= $filtroPeriodo ?>&carrera=<?= $filtroCarrera ?>" class="text-decoration-none"
         style="padding:8px 14px;border-radius:var(--r-lg);font-size:12px;font-weight:600;
                background:<?= $activo?'var(--card-alt)':'var(--card)' ?>;
                border:1px solid <?= $activo?'var(--accent)':'var(--border)' ?>;
                color:<?= $activo?'var(--accent)':'var(--text-2)' ?>;">
        <?= $lbl ?> <span style="font-size:11px;opacity:.7;">(<?= $cnt ?>)</span>
      </a>
      <?php endforeach; ?>
    </div>

    <?php if(empty($bitacoras)): ?>
    <div class="tbl-wrap p-5 text-center text-muted">Sin bitácoras para el filtro seleccionado.</div>
    <?php else: foreach($bitacoras as $b):
      // Decodificar actividades (JSON array de objetos por día)
      $actDecoded = [];
      if ($b['actividades']) {
          $decoded = json_decode($b['actividades'], true);
          $actDecoded = is_array($decoded) ? $decoded : [];
      }
      $pct = $b['horas_requeridas'] > 0
           ? min(100, round($b['horas_cumplidas'] / $b['horas_requeridas'] * 100))
           : 0;
      $borderColor = [
          'enviada'  => '#f7b93e',
          'validada' => '#3dffa0',
          'observada'=> '#ff7043',
          'borrador' => '#6b7280',
      ][$b['estado']] ?? '#6b7280';
    ?>
    <div class="tbl-wrap mb-3" style="border-left:4px solid <?= $borderColor ?>;padding:0;">

      <!-- Cabecera de la tarjeta -->
      <div class="p-3" style="border-bottom:1px solid var(--border);">
        <div class="d-flex justify-content-between align-items-start flex-wrap gap-2">
          <div>
            <div style="font-size:14px;font-weight:700;"><?= htmlspecialchars($b['estudiante']) ?>
              <span style="font-size:11px;color:var(--text-2);font-weight:400;margin-left:6px;"><?= htmlspecialchars($b['cedula']) ?></span>
            </div>
            <div style="font-size:11px;color:var(--text-2);">
              <?= htmlspecialchars($b['carrera']) ?> &nbsp;·&nbsp; <?= htmlspecialchars($b['empresa']) ?>
            </div>
          </div>
          <div class="d-flex align-items-center gap-2">
            <span class="badge-estado st-<?= $b['estado'] ?>"><?= $b['estado'] ?></span>
            <?php if($b['estado']==='enviada'): ?>
            <button class="btn btn-sm btn-success btn-validar" data-id="<?= $b['id_bitacora'] ?>" style="font-size:11px;">✓ Validar</button>
            <button class="btn btn-sm btn-outline-warning btn-observar" data-id="<?= $b['id_bitacora'] ?>" style="font-size:11px;">💬 Observar</button>
            <?php endif; ?>
          </div>
        </div>

        <!-- Info semana + avance -->
        <div class="d-flex gap-3 mt-2 flex-wrap align-items-center">
          <div class="text-center px-3 py-1 rounded" style="background:#dbeafe;border:1px solid #bfdbfe;min-width:64px;">
            <div style="font-size:9px;color:#1d4ed8;text-transform:uppercase;">Semana</div>
            <div style="font-size:18px;font-weight:800;color:#1d4ed8;"><?= $b['semana_numero'] ?></div>
          </div>
          <div class="text-center px-3 py-1 rounded" style="background:#dcfce7;border:1px solid #bbf7d0;min-width:64px;">
            <div style="font-size:9px;color:#15803d;text-transform:uppercase;">Horas</div>
            <div style="font-size:18px;font-weight:800;color:#15803d;"><?= $b['horas_semana'] ?>h</div>
          </div>
          <div style="flex:1;min-width:160px;">
            <div style="font-size:10px;color:var(--text-2);">
              <?= date('d/m/Y', strtotime($b['fecha_inicio_semana'])) ?> &mdash; <?= date('d/m/Y', strtotime($b['fecha_fin_semana'])) ?>
            </div>
            <div style="font-size:10px;color:var(--text-2);margin-top:4px;">
              Avance práctica: <strong style="color:var(--accent);"><?= $b['horas_cumplidas'] ?>/<?= $b['horas_requeridas'] ?>h</strong> (<?= $pct ?>%)
            </div>
            <div style="background:var(--border);border-radius:4px;height:5px;margin-top:4px;overflow:hidden;">
              <div style="width:<?= $pct ?>%;height:5px;border-radius:4px;background:<?= $pct>=100?'#3dffa0':'var(--accent)' ?>;"></div>
            </div>
          </div>
        </div>
      </div>

      <!-- Cuerpo: actividades diarias -->
      <div class="p-3">
        <?php if(!empty($actDecoded)): ?>
        <div class="d-flex justify-content-between align-items-center" style="margin-bottom:8px;">
          <div style="font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text-2);">
            Actividades diarias (<?= count($actDecoded) ?> día<?= count($actDecoded)!=1?'s':'' ?>)
          </div>
          <button class="btn-toggle-dias btn btn-sm btn-outline-secondary"
                  data-id="<?= $b['id_bitacora'] ?>"
                  style="font-size:11px;padding:2px 10px;">
            <i class="fa fa-chevron-down me-1"></i>Ver días
          </button>
        </div>
        <div id="dias-<?= $b['id_bitacora'] ?>" style="display:none;overflow-x:auto;">
          <table style="width:100%;border-collapse:collapse;font-size:11px;">
            <thead>
              <tr style="border-bottom:1px solid var(--border);">
                <th style="padding:5px 8px;color:var(--text-2);font-weight:600;white-space:nowrap;">Fecha</th>
                <th style="padding:5px 8px;color:var(--text-2);font-weight:600;text-align:center;">Horas</th>
                <th style="padding:5px 8px;color:var(--text-2);font-weight:600;">Actividades realizadas</th>
                <th style="padding:5px 8px;color:var(--text-2);font-weight:600;">Logros</th>
                <th style="padding:5px 8px;color:var(--text-2);font-weight:600;">Dificultades</th>
              </tr>
            </thead>
            <tbody>
              <?php
              $diasNom = ['','Lun','Mar','Mié','Jue','Vie','Sáb','Dom'];
              foreach($actDecoded as $dia):
                $feriado = (int)($dia['horas'] ?? 0) === 0;
                $d = new DateTime($dia['fecha'] ?? '');
                $dow = (int)$d->format('N');
                $fechaStr = $d->format('d/m/Y');
              ?>
              <tr style="border-bottom:1px solid var(--border);<?= $feriado?'opacity:.6;':'' ?>">
                <td style="padding:5px 8px;white-space:nowrap;">
                  <strong><?= $fechaStr ?></strong>
                  <div style="font-size:10px;color:var(--text-2);"><?= $diasNom[$dow] ?>
                    <?php if($feriado): ?><span style="font-size:9px;background:rgba(251,191,36,.15);color:#f7b93e;padding:1px 5px;border-radius:3px;margin-left:3px;">FERIADO</span><?php endif; ?>
                  </div>
                </td>
                <td style="padding:5px 8px;text-align:center;font-weight:700;color:<?= $feriado?'#f7b93e':'var(--accent)' ?>;">
                  <?= $feriado ? '—' : ($dia['horas']??'0').'h' ?>
                </td>
                <td style="padding:5px 8px;color:var(--text);"><?= htmlspecialchars($dia['descripcion'] ?? '—') ?></td>
                <td style="padding:5px 8px;color:#3dffa0;"><?= htmlspecialchars($dia['logros'] ?? '—') ?></td>
                <td style="padding:5px 8px;color:#f7b93e;"><?= htmlspecialchars($dia['dificultades'] ?? '—') ?></td>
              </tr>
              <?php endforeach; ?>
            </tbody>
          </table>
        </div><!-- /dias collapse -->
        <?php else:
          // actividades guardadas como texto plano
          if($b['actividades']): ?>
          <div style="font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text-2);margin-bottom:6px;">Actividades</div>
          <p style="font-size:12px;margin:0;white-space:pre-wrap;"><?= htmlspecialchars($b['actividades']) ?></p>
        <?php endif; endif; ?>

        <!-- Logros y dificultades globales (si no están en el JSON) -->
        <?php if(empty($actDecoded)): ?>
        <div class="row g-2 mt-2">
          <?php if($b['logros']): ?>
          <div class="col-sm-6">
            <div style="background:#052e16;border:1px solid #166534;border-radius:6px;padding:8px 10px;">
              <div style="font-size:9px;font-weight:700;text-transform:uppercase;color:#3dffa0;margin-bottom:4px;">✓ Logros</div>
              <div style="font-size:11px;color:#86efac;"><?= htmlspecialchars($b['logros']) ?></div>
            </div>
          </div>
          <?php endif; ?>
          <?php if($b['dificultades']): ?>
          <div class="col-sm-6">
            <div style="background:#1c1006;border:1px solid #92400e;border-radius:6px;padding:8px 10px;">
              <div style="font-size:9px;font-weight:700;text-transform:uppercase;color:#f7b93e;margin-bottom:4px;">⚠ Dificultades</div>
              <div style="font-size:11px;color:#fde68a;"><?= htmlspecialchars($b['dificultades']) ?></div>
            </div>
          </div>
          <?php endif; ?>
        </div>
        <?php endif; ?>

        <!-- Observación del tutor -->
        <?php if($b['observaciones']): ?>
        <div style="margin-top:10px;background:#1c1206;border:1px solid #92400e;border-radius:6px;padding:8px 12px;">
          <div style="font-size:9px;font-weight:700;text-transform:uppercase;color:#f7b93e;margin-bottom:4px;">
            <i class="fa fa-comment me-1"></i>Observación del tutor
          </div>
          <div style="font-size:11px;color:#fde68a;"><?= htmlspecialchars($b['observaciones']) ?></div>
        </div>
        <?php endif; ?>
      </div>

    </div>
    <?php endforeach; endif; ?>

    <!-- Paginación -->
    <?php if($totalPags > 1): ?>
    <div class="d-flex justify-content-between align-items-center mt-4 flex-wrap gap-2">
      <div style="font-size:12px;color:var(--text-2);">
        Mostrando <?= min($offset+1,$total) ?>–<?= min($offset+$porPagina,$total) ?> de <strong><?= $total ?></strong> bitácoras
      </div>
      <?php
        $qBase = http_build_query(['estado'=>$filtroEstado,'periodo'=>$filtroPeriodo,'carrera'=>$filtroCarrera]);
      ?>
      <div class="d-flex gap-1 flex-wrap">
        <?php if($pagina > 1): ?>
          <a href="?<?= $qBase ?>&pag=<?= $pagina-1 ?>"
             class="btn btn-sm btn-outline-secondary" style="font-size:12px;">
            <i class="fa fa-chevron-left"></i> Anterior
          </a>
        <?php endif; ?>
        <?php
        $ini = max(1, $pagina-2);
        $fin = min($totalPags, $pagina+2);
        for($p=$ini; $p<=$fin; $p++):
        ?>
          <a href="?<?= $qBase ?>&pag=<?= $p ?>"
             class="btn btn-sm <?= $p==$pagina?'btn-primary':'btn-outline-secondary' ?>"
             style="font-size:12px;min-width:36px;"><?= $p ?></a>
        <?php endfor; ?>
        <?php if($pagina < $totalPags): ?>
          <a href="?<?= $qBase ?>&pag=<?= $pagina+1 ?>"
             class="btn btn-sm btn-outline-secondary" style="font-size:12px;">
            Siguiente <i class="fa fa-chevron-right"></i>
          </a>
        <?php endif; ?>
      </div>
    </div>
    <?php endif; ?>
  </main>
</div>

<!-- Modal observación -->
<div class="modal fade" id="modalObs" tabindex="-1">
  <div class="modal-dialog">
    <div class="modal-content" style="background:var(--card);border:1px solid var(--border);">
      <div class="modal-header" style="border-color:var(--border);">
        <h5 class="modal-title" style="font-size:14px;">💬 Registrar observación</h5>
        <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
      </div>
      <form method="POST">
        <div class="modal-body">
          <input type="hidden" name="id_bitacora" id="obsIdBit">
          <input type="hidden" name="accion" value="observar">
          <label class="form-label">Observación para el estudiante</label>
          <textarea name="observacion" class="form-control" rows="4" placeholder="Explica qué debe corregir o mejorar..." required></textarea>
        </div>
        <div class="modal-footer" style="border-color:var(--border);">
          <button type="button" class="btn btn-outline-secondary btn-sm" data-bs-dismiss="modal">Cancelar</button>
          <button type="submit" class="btn btn-warning btn-sm">Enviar observación</button>
        </div>
      </form>
    </div>
  </div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/js/bootstrap.bundle.min.js"></script>
<script>
var BASE_URL='<?= BASE_URL ?>';
$(function(){
  $('.btn-validar').on('click',function(){
    if(!confirm('¿Validar esta bitácora?')) return;
    var id = $(this).data('id');
    $('<form method="POST"><input name="id_bitacora" value="'+id+'"><input name="accion" value="validar"></form>').appendTo('body').submit();
  });
  $('.btn-observar').on('click',function(){
    $('#obsIdBit').val($(this).data('id'));
    new bootstrap.Modal($('#modalObs')[0]).show();
  });

  // Toggle días
  $(document).on('click', '.btn-toggle-dias', function(){
    var id  = $(this).data('id');
    var $el = $('#dias-' + id);
    var visible = $el.is(':visible');
    $el.slideToggle(200);
    $(this).html(visible
      ? '<i class="fa fa-chevron-down me-1"></i>Ver días'
      : '<i class="fa fa-chevron-up me-1"></i>Ocultar días');
  });
});
</script>
</body></html>