@extends('Master.master')
@section('content')
<!-- Content Header (Page header) -->
<section class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-4">
                <h1>Surat Usulan</h1>
            </div>
            @if (auth()->user()->role == 'super')
            <div class="col-sm-8">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{route('dashboard')}}">Dashboard</a></li>
                    <li class="breadcrumb-item"><a href="{{route('list_permohonan_super')}}">Permohonan PAK</a></li>
                    <li class="breadcrumb-item"><a href="{{route('permohonan_detail_super', $Permohonan->id)}}">Form Permohonan</a></li>
                    <li class="breadcrumb-item"><a href="{{route('document', $Permohonan->id)}}">Data Administrasi</a></li>
                    <li class="breadcrumb-item active">Surat Usulan</li>
                </ol>
            </div>
            @elseif (auth()->user()->role == 'admin')
            <div class="col-sm-8">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{route('dashboard')}}">Dashboard</a></li>
                    <li class="breadcrumb-item"><a href="{{route('list_permohonan_admin')}}">Permohonan PAK</a></li>
                    <li class="breadcrumb-item"><a href="{{route('permohonan_detail_admin', $Permohonan->id)}}">Form Permohonan</a></li>
                    <li class="breadcrumb-item"><a href="{{route('document', $Permohonan->id)}}">Data Administrasi</a></li>
                    <li class="breadcrumb-item active">Surat Usulan</li>
                </ol>
            </div>
            @elseif (auth()->user()->role == 'user')
            @if (position() <= 4)
            <div class="col-sm-8">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{route('dashboard')}}">Home</a></li>
                    <li class="breadcrumb-item"><a href="{{route('list_permohonan_user')}}">Permohonan PAK Ahli</a></li>
                    <li class="breadcrumb-item"><a href="{{route('permohonan_detail_user', $Permohonan->id)}}">Form Permohonan Ahli</a></li>
                    <li class="breadcrumb-item"><a href="{{route('document', $Permohonan->id)}}">Data Administrasi</a></li>
                    <li class="breadcrumb-item active">Surat Usulan</li>
                </ol>
            </div>
            @elseif (position() >= 5)
            <div class="col-sm-8">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{route('dashboard')}}">Home</a></li>
                    <li class="breadcrumb-item"><a href="{{route('list_permohonan_user')}}">Permohonan PAK Terampil</a></li>
                    <li class="breadcrumb-item"><a href="{{route('permohonan_detail_user', $Permohonan->id)}}">Form Permohonan Terampil</a></li>
                    <li class="breadcrumb-item"><a href="{{route('document', $Permohonan->id)}}">Data Administrasi</a></li>
                    <li class="breadcrumb-item active">Surat Usulan</li>
                </ol>
            </div>
            @endif
            @endif
        </div>
    </div>
</section>

