@extends('layouts.simple.master')

@section('title', 'Default')

@section('css')

@endsection

@section('style')
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/animate.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/datatables.css') }}">
<link rel="stylesheet" type="text/css" href="{{asset('assets/css/vendors/select2.css')}}">
@endsection

@section('breadcrumb-title')
<!-- <h3>Verifications</h3> -->
@endsection

@section('breadcrumb-items')
<li class="breadcrumb-item">Verifications</li>
@endsection

@section('content')
<style>
    .gallery img {
        cursor: pointer;
        width: 100px;
        /* Adjust size as needed */
        height: auto;
    }

    .fancybox-content {
        text-align: center;

    }

    .select2-selection--single {
        border-color: #8e8e8e !important;
    }

    .select2-container .select2-selection--single {
        height: 37px !important;
        padding: 4px !important;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 13px !important;
    }
</style>
<div class="container-fluid">
    <div class="row">
        <div class="col-xxl-12 col-xl-12 col-md-12 col-sm-12 box-col-12">
            <div class="card height-equal">
                <div class="card-header card-no-border">
                    <div class="header-top">
                        <h5>Verifications</h5>
                    </div>
                </div>
                <div class="card-body pt-3 pb-5">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="mb-3">
                                <select class="form-control mb-3 js-example-basic-single" onchange="filter_rows(this)">
                                    <option value="">Filter By Status</option>
                                    @if (!empty($statuses))
                                    @foreach ($statuses as $status)
                                    <option value="{{$status->id}}">{{$status->entity_title}}</option>
                                    @endforeach
                                    @endif
                                </select>
                            </div>
                            <div class="table-responsive">
                                <table class="display" id="basic-1" role="grid">
                                    <thead>
                                        <tr>
                                            <th>ID</th>
                                            <th>Document</th>
                                            <th>Uploaded By</th>
                                            <th>Level</th>
                                            <th>Status</th>
                                            <th>Uploaded On</th>
                                            <td style="width:15% !important"></td>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if (!empty($pdf))
                                        @php
                                        $pdf_urls = [];
                                        $i = 0;
                                        @endphp
                                        @foreach ($pdf as $row)
                                        <tr>
                                            <td>1</td>
                                            <td>
                                                @php
                                                if(!empty($row->pdf)){
                                                $pdf_urls = json_decode($row->pdf,true);
                                                }
                                                @endphp
                                                <div class="gallery" style="display:none;">
                                                    @if (!empty($pdf_urls))
                                                    @foreach ($pdf_urls as $pdf_url)
                                                    @if (!empty($pdf_url))
                                                    @php
                                                    $extension = pathinfo($pdf_url, PATHINFO_EXTENSION);
                                                    @endphp
                                                    @if (strtolower($extension) == 'pdf')
                                                    <a href="{{ url('storage/uploads/'.$pdf_url) }}" class="pdf-view" style="display:none;">
                                                        {{ url('storage/uploads/'.$pdf_url) }}
                                                    </a>
                                                    @else
                                                    <img src="{{ url('storage/uploads/'.$pdf_url) }}" style="width:48%; height:auto;">
                                                    @endif
                                                    @endif
                                                    @endforeach
                                                    @endif
                                                </div>
                                                @if ($row->doc_type == 1)
                                                ID Card
                                                @elseif($row->doc_type == 2)
                                                Driving License
                                                @elseif($row->doc_type ==3)
                                                Passport
                                                @elseif($row->doc_type == 4)
                                                Utility Bills
                                                @elseif($row->doc_type == 5)
                                                Bank Statment
                                                @endif
                                                <!-- <a class="text-inherit a_doc" href="{{ url('storage/uploads/'.$row->pdf) }}" target="_blank">{{ $row->pdf }}</a> -->
                                            </td>
                                            <td> </td>
                                            <td></td>
                                            <td>
                                                <span class="badge" style="background-color: ;"></span>
                                            </td>
                                            <td>
                                                {{ optional($row->created_at)->format('j M Y g:i a') ?? 'N/A' }}
                                            </td>
                                            <td class="text-end" style="width:15% !important">
                                                <button class="btn btn-success btn-sm view-doc" type="button" data-gallery-id="{{ $row->id }}"><i class="fa fa-eye"></i></button>
                                                <button class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#var"><i class="fa fa-edit"></i></button>
                                                <button class="btn btn-danger btn-sm" data-bs-toggle="modal" data-bs-target="#trash"><i class="fa fa-trash"></i></button>
                                            </td>
                                        </tr>
                                        <div class="modal fade" id="trash" tabindex="-1" role="dialog" aria-labelledby="trashLabel" aria-hidden="true">
                                            <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title" id="trashLabel">Confirmation</h5>
                                                        <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close" data-bs-original-title="" title=""></button>
                                                    </div>
                                                    <form action="{{ route('verification.trash') }}" method="post">
                                                        @csrf
                                                        <div class="modal-body">
                                                            <div class="row">
                                                                <div class="col">
                                                                    <div class="mb-3 row">
                                                                        <div class="col-sm-12">
                                                                            <p><b>Are you sure you want to delete this?</b></p>
                                                                            <input type="hidden" name="id" value="">
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">No</button>
                                                            <button class="btn btn-danger" type="submit">Yes</button>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="modal fade" id="var" tabindex="-1" role="dialog" aria-labelledby="upload_fileLabel" aria-hidden="true">
                                            <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title" id="upload_fileLabel">Update</h5>
                                                        <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close" data-bs-original-title="" title=""></button>
                                                    </div>
                                                    <form action="{{ route('verification.update') }}" method="post">
                                                        @csrf
                                                        <div class="modal-body">
                                                            <div class="row">
                                                                <div class="col">
                                                                    <div class="mb-3 row">
                                                                        <label class="col-sm-3 col-form-label">Document</label>
                                                                        <div class="col-sm-9">
                                                                            @if ($row->doc_type == 1)
                                                                            ID Card
                                                                            @elseif($row->doc_type == 2)
                                                                            Driving License
                                                                            @elseif($row->doc_type ==3)
                                                                            Passport
                                                                            @elseif($row->doc_type == 4)
                                                                            Utility Bills
                                                                            @elseif($row->doc_type == 5)
                                                                            Bank Statment
                                                                            @endif
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="row">
                                                                <div class="col">
                                                                    <div class="mb-3 row">
                                                                        <label class="col-sm-3 col-form-label">Status</label>
                                                                        <div class="col-sm-9 mb-3">
                                                                            <input type="hidden" name="id" value="{{$row->id}}">
                                                                            <select name="status" class="form-control">
                                                                                @if (!empty($statuses))
                                                                                @foreach ($statuses as $status)
                                                                                <option value="{{$status->id}}"
                                                                                    @if($status->id == $row->status)
                                                                                    selected
                                                                                    @endif
                                                                                    >{{$status->entity_title}}</option>
                                                                                @endforeach
                                                                                @endif
                                                                            </select>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="row">
                                                                <div class="col">
                                                                    <div class="mb-3 row">
                                                                        <label class="col-sm-3 col-form-label">Comments</label>
                                                                        <div class="col-sm-9">
                                                                            <textarea name="comment" class="form-control"></textarea>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Close</button>
                                                            <button class="btn btn-primary" type="submit">Save</button>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                        @endforeach
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="transaction_info" tabindex="-1" role="dialog" aria-labelledby="transaction_infoLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="transaction_infoLabel">Documents</h5>
                <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close" data-bs-original-title="" title=""></button>
            </div>
            <div class="modal-body">
                <div class="row">

                    <div class="col-md-12">
                        <p><u><b>Document1.pdf</b></u></p>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Close</button>
                <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Download</button>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var session_layout = '{{ session()->get('
    layout ') }}';
