{{-- Extends layout --}}
@extends(getThemeBasePath())

@section('page_title')
{{$page_title}}
@endsection

{{-- Content --}}
@section('content')
<!--begin::Card-->
<div class="card shadow-sm">
    <!--begin::Header-->
    <div class="card-header flex-wrap border-0 pt-6 pb-0">
        <div class="card-title">
            <input type="text" data-kt-customer-table-filter="search" class="form-control form-control-solid w-250px ps-15" placeholder="Search" />
        </div>
        <div class="card-toolbar">
            <!--begin::Button-->
            {!!Helper::getListAddBtn(route("document_center.create"),"Add New Document")!!}
            <!--end::Button-->
        </div>
    </div>
    <!--end::Header-->
    <!--begin::Body-->
    <div class="card-body">
        @include("backend.alerts")
        <div class="row" style="margin-bottom: 20px;">
            <div class="col-md-3">
                {!!Helper::getClientFilterDropDown(false)!!}
            </div>
            <div class="col-md-3">
                <div class="mb-10">
                    <label class="form-label fs-5 fw-bold mb-3">Start Date:</label>
                    <input type="text" class="form-control age-datepicker filter-date input-from-date" placeholder="From Date" name="fromDate" value="" autocomplete="off" />
                </div>
            </div>
            <div class="col-md-3">
                <div class="mb-10">
                    <label class="form-label fs-5 fw-bold mb-3">End date / Review date:</label>
                    <input type="text" class="form-control age-datepicker filter-date input-to-date" placeholder="To Date" name="toDate" value="" autocomplete="off" />
                </div>
            </div>
            <div class="col-md-3">
                <div class="mb-10">
                    <label class="form-label fs-5 fw-bold mb-3">Document Name:</label>
                    <input type="text" class="form-control filter-date input-document-name" placeholder="Document Name" name="document_name" value="" autocomplete="off" />
                </div>
            </div>
            <div class="col-md-3">
                <div class="mb-10">
                    <label class="form-label fs-5 fw-bold mb-3">Status:</label>
                    <select class="form-control form-control-lg form-control-solid required select2 filter-date input-status" name="status" required>
                        <option value="">All</option>
                        @foreach(config('constant.status_list') as $gN => $gV)
                        <option value="{{$gN}}" {{ ($gN == 1 ? 'selected' : '') }}>{{$gV}}</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <div class="col-md-3 mt-10">
                <div class="mb-10">
                    <a href="javascript:;" class="mr-5 btn btn-primary" onclick="searchTable();" title="">Search</a>
                </div>
            </div>

        </div>
        <!--begin: Datatable-->
        {!! $html->table() !!}
        <!--end: Datatable-->
    </div>
    <!--end::Body-->
</div>
<!--end::Card-->
@endsection

{{-- Scripts Section --}}
@section('scripts')

{!! $html->scripts() !!}
<script type="text/javascript">
    $('#kt_header_menu_wrapper').attr('style', 'visibility:hidden;');
    $(document).on('change keyup', '.filter-date', function() {
        window.LaravelDataTables["dataTableBuilder"].ajax.reload();
    });
    function searchTable(){
        window.LaravelDataTables["dataTableBuilder"].ajax.reload();
    }

    function actionDelete(ele) {
        var row = $(ele).parents('tr:first');
        if (row) {
            var id = row.attr('id');
            if (id) {
                Swal.fire(deleteAlert).then(function(result) {
                    if (result.value) {
                        $.ajax({
                            type: 'POST',
                            dataType: 'json',
                            data: {
                                id: id,
                                "_token": "{{ csrf_token() }}",
                                _method: 'DELETE'
                            },
                            url: "{!! route('document_center.destroy',1) !!}",
                            success: function(data) {
                                if (data.status) {
                                    Swal.fire(deleteSuccessAlert);
                                    window.LaravelDataTables["dataTableBuilder"].ajax.reload();
                                }
                            }
                        });
                    }
                });
            }
        }
    }

    function previewDocument(ele) {
        var row = $(ele).parents('tr:first');
        if (row) {
            var id = row.attr('id');
            $.ajax({
                type: 'POST',
                dataType: 'json',
                data: {
                    "docId": id,
                    "_token": "{{ csrf_token() }}",
                },
                url: "{!! $docCheckUrl !!}",
                success: function(data) {
                    if (data.status) {
                        window.open(data.file, "_blank");
                    } else {
                        var url = "{{$previewUrl}}";
                        var getData = $('#kt_form').serialize();
                        getData += "&docId=" + id;
                        window.open(url + '?' + getData, "_blank");
                    }
                }
            });
        } else {
            deleteSuccessAlert['text'] = "Please document template from the list!";
            Swal.fire(deleteSuccessAlert);
        }
    }
</script>
@endsection