<style> 
    .img-thumb-path{
        width:100px;
        height:80px;
        object-fit:scale-down;
        object-position:center center;
    }
</style>

<div class="card card-outline card-primary rounded-0 shadow">
    <div class="card-header">
        <h3 class="card-title">Lista de Proyectos</h3>

        <?php if (in_array($_settings->userdata('role'), ['ADMIN','SUPERVISOR','GESTOR'])): ?>
        <div class="card-tools">
            <a href="javascript:void(0)" id="create_new"
               class="btn btn-sm btn-primary">
                <span class="fas fa-plus"></span>
                Agregar Nuevo Proyecto
            </a>
        </div>
        <?php endif; ?>
    </div>

    <div class="card-body">
        <div class="container-fluid">
            <table class="table table-bordered table-hover table-striped">
                <colgroup>
                    <col width="5%">
                    <col width="15%">
                    <col width="20%">
                    <col width="20%">
                    <col width="12%">
                    <col width="13%">
                    <col width="15%">
                </colgroup>
                <thead>
                    <tr class="bg-gradient-primary text-light">
                        <th>#</th>
                        <th>Fecha de Creación</th>
                        <th>Nombre</th>
                        <th>Descripción</th>
                        <th>Estado</th>
                        <th>Seguimiento</th>
                        <th>Acción</th>
                    </tr>
                </thead>
                <tbody>
                <?php
                    $i = 1;

                    $qry = $conn->query("
                        SELECT p.*,
                               f.traffic_light
                        FROM projects p
                        LEFT JOIN project_followups f
                          ON f.project_id = p.id
                         AND f.period = (
                            SELECT MAX(period)
                            FROM project_followups
                            WHERE project_id = p.id
                         )
                        ORDER BY p.id ASC
                    ");

                    if(!$qry){
                        echo '<tr>
                                <td colspan="7" class="text-danger text-center">
                                    '.$conn->error.'
                                </td>
                              </tr>';
                    } else {
                        while($row = $qry->fetch_assoc()):
                ?>
                    <tr>
                        <td class="text-center"><?= $i++; ?></td>

                        <td>
                            <?= !empty($row['created_at'])
                                ? date("Y-m-d H:i", strtotime($row['created_at']))
                                : '-' ?>
                        </td>

                        <td>
                            <p class="m-0 truncate-1">
                                <?= htmlspecialchars($row['project_name']) ?>
                            </p>
                        </td>

                        <td>
                            <p class="m-0 truncate-1">
                                <?= !empty($row['description'])
                                    ? htmlspecialchars($row['description'])
                                    : '-' ?>
                            </p>
                        </td>

                        <!-- ESTADO PMO -->
                        <td class="text-center">
                            <?php
                                switch((int)$row['approval_status']){
                                    case -1:
                                        echo '<span class="badge badge-dark">Cancelado</span>';
                                        break;
                                    case 0:
                                        echo '<span class="badge badge-secondary">Registrado</span>';
                                        break;
                                    case 1:
                                        echo '<span class="badge badge-info">En Revisión PMO</span>';
                                        break;
                                    case 3:
                                        echo '<span class="badge badge-warning">En Coordinación</span>';
                                        break;
                                    case 5:
                                        echo '<span class="badge badge-primary">VB Subgerencia</span>';
                                        break;
                                    case 7:
                                        echo '<span class="badge badge-success">Comité</span>';
                                        break;
                                    default:
                                        echo '<span class="badge badge-light">N/D</span>';
                                }
                            ?>
                        </td>

                        <!-- SEMÁFORO -->
                        <td class="text-center">
                            <?php
                                switch($row['traffic_light']){
                                    case 'green':
                                        echo '<span class="badge badge-success">En línea</span>';
                                        break;
                                    case 'amber':
                                        echo '<span class="badge badge-warning">Observación</span>';
                                        break;
                                    case 'red':
                                        echo '<span class="badge badge-danger">Riesgo</span>';
                                        break;
                                    default:
                                        echo '<span class="badge badge-secondary">Sin reporte</span>';
                                }
                            ?>
                        </td>

                        <!-- ACCIONES -->
                        <td align="center">
                            <button type="button"
                                    class="btn btn-flat btn-default btn-sm dropdown-toggle dropdown-icon"
                                    data-toggle="dropdown">
                                Acción
                                <span class="sr-only">Toggle Dropdown</span>
                            </button>

                            <div class="dropdown-menu" role="menu">
                                <a class="dropdown-item"
                                   href="<?= base_url ?>?page=projects/view_project&id=<?= $row['id'] ?>">
                                    <span class="fa fa-eye text-dark"></span> Ver
                                </a>


                                <?php if ($row['approval_status'] >= 0): ?>
                                <div class="dropdown-divider"></div>

                                <a class="dropdown-item add_report"
                                   href="javascript:void(0)"
                                   data-id="<?= $row['id'] ?>"
                                   data-name="<?= htmlspecialchars($row['project_name']) ?>">
                                    <span class="fa fa-file-alt text-dark"></span>
                                    Agregar Reporte
                                </a>

                                <div class="dropdown-divider"></div>

                                <a class="dropdown-item add_activity"
                                   href="javascript:void(0)"
                                   data-id="<?= $row['id'] ?>"
                                   data-name="<?= htmlspecialchars($row['project_name']) ?>">
                                    <span class="fa fa-tasks text-primary"></span>
                                    Agregar Actividad
                                </a>
                                <?php endif; ?>
                            </div>
                        </td>
                    </tr>
                <?php endwhile; } ?>
                </tbody>
            </table>
        </div>
    </div>
</div>

<script>
$(document).ready(function(){

    $('#create_new').click(function(){
        uni_modal(
            "Registrar Nuevo Proyecto",
            "admin/projects/manage_project.php"
        );
    });

    $('.add_report').click(function(){
        uni_modal(
            "Agregar nuevo reporte a <b>"+$(this).attr('data-name')+"</b>",
            "projects/manage_followup.php?project_id="+$(this).attr('data-id')
        );
    });

    $('.add_activity').click(function(){
        uni_modal(
            "Agregar Actividad a <b>"+$(this).attr('data-name')+"</b>",
            "projects/manage_activity.php?project_id="+$(this).attr('data-id')
        );
    });

    $('.table').dataTable({
        columnDefs: [
            { orderable: false, targets: 6 }
        ],
    });
});
</script>