</script>
@endsection

@section('script')
<script src="{{ asset('assets/js/datatable/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('assets/js/datatable/datatables/datatable.custom.js') }}"></script>
<script>
    @if(strtolower(Request::segment(1)) === 'client')
    var user_id = "{{ Auth::guard('client')->user()->id }}";
    var person_name = "{{ Auth::guard('client')->user()->fname }}";
    var person_img = "{{ Auth::guard('client')->user()->image }}";
    var role = "{{ Auth::guard('client')->user()->role }}";
    @else
    var user_id = "{{ Auth::guard('admin')->user()->id }}";
    var person_name = "{{ Auth::guard('admin')->user()->fname }}";
    var person_img = "{{ Auth::guard('admin')->user()->image }}";
    var role = "{{ Auth::guard('admin')->user()->role }}";
    if (role == 3) {
        user_id = 1
    }
    @endif
    $(document).ready(function() {
        $.ajax({
            url: "{{ route('notifications.read') }}",
            type: 'GET',
            data: {
                user_id: user_id,
                type: "App\\Notifications\\NewVerificationFile",
            },
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            success: function(response) {}
        });
    })

    function view_doc(obj) {
        $(obj).closest('tr').find('.a_doc')[0].click();
    }

    function filter_rows(obj) {
        var id = $(obj).val();
        if (id) {
            var status = $(obj).find('option:selected').text();
            $('#basic-1').DataTable().search(status).draw();
        } else {
            $('#basic-1').DataTable().search('').draw();
        }
    }
    $(document).ready(function() {
        $('#verification_notification').removeAttr('id')
        $('.onhover-dropdown .verification').removeClass('chat')
    })
</script>
<script>
    $(document).ready(function() {
        $('.view-doc').on('click', function() {
            var galleryId = $(this).data('gallery-id');
            var $gallery = $(this).closest('tr').find('.gallery');

            var $pdfLink = $gallery.find('.pdf-view');
            if ($pdfLink.length) {
                $.fancybox.open({
                    src: $pdfLink.attr('href'),
                    type: 'iframe',
                    opts: {
                        loop: true,
                        buttons: [
                            'close'
                        ],
                        iframe: {
                            preload: false
                        }
                    }
                });
            } else {
                // If there are images, open them in a gallery as before
                $.fancybox.open({
                    src: $gallery.html(),
                    type: 'html',
                    opts: {
                        loop: true,
                        buttons: [
                            'close'
                        ]
                    }
                });
            }
        });

    });
</script>

@endsection