<!-- Thông báo lỗi -->
<?php MyHelper::loadView('backend/cms_partials/error_message_view') ?>
<div class="row">
    <?php echo form_open(base_url().'backend/cmsSetting/logUser'); ?>
        <div class="col-lg-3" style="margin-left: -12px">
            <div class="input-group">
                <input
                    class="form-control" type="text"
                    name="date-range-picker"
                    id="input-date-range-log-user"
                    readonly style="text-align: center"
                    placeholder="Kích chọn ngày tạo"/>
                <span class="input-group-addon">
                    <i class="fa fa-calendar bigger-110" id="daterange-picker"></i>
                </span>
            </div>
        </div>
        <div class="col-lg-2">
            <input
                class="form-control" type="text"
                name="input-ip"
                id="input-ip"
                placeholder="IP..."/>
        </div>
        <div class="col-lg-2">
            <input
                class="form-control" type="text"
                name="input-account"
                id="input-account"
                style="text-align: right"
                placeholder="username..."/>
        </div>
        <div class="col-lg-2">
            <select class="form-control" id="select-result" name="select-result">
                <option value="">-- Tất cả kết quả --</option>
                <option value="SUCCESS">SUCCESS</option>
                <option value="FAILED">FAILED</option>
            </select>
        </div>
        <div class="col-lg-1">
            <button class="btn btn-sm btn-default" id="delete-filter">Xóa bộ lọc</button>
        </div>
    <?php echo form_close(); ?>
</div>
<!-- /.row -->
<div class="space-6"></div>
<div class="row" >
    <div style="text-align: center" id="data-loading">
        <i class="fa fa-refresh fa-spin bigger-200"></i> Đang tải dữ liệu...
    </div>
    <div id="div-mo-list">
        <table class="table table-striped table-bordered table-hover">
            <thead></thead>
            <tbody></tbody>
        </table>
    </div>
</div>

