<?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'); ?>

    <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>STT</th>
                    <th>Mã hợp đồng </br> Mã tham chiếu</th>
                    <th>Ngày hợp đồng</th>
                    <th>Nhà</th>
                    <th>Phòng</th>
                    <th>Giường</th>
                    <th>Thời hạn thuê</th>
                    <th>Chu kỳ (tháng)</th>
                    <th>Giá thuê</th>
                    <th>Đặt cọc</th>
                    <th>Người ký hợp đồng</th>
                    <th>Trạng thái</th>
                    <th>Ngày thanh lý</th>
                    <th style="width: 10%">Hành động</th>
                    
                </tr>
                </thead>
                <tfoot>
                <tr>
                    <th></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><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><input type="text" class="form-control"></th>
                    <th><input type="text" class="form-control"></th>
                    <th><input type="text" class="form-control"></th>
                    <th>
                        <select class="form-control">
                            <option value="">Vui lòng chọn</option>
                            <option value="<?php echo e(\App\Models\Contract::VALIDATED); ?>">Còn hạn</option>
                            <option value="<?php echo e(\App\Models\Contract::LIQUIDATED); ?>">Đã thanh lý</option>
                            <option value="<?php echo e(\App\Models\Contract::EXPIRE); ?>">Quá hạn</option>
                        </select>
                    </th>
                    <th><input type="text" class="form-control"></th>
                    <th style="width: 10%"></th>
                    
                </tr>
                </tfoot>
            </table>
        </div>
    </div>

    <div class="modal fade bs-modal-lg" id="edit-contract" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close2" data-dismiss="modal" aria-hidden="true"><span
                                aria-hidden="true" style="
    color: white;
">×</span></button>
                    <h4 class="modal-title">Cập nhật hợp đồng</h4>
                </div>
                <div class="modal-body" id="edit-contract-content">


                </div>
                <div class="modal-footer">
                    <button type="button" class="btn dark btn-outline" data-dismiss="modal" id="dismiss-modal">Hủy
                    </button>
                    <button type="button" class="btn green" id="btn-save-edit-contract">Lưu</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

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

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

<script>


    var table = '';
    $(document).on('click', '#btn-save-edit-contract', function () {

        var data = $('#form-edit-contract').serialize();

        $.ajax({
            url: '<?php echo e(url('admin2/contract/edit')); ?>',
            type: 'post',
            dataType: 'json',
            data: data,
            beforeSend: function () {
                $('#edit-contract-content').addClass('ht-on-loading');
            },
            success: function (response) {
                if (response.status == 2) {
                    swal('Thông báo', response.message, 'info');
                }

                if (response.status == 1) {
                    swal('Thành công', 'Hợp đồng đã được cập nhật', 'success');
                    $('#edit-contract-content').removeClass('ht-on-loading');
                    $('#edit-contract').modal('hide');
                    table.ajax.reload(null, false);
                }
            }
        });
    });

    $(document).on('click', '.edit-contract', function () {

        var id = $(this).attr('data-id');

        $.ajax({
            url: '<?php echo e(url('admin2/contract/edit')); ?>',
            type: 'get',
            dataType: 'json',
            data: {
                id: id
            },
            beforeSend: function () {
                $('#edit-contract-content').addClass('ht-on-loading');
            },
            success: function (response) {
                if (response.status == 2) {
                    swal('Thông báo', response.message, 'info');
                }

                if (response.status == 1) {
                    $('#edit-contract-content').removeClass('ht-on-loading').html(response.data);
                    $('.select2').select2();
                    $('.datepicker2').datepicker({
                        format: 'dd/mm/yyyy',
                        autoclose: true
                    });
                }
            }
        });
    });

    $(function () {

//        $('#orders-table tfoot th').each( function (index) {
//            if(index != 0 && index != 9) {
//                $(this).html('<input type="text" class="form-control" />');
//            }
//        } );
        table = $('#orders-table').DataTable({
            "bDestroy": true,
            processing: true,
            searching: true,
            "aaSorting": [],
            serverSide: true,
            ajax: {
                url: '<?php echo url('admin2/report/contract.data'); ?>',
            },
            columns: [

                {data: 'DT_Row_Index', name: 'DT_Row_Index', orderable: false, searchable: false},
                {data: 'code', name: 'code'},
                {data: 'date_contract', name: 'date_contract'},
                {data: 'hostel_id', name: 'hostel_id'},
                {data: 'room_id', name: 'room_id'},
                {data: 'bed_id', name: 'bed_id'},

                {data: 'end_date', name: 'end_date'},
                {data: 'period', name: 'period'},
                {data: 'room_price', name: 'room_price'},
                {data: 'deposit', name: 'deposit'},
                {data: 'name', name: 'name'},
                {data: 'status', name: 'status'},
                {data: 'date_end_contract', name: 'date_end_contract'},
                {data: 'action', name: 'action'},
                // {data: 'action', name: 'action', 'orderable' : false, searchable: false},
            ],
        });


        table.columns().every(function (index) {
            if (index !== 0 && index !== 12) {
                var that = this;
                $('input', this.footer()).on('keyup change', 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('change', '.checkbox-all-contract', function (e) {
        if ($(this).is(":checked")) {
            $('.checkbox-contract-fee-c-contract').prop('checked', true);
        } else {
            $('.checkbox-contract-fee-c-contract').prop('checked', false);
        }
    });

    $(document).on('change', '#hostel_id', function (e) {
        var id = $(this).val();
        var type = $(this).attr('data-type');
        $.ajax({
            url: '<?php echo e(url('get-sub-hostel')); ?>',
            type: 'get',
            data: {
                'id': $(this).val(),
                'type': type
            },
            dataType: 'html',
            success: function (response) {
                $('#room_id').html(response);
                $('#room_id').select2();

            }
        });
    });

    $(document).on('change', '#room_id', function () {
        $.ajax({
            url: '<?php echo e(url('admin2/room/bed-by-room')); ?>',
            type: 'get',
            data: {
                room_id: $(this).val()
            },
            dataType: 'json',
            success: function (response) {
                $('#bed_id').html(response.data);
            }
        })
    });

    $(document).on('click', '.btn-delete-contract', 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('admin2/contract/delete')); ?>',
                        type: 'post',
                        data: {
                            id: id
                        },
                        dataType: 'json',
                        success: function (response) {
                            if (response.status == 1) {
                                swal('Xóa thành công', '', 'success');
                                table.ajax.reload();
                            } else {
                                swal('Thông báo', response.message, 'info');
                            }
                        }
                    });
                }
            }
        });
    });
</script>
<?php $__env->stopPush(); ?>
<?php echo $__env->make('admin2', \Illuminate\Support\Arr::except(get_defined_vars(), array('__data', '__path')))->render(); ?>