@extends('admin2')

@section('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"/>
    <link href="/assets/global/plugins/typeahead/typeahead.css" rel="stylesheet" type="text/css"/>
    <link href="/assets/global/plugins/bootstrap-select/css/bootstrap-select.min.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>

@endsection
@section('content')
    @if (session()->has('error'))
        <div class="alert alert-danger">{{ session()->get('error') }}</div>
    @endif
    @if (session()->has('success'))
        <div class="alert alert-success">{{ session()->get('success') }}</div>
    @endif
    @if (count($errors) > 0)
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    <h1 class="page-title">
        @if(request()->url() == url('admin2/money/income'))
            Danh sách phiếu thu
        @else
            Danh sách phiếu chi
        @endif
    </h1>

    <div class="row"
         style="margin-right: 0px; margin-left: 0px; padding-top: 15px; margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #e7ecf1; background-color: #EFF2F5">
        <div class="col-md-9">
            <div class="row">


                <div class="col-md-2">
                    <label class="control-label">Chọn nhà</label>
                    <select class="form-control" id="hostels">
                        <option value="">Tất cả nhà</option>
                        @php
                            $hostelArrs = \App\Models\Hostel::where('owner_id', auth('backend')->user()->id)->pluck('id')->toArray();

                             if(auth('backend')->user()->type == \App\User::STAFF)
	    {
		    $hostelArrs = \App\Components\Functions::getHostelArrStaff();
	    }
                                $hostels = \App\Models\Hostel::whereIn('id', $hostelArrs)->get();

                        @endphp
                        @foreach($hostels as $hostel)
                            <option
                                    value="{{ $hostel->id }}">{{ $hostel->name }}</option>
                        @endforeach
                    </select>
                </div>

                <div class="col-md-2">
                    <label class="control-label">Chọn phòng</label>
                    <select class="form-control select2" id="select-rooms">
                        <option value=" " selected>Tất cả phòng</option>
                        @if(!empty($hostels))

                            @php $hostel = $hostels->first();
                            if($hostel){
                            $hostelId = $hostel->id;
                            $rooms = \App\Models\Room::where('hostel_id', $hostelId)->get()->sortBy(function($item) {
                            return $item->name;
                            });
                            }
                            @endphp

                            @if(!empty($rooms))
                                @foreach($rooms as $room)
                                    <option value="{{ $room->id }}"> {{ $room->name }}</option>
                                @endforeach
                            @endif


                        @endif
                    </select>
                </div>


                <div class="col-md-2">
                    <label class="control-label">Ngày bắt đầu</label>
                    <input class="form-control date-picker" type="text" name="start_date" id="start_date">
                </div>


                <div class="col-md-2">
                    <label class="control-label">Ngày kết thúc</label>
                    <input class="form-control date-picker" type="text" name="end_date" id="end_date">
                </div>
                @php
                    $ownerId = auth('backend')->user()->id;
            if(auth('backend')->user()->type == App\User::STAFF)
            {
             $ownerId = auth('backend')->user()->staff_owner_id;
            }

                @endphp
                @if(request()->url() == url('admin2/money/income'))
                    <div class="col-md-2">
                        <label class="control-label">Loại phiếu</label>

                        <select class="bs-select form-control" data-deselect-all-text="Bỏ chọn tất cả" data-select-all-text="Chọn tất cả"  data-actions-box="true" id="type" multiple >
                            @php
                        $types = App\Models\TypeCollect::query()->where('owner_id', $ownerId)->get();

                            @endphp
                            @foreach($types as $type)
                            <option value="{{ $type->id }}">{{ $type->name }}
                            </option>
                          @endforeach
                            {{--<option value="{{ \App\Models\MoneyInfo::VOUCHER_OTHER }}" selected>Khác</option>--}}
                        </select>


                    </div>
                @else
                    @php
                        $types = App\Models\TypeSpend::query()->where('owner_id', $ownerId)->get();

                    @endphp
                    <div class="col-md-2">
                        <label class="control-label">Loại phiếu</label>

                        <select class="bs-select form-control" id="type" multiple>
                            @foreach($types as $type)
                                <option value="{{ $type->id }}">{{ $type->name }}
                                </option>
                            @endforeach
                        </select>


                    </div>
                @endif
            </div>
        </div>
        <div class="col-md-3">

            <div class="row">
                <div class="col-md-12" id="hostels-button">
                    @if(request()->url() == url('admin2/money/outcome'))
                        @if(auth('backend')->user()->can('add-spend'))
                            <div class="col-md-12" style="margin-bottom: 12px; padding-top: 12px">
                                <a style="margin-left: 10px" class="btn green-meadow pull-right btn-export-excel"
                                   data-type="outcome"
                                   href="#export-excel" data-toggle="modal">
                                    <i class="fa fa-file-excel"></i> Xuất Excel</a>
                                <a href="#spend" data-toggle="modal" class="btn btn-success" id="btn-add-spend"
                                   style="float: right">Thêm
                                    phiếu chi</a>

                            </div>
                        @endif
                    @else
                        @if(auth('backend')->user()->can('add-collect'))
                            <div class="col-md-12" style="margin-bottom: 12px; padding-top: 12px">
                                <a style="margin-left: 10px" class="btn green-meadow pull-right btn-export-excel"
                                   href="#export-excel" data-toggle="modal" data-type="income">
                                    <i class="fa fa-file-excel"></i> Xuất Excel</a>
                                <a href="#collect" data-toggle="modal" class="btn btn-success" id="btn-add-collect"
                                   style="float: right">Thêm
                                    phiếu thu</a>

                            </div>
                        @endif
                    @endif
                </div>
            </div>
        </div>


    </div>
    <div class="row" id="stat">
    </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>STT</th>
                    @if(request()->url() == url('admin2/money/income'))
                        <th>Mã phiếu thu</th>
                    @else
                        <th>Mã phiếu chi</th>
                    @endif
                    <th>Id</th>
                    <th>Loại phiếu</th>
                    @if(request()->url() == url('admin2/money/income'))
                        <th>Mã hóa đơn</th>
                    @endif

                    <th>Mã HĐ</th>


                    <th>Nhà</th>
                    <th>Phòng</th>
                    @if(request()->url() == url('admin2/money/income'))
                        <th>Số tiền thu</th>
                        <th>Người nộp tiền</th>
                        <th>Nội dung thu</th>
                    @else
                        <th>Số tiền chi</th>
                        <th>Nội dung chi</th>
                    @endif
                    @if(request()->url() == url('admin2/money/outcome'))
                        <th>Người nhận</th>
                    @endif

                    <th style="width: 10%">Hình thức</th>
                    @if(request()->url() == url('admin2/money/income'))
                        <th>Ngày thu</th>
                    @else
                        <th>Ngày chi</th>
                    @endif
                    <th>Ghi chú</th>
                    <th style="width: 8%">Thao tác</th>
                    {{--<th style="width: 10%;">Thao tác</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>
                    @if(request()->url() == url('admin2/money/income'))
                        <th><input type="text" class="form-control"></th>
                    @endif
                    <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>

                    @if(request()->url() == url('admin2/money/outcome'))
                        <th><input type="text" class="form-control"></th>
                    @endif

                    {{--<th><input type="text" class="form-control"></th>--}}
                    @if(request()->url() == url('admin2/money/outcome'))
                        <th>
                            <select class="form-control" style="font-weight: normal">
                                <option value="">Vui lòng chọn</option>
                                <option value="{{ \App\Models\CollectSpend::MONEY }}">Tiền mặt</option>
                                <option value="{{ \App\Models\CollectSpend::BANK }}">Chuyển khoản</option>
                            </select>
                        </th>
                    @endif
                    <th><input type="text" class="form-control"></th>
                    @if(request()->url() == url('admin2/money/income'))
                        <th>
                            <select class="form-control" style="font-weight: normal">
                                <option value="">Vui lòng chọn</option>
                                <option value="{{ \App\Models\CollectSpend::MONEY }}">Tiền mặt</option>
                                <option value="{{ \App\Models\CollectSpend::BANK }}">Chuyển khoản</option>
                            </select>
                        </th>
                    @endif
                    <th><input type="text" class="form-control"></th>
                    <th><input type="text" class="form-control"></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="spend" 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" id="voucher-title">Lập phiếu chi</h4>
                </div>
                <div class="modal-body" id="spend-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-spend">Lưu</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

    <div class="modal fade bs-modal-lg" id="export-excel" 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" id="voucher-title">Xuất dữ liệu ra Excel</h4>
                </div>
                <div class="modal-body">
                    <form role="form" id="form-export">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                        <input type="hidden" name="type" id="type_export">
                        <div class="form-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>Chọn nhà</label>
                                        <select class="form-control" name="hostel_id" id="hostel_id_2">
                                            @php
                                                $hostelArrs = \App\Models\Hostel::where('owner_id', auth('backend')->user()->id)->pluck('id')->toArray();
                                                $hostels = \App\Models\Hostel::whereIn('id', $hostelArrs)->get();

                                            @endphp

                                            <option value="">Vui lòng chọn</option>
                                            @foreach($hostels as $hostel)
                                                <option value="{{ $hostel->id }}"> {{ $hostel->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>Chọn phòng</label>
                                        <select class="form-control" name="room_id" id="room_id_2">

                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>Chọn ngày bắt đầu</label>
                                        <input class="form-control datepicker" name="start_date">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>Chọn ngày kết thúc</label>
                                        <input class="form-control datepicker" name="end_date">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>

                </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-export">Xuất</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

    <div class="modal fade bs-modal-lg" id="collect" 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" id="voucher-title">Lập phiếu thu</h4>
                </div>
                <div class="modal-body" id="collect-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-collect">Lưu</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>


    <div class="modal fade bs-modal-lg" id="detail-money-info" 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" id="detail-money-info-title">Thông tin hóa đơn</h4>
                </div>
                <div class="modal-body" id="detail-money-info-content">


                </div>
                <div class="modal-footer">
                    <button type="button" class="btn dark btn-outline" data-dismiss="modal" id="dismiss-modal">Hủy
                    </button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

    <div class="modal fade bs-modal-lg" id="edit-collect-spend" 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" id="collect-spend-title">Cập nhật phiếu thu chi</h4>
                </div>
                <div class="modal-body" id="edit-collect-spend-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">Lưu</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>


@endsection

@push('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 src="/assets/global/plugins/typeahead/handlebars.min.js" type="text/javascript"></script>
    <script src="/assets/global/plugins/typeahead/typeahead.bundle.min.js" type="text/javascript"></script>
    <script src="/assets/global/plugins/bootstrap-select/js/bootstrap-select.min.js" type="text/javascript"></script>
    <script src="/assets/pages/scripts/components-bootstrap-select.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>


@endpush


@push('scripts')
    {{--<script type="text/javascript">--}}
    {{--var file1 = $('.add-image-hostel').val();--}}

    {{--$('#file-upload').on('change.bs.fileinput', function(e, file) {--}}
    {{--//console.log(e)--}}
    {{--$('#file1').val(file1)--}}
    {{--});--}}


    {{--$('#file-upload').on('clear.bs.fileinput', function(e, file) {--}}
    {{--//console.log(e)--}}
    {{--$('#file1').val(file1)--}}
    {{--});--}}
    {{--</script>--}}

    <script>


        //    $(document).on('change', '.add-image-hostel', function(e) {
        //        alert('123');
        //       $('.fileinput-exists').css({
        //           'width' : '48%'
        //       });
        //
        //      $('.btn-file').css({
        //          'width' : '100%'
        //      });
        //
        //
        //    });

        var table = null;

        $('#select-rooms').change(function () {
            getPostByAttr();
        });

        $('#hostels').change(function (e) {
            getPostByAttr();
            $.ajax({
                url: '{{ url('admin2/hostel/select-rooms') }}',
                type: 'get',
                data: {
                    hostel_id: $(this).val()
                },
                dataType: 'json',
                success: function (response) {
                    $('#select-rooms').html(response.data);
                }
            })
        });

        //    $('#start_date').change(function (e) {
        //        getPostByAttr();
        //    });

        function getDt() {

        }

        $('.date-picker').datepicker({
            format: 'dd/mm/yyyy',
            autoclose: true,
        }).on('changeDate', function (ev) {
            //  get_stat();
            getPostByAttr();
        });

        $('#type').change(function () {
            getPostByAttr();
        });

        $('.btn-export-excel').click(function (e) {
            var data_type = $(this).attr('data-type');
            $('#type_export').val(data_type);
        });

        $('#btn-export').click(function (e) {
            var data = $('#form-export').serialize();
            window.location = '{{ url('admin2/money/export-excel') }}' + '?' + data;
        });

        function get_stat() {
            $.ajax({
                url: '{!! url('admin2/money/money.data') !!}',
                data: {
                    @if(request()->url() == url('admin2/money/income'))
                    type: '{{ \App\Models\CollectSpend::COLLECT }}',
                    @else
                    type: '{{ \App\Models\CollectSpend::SPEND }}',
                    @endif
                    hostel_id: $('#hostels').val(),
                    start_date: $('#start_date').val(),
                    end_date: $('#end_date').val(),
                    type_voucher: $('#type').val(),
                    room_id: $('#select-rooms').val(),
                    is_stat: 1,
                },
                beforeSend: function () {
                    $('#stat').addClass('ht-on-loading');
                },
                dataType: 'json',
                success: function (response) {
                    $('#stat').removeClass('ht-on-loading').html(response.data);
                }
            });
        }

        function getPostByAttr() {
            get_stat();
            table.ajax.reload(null, false);
        }

        $(function () {
            get_stat();

//        $('#orders-table tfoot th').each( function (index) {
//            if(index != 0 && index != 9) {
//                $(this).html('<input type="text" class="form-control" />');
//            }
//        } );co
            table = $('#orders-table').DataTable({
                "bDestroy": true,
                processing: true,
                searching: true,
                "aaSorting": [],
                serverSide: true,
                ajax: {
                    url: '{!! url('admin2/money/money.data') !!}',
                    data: function (d) {
                        @if(request()->url() == url('admin2/money/income'))
                            d.type = '{{ \App\Models\CollectSpend::COLLECT }}';
                        @else
                            d.type = '{{ \App\Models\CollectSpend::SPEND }}';
                        @endif
                            d.hostel_id = $('#hostels').val();
                        d.start_date = $('#start_date').val();
                        d.end_date = $('#end_date').val();
                        d.type_voucher = $('#type').val();
                        d.room_id = $('#select-rooms').val();
                    }
                },
                "columnDefs": [
                    {
                        "targets": [2],
                        "visible": false,
                    },
                ],
                columns: [

                    {data: 'DT_Row_Index', name: 'DT_Row_Index', orderable: false, searchable: false},
                    {data: 'code', name: 'code'},
                    {data: 'id', name: 'id'},
                    {data: 'money_info_type', name: 'money_info_type'},
                        @if(request()->url() == url('admin2/money/income'))
                    {
                        data: 'money_info_name', name: 'money_info_name'
                    },
                        @endif
                    {
                        data: 'contract_code', name: 'contract_code'
                    },
                    {
                        data: 'hostel_name', name: 'hostel_name'
                    },
                    {data: 'room_name', name: 'room_name'},
                    {data: 'amount', name: 'amount'},
                        @if(request()->url() == url('admin2/money/income'))
                    {
                        data: 'payer', name: 'payer'
                    },
                        @endif
                    {
                        data: 'name', name: 'name'
                    },
                        @if(request()->url() == url('admin2/money/outcome'))
                    {
                        data: 'receiver', name: 'receiver'
                    },
                        @endif
                    {
                        data: 'payment_method', name: 'payment_method'
                    },
                    {data: 'date_action', name: 'date_action'},
                    {data: 'note', name: 'note'},
                    {data: 'action', name: 'action', 'orderable': false, searchable: false},
                    // {data: 'action', name: 'action', 'orderable' : false, searchable: false},
                ],
            });


            table.columns().every(function (index) {
                if (index !== 0) {
                    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();
                        }
                    });
                }
            });

        });

        $("#spend").on("shown.bs.modal", function (e) {
            $.ajax({
                url: '{{ url('admin2/money/spendView') }}',
                type: 'get',
                dataType: 'json',
                beforeSend: function () {
                    $('#spend-content').addClass('ht-on-loading');
                },
                success: function (response) {
                    if (response.status == 2) {
                        swal('Thông báo', response.message, 'info');
                    }

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

                        $('#receiver').typeahead({
                            hint: true,
                            highlight: true,
                            minLength: 1
                        }, {
                            source: function (query, syncresults, process) {
                                return $.ajax({
                                    url: '{{ url('admin2/money/receivers') }}',
                                    data: {q: query},
                                    dataType: 'json',
                                    type: 'get',
                                    success: function (response) {
                                        return process(response)
                                    }
                                });
                            },
                            display: 'name', // PUT IT HERE
                            templates: {
                                empty: [
//                    '<div class="empty-message">',
//                    '</div>'
                                ].join('\n'),
                                suggestion: function (data) {
                                    return '<div>' + data.name + '</div>';
                                }
                            }
                        })
                    }
                }
            });
        });

        $("#collect").on("shown.bs.modal", function (e) {
            $.ajax({
                url: '{{ url('admin2/money/collectView') }}',
                type: 'get',
                dataType: 'json',
                beforeSend: function () {
                    $('#collect-content').addClass('ht-on-loading');
                },
                success: function (response) {
                    if (response.status == 2) {
                        swal('Thông báo', response.message, 'info');
                    }

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

        $(document).on('click', '.detail-money', function () {
            var money_info_id = $(this).attr('data-id');
            $.ajax({
                url: '{{ url('admin2/money/detail-money-info') }}',
                type: 'get',
                data: {
                    money_info_id: money_info_id
                },
                dataType: 'json',
                beforeSend: function () {
                    $('#detail-money-info-content').addClass('ht-on-loading');
                },
                success: function (response) {
                    $('#detail-money-info-content').removeClass('ht-on-loading').html(response.data);
                    $('#detail-money-info-title').text(response.title);
                }
            });

        });


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

            $("#edit-collect-spend").off('shown.bs.modal').on("shown.bs.modal", function (e) {
                $.ajax({
                    url: '{{ url('admin2/money/edit-spendView') }}',
                    type: 'get',
                    data: {
                        id: id
                    },
                    dataType: 'json',
                    beforeSend: function () {
                        $('#edit-collect-spend-content').addClass('ht-on-loading');
                        $('#spend-content').html('');
                    },
                    success: function (response) {
                        $('#edit-collect-spend-content').removeClass('ht-on-loading').html(response.data);
                        $('.datepicker').datepicker({
                            format: 'dd/mm/yyyy',
                            autoclose: true,
                        });

                        $('#collect-spend-title').text(response.code);
                        $('#receiver').typeahead({
                            hint: true,
                            highlight: true,
                            minLength: 1
                        }, {
                            source: function (query, syncresults, process) {
                                return $.ajax({
                                    url: '{{ url('admin2/money/receivers') }}',
                                    data: {q: query},
                                    dataType: 'json',
                                    type: 'get',
                                    success: function (response) {
                                        return process(response)
                                    }
                                });
                            },
                            display: 'name', // PUT IT HERE
                            templates: {
                                empty: [
//                    '<div class="empty-message">',
//                    '</div>'
                                ].join('\n'),
                                suggestion: function (data) {
                                    return '<div>' + data.name + '</div>';
                                }
                            }
                        })
                    }
                });
            });
        });

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

            $("#edit-collect-spend").off('shown.bs.modal').on("shown.bs.modal", function (e) {
                $.ajax({
                    url: '{{ url('admin2/money/edit-collectView') }}',
                    type: 'get',
                    data: {
                        id: id
                    },
                    dataType: 'json',
                    beforeSend: function () {
                        $('#edit-collect-spend-content').addClass('ht-on-loading');
                        $('#spend-content').html('');
                    },
                    success: function (response) {
                        $('#edit-collect-spend-content').removeClass('ht-on-loading').html(response.data);
                        $('.datepicker').datepicker({
                            format: 'dd/mm/yyyy',
                            autoclose: true,
                        });

                        $('#collect-spend-title').text(response.code);
                        $('#receiver').typeahead({
                            hint: true,
                            highlight: true,
                            minLength: 1
                        }, {
                            source: function (query, syncresults, process) {
                                return $.ajax({
                                    url: '{{ url('admin2/money/receivers') }}',
                                    data: {q: query},
                                    dataType: 'json',
                                    type: 'get',
                                    success: function (response) {
                                        return process(response)
                                    }
                                });
                            },
                            display: 'name', // PUT IT HERE
                            templates: {
                                empty: [
//                    '<div class="empty-message">',
//                    '</div>'
                                ].join('\n'),
                                suggestion: function (data) {
                                    return '<div>' + data.name + '</div>';
                                }
                            }
                        })
                    }
                });
            });
        });


        $(document).on('change', '#hostel_id', function (e) {
            var id = $(this).val();
            var type = $(this).attr('data-type');
            $.ajax({
                url: '{{ 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', '#repeat_every', function (e) {
            if($(this).val() == '{{ \App\Models\CollectSpendCycle::REPEAT_EVERY_CUSTOM }}')
            {
                $('#repeat-custom').show();
            } else {
                $('#repeat-custom').hide();
            }

            if($(this).val() != '')
            {
                $('#cycles-row').show();
            } else {
                $('#cycles-row').hide();
            }
        });

        $(document).on('change', '#unlimited_cycles', function (e) {
            if($(this).is(':checked'))
            {
                $('#cycles').attr('disabled', true);
            } else {
                $('#cycles').removeAttr('disabled');
            }
        });

        $('.datepicker').datepicker({
            format: 'dd/mm/yyyy',
            language: 'vi',
            autoclose: true,
        });

        $(document).on('change', '#hostel_id_2', function (e) {
            var id = $(this).val();
            $.ajax({
                url: '{{ url('get-sub-hostel') }}',
                type: 'get',
                data: {
                    'id': $(this).val(),
                },
                dataType: 'html',
                success: function (response) {
                    $('#room_id_2').html(response);
                    $('#room_id_2').select2();

                }
            });
        });

        $(document).on('click', '#btn-save-spend', function (e) {
            e.preventDefault();
            //var data = $('#form-add-spend').serialize();
            var data = new FormData($('#form-add-spend')[0]);
            var formStatus = $('#form-add-spend').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: {
                    // 'hostel_id': "required",
                    'name': "required",
                    //  'amenities[]': "required",
                    'date_action': {
                        required: true,
                    },
                    'amount': {
                        required: true,
                    },
                    'receiver': {
                        required: true,
                    },
                    'payment_method': {
                        required: true,
                    }
                },
                messages: {
                    //  'hostel_id': "Không được bỏ trống nhà trọ",
                    'name': "Không được bỏ trống lý do chi",
                    'date_action': "Không được bỏ trống ngày chi",
                    'amount': "Không được bỏ trống số tiền",
                    'receiver': "Không được bỏ trống người nhận",
                    'payment_method': "Không được bỏ trống phương thức thanh toán",
                    // 'amenities[]': "Không được bỏ trống tiện ích"
                }
            }).form();
            if (formStatus) {
                $.ajax({
                    url: '{{ url('admin2/money/spend') }}',
                    type: 'post',
                    data: data,
                    dataType: 'json',
                    cache:false,
                    contentType: false,
                    processData: false,
                    beforeSend: function () {
                        $('#spend-content').addClass('ht-on-loading');
                    },
                    success: function (response) {
                        $('#spend-content').removeClass('ht-on-loading');
                        if (response.status == 1) {
                            swal('Thành công', 'Lập phiếu chi thành công', 'success');
                            get_stat();
                            table.ajax.reload(null, false);
                            $('#spend').modal('hide');
                        } else {
                            swal('Thông báo', response.message, 'warning');
                        }
                    }
                });
            }
        });


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

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

            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: '{{ url('admin2/money/delete-cp-file') }}',
                            type: 'post',
                            data: {
                                id: id
                            },
                            dataType: 'json',
                            success: function (response) {
                                if (response.status == 1) {
                                    swal('Xóa thành công', '', 'success');
                                    $(that).parent().parent().remove();
                                    //   table.ajax.reload();
                                } else {
                                    swal('Thông báo', response.message, 'info');
                                }
                            }
                        });
                    }
                }
            });
        });

        $(document).on('click', '#btn-save-collect', function (e) {
            e.preventDefault();
            //  var data = $('#form-add-collect').serialize();
            var data = new FormData($('#form-add-collect')[0]);

            var formStatus = $('#form-add-collect').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: {
                    'hostel_id': "required",
                    'name': "required",
                    //  'amenities[]': "required",
                    'date_action': {
                        required: true,
                    },
                    'amount': {
                        required: true,
                    },
                    'receiver': {
                        required: true,
                    },
                    'payment_method': {
                        required: true,
                    },
                    'payer': {
                        required: true,
                    }

                },
                messages: {
                    'hostel_id': "Không được bỏ trống nhà trọ",
                    'name': "Không được bỏ trống lý do chi",
                    'date_action': "Không được bỏ trống ngày thu",
                    'amount': "Không được bỏ trống số tiền",
                    'payment_method': "Không được bỏ trống phương thức thanh toán",
                    'payer': "Không được bỏ trống người nộp tiền"
                }
            }).form();

            if (formStatus) {

                $.ajax({
                    url: '{{ url('admin2/money/collect') }}',
                    type: 'post',
                    data: data,
                    dataType: 'json',
                    cache:false,
                    contentType: false,
                    processData: false,
                    beforeSend: function () {
                        $('#spend-content').addClass('ht-on-loading');
                    },
                    success: function (response) {
                        $('#spend-content').removeClass('ht-on-loading');
                        if (response.status == 1) {
                            swal('Thành công', 'Lập phiếu thu thành công', 'success');
                            table.ajax.reload(null, false);
                            $('#collect').modal('hide');
                        } else {
                            swal('Thông báo', response.message, 'warning');
                        }

                    }
                });
            }
        });

        $(document).on('click', '#btn-save-edit', function (e) {
            e.preventDefault();
            //   var data = $('#form-edit-spend').serialize();
            var data = new FormData($('#form-edit-spend')[0]);

            var formStatus = $('#form-edit-spend').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: {
                    //'hostel_id': "required",
                    'name': "required",
                    //  'amenities[]': "required",
                    'date_action': {
                        required: true,
                    },
                    'amount': {
                        required: true,
                    },
                    'receiver': {
                        required: true,
                    },
                    'payment_method': {
                        required: true,
                    }
                },
                messages: {
                    //'hostel_id': "Không được bỏ trống nhà trọ",

                    @if(request()->url == url('admin2/money/income'))
                    'name': "Không được bỏ trống lý do thu",

                    'date_action': "Không được bỏ trống ngày thu",

                    @else
                    'name': "Không được bỏ trống lý do chi",

                    'date_action': "Không được bỏ trống ngày chi",
                    @endif
                    'amount': "Không được bỏ trống số tiền",
                    'receiver': "Không được bỏ trống người nhận",
                    'payment_method': "Không được bỏ trống phương thức thanh toán",
                    // 'amenities[]': "Không được bỏ trống tiện ích"
                }
            }).form();

            if (formStatus) {

                $.ajax({
                    url: '{{ url('admin2/money/edit-spend') }}',
                    type: 'post',
                    data: data,
                    cache:false,
                    contentType: false,
                    processData: false,
                    dataType: 'json',
                    beforeSend: function () {
                        $('#edit-collect-spend-content').addClass('ht-on-loading');
                    },
                    success: function (response) {
                        $('#edit-collect-spend-content').removeClass('ht-on-loading');
                        if (response.status == 1) {
                            swal('Thành công', 'Cập nhật thành công', 'success');
                            table.ajax.reload(null, false);
                            $('#edit-collect-spend').modal('hide');
                        } else {
                            swal('Thông báo', response.message, 'warning');
                        }

                    }
                });
            }
        });

        @if(request()->url == url('admin2/money/income'))
        $(document).ready(function () {
            $.ajax({
                url: '{{ url('admin2/money/collect-stat') }}',
                type: 'post',
                data: {},
                dataType: 'json',
                beforeSend: function () {
                    $('#edit-collect-spend-content').addClass('ht-on-loading');
                },
                success: function (response) {
                    $('#edit-collect-spend-content').removeClass('ht-on-loading');
                    if (response.status == 1) {
                        swal('Thành công', 'Cập nhật thành công', 'success');
                        table.ajax.reload(null, false);
                        $('#edit-collect-spend').modal('hide');
                    } else {
                        swal('Thông báo', response.message, 'warning');
                    }

                }
            });
        });
        @endif



        $(document).on('click', '.btn-delete-money', 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: '{{ url('admin2/money/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(null, false);
                                } else {
                                    swal('Thông báo', response.message, 'info');
                                }
                            }
                        });
                    }
                }
            });
        });
        //$('.bs-select').selectpicker();
    </script>

@endpush