<script type="text/javascript">
    //Thuc hien viec ve bieu do
    $(document).ready(function() {
        $('#daterange-picker').click(function(){
            $('#input-date-range-log-user').click();
        });

        var url = '<?php echo base_url()."backend/cmsSetting/logUserAjax"; ?>';
        // Tìm kiếm theo ngày tháng
        $('#input-date-range-log-user').on('apply.daterangepicker', function(ev, picker) {
            loadDataByAjaxDateRange(picker.startDate.format('DD-MM-YYYY'), picker.endDate.format('DD-MM-YYYY'), url);
        });
        // Tìm kiếm theo SĐT
        var oldTimeout = '';
        $('#input-ip').keyup(function(){
            clearTimeout(oldTimeout);
            oldTimeout = setTimeout(function(){
                loadDataByAjaxFromInput(url);
            }, 1000);
        });
        // Tìm kiếm theo cú pháp
        var oldTimeout2 = '';
        $('#input-account').keyup(function(){
            clearTimeout(oldTimeout2);
            oldTimeout2 = setTimeout(function(){
                loadDataByAjaxFromInput(url);
            }, 1000);
        });
        // Tìm kiếm theo kênh
        loadDataByAjaxFromSelectBox("select-result", url);
        // Xóa bộ lọc
        $('#delete-filter').click(function(){
            $("#input-date-range-log-user").val('');
            $("#input-ip").val('');
            $("#input-account").val('');
            $("#select-result").val('');
            changePagination('0');
            return false;

        });
        changePagination('0');

    });
    //Ham chung cho cac input
    function loadDataByAjaxFromInput(url){
        var csrf_value = '<?php echo $this->security->get_csrf_hash(); ?>';
        var filterByDateRange = $("#input-date-range-log-user").val();
        var filterByIP = $('#input-ip').val();
        var filterByAccount = $("#input-account").val();
        var filterByResult = $("#select-result").val();
        var dtFrom = "";
        var dtTo = "";
        //
        if(filterByDateRange.length > 0){
            var arr_filter_by_date = filterByDateRange.split("-");
            var date_from = arr_filter_by_date[0];
            var date_to = arr_filter_by_date[1];
            var arr_from = date_from.split("/");
            var arr_to = date_to.split("/");
            dtFrom = arr_from[0].trim()+"-"+arr_from[1].trim()+"-"+arr_from[2].trim();
            dtTo = arr_to[0].trim()+"-"+arr_to[1].trim()+"-"+arr_to[2].trim();
        }
        //Ajax ve bieu do
        $.ajax({
            type: "POST",
            url: url,
            data: {
                csrf_name: csrf_value,
                filterByIP: filterByIP,
                filterByAccount: filterByAccount,
                filterByResult: filterByResult,
                dtFrom: dtFrom,
                dtTo: dtTo
            },
            dataType: "text",
            cache: false,
            success: function(data){
                $('#div-mo-list').html(data);
                $('#data-loading').hide();
            }
        });
    }
    //Ham chung cho cac SelectBox
    function loadDataByAjaxFromSelectBox(id, url){
        $('#'+id).change(function(){
            var csrf_value = '<?php echo $this->security->get_csrf_hash(); ?>';
            var filterByDateRange = $("#input-date-range-log-user").val();
            var filterByIP = $("#input-ip").val();
            var filterByAccount = $("#input-account").val();
            var filterByResult = $("#select-result").val();
            var dtFrom = "";
            var dtTo = "";
            //
            if(filterByDateRange.length > 0){
                var arr_filter_by_date = filterByDateRange.split("-");
                var date_from = arr_filter_by_date[0];
                var date_to = arr_filter_by_date[1];
                var arr_from = date_from.split("/");
                var arr_to = date_to.split("/");
                dtFrom = arr_from[0].trim()+"-"+arr_from[1].trim()+"-"+arr_from[2].trim();
                dtTo = arr_to[0].trim()+"-"+arr_to[1].trim()+"-"+arr_to[2].trim();
            }
            //Ajax ve bieu do
            $.ajax({
                type: "POST",
                url: url,
                data: {
                    csrf_name: csrf_value,
                    filterByIP: filterByIP,
                    filterByAccount: filterByAccount,
                    filterByResult: filterByResult,
                    dtFrom: dtFrom,
                    dtTo: dtTo
                },
                dataType: "text",
                cache: false,
                success: function(data){
                    $('#div-mo-list').html(data);
                    $('#data-loading').hide();
                }
            });
        });
    }

    function loadDataByAjaxDateRange(dtFrom, dtTo, url){
        var csrf_value = '<?php echo $this->security->get_csrf_hash(); ?>';
        var filterByIP = $("#input-ip").val();
        var filterByAccount = $("#input-account").val();
        var filterByResult = $("#select-result").val();
        // ajax
        $.ajax({
            type: "POST",
            url: url,
            data: {
                csrf_name: csrf_value,
                filterByIP: filterByIP,
                filterByAccount: filterByAccount,
                filterByResult: filterByResult,
                dtFrom: dtFrom,
                dtTo: dtTo
            },
            dataType: "text",
            cache: false,
            success: function(data){
                $('#div-mo-list').html(data);
                $('#data-loading').hide();
            }
        });
    }

    function changePagination(pageId) {
        var csrf_value = '<?php echo $this->security->get_csrf_hash(); ?>';
        var url = '<?php echo base_url()."backend/cmsSetting/logUserAjax"; ?>';
        var filterByDateRange = $("#input-date-range-log-user").val();
        var filterByIP = $("#input-ip").val();
        var filterByAccount = $("#input-account").val();
        var filterByResult = $("#select-result").val();
        var dtFrom = "";
        var dtTo = "";
        //
        if(filterByDateRange.length > 0){
            var arr_filter_by_date = filterByDateRange.split("-");
            var date_from = arr_filter_by_date[0];
            var date_to = arr_filter_by_date[1];
            var arr_from = date_from.split("/");
            var arr_to = date_to.split("/");
            dtFrom = arr_from[0].trim()+"-"+arr_from[1].trim()+"-"+arr_from[2].trim();
            dtTo = arr_to[0].trim()+"-"+arr_to[1].trim()+"-"+arr_to[2].trim();
        }
        //Ajax ve bieu do
        $.ajax({
            type: "POST",
            url: url,
            data: {
                csrf_name: csrf_value,
                filterByIP: filterByIP,
                filterByAccount: filterByAccount,
                filterByResult: filterByResult,
                dtFrom: dtFrom,
                dtTo: dtTo,
                pageId: pageId
            },
            dataType: "text",
            cache: false,
            success: function(data){
                $('#div-mo-list').html(data);
                $('#data-loading').hide();
            }
        });
    }

</script>