<?php $__env->startSection('styles'); ?>

    <link href="/assets/global/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/global/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css" rel="stylesheet"
          type="text/css"/>
    <link href="/assets/global/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet"
          type="text/css"/>
    <link href="/assets/global/plugins/bootstrap-editable/bootstrap-editable/css/bootstrap-editable.css"
          rel="stylesheet" type="text/css"/>
    <link href="/assets/global/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/global/plugins/bootstrap-editable/inputs-ext/address/address.css" rel="stylesheet"
          type="text/css"/>


    <style>

        .pac-container {
            z-index: 10052 !important;
        }

        #map {
            width: auto !important;
            height: 500px !important;
        }

        #map_edit {
            width: auto !important;
            height: 500px !important;
        }

        tfoot {
            display: table-header-group;
        }

        tfoot input {
            font-weight: normal !important;
        }

        tfoot select {
            font-weight: normal !important;
        }

        .dataTables_filter {
            display: none;
        }

        #orders-table_length {
            display: none;
        }

        .ws-nr {
            width: 100% !important;
        }

    </style>

<?php $__env->stopSection(); ?>
<?php $__env->startSection('content'); ?>
    <?php if(session()->has('error')): ?>
        <div class="alert alert-danger"><?php echo e(session()->get('error')); ?></div>
    <?php endif; ?>
    <?php if(session()->has('success')): ?>
        <div class="alert alert-success"><?php echo e(session()->get('success')); ?></div>
    <?php endif; ?>
    <?php if(count($errors) > 0): ?>
        <div class="alert alert-danger">
            <ul>
                <?php $__currentLoopData = $errors->all(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $error): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <li><?php echo e($error); ?></li>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </ul>
        </div>
    <?php endif; ?>
    <h1 class="page-title">
        Danh sách agent Itro
    </h1>

    <div class="row">
        <div class="col-md-12">
            <a class="btn red" id="btn-add" data-toggle="modal" href="#add-agent-form">
                <i class="fa  fa-plus"></i> Thêm
            </a>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <table class="table table-striped table-bordered table-hover" id="orders-table">
                <thead>
                <tr style="background-color: #5376B9; color: white">
                    <th>Tên</th>
                    <th>SĐT</th>
                    <th>Email</th>
                    <th>Khu vực</th>
                    <th>Hành động</th>
                </tr>
                </thead>
                <tfoot>
                <tr>
                    <th><input type="text" class="form-control"></th>
                    <th><input type="text" class="form-control"></th>
                    <th><input type="text" class="form-control"></th>
                    <th><input type="text" class="form-control"></th>
                    <th></th>
                </tr>
                </tfoot>
            </table>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12" id="detail">
        </div>
    </div>

    <div class="modal fade bs-modal-lg" id="add-agent-form" role="basic" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    <h4 class="modal-title">Thêm agent</h4>
                </div>
                <div class="modal-body" id="add-agent-form-content">

                </div>
                <div class="modal-footer">

                    <button type="button" class="btn dark btn-outline" data-dismiss="modal">Đóng</button>
                    <button type="submit" class="btn green" id="btn-save-agent-form">Lưu</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
    </div>


    <div class="modal fade bs-modal-lg" id="edit-agent" role="basic" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    <h4 class="modal-title">Cập nhật agent</h4>
                </div>

                <div class="modal-body" id="edit-agent-form-content">

                </div>
                <div class="modal-footer">

                    <button type="button" class="btn dark btn-outline" data-dismiss="modal">Đóng</button>
                    <button type="submit" class="btn green" id="btn-save-edit-agent-form">Lưu</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
    </div>




<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
    <script src="/assets/global/plugins/jquery-validation/js/jquery.validate.min.js" type="text/javascript"></script>
    <script src="/assets/global/plugins/jquery-validation/js/additional-methods.min.js" type="text/javascript"></script>

    <script>
        $.validator.addMethod("greaterThan",
            function (value, element, param) {
                var $otherElement = $(param);
                return parseInt(value, 10) >= parseInt($otherElement.val(), 10);
            }
        );
    </script>


<?php $__env->stopPush(); ?>


