<?php
/*
 * *************************************************
 * Copyright (C) 2021 Earworks.                    *
 * Codeigniter Project Template Modification       *
 * Please contact our email for more information : *
 * contact@earworks.co.id                          *
 * *************************************************
 */

defined('BASEPATH') OR exit('No direct script access allowed');
Ci::set_title(lang('visitor-list'));
$total = isset($query_pagination['total_row']) ? $query_pagination['total_row'] : 0 ;
?> 
<style type="text/css">
    .wrapper {max-width:none;}
    </style>
<h1 class="page-title">
    <?= Ci::$title ?>
    <hr class="hiasan-judul blue" />
</h1>

<div class="row">
    <div class="col-xs-12 text-right">
        <a href="<?= base_url('dashboard/excel-visitor/' . $user_absen->absen_id . $redir) ?>" class="btn btn-primary">
            Download Excel
        </a>   
    </div>
</div>
<br /><br />

<div class="row">
    <div class="col-xs-8">
        <?= $pagination->create_forms($query_pagination) ?>
        <p>
            Total: <?= $total ?>
            Attend: <?= $counter > 0 ? $counter : '-' ?>
            Pending: <?= $total - $counter ?>
        </p>
        <?= form_open('visitor-list/check-all' . $redir, ['class' => 'check-all-form']) ?>
        <button type="submit" name="submit" value="delete_all" class="btn red btn-xs check-all-confirm" style="display:none;" onclick="return script.deletePrompt();">
            <i class="fa fa-times"></i> Delete All
        </button>
        <div class="table-responsive">
            <table class="table table-hover table-bordered sort">
                <thead>
                    <tr>
                        <?php // $pagination->check_all_header() ?>
                        <th data-order="users.identity" class="both" style="text-align:center;width:100px;">#</th>
                        <th data-order="user_profile.name" class="both" style="text-align:center;"><?= lang('nama_user') ?></th>
                        <th data-order="user_profile.optic" class="both"  style="text-align:center;"><?= lang('optic') ?></th>
                        <th data-order="visitor_absen.absen_id" class="both"  style="text-align:center;">Absen</th>
                    </tr>
                </thead>
                <tbody>
                    <?php if ($query_pagination['data']->count() > 0) : ?>
                        <?php foreach ($query_pagination['data'] as $data) : ?>
                            <tr>
                                <?php // $pagination->check_all($data->id) ?>
                                <td>
                                    <a href="javascript:void(0)" onclick="page_script.show_detail(this);" data-identity="<?= $data->identity ?>">
                                        #<?= $data->identity ?>
                                    </a>
                                </td>
                                <td><?= $data->profile->name ?></td>
                                <td><?= $data->profile->optic ?></td>
                                <td>
                                    <?= $data->absen_id ? 'Yes' : 'No' ?>
                                    <div class="table-button" style="display:none;">
                                        <a href="<?= base_url('dashboard/update/' . $user_absen->absen_id . '/' . $user_absen->user_id . '/' . $data->visitor_id . $redir) ?>" class="table-button-action blue" title="Edit">
                                            <i class="fa fa-pencil"></i>
                                        </a>
                                        <a href="<?= base_url('dashboard/delete/' . $user_absen->absen_id . '/' . $user_absen->user_id . '/' . $data->visitor_id . $redir) ?>" class="table-button-action red" onclick="return script.deletePrompt();" title="<?= lang('remove') ?>">
                                            <i class="fa fa-times"></i>
                                        </a>
                                    </div>
                                </td>
                            </tr>
                        <?php endforeach; ?>
                    <?php else: ?>
                        <tr>
                            <td colspan="5" style="text-align: center;">
                                Data tidak tersedia
                            </td>
                        </tr>
                    <?php endif; ?>
                </tbody>
            </table>
        </div>
        <?= form_close() ?>
        <div class="pagination-wrapper">
            <?= $pagination->create_links(); ?>
        </div>
    </div>
    <div class="col-xs-4" id="detail-user-frame">
        <!-- Ajax View -->
    </div>
</div>
<script type="text/javascript">
</script>
<?php
$visitor_detail_url = base_url('dashboard/ajax-visitor-detail');
Ci::set_script(<<<EOD
    var page_script = function () {
        var the;
        var visitor_detail_url = '{$visitor_detail_url}';
        return {
            init: function () {
                the = this;
                script.orderTable('{$query_pagination["order"]}');
                script.handleOrder();
            },
            show_detail: function (obj) {
                var id = $(obj).data('identity');
                $.ajax({
                    url: visitor_detail_url, type: 'POST', dataType: 'HTML',
                    data: {id}, success: function (res) {
                        $('#detail-user-frame').empty().html(res);
                    }
                });
            }
        };
    }();
    var ajax_script = function () {
        var the;
        return {
            init: function () {
                the = this;
                $('.img').each(function(){
                    $(this).click(the.show_img);
                });
            },
            show_img: function (obj) {
                var new_img = $('<img>', {'class': 'img img-responsive img-thumbnail', 'src': $(obj).attr('src')});
                $('#metronic-modal').modal('show');
                $('#modal-title').empty().html($(obj).data('title'));
                $('#modal-body').empty().html(new_img);

            }
        };
    }();
    $(document).ready(function () {
        ajax_script.init();
    });                
    $(document).ready(function () {
        page_script.init();
                     ajax_script.init();
    });
EOD
    , 'embed');
