@extends('layouts.index')

@push('css')
<link rel="stylesheet" type="text/css" href="{{asset('assets/libs/bootstrap-datepicker/css/bootstrap-datepicker.min.css')}}">
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="{{asset('assets/css/custom.css')}}">
<style>
	tr.show {
		display: table-row !important;
	}
    table th{
        vertical-align: middle;
    }
</style>
@endpush

@section('content')

@include('layouts.include._breadcrumb')

<div class="page-content">
    <div class="container-fluid">

<!-- start page title -->
<div class="row">
    <div class="col-12">
        <div class="page-title-box d-flex align-items-center justify-content-between">
            <div class="page-title">
                <br>
                <br>
                <br>
                <h4 class="mb-0 font-size-18">Data {{ $title }}</h4>
                <ol class="breadcrumb">
                    <li class="breadcrumb-item active">Welcome to {{ env('APP_NAME') }}</li>
                </ol>
            </div>
        </div>
    </div>
</div>
<!-- end page title -->

<div class="page-content-wrapper">

    <div class="row">
        <div class="col">
            <div class="card">
                <div class="card-body">
                    <br>
                    <div class="d-flex justify-content-between w-100 align-items-center">
                        <form method="GET" class="d-flex w-100">
                            <div class="flex-grow-1">
                                <label class="form-label">Perangkat Daerah</label>
                                <select name="pd" id="" class="form-control select-opd mx-1 w-100">
                                    <option value="">Pilih Perangkat Daerah</option>
                                    @foreach ($opd as $item)
                                    <option value="{{ $item->id }}" @if($request->get('pd') == $item->id ) SELECTED @endif>{{ $item->nama_perangkat_daerah }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="mx-1">
                                <label for="tanggal_awal">Tanggal Awal</label>
                                <input type="text" value="{{ ($request->tanggal_awal) ? $request->tanggal_awal : '' }}" name="tanggal_awal" class="form-control tanggal_awal_akhir" autocomplete="off">
                            </div>
                            <div class="mx-1">
                                <label for="tanggal_akhir">Tanggal Akhir</label>
                                <input type="text" value="{{ ($request->tanggal_akhir) ? $request->tanggal_akhir : '' }}" name="tanggal_akhir" class="form-control tanggal_awal_akhir" autocomplete="off">
                            </div>
                            <div>
                                <button type="submit" class="btn btn-warning mt-4">Filter</button>
                            </div>
                            <div>
                                <a href="{{url('/review_pekerjaan')}}" class="btn btn-success mt-4" style="margin-left: 5px;">Reset</a>
                            </div>
                            @role('admin|admin-opd|monev')
                                <div>
                                    <button class="btn btn-success mt-4 mx-2" type="submit" name="printexcel" value="print" @if ($request->pd == null) disabled @endif> <img height="20px" src="{{ asset('excel-download-icon.png') }}" alt="dowload-to-excel" ></button>
                                </div> 
                            @endrole
                        </form>
                    </div>                    

                    <div class="text-center d-flex flex-column justify-content-center w-100 align-items-around table-responsive"style="display: block">
                        <table class="my-5">
                            <thead>
                                <tr class="text-center biasa">
                                    <th class="text-center align-middle p-3" style="background: rgb(220, 218, 218)" rowspan="2">
                                        <center><h5>No</h5></center>
                                    </th>
                                    <th class="text-center align-middle p-3" style="background: rgb(220, 218, 218)" rowspan="2"><center><h5>Perangkat Daerah</h5></center></th>
                                    <th class="text-center align-middle p-3" style="background: rgb(220, 218, 218)" rowspan="2"><center><h5>Total Anggaran Pagu</h5></center></th>
                                    <th class="text-center align-middle p-3" style="background: rgb(220, 218, 218)" colspan="3"><center><h5>Realisasi (%)</h5></center></th>
                                </tr>
                                <tr class="biasa">
                                    <th style="background: rgb(220, 218, 218)" class="p-3"><center><h5>Fisik</h5></center></th>
                                    <th style="background: rgb(220, 218, 218)" class="p-3"><center><h5>Keuangan Pembayaran</h5></center></th>
                                    <th style="background: rgb(220, 218, 218)" class="p-3"><center><h5>Keuangan Penyerapan</h5></center></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr class="biasa">
                                    <td class="p-3">{{$proker->count() > 0?'1':'-'}}</td>
                                    <td class="p-3">{{$proker->count() > 0?$proker->first()->Opd->nama_perangkat_daerah:'-'}}</td>
                                    <td class="p-3">
                                        {{$proker->count() > 0?'Rp'.number_format($proker->first()->anggaran , 0, ',', '.'):'-'}}
                                    </td>
                                    <td class="p-3">{{$proker->count() > 0? number_format($proker->first()->percentfisik/($proker->first()->anggaran > 0 ? $proker->first()->anggaran:1) , 2, ',', '.'):'0'}}%</td>
                                    <td class="p-3">{{$proker->count() > 0? number_format(($proker->first()->keuangan/($proker->first()->kontrak > 0 ? $proker->first()->kontrak + $proker->first()->pagubelumberjalan : 1))*100 , 2, ',', '.'):'0'}}%</td>
                                    {{-- <td>{{ $proker->first()->pagubelumberjalan }}</td> --}}
                                    {{-- <td class="p-3">{{$proker->first()->kontrak}}%</td> --}}
                                    <td class="p-3">{{$proker->count() > 0? number_format(($proker->first()->keuangan/($proker->first()->anggaran > 0 ? $proker->first()->anggaran:1))*100 , 2, ',', '.'):'0'}}%</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col">
            <div class="card">
                <div class="card-body">
                    <div class="card-title">
                        <div class="row">
                            <div class="col-6">
                                <h3 class="mb-0">Data {{$title}}</h3>
                            </div>
                             <div class="col-md-6">
                                <div style="float:right;">
                                    <div class="icon d-flex w-100">
                                        <div class="d-flex align-items-center w-100 justify-content-around">
                                           
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="table-responsive py-4">
                        <table class="table table-hover table-bordered sticky-header">
                            <thead style="background: rgb(220, 218, 218)">
                                <tr>
                                    <th rowspan="3"></th>
                                    <th rowspan="3">
                                        <center><h5>No</h5></center>
                                    </th>
                                    <th rowspan="3">
                                        <center><h5>Status</h5></center>
                                    </th>
                                    <th rowspan="3" style="min-width: 150px;">
                                        <center><h5>Kode</h5></center>
                                    </th>
                                    <th rowspan="3">
                                        <center><h5>Program/Kegiatan/Sub Kegiatan</h5></center>
                                    </th>
                                    <th rowspan="3"><center><h5>OPD</h5></center></th>
                                    <th rowspan="3"><center><h5>Bagian/Bidang/Kelurahan/UPT</h5></center></th>
                                    <th rowspan="3"><center><h5>PA/KPA</h5></center></th>
                                    <th rowspan="3"><center><h5>PPTK</h5></center></th>
                                    <th rowspan="3"><center><h5>Pagu</h5></center></th>
                                    <th rowspan="3"><center><h5>Pagu Kontrak</h5></center></th>
                                    <th rowspan="3"><center><h5>Nilai Kontrak</h5></center></th>
                                    <th colspan="4"><center><h5>Realisasi</h5></center></th>
                                    <th rowspan="3"><center><h5>Sisa Pagu Kontrak</h5></center></th>
                                    <th rowspan="3"><center><h5>Sisa Pagu</h5></center></th>
                                    <th rowspan="3"><center><h5>Metode</h5></center></th>
                                    <th rowspan="3"><center><h5>PDN</h5></center></th>
                                    <th rowspan="3"><center><h5>TKDN</h5></center></th>
                                    <th rowspan="3"><center><h5>Aksi</h5></center></th>
                                </tr>

                                <tr>
                                    <th><center><h5>Fisik</h5></center></th>
                                    <th colspan="3"><center><h5>Keuangan</h5></center></th>
                                </tr>

                                <tr>
                                    <th><center><h5>%</h5></center></th>
                                    <th><center><h5>RP</h5></center></th>
                                    <th><center><h5 class="text-nowrap">Pembayaran</h5></center></th>
                                    <th><center><h5 class="text-nowrap">Penyerapan</h5></center></th>
                                </tr>
                            </thead>
                            <tbody>

                                {{-- Proker --}}
                                @forelse ($proker as $pr)
                                        {{-- Proker Program --}}
                                        @foreach ($pr->ProkerProgram as $pm)
                                            <tr class="table-primary">
                                                <td>
                                                    <button url="{{ route('get.review_pekerjaan.kegiatan',$pm->id) }}" type="button" id="{{ $pm->id }}" class="btn btn-sm btn-primary btn-program sub" data-toggle="collapse" data-target=".program_{{ $pm->id }}" data-tglawal="{{ $request->tanggal_awal ?? '' }}" data-tglakhir="{{ $request->tanggal_akhir ?? '' }}"> <i class="fa fa-arrow-down text-white"></i> </button>
                                                </td>
                                                <td>{{ $loop->iteration }}</td>
                                                <td>
                                                    {{-- @if(($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1)) != 0 && (($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100) != 0 )
                                                        @if (($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1)) < (($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100))
                                                            Uang Muka Boleh Dibayarkan {{ number_format((($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100)-($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1)),2) }}%
                                                            Rp.{{ number_format($pm->anggaran*(number_format((($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100)-($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1)),20)/100)) }}
                                                        @else
                                                            Maksimal Dibayarkan {{ number_format((($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1))-(($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100)),2)}}%
                                                            Rp.{{ number_format($pm->anggaran*(number_format((($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1))-(($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100)),20))/100)}}
                                                        @endif
                                                    @elseif (($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1)) != 0)
                                                        Maksimal Dibayarkan {{ number_format($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1),2)}}%
                                                        Rp.{{ ($pm->anggaran*(number_format($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1),20)/100))}}
                                                    @elseif((($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100) != 0)
                                                        Uang Muka Boleh Dibayarkan {{number_format(($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100,2)}}%
                                                        Rp.{{($pm->anggaran*(number_format(($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100,20)/100))}}
                                                    @else
                                                        Belum Boleh Dibayarkan Karena Fisik dan Keuangan Masih Kosong !
                                                    @endif --}}
                                                </td>
                                                <td>{{ $pm->program->kode }}</td>
                                                <td>{{ $pm->program->nama_program }}</td>
                                                <td>{{ $pr->opd->nama_perangkat_daerah }}</td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td class="text-nowrap text-end">Rp{{ number_format($pm->anggaran , 0, ',', '.') }}</td>
                                                <td class="text-nowrap text-end">Rp{{ number_format($pm->paguberjalan , 0, ',', '.') }}</td>
                                                <td class="text-nowrap text-end">Rp{{number_format($pm->kontrak , 0, ',', '.')}}</td>
                                                <td class="text-center">{{ number_format($pm->percentfisik/($pm->anggaran > 0 ? $pm->anggaran:1),2, ',', '.')}}%</td>
                                                <td class="text-nowrap text-end">Rp{{number_format($pm->keuangan , 0, ',', '.')}}</td>
                                                <td class="text-center">{{number_format(($pm->keuangan/($pm->kontrak > 0 ?$pm->kontrak+$pm->pagubelumberjalan:1))*100,2, ',', '.')}}%</td>
                                                <td class="text-center">{{number_format(($pm->keuangan/($pm->anggaran > 0 ?$pm->anggaran:1))*100,2, ',', '.')}}%</td>
                                                <td class="text-nowrap text-end">Rp{{number_format($pm->paguberjalan - $pm->kontrak , 0, ',', '.')}}</td>
                                                <td class="text-nowrap text-end">Rp{{number_format($pm->anggaran - $pm->keuangan , 0, ',', '.')}}</td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                                <td></td>
                                            </tr>

                                        <tr class="table-warning collapse program_{{ $pm->id }} view_kegiatan_{{ $pm->id }}">
                                            <td colspan="20">
                                                <div align="center">
                                                    Memproses...
                                                </div>  
                                            </td>
                                        </tr>
                                        @endforeach
                                @empty
                                    <tr>
                                        <td class="text-center" colspan="20">{{ $request->get('pd') == null ? "Mohon Pilih OPD Terlebih Dahulu" : 'Tidak Ada Data' }}</td>
                                    </tr>
                                @endforelse

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
    </div>
</div>

<!-- Modal Cetak Pekerjaan -->
<div class="modal fade" id="modalprint" data-bs-backdrop="static" data-bs-keyboard="false"
    aria-labelledby="modalprintLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <form action="{{ route('review_pekerjaan.cetak') }}" id="cetak_laporan" method="POST">
            <input type="hidden" name="rincianIds" class="rincianIds">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="modalprintLabel">Cetak Review Pekerjaan</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">
                            <input type="hidden" name="rincianIds" id="rincianIds">
                            <input type="hidden" value="{{ ($request->tanggal_awal) ? $request->tanggal_awal : '' }}" name="tgl_awal" class="form-control tanggal_awal_akhir" autocomplete="off">
                            <input type="hidden" value="{{ ($request->tanggal_akhir) ? $request->tanggal_akhir : '' }}" name="tgl_akhir" class="form-control tanggal_awal_akhir" autocomplete="off">

                            <input type="hidden" class="form-control" name="opd_id" readonly value="{{ $request->get('pd') }}"
                                required>
                            <input type="hidden" class="form-control" name="nama_opd" readonly
                                value="{{ @\Helper::getOpd($request->get('pd'))->nama_perangkat_daerah }}" required>
                            <input type="hidden" class="form-control" name="tahun" readonly
                                value="{{ $request->get('tahun') }}" required>
                            <input type="hidden" class="form-control" name="sk_id" id="sub-kegiatan-id" 
                                value="" required>

                            <div class="form-group my-3 w-100">
                                <label class="form-control-label" for="nama"> Nama <i
                                        class="text-danger">*</i> </label>
                                <select name="id_pencetak" class="form-control select-opd select-pptk mx-1 w-100" style="width: 100%">
                                    <option value="">Pilih PPTK</option>
                                    @foreach ($pptk as $user)
                                        <option value="{{ $user->id }}" 
                                            @if ($user->id === Auth::user()->opd_id)
                                                selected
                                            @endif
                                        >{{ $user->nama }}</option>
                                    @endforeach
                                </select>
                            </div>

                            {{-- <div class="form-group my-3">
                                <label class="form-control-label" for="nama"> NIP <i
                                        class="text-danger">*</i> </label>
                                <input type="text" class="form-control" name="nip" id="" 
                                    required readonly>
                            </div> --}}

                        </div>

                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary" id="btn-cetak-laporan">Cetak</button>
                </div>
        </form>
    </div>
</div>
</div>

@endsection

@push('js')
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="{{asset('assets/libs/bootstrap-datepicker/js/bootstrap-datepicker.min.js')}}"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/floatthead/2.2.5/jquery.floatThead.min.js" integrity="sha512-131fDtJKn0jUOqN1sfcHkBZHRmTCP0gmcpztVNuE3M8toiuIv8V9I+tpL/1t3GFDBcigLyB2hWJ3ZNjYwEO4bg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<script>
    var $table = $('.sticky-header');
    $table.floatThead({
            top: 70,
            responsiveContainer: function($table){
            return $table.closest('.table-responsive');
        }
    });

    $('#vertical-menu-btn').on('click', function () {
        // Delay sedikit untuk memastikan animasi selesai (jika ada)
        setTimeout(function () {
            $table.floatThead('reflow'); // refresh posisi
        }); // sesuaikan delay-nya jika perlu
    });
</script>

<script type="text/javascript">
    $('.select-opd').select2({
    //    width:'100%',
    });

    $('.tanggal_awal_akhir').datepicker({
        format:'yyyy-mm-dd',
        autoclose:true,
    });

    $('body').on('click', ".tombolPrint", function() {
        let subkegiatanid = $(this).data('sub-kegiatan-id');
        $('#sub-kegiatan-id').val(subkegiatanid);
    });
    
    // $('body').on('click', "#btn-cetak-laporan", function() {
    //     console.log($('#sub-kegiatan-id').val());
    //     console.log('bisa');
    // });


    $('body').on('click','.btn-program',function(){
        var ini  = $(this);
        var loc = '.view_kegiatan_'+ini.attr('id');
        var progEl = $(".program_"+ini.attr('id'));
        var check = [];
        let tgl_awal = {!! json_encode($request->tanggal_awal ?? null) !!};
        let tgl_akhir = {!! json_encode($request->tanggal_akhir ?? null) !!};
        $.each(progEl,function(index){
            check.push(index);
        });
        if(check.length < 2){
            $.ajax({
                url: ini.attr('url'),
                method: "POST",
                dataType: 'json',
                data: {_token: "{{ csrf_token() }}",
                        tgl_awal: tgl_awal,
                        tgl_akhir: tgl_akhir},
            }).done(function(data){
                $(loc).replaceWith(data);
            }).fail(function(data){
                $(loc).replaceWith('<tr><td colspan="16"><div align="center">Terjadi kegagalan!</div></td></tr>');
            });
        }
    });

    $('body').on('click','.btn-kegiatan',function(){
        var ini  = $(this);
        var loc = '.view_subkegiatan_'+ini.attr('id');
        var progEl = $(".subkegiatan_"+ini.attr('id'));
        var check = [];
        let tgl_awal = {!! json_encode($request->tanggal_awal ?? null) !!};
        let tgl_akhir = {!! json_encode($request->tanggal_akhir ?? null) !!};
        $.each(progEl,function(index){
            check.push(index);
        });
        if(check.length < 2){
            $.ajax({
                url: ini.attr('url'),
                method: "POST",
                dataType: 'json',
                data: {_token: "{{ csrf_token() }}",
                        tgl_awal: tgl_awal,
                        tgl_akhir: tgl_akhir},
            }).done(function(data){
                if(data.length > 0){
                    $(loc).replaceWith (data);
                }else{
                    $(loc).find('div').html('Tidak ditemukan data!');
                }
            }).fail(function(data){
                $(loc).replaceWith('<tr><td colspan="16"><div align="center">Terjadi kegagalan!</div></td></tr>');
            });
        }
    });

    $('body').on('click','.btn-sub-kegiatan',function(){
        var ini  = $(this);
        var loc = '.view_realisasidetail_'+ini.attr('id');
        var progEl = $(".realisasidetail_"+ini.attr('id'));
        var check = [];
        let tgl_awal = {!! json_encode($request->tanggal_awal ?? null) !!};
        let tgl_akhir = {!! json_encode($request->tanggal_akhir ?? null) !!};
        // checkAllCheckboxes();
        const selectedIds = [];

        function checkAllCheckboxes() {
            const checkboxes = document.querySelectorAll('.check-rincian');            
            checkboxes.forEach(checkbox => {
                if (!checkbox.checked) {
                    checkbox.checked = true;
                    const id = $(checkbox).data('id');
                    selectedIds.push(id);
                }
            });
        }

        $.each(progEl,function(index){
            check.push(index);
        });

        if(check.length < 2){
            $.ajax({
                url: ini.attr('url'),
                method: "POST",
                dataType: 'json',
                data: {_token: "{{ csrf_token() }}",
                        tgl_awal: tgl_awal,
                        tgl_akhir: tgl_akhir},
            }).done(function(data){
                if(data.length > 0){
                    $(loc).replaceWith (data);
                    //checkAllCheckboxes();
                }else{
                    $(loc).find('div').html('Tidak ditemukan data!');
                }
            }).fail(function(data){
                $(loc).replaceWith('<tr><td colspan="16"><div align="center">Terjadi kegagalan!</div></td></tr>');
            });
        }

        $('body').on('change',"#check-rincian",function() {
            const id = $(this).data('id');
            if ($(this).prop('checked')) {
                selectedIds.push(id);
            } else {
                const index = selectedIds.indexOf(id);
                if (index !== -1) {
                    selectedIds.splice(index, 1);
                }
            }
            
        });

        $('body').on('click', ".tombolPrint", function() {
            var subKegiatanId = $(this).data('sub-kegiatan-id');
            var subKegiatanNama = $(this).data('sub-kegiatan-nama');
            // event.preventDefault();
            // console.log(subKegiatanId);
            // console.log(selectedIds);
            $('#rincianIds').val(JSON.stringify(selectedIds)); 
        });

        // $('body').on('click', ".tombolPrint", function() {
        //     event.preventDefault();
        //     let container = $(this).closest('.form-container'); // Find the closest container
        //     let subkegiatanId = $(this).data('sub-kegiatan-id');
        //     let subkegiatanNama = $(this).data('sub-kegiatan-nama');
        //     console.log(subkegiatanId);

        //     container.find('.rincian-ids-input').val(JSON.stringify(selectedIds)); // Update the specific rincianIds field within the container
        //     container.find("#sub-kegiatan-id").val(subkegiatanId);
        //     container.find("#sub-kegiatan-nama").val(subkegiatanNama);
            

        //     // Submit the form
        //     // container.find('form').submit();
        // });


    });

</script>
<script>

    $('.date').datepicker({
        format:'yyyy-mm-dd',
        autoclose:true,
    });

	$(document).ready(function () {
		// $.each($(".select2-container"), function (i, v) {
		// 	$(v).attr("style", "width:100%;")
		// });

		$(".tombolTambahKegiatan").click(function (e) {
			$('input[name="proker_program_id"]').val($(this).attr('data-proker-program-id'))
		});

		$(".tombolTambahSubKegiatan").click(function (e) {
			$('input[name="proker_kegiatan_id"]').val($(this).attr('data-proker-kegiatan-id'))
		});


		// Edit
		$(".tombolEditProgram").click(function (e) {
			let prokerProgramId = $(this).attr('data-proker-program-id')
			let programId = $(this).attr('data-program-id')
			var route = '{{ route("proker.editProgram", ":id") }}';
			route = route.replace(':id', prokerProgramId);

			$('#editProgram').modal('show');
			$('#editProgram').find('select[name="program_id"]').val(programId).trigger('change')
			$('#editProgram').find('form').attr('action', route)
		});

		$(".tombolEditKegiatan").click(function (e) {
			let prokerKegiatanId = $(this).attr('data-proker-kegiatan-id')
			let kegiatanId = $(this).attr('data-kegiatan-id')
			var route = '{{ route("proker.editKegiatan", ":id") }}';
			route = route.replace(':id', prokerKegiatanId);

			$('#editKegiatan').modal('show');
			$('#editKegiatan').find('select[name="kegiatan_id"]').val(kegiatanId).trigger('change')
			$('#editKegiatan').find('form').attr('action', route)
		});

		$(".tombolEditSubKegiatan").click(function (e) {
			let prokerSubKegiatanId = $(this).attr('data-proker-sub-kegiatan-id')
			let subKegiatanId = $(this).attr('data-sub-kegiatan-id')
			let kpaId = $(this).attr('data-kpa-id')
			let userId = $(this).attr('data-pptk-id')
			let sumberDanaId = $(this).attr('data-sumber-dana-id')
			let bagianId = $(this).attr('data-bagian-id')
			var route = '{{ route("proker.editSubKegiatan", ":id") }}';
			route = route.replace(':id', prokerSubKegiatanId);

			$('#editSubKegiatan').modal('show');
			$('#editSubKegiatan').find('select[name="sub_kegiatan_id"]').val(subKegiatanId).trigger('change')
			$('#editSubKegiatan').find('select[name="kpa_id"]').val(kpaId).trigger('change')
			$('#editSubKegiatan').find('select[name="pptk_id"]').val(userId).trigger('change')
			$('#editSubKegiatan').find('select[name="sumber_dana_id"]').val(sumberDanaId).trigger('change')
			$('#editSubKegiatan').find('input[name="bagian"]').val(bagianId)
			$('#editSubKegiatan').find('form').attr('action', route)
		});




		// Hapus
		$(".tombolHapusProgram").click(function (e) {
			var confirm = window.confirm("Apakah anda yakin ingin menghapus Program ini ?");
				if(confirm){
					let prokerProgramId = $(this).attr('data-proker-program-id')

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

					$.ajax({
							'type': 'DELETE',
							'url': `{{ url("proker/delete-program") }}/${prokerProgramId}`,
							'data': {
								'prokerProgramId': prokerProgramId,
								_token: '{!! csrf_token() !!}',
							},
							success: (res) => {
								alert(res.message)
								window.location.reload();
							},
					});
				}

		});

		$(".tombolHapusKegiatan").click(function (e) {
			var confirm = window.confirm("Apakah anda yakin ingin menghapus Kegiatan ini ?");
				if(confirm){
					let prokerKegiatanId = $(this).attr('data-proker-kegiatan-id')

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

					$.ajax({
							'type': 'DELETE',
							'url': `{{ url("proker/delete-kegiatan") }}/${prokerKegiatanId}`,
							'data': {
								'prokerKegiatanId': prokerKegiatanId,
								_token: '{!! csrf_token() !!}',
							},
							success: (res) => {
								alert(res.message)
								window.location.reload();
							},
					});
				}

		});


		$(".tombolHapusSubKegiatan").click(function (e) {
			var confirm = window.confirm("Apakah anda yakin ingin menghapus Sub Kegiatan ini ?");
				if(confirm){
					let prokerSubKegiatanId = $(this).attr('data-proker-sub-kegiatan-id')

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

					$.ajax({
							'type': 'DELETE',
							'url': `{{ url("proker/delete-sub-kegiatan") }}/${prokerSubKegiatanId}`,
							'data': {
								'prokerSubKegiatanId': prokerSubKegiatanId,
								_token: '{!! csrf_token() !!}',
							},
							success: (res) => {
								alert(res.message)
								window.location.reload();
							},
					});
				}

		});


		$("body").on('click','.sub',function(){
            if($(this).find('i').hasClass("fa-arrow-down")){
                $(this).find('i').removeClass('fa-arrow-down')
                $(this).find('i').addClass('fa-arrow-up')
            }else{
                $(this).find('i').removeClass('fa-arrow-up')
                $(this).find('i').addClass('fa-arrow-down')
            }
        });

	});
</script>
@endpush