<?php $__env->startPush('scripts'); ?>
    <script>
        var table;

        function getPostByAttr() {
            table.ajax.reload();
        }

        $(function () {

            table = $('#orders-table').DataTable({
                "bDestroy": true,
                processing: true,
                searching: true,
                serverSide: true,
                aaSorting: [],
                ajax: {
                    url: '<?php echo url('admin/agent/agent.data'); ?>',
                    data: function (d) {
                    }
                },
                columns: [
                    {data: 'name', name: 'name'},
                    {data: 'phone', name: 'phone'},
                    {data: 'email', name: 'email'},
                    {data: 'districts', name: 'districts'},
                    {data: 'action', name: 'action', 'orderable': false, searchable: false},
                ],
            });

            table.columns().every(function (index) {
                if (index !== 0) {
                    var that = this;
                    $('input', this.footer()).on('keyup', function () {
                        if (that.search() !== this.value) {
                            that
                                .search(this.value)
                                .draw();
                        }
                    });

                    $('select', this.footer()).on('change', function () {
                        if (that.search() !== this.value) {
                            that
                                .search(this.value)
                                .draw();
                        }
                    });
                }
            });

        });

        $(document).on('click', '#btn-add', function (e) {
            e.preventDefault();

            $.ajax({
                url: '<?php echo e(url('admin/agent/create')); ?>',
                type: 'get',
                dataType: 'json',
                beforeSend: function () {
                    $('#add-agent-form-content').addClass('ht-on-loading');
                    $('#edit-agent-form-content').html('');
                },
                success: function (response) {
                    $('#add-agent-form-content').removeClass('ht-on-loading').html(response.data);
                    $('.select2').select2();
                }
            });
        });

        $(document).on('click', '.btn-edit', function (e) {
            e.preventDefault();

            var id = $(this).attr('data-id');
            $.ajax({
                url: '<?php echo e(url('admin/agent/edit')); ?>',
                type: 'get',
                data: {
                    id: id
                },
                dataType: 'json',
                beforeSend: function () {
                    $('#edit-agent-form-content').addClass('ht-on-loading');
                    $('#add-agent-form-content').html('');
                },
                success: function (response) {
                    $('#edit-agent-form-content').removeClass('ht-on-loading').html(response.data);
                    $('.select2').select2();
                }
            });
        });

        $(document).on('change', '#province_id,#province', function (e) {
            var id = $(this).val();
            $.ajax({
                url: '<?php echo e(url('get-sub-location')); ?>',
                type: 'get',
                data: {
                    'id': $(this).val(),
                    'type': 'province',
                },
                dataType: 'html',
                success: function (response) {
                    $('#district_id').html(response);
                    $('#ward_id').html('');
                    $('#district').html(response);
                    $('#ward').html('');
                }
            });
        });

        $(document).on('change', '#district_id,#district', function (e) {
            var id = $(this).val();
            $.ajax({
                url: '<?php echo e(url('get-sub-location')); ?>',
                type: 'get',
                data: {
                    'id': $(this).val(),
                    'type': 'district'
                },
                dataType: 'html',
                success: function (response) {
                    $('#ward_id').html(response);
                    $('#ward').html(response);
                }
            });
        });


        $(document).on('click', '.btn-delete', function (e) {
            e.preventDefault();
            var id = $(this).attr('data-id');

            bootbox.confirm({
                message: "Bạn có chắc chắn muốn xóa",
                buttons: {
                    confirm: {
                        label: 'Có',
                        className: 'btn-success'
                    },
                    cancel: {
                        label: 'Không',
                        className: 'btn-danger'
                    }
                },


                callback: function (result) {
                    if (result == true) {

                        $.ajax({
                            url: '<?php echo e(url('admin/agent/delete')); ?>',
                            type: 'post',
                            data: {
                                id: id,
                            },
                            dataType: 'json',
                            success: function (response) {
                                if (response.status == 1) {
                                    swal('Thành công', '', 'success');
                                } else if (response.status == 2) {
                                    swal('Thông báo', response.message, 'info');
                                } else {
                                    swal('Thông báo', response.message, 'warning');
                                }
                                table.ajax.reload();
                            }
                        });

                    }
                }
            });
        });

        $('#btn-save-agent-form').click(function (e) {
            e.preventDefault();

            var formStatus = $('#form-add-agent').validate({
                errorElement: "span",
                errorClass: "help-block help-block-error",

                highlight: function (e) {
                    $(e).closest(".form-group").addClass("has-error")
                },
                unhighlight: function (e) {
                    $(e).closest(".form-group").removeClass("has-error")
                },
                success: function (e) {
                    e.closest(".form-group").removeClass("has-error")
                },
                rules: {
                    'province_id': "required",
                },
                messages: {
                    'province_id': "Không được bỏ trống Tỉnh thành",
                }
            }).form();

            if (formStatus) {
                let data = $('#form-add-agent').serialize();
                $.ajax({
                    url: '<?php echo e(url('admin/agent/create')); ?>',
                    type: 'post',
                    data: data,
                    dataType: 'json',
                    beforeSend: function () {
                        $('#add-agent-form-content').addClass('ht-on-loading');
                    },
                    success: function (response) {
                        $('#add-agent-form-content').removeClass('ht-on-loading');
                        $('#add-agent-form').modal('hide');
                        if (response.status == 1) {
                            swal('Thành công', response.message, 'success');

                        } else if (response.status == 0) {
                            swal('Thông báo', response.message, 'warning');
                        } else if (response.status == 2) {
                            swal('Thông báo', response.message, 'info');
                        }
                        table.ajax.reload();
                    }
                });
            }
        });

        $('#btn-save-edit-agent-form').click(function (e) {
            e.preventDefault();

            var formStatus = $('#form-edit-agent-item').validate({
                errorElement: "span",
                errorClass: "help-block help-block-error",

                highlight: function (e) {
                    $(e).closest(".form-group").addClass("has-error")
                },
                unhighlight: function (e) {
                    $(e).closest(".form-group").removeClass("has-error")
                },
                success: function (e) {
                    e.closest(".form-group").removeClass("has-error")
                },
                rules: {
                    'province_id': "required",
                },
                messages: {
                    'province_id': "Không được bỏ trống Tỉnh / thành",
                }
            }).form();

            if (formStatus) {
                let data = $('#form-edit-agent-item').serialize();
                $.ajax({
                    url: '<?php echo e(url('admin/agent/edit')); ?>',
                    type: 'post',
                    data: data,
                    dataType: 'json',
                    beforeSend: function () {
                        $('#edit-agent-form-content').addClass('ht-on-loading');
                    },
                    success: function (response) {
                        $('#edit-agent-form-content').removeClass('ht-on-loading');
                        $('#edit-agent').modal('hide');
                        if (response.status == 1) {
                            swal('Thành công', response.message, 'success');

                        } else if (response.status == 0) {
                            swal('Thông báo', response.message, 'warning');
                        } else if (response.status == 2) {
                            swal('Thông báo', response.message, 'info');
                        }
                        table.ajax.reload();
                    }
                });
            }
        });

        $('#btn-save-agent').click(function (e) {
            e.preventDefault();

            var formStatus = $('#form-add-agent').validate({
                errorElement: "span",
                errorClass: "help-block help-block-error",

                highlight: function (e) {
                    $(e).closest(".form-group").addClass("has-error")
                },
                unhighlight: function (e) {
                    $(e).closest(".form-group").removeClass("has-error")
                },
                success: function (e) {
                    e.closest(".form-group").removeClass("has-error")
                },
                rules: {
                    'file': "required",
                },
                messages: {
                    'file': "Không được bỏ trống file",
                }
            }).form();

            if (formStatus) {
                let data = new FormData($('#form-add-agent')[0]);
                $.ajax({
                    url: '<?php echo e(url('admin/agent/excel')); ?>',
                    type: 'post',
                    data: data,
                    dataType: 'json',
                    processData: false,
                    contentType: false,
                    beforeSend: function () {
                        $('#add-agent-content').addClass('ht-on-loading');
                    },
                    success: function (response) {
                        $('#add-agent-content').removeClass('ht-on-loading');
                        $('#add-agent').modal('hide');
                        if (response.status == 1) {
                            swal('Thành công', response.message, 'success');

                        } else if (response.status == 0) {
                            swal('Thông báo', response.message, 'warning');
                        } else if (response.status == 2) {
                            swal('Thông báo', response.message, 'info');
                        }
                        table.ajax.reload();
                    }
                });
            }
        });

    </script>
<?php $__env->stopPush(); ?>
<?php echo $__env->make('admin', \Illuminate\Support\Arr::except(get_defined_vars(), array('__data', '__path')))->render(); ?>