<?php echo $this->extend('/template'); ?>
<?php echo $this->section('content') ?>


<!DOCTYPE html>
<html lang="id">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Box Container Bus</title>
    <style>
        .bus-container {
            padding-top:10px;
            /* font-family: 'Courier New', Courier, monospace; */
            font-weight: bolder;
            width: 180px;
            height: 140px;
            background-color: lightblue;
            /* border: 2px solid #BA0049; */
            border:2px solid #444;
            border-radius: 15px 15px 5px 5px;
            position: relative;
            /* display: flex; */
            justify-content: center;
            align-items: center;
            font-size: 16px;
            line-height: 18px;
            text-align: center;
            display: inline-block;
            margin-bottom: 50px;
            margin:5px;
        }
        .busfull {
            background-color: #BA0049;
            color:#fff;
        }
        .busempty {
            background-color: #ffe;
        }        

        .bus-container::before,
        .bus-container::after {
            content: '';
            width: 40px;
            height: 40px;
            background-color: grey;
            border-radius: 50%;
            position: absolute;
            bottom: -20px;
        }

        .bus-container::before {
            left: 30px;
        }

        .bus-container::after {
            right: 30px;
        }

        span.b {
            display: inline-block;
            width: 100px;
            height: 80px;
            padding: 5px;
            /* border: 1px solid blue;
            background-color: yellow; */
            text-align: left;
        }
        span.c {
            display: inline-block;
            width: 40px;
            height: 80px;
            padding: 5px;
            text-align: right;
        }

        .judul {
            font-size: 20px;
            border-bottom: solid 1px #fff;
            padding-bottom: -2px;
            
        }

    </style>
</head>

<body>
<div class="row">
    <div class="col-md-5">
        <h3>
            <img src="/assets/images/pemprovsmr/header_icon.png" width="35px">&nbsp;<b><?php echo ISMUDIKORBALIK == '0' ? 'MONITORING ARMADA' : 'MONITORING ARMADA BALIK RANTAU'; ?></b>
            <a href="#" class="easyui-linkbutton"  plain="true" onclick="reload_data()"><img src="/assets/images/pemprovsmr/refresh.png" width="30px"></a>
        </h3>
    </div>
    <div class="col-md-7" style="text-align:right;">
    <?php include("searchbusmoni.php"); ?>
    </div>
</div>
<?php 
// echo '<pre>';print_r($data);echo '</pre>';
?>

<?php 
foreach($data as $k=>$v) {    
    echo '<h2>'.$wilayah[$k].'</h2>'; 
?>
<?php foreach($v as $kk=>$vv) { 
    if($vv['sisa'] == $vv['kapasitas']) {
    ?>
    <div class="bus-container busempty">
    <span class="judul">NO BUS : <?php echo $vv['nobus']; ?></span>
    <span class="b">SEAT<BR />TERPAKAI<BR/>SISA<br/>SDH. ABSEN</span>
        <span class="c"><?php echo $vv['kapasitas'].'<br/>'.$vv['terpakai'].'<br/>'.$vv['sisa'].'<br/>'.$vv['sdh_absen']; ?></span>
    </div>

    <?php } else if($vv['sisa'] == 0) { ?>
        <div class="bus-container busfull">
    <span class="judul">NO BUS : <?php echo $vv['nobus']; ?></span>
    <span class="b">SEAT<BR />TERPAKAI<BR/>SISA<br/>SDH. ABSEN</span>
        <span class="c"><?php echo $vv['kapasitas'].'<br/>'.$vv['terpakai'].'<br/>'.$vv['sisa'].'<br/>'.$vv['sdh_absen']; ?></span>
    </div>
    <?php } else  { ?>
        <div class="bus-container">
    <span class="judul">NO BUS : <?php echo $vv['nobus']; ?></span>
    <span class="b">SEAT<BR />TERPAKAI<BR/>SISA<br/>SDH. ABSEN</span>
        <span class="c"><?php echo $vv['kapasitas'].'<br/>'.$vv['terpakai'].'<br/>'.$vv['sisa'].'<br/>'.$vv['sdh_absen']; ?></span>
    </div>


    <?php } ?>

<?php }} ?>
<script> 
function reload_data()
{
    location.href = "/busmoni";
}
</script>



</body>

</html>


<?php echo $this->endSection() ?>