@extends('layouts.app')
@section('title', trans('title.settings_employee_documents'))

@section('plugin-styles')
    <style>
        .lightGallery{
            width: 100% !important;
        }
    </style>
@stop
@section('content')
@include('layouts.partials.employee-files')
<div class="tab-content-wrapper">
    <!-- Tab Content -->
    @php
        $isBelongsTo = true;
    @endphp
    @if($isBelongsTo)
        @can('create_document',$user)
            <div class="content-title-div" >
                <div>
                    <h1 class="text-lg-semibold">
                        {{trans('title.documents')}}
                    </h1>
                </div>
                <div>
                    @if (request()->has('user_id'))
                        @php
                            $user_id = (request()->get('user_id'));
                        @endphp
                        <a onclick="toggleOffCanvas('off-canvas-with-loading')" href="{{route('employee.documents.create.user', ['user_id' => $user_id])}}" class="btn-secondary-sm" >
                            <x-svg-icon icon="icon-add" />
                            {{trans('forms.lbl_add_new')}}
                        </a>
                    @else
                        <a onclick="toggleOffCanvas('off-canvas-with-loading')" href="{{route('employee.documents.create.user')}}" class="btn-secondary-sm" >
                            <x-svg-icon icon="icon-add" />
                            {{trans('forms.lbl_add_new')}}
                        </a>
                    @endif
                </div>
            </div>
        @endcan
    @endif
    <table id="datatable" class="table-custom-striped w-full" style="width: 100%;">
        <thead>
        <tr>
            <th class="w-[30%]">{{__('tables.document_type')}}</th>
            <th class="min-w-[135px]">{{__('tables.expiry_date_title')}}</th>
            {{-- <th >Deadline</th> --}}
            {{-- <th >Upload date</th> --}}
            <th >{{__('tables.status_title')}}</th>
            <th >{{__('tables.documents')}}</th>
            <th class="w-[15%]">&nbsp;</th>
        </tr>
        </thead>
    </table>
</div>
@stop

@section('footer-script')

<script src="{{ asset('js/tailwind/profile.js') }}"></script>
    <script type="text/javascript">

        var $datable = $('#datatable');

        PDDataTable({
            url: "{{ route('employee.documents.index').(request()->has('user_id') ? '?user_id='.request()->get('user_id'): '')}}",
            searching : false,
            columns:[
                { data: 'name', name: 'name', className:"!text-custom-grey-900 !font-medium"},
                // { data: 'deadline', name: 'deadline'},
                { data: 'expired_at', name: 'expired_at'},
                //{ data: 'upload_date', name: 'upload_date'},
                { data: 'status', name: 'status', className: 'text-center', orderable: false, searchable : false},
                { data: 'documents', name: 'documents', orderable: false, searchable : false,sWidth:'40%'},
				{ data: 'action', name: 'action', orderable: false, className: 'text-left', searchable : false }
            ],
            order : [1, 'asc']
        });

    </script>
@stop