<?php
$comp_model = new SharedController;
$page_element_id = "list-page-" . random_str();
$current_page = $this->set_current_page_link();
$csrf_token = Csrf::$token;
//Page Data From Controller
$view_data = $this->view_data;
$records = $view_data->records;
$record_count = $view_data->record_count;
$total_records = $view_data->total_records;
$field_name = $this->route->field_name;
$field_value = $this->route->field_value;
$view_title = $this->view_title;
$show_header = $this->show_header;
$show_footer = $this->show_footer;
$show_pagination = $this->show_pagination;
?>
<section class="page ajax-page" id="<?php echo $page_element_id; ?>" data-page-type="list"  data-display-type="table" data-page-url="<?php print_link($current_page); ?>">
    <div  class="">
        <div class="container-fluid">
            <div class="row ">
                <div class="col-md-12 comp-grid">
                </div>
            </div>
        </div>
    </div>
    <div  class="bg-success">
        <div class="container">
            <div class="row ">
                <div class="col-md-12 comp-grid">
                    <div class=""><div>
                        <center>
                            <a href="https://time.is/Duri_Pulo" id="time_is_link" rel="nofollow" style="font-size:36px"><img width="50" heigth="70" src="https://png.pngtree.com/png-clipart/20220818/ourmid/pngtree-santri-kecil-hallo-assalamualaikum-png-image_6115130.png" /></a>
                            <span id="Duri_Pulo_z41c" style="font-size:30px"></span>
                            <script src="//widget.time.is/t.js"></script>
                            <script>
                                time_is_widget.init({Duri_Pulo_z41c:{}});
                            </script>
                        </center>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div  class="">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-6 p-3 comp-grid">
                <div id="Comp-1-Accordion-Group" role="tablist" class="accordion-group">
                    <div class="card mb-2">
                        <div class="card-header accordion-header" data-toggle="collapse" data-target="#Accordion-1-Page1" role="tab">
                            ZONA 1   (Solok-Sawahlunto) <span class="expand text-muted">+</span>
                        </div>
                        <div id="Accordion-1-Page1" class="collapse " data-parent="#Comp-1-Accordion-Group">
                            <div class=""><div>
                                <div class="card">
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Solok&kelompok=Tanah Garam&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Tanah Garam</a>
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Solok&kelompok=Singkarak&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Singkarak</a>
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Solok&kelompok=Muara Labuh&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Muara Labuh</a>
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Solok&kelompok=Laing Jaya&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Laing Jaya</a>
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Lembah Segar&kelompok=Aur Mulyo&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Aur Mulyo</a>
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Lembah Segar&kelompok=Sapan&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Sapan</a>
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Lembah Segar&kelompok=Talawi&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Talawi</a>
                                    <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Lembah Segar&kelompok=Sijunjung&zona=Zona 1'); ?>" > 
                                    <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Sijunjung</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card">
                    <div class="card-header accordion-header" data-toggle="collapse" data-target="#Accordion-1-Page2" role="tab">
                        ZONA 2   (Desa Utara - Selatan) <span class="expand text-muted">+</span>
                    </div>
                    <div id="Accordion-1-Page2" class="collapse " data-parent="#Comp-1-Accordion-Group">
                        <div class=""><div>
                            <div class="card">
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Utara&kelompok=Blok B&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Blok B</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Utara&kelompok=Timpeh Timur&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Timpeh Timur</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Utara&kelompok=Timpeh Barat&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Timpeh Barat</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Utara&kelompok=SP 5&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> SP 5</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Utara&kelompok=Sungai Tambang&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Sungai Tambang</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Selatan&kelompok=Padang Bintungan 1&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Padang Bintungan 1</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Selatan&kelompok=Padang Bintungan 2&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Padang Bintungan 2</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Selatan&kelompok=Sitiung 2 Barat&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Sitiung 2 Timur</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Selatan&kelompok=Sitiung 2 Timur&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Sitiung 2 Timur</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Selatan&kelompok=Sitiung 3&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Sitiung 3</a>
                                <a class="badge badge-success mb-2 text-left" font-size="12" href="<?php print_link('absen_remaja/add_absen?desa=Dharmasraya Selatan&kelompok=Blok E&zona=Zona 2'); ?>" > 
                                <img width="30" height="30" src="https://img.icons8.com/external-bearicons-flat-bearicons/64/external-user-essential-collection-bearicons-flat-bearicons.png" alt="external-user-essential-collection-bearicons-flat-bearicons"/> Blok E</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>
<div  class="">
    <div class="container">
        <div class="row ">
            <div class="col-md-12 comp-grid">
            </div>
        </div>
    </div>
</div>
<div  class="">
    <div class="container">
        <div class="row ">
            <div class="col-md-12 comp-grid">
                <div class="card ">
                    <div class="card-header p-2">
                        <ul class="nav  nav-pills   ">
                            <li class="nav-item">
                                <a class="nav-link active" data-toggle="tab" href="#TabPage-1-Page1" role="tab" aria-selected="true">
                                    Solok
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link " data-toggle="tab" href="#TabPage-1-Page2" role="tab" aria-selected="true">
                                    Lembah Segar
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link " data-toggle="tab" href="#TabPage-1-Page3" role="tab" aria-selected="true">
                                    Utara
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link " data-toggle="tab" href="#TabPage-1-Page4" role="tab" aria-selected="true">
                                    Selatan
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="card-body">
                        <div class="tab-content">
                            <div class="tab-pane show active fade" id="TabPage-1-Page1" role="tabpanel">
                                <div class=" reset-grids">
                                    <?php  
                                    $this->render_page("absen_remaja/list/absen_remaja.desa/Solok?orderby=absen_remaja.kelompok&ordertype=ASC&limit_count=500"); 
                                    ?>
                                </div>
                            </div>
                            <div class="tab-pane  fade" id="TabPage-1-Page2" role="tabpanel">
                                <div class=" reset-grids">
                                    <?php  
                                    $this->render_page("absen_remaja/list/absen_remaja.desa/Lembah Segar?orderby=absen_remaja.kelompok&ordertype=ASC&limit_count=500"); 
                                    ?>
                                </div>
                            </div>
                            <div class="tab-pane  fade" id="TabPage-1-Page3" role="tabpanel">
                                <div class=" reset-grids">
                                    <?php  
                                    $this->render_page("absen_remaja/list/absen_remaja.desa/Dharmasraya Utara?orderby=absen_remaja.kelompok&ordertype=ASC&limit_count=500"); 
                                    ?>
                                </div>
                            </div>
                            <div class="tab-pane  fade" id="TabPage-1-Page4" role="tabpanel">
                                <div class=" reset-grids">
                                    <?php  
                                    $this->render_page("absen_remaja/list/absen_remaja.desa/Dharmasraya Selatan?orderby=absen_remaja.kelompok&ordertype=ASC&limit_count=500"); 
                                    ?>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</section>
