@extends('layouts.app')

@section('title', 'Document Approvals')

@section('content')
<div class="container-fluid">
    <div class="card card-outline card-info shadow-sm">
        <div class="card-header">
            <h3 class="card-title font-weight-bold"><i class="fas fa-file-alt mr-2 text-info"></i>Pending Document Verifications</h3>
        </div>
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-hover table-bordered table-striped w-100 mb-0" id="docApprovalsTable">
                    <thead>
                    <tr>
                        <th>Employee</th>
                        <th>Document Name</th>
                        <th>File</th>
                        <th>Date</th>
                        <th style="width: 150px;">Action</th>
                    </tr>
                </thead>
            </table>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
$(function() {
    var table = $('#docApprovalsTable').DataTable({
        processing: true,
        serverSide: true,
        ajax: "{{ route('approvals.documents.data') }}",
        columns: [
            {data: 'employee_name', name: 'employee.name'},
            {data: 'name', name: 'name'},
            {data: 'file_link', name: 'file_path', orderable: false, searchable: false},
            {data: 'created_at', name: 'created_at'},
            {data: 'action', name: 'action', orderable: false, searchable: false}
        ]
    });

    $('body').on('click', '.approve-doc', function() {
        var id = $(this).data('id');
        $.post("{{ url('approvals/documents') }}/" + id + "/approve", { _token: "{{ csrf_token() }}" }, function() {
            table.draw();
            Swal.fire({ icon: 'success', title: 'Approved', toast: true, position: 'top-end', showConfirmButton: false, timer: 3000 });
        });
    });

    $('body').on('click', '.reject-doc', function() {
        var id = $(this).data('id');
        Swal.fire({
            title: 'Reject Document',
            input: 'text',
            inputPlaceholder: 'Enter reason for rejection',
            showCancelButton: true,
            confirmButtonText: 'Reject',
            confirmButtonColor: '#d33'
        }).then((result) => {
            if (result.isConfirmed) {
                $.post("{{ url('approvals/documents') }}/" + id + "/reject", { _token: "{{ csrf_token() }}", reason: result.value }, function() {
                    table.draw();
                    Swal.fire({ icon: 'info', title: 'Rejected', toast: true, position: 'top-end', showConfirmButton: false, timer: 3000 });
                });
            }
        });
    });
});
</script>
@endpush