@if (auth()->user()->role == 'user' || auth()->user()->role == 'super' || auth()->user()->role == 'pembina')
<!-- Main content -->
<section class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    @if ($Permohonan->status == 0)
                    @if($Doc_count <= 0)
                    <div class="card-header">
                        <h3 class="card-title"><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modal-default-usulan">Tambah Dokumen</button></h3>
                    </div>
                    @endif
                    @endif
                    <div class="card-body">
                        <table id="example1" class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th class="text-center">No</th>
                                    <th class="text-center">Tanggal Upload</th>
                                    <th class="text-center">Nama File</th>
                                    <th class="text-center">Status</th>
                                    <th class="text-center">Catatan</th>
                                    <th class="text-center">Aksi</th>
                                </tr>
                            </thead>
                            @php $no = 1; @endphp
                            <tbody>
                                @foreach ($Doc as $d)
                                <tr>
                                    <td class="text-center col-1">{{$no++}}</td>
                                    <td>{{$d->created_at}}</td>
                                    <td>{{$d->document_name}}</td>
                                    @switch($d->status_document)
                                        @case(0)
                                            <td class="col-1 text-center"><div class="bg-info color-palette"><span>Verifikasi</span></div></td>
                                            @break
                                        @case(1)
                                            <td class="col-1 text-center"><div class="bg-success color-palette"><span>Sudah Sesuai</span></div></td>
                                            @break
                                        @case(2)
                                            <td class="col-1 text-center"><div class="bg-danger color-palette"><span>Tidak Sesuai</span></div></td>
                                            @break
                                        @default
                                            <td class="col-1 text-center"><div class="bg-info color-palette"><span>Verifikasi</span></div></td>
                                    @endswitch
                                    </td>
                                    <td>
                                        {{$d->catatan}}
                                    </td>
                                    @php
                                        $extension = substr("{$d->upload}", -4);
                                    @endphp
                                    @if ($extension == '.zip')
                                        @if (auth()->user()->role == 'user')
                                            @if ($Permohonan->status == 0)
                                            <td class="col-2">
                                                <div class="row">
                                                    <div class="col-6">
                                                        <a href="{{ asset('upload/surat_usulan/'.$d->upload) }}" target="_blank"><button type="button" class="btn btn-block bg-gradient-primary"><i class="fas fa-download"></i></button></a>
                                                    </div>
                                                    <div class="col-6">
                                                        <a href="" class="button delete-confirm" data-id="{{$d->id}}"><button type="button" class="btn btn-block bg-gradient-danger"><i class="fas fa-trash"></i></button></a>
                                                    </div>
                                                </div>
                                            </td>
                                            @else
                                                @if ($d->status_document == 2)
                                                <td class="col-2">
                                                    <div class="row">
                                                        <div class="col-md-6">
                                                            <a href="{{ asset('upload/surat_usulan/'.$d->upload) }}" target="_blank"><button type="button" class="btn btn-block bg-gradient-primary"><i class="fas fa-download"></i></button></a>
                                                        </div>
                                                        <div class="col-md-6">
                                                            <button type="button" id="edit-file-dokumen" class="btn btn-block bg-gradient-warning" data-toggle="modal" data-target="#modal-edit-dokumen" data-id="{{ $d->id }}"><i class="fas fa-edit"></i></button>
                                                        </div>
                                                    </div>
                                                </td>
                                                @else
                                                <td>
                                                    <a href="{{ asset('upload/surat_usulan/'.$d->upload) }}" target="_blank"><button type="button" class="btn btn-block bg-gradient-primary"><i class="fas fa-download"></i></button></a>
                                                </td>
                                                @endif
                                            @endif
                                        @elseif (auth()->user()->role == 'super')
                                            <td class="col-2">
                                                <div class="row">
                                                    <div class="col-6">
                                                        <a href="{{ asset('upload/surat_usulan/'.$d->upload) }}" target="_blank"><button type="button" class="btn btn-block bg-gradient-primary"><i class="fas fa-download"></i></button></a>
                                                    </div>
                                                    <div class="col-6">
                                                        <button type="button" id="status_catatan_document" class="btn btn-block bg-gradient-warning" data-toggle="modal" data-target="#status-catatan-document" data-id="{{ $d->id }}"><i class="fas fa-edit"></i></button>
                                                    </div>
                                                </div>
                                            </td>
                                        @elseif (auth()->user()->role == 'pembina')
                                        <td>
                                            <div class="row">
                                                <div class="col-12">
                                                    <a href="{{ asset('upload/surat_usulan/'.$d->upload) }}" target="_blank"><button type="button" class="btn btn-block bg-gradient-primary"><i class="fas fa-download"></i></button></a>
                                                </div>
                                            </div>
                                        </td>
                                        @endif
                                    @else
                                        @if (auth()->user()->role == 'user')
                                            @if ($Permohonan->status == 0)
                                            <td class="col-2">
                                                <div class="row">
                                                    <div class="col-md-6">
                                                        <button type="button" class="btn btn-block bg-gradient-primary" data-toggle="modal" data-target="#i-frame"><i class="fas fa-eye"></i></button>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <a href="" class="button delete-confirm" data-id="{{$d->id}}"><button type="button" class="btn btn-block bg-gradient-danger"><i class="fas fa-trash"></i></button></a>
                                                    </div>
                                                </div>
                                            </td>
                                            @else
                                                @if ($d->status_document == 2)
                                                <td class="col-2">
                                                    <div class="row">
                                                        <div class="col-md-6">
                                                            <button type="button" class="btn btn-block bg-gradient-primary" data-toggle="modal" data-target="#i-frame"><i class="fas fa-eye"></i></button>
                                                        </div>
                                                        <div class="col-md-6">
                                                            <button type="button" id="edit-file-dokumen" class="btn btn-block bg-gradient-warning" data-toggle="modal" data-target="#modal-edit-dokumen" data-id="{{ $d->id }}"><i class="fas fa-edit"></i></button>
                                                        </div>
                                                    </div>
                                                </td>
                                                @else
                                                <td>
                                                    <button type="button" class="btn btn-block bg-gradient-primary" data-toggle="modal" data-target="#i-frame"><i class="fas fa-eye"></i></button>
                                                </td>
                                                @endif
                                            @endif
                                        @elseif (auth()->user()->role == 'super')
                                        <td class="col-2">
                                            <div class="row">
                                                <div class="col-6">
                                                    <button type="button" class="btn btn-block bg-gradient-primary" data-toggle="modal" data-target="#i-frame"><i class="fas fa-eye"></i></button>
                                                </div>
                                                <div class="col-6">
                                                    <button type="button" id="status_catatan_document" class="btn btn-block bg-gradient-warning" data-toggle="modal" data-target="#status-catatan-document" data-id="{{ $d->id }}"><i class="fas fa-edit"></i></button>
                                                </div>
                                            </div>
                                        </td>
                                        @elseif (auth()->user()->role == 'pembina')
                                        <td>
                                            <div class="row">
                                                <div class="col-12">
                                                    <button type="button" class="btn btn-block bg-gradient-primary" data-toggle="modal" data-target="#i-frame"><i class="fas fa-eye"></i></button>
                                                </div>
                                            </div>
                                        </td>
                                        @endif
                                    @endif
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @if (auth()->user()->role == 'super' && $Doc_count >= 1)
        @include ('Form_Modal.edit_catatan_document')
    @endif
    
    <!-- Modal Usulan -->
    @if ($Permohonan->status == 0)
    <div class="modal fade" id="modal-default-usulan">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Form Surat Usulan</h4>
                    <button type="button" class="close" data-dismiss="modal" id="close" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="usulan-data" method="post" enctype="multipart/form-data">
                    {{ csrf_field()}}
                    <div class="modal-body">
                        <div class="form-group">
                            <p>Surat usulan yang ditandatangani kepala unit kerja pengusul: Ditujukan kepada Sekretaris Jendral cq. Direktorat Bina Teknik SDA (Instansi di luar Kementerian PUPR atau K/L/D.</p>
                        </div>
                        <div class="form-group">
                            <label for="exampleInputFile">File input</label>
                            <div class="input-group">
                                <div class="custom-file">
                                    <input type="file" class="custom-file-input" id="fileupload" name="upload" accept=".pdf, .zip">
                                    <label class="custom-file-label" for="exampleInputFile">Choose file</label>
                                </div>
                            </div>
                            <span style="color:red; font-size:14px;" id="tampil_alert_file" class="tampil_alert_file"></span>
                        </div>
                    </div>
                    <input type="hidden" id="type" value="1" name="type">
                    <input type="hidden" id="permohonan_id" value="{{$Permohonan->id}}" name="permohonan_id">
                    <input type="hidden" id="progress" value="{{$Permohonan->progress}}" name="progress">
                    <div class="modal-footer justify-content-between">
                        <button type="button" id="close" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="submit" id="submit" class="btn btn-primary">Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    @endif

    <!-- i frame surat usulan-->
    @if ($Doc_count >= 1 && $extension != '.zip')
    <div class="modal fade" id="i-frame">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <iframe src="{{ asset('upload/surat_usulan/'.$d->upload) }}" width="100%" height="600"></iframe>
                </div>
            </div>
        </div>
    </div>
    @endif

    <div class="modal fade" id="modal-edit-dokumen">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Edit Form Surat Usulan</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="form-edit-dokumen" method="post" enctype="multipart/form-data">
                    {{ csrf_field()}}
                    <input type="hidden" id="id" name="id" value="">
                    <div class="modal-body">
                        <div class="form-group">
                            <label for="exampleInputFile">File input</label>
                            <div class="input-group">
                                <div class="custom-file">
                                    <input type="file" class="custom-file-input" id="edit-fileupload" name="upload" accept=".pdf, .zip">
                                    <label class="custom-file-label" for="exampleInputFile">Choose file</label>
                                </div>
                            </div>
                            <span style="color:red; font-size:14px;" id="tampil_alert_file" class="tampil_alert_file"></span>
                        </div>
                    </div>
                    <input type="hidden" id="type" value="" name="type">
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="submit" id="submit3" class="btn btn-primary">Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script>
        $(document).ready(function() {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $('body').on('click', '#close', function(event) {
                event.preventDefault()
                var text;

                text = ""
                document.getElementById("tampil_alert_file").innerHTML = text;
            });

            $("#fileupload").change(function() {
                var text;
                var inputFile = document.getElementById('fileupload');
                var pathFile = inputFile.value;
                var ekstensiOk = /(\.pdf|\.zip)$/i;
                if (!ekstensiOk.exec(pathFile)) {
                    text = 'Silakan upload file yang dengan ekstensi .pdf /.zip &nbsp;<i class="fas fa-exclamation-circle"></i>'
                    document.getElementById("tampil_alert_file").innerHTML = text;
                    inputFile.value = '';
                    return false;
                }
            })

            $('.delete-confirm').on('click', function(event) {
                event.preventDefault();
                var permohonan_id = document.getElementById('permohonan_id').value;
                var type = document.getElementById('type').value;
                var id = $(this).data('id');
                Swal.fire({
                    title: 'Apakah anda yakin?',
                    text: "Anda tidak akan dapat mengembalikan ini!",
                    icon: 'warning',
                    showCancelButton: true,
                    cancelButtonText: 'Tidak',
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Ya, hapus data!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        Swal.fire({
                        title: 'Menghapus Data',
                        html: 'Tunggu hingga proses hapus selesai.',
                        didOpen: () => {
                            Swal.showLoading()
                        }
                        })
                        $.ajax({
                            url: '/hapus-dokumen/' + id,
                            type: "POST",
                            dataType: 'json',
                            data: {
                                id: id,
                                type: type,
                                permohonan_id: permohonan_id
                            },
                            success: function(data) {
                                Swal.fire({
                                    title: 'Terhapus',
                                    text: 'Data Berhasil dihapus.',
                                    icon: 'success',
                                    confirmButtonColor: '#3085d6',
                                    confirmButtonText: 'OK'
                                }).then((result) => {
                                    if (result.isConfirmed) {
                                        window.location.reload(true);
                                    }
                                    Swal.close(window.location.reload(true));
                                })
                            }
                        });
                        
                    }
                })
            });

            $('body').on('click', '#submit', function(event) {
                event.preventDefault()
                let formData = new FormData();
                const fileupload = $('#fileupload').prop('files')[0];
                var type = document.getElementById("type").value;
                var permohonan_id = document.getElementById("permohonan_id").value;

                formData.append('type', type);
                formData.append('fileupload', fileupload);
                formData.append('permohonan_id', permohonan_id);

                if (fileupload != null) {
                    Swal.fire({
                    title: 'Mengirim Data',
                    html: 'Tunggu hingga proses kirim selesai.',
                    didOpen: () => {
                        Swal.showLoading()
                    }
                    })
                    $.ajax({
                        url: '/simpan-dokumen',
                        type: "POST",
                        enctype: 'multipart/form-data',
                        contentType: false,
                        processData: false,
                        data: formData,
                        dataType: 'json',
                        success: function(data) {
                            $('#usulan-data').trigger("reset");
                            $('#modal-default-usulan').modal('hide');
                            Swal.fire({
                                title: 'Tersimpan',
                                text: 'Data Berhasil disimpan.',
                                icon: 'success',
                                confirmButtonColor: '#3085d6',
                                confirmButtonText: 'OK'
                            }).then((result) => {
                                if (result.isConfirmed) {
                                    window.location.reload(true);
                                }
                                Swal.close(window.location.reload(true));
                            })
                        }
                    });
                } else {
                    text = 'File tidak boleh kosong &nbsp;<i class="fas fa-exclamation-circle"></i>'
                    document.getElementById("tampil_alert_file").innerHTML = text;
                }
            });

            //Update Status Permohonan
            $('body').on('click', '#submit2', function(event) {
                event.preventDefault()
                let formData = new FormData();
                var id = document.getElementById("id").value;
                var status;
                var catatan = document.getElementById("catatan").value;
                console.log(id)
                if ($('#StatusDocument1').is(":checked")) {
                    status = 0;
                } else if ($('#StatusDocument2').is(":checked")) {
                    status = 1;
                }else if ($('#StatusDocument3').is(":checked")) {
                    status = 2;
                }

                formData.append('id', id);
                formData.append('status', status);
                formData.append('catatan', catatan);
                $.ajax({
                    url: '/simpan-catatan-dokumen/',
                    type: "POST",
                    enctype: 'multipart/form-data',
                    contentType: false,
                    processData: false,
                    data: formData,
                    dataType: 'json',
                    success: function(data) {
                        $('#status_catatan_document').trigger("reset");
                        $('#status_catatan_document').modal('hide');
                        Swal.fire({
                            title: 'Tersimpan',
                            text: 'Data Berhasil disimpan.',
                            icon: 'success',
                            confirmButtonColor: '#3085d6',
                            confirmButtonText: 'OK'
                        }).then((result) => {
                            if (result.isConfirmed) {
                                window.location.reload(true);
                            }
                            Swal.close(window.location.reload(true));
                        })
                    }

                });
            });

            $("#edit-fileupload").change(function() {
            var text;
            var inputFile = document.getElementById('edit-fileupload');
            var pathFile = inputFile.value;
            var ekstensiOk = /(\.pdf|\.zip)$/i;
                if (!ekstensiOk.exec(pathFile)) {
                    text = 'Silakan upload file yang dengan ekstensi .pdf /.zip &nbsp;<i class="fas fa-exclamation-circle"></i>'
                    document.getElementById("tampil_alert_file").innerHTML = text;
                    inputFile.value = '';
                    return false;
                }
            })

            $('body').on('click', '#edit-file-dokumen', function(event) {
            event.preventDefault();
            let formData = new FormData();
            var id = $(this).data('id');
        
            $.get('/edit-dokumen/' + id, function(data) {
                $('#submit3').val("Edit category");
                $('#modal-edit-dokumen').modal('show');
                $('#id').val(data.data.id);
                $('#type').val(data.data.type);

            })

            $('body').on('click', '#submit3', function(event) {
                event.preventDefault()
                let formData = new FormData();

                var id = $("#id").val();
                const fileupload = $('#edit-fileupload').prop('files')[0];
                var type= document.getElementById("type").value;
                
                formData.append('id', id);
                formData.append('type', type);
                formData.append('fileupload', fileupload);

                if (fileupload != null) {
                    Swal.fire({
                    title: 'Mengirim Data',
                    html: 'Tunggu hingga proses kirim selesai.',
                    didOpen: () => {
                        Swal.showLoading()
                    }
                    })
                    $.ajax({
                        url: '/simpan-edit-dokumen/' + id,
                        type: "POST",
                        enctype: 'multipart/form-data',
                        contentType: false,
                        processData: false,
                        data: formData,
                        dataType: 'json',
                        success: function(data) {
                            $('#form-edit-dokumen').trigger("reset");
                            $('#modal-edit-dokumen').modal('hide');
                            Swal.fire({
                                title: 'Tersimpan',
                                text: 'Data Berhasil disimpan.',
                                icon: 'success',
                                confirmButtonColor: '#3085d6',
                                confirmButtonText: 'OK'
                            }).then((result) => {
                                if (result.isConfirmed) {
                                    window.location.reload(true);
                                }
                                Swal.close(window.location.reload(true));
                            })
                        }
                    });
                } else {
                    text = 'File tidak boleh kosong &nbsp;<i class="fas fa-exclamation-circle"></i>'
                    document.getElementById("tampil_alert_file").innerHTML = text;
                }
            });
            });
        });
    </script>
</section>
@endif
@endsection