@extends('layouts.index')

@push('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;
    }

    .input_target{
        -moz-appearance: textfield;
        appearance: textfield;
    }

    .input_target::-webkit-outer-spin-button,
    .input_target::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
    }

    .hover-container {
        position: relative;
    }

    .hover-text {
        display: none;
        position: absolute;
        background-color: #f0f0f0;
        border-radius: 5px;
        padding: 8px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
        z-index: 1;
    }

    #star-icon:hover + .hover-text {
        display: block;
    }


</style>
@endpush

@section('content')

<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">
                        <h4 class="mb-0 font-size-18">{{ $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-lg-12">
                    <div class="card">
                        <!-- Card body -->
                        <div class="card-body">
                            <div class="d-flex justify-content-between w-100 align-items-center">
                                <form method="GET" class="d-flex w-100">
                                    <select name="pd" id="" class="form-control w-100 mx-1 select-opd">
                                        <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>
                                    {{-- <select name="tahun" id="" class="form-control w-100 mx-1">
                                        <option value="{{ date('Y') - 1 }}" @if( $request->get('tahun') == date('Y') - 1 ) SELECTED @endif >{{ date('Y') - 1 }}</option>

                                        <option value="{{ date('Y') }}" @if( $request->get('tahun') == date('Y') ) SELECTED @endif @if($request->get('tahun') == NULL) SELECTED @endif >{{ date('Y') }}</option>

                                        <option value="{{ date('Y') + 1 }}"  @if( $request->get('tahun') == date('Y') + 1 ) SELECTED @endif >{{ date('Y') + 1 }}</option>
                                    </select> --}}
                                    <button type="submit" class="btn btn-warning mx-3">filter</button>
                                </form>
                                <div>
                                    <div class="icon d-flex w-100">
                                        <div class="d-flex align-items-center w-100 justify-content-around">
                                            {{-- <a href="" class="btn btn-danger mx-3"><i class="fa fa-print"></i></a>
                                            <a href="" class="btn btn-success"><i class="fa fa-file"></i></a> --}}
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="text-center d-flex flex-column justify-content-center w-100 align-items-around"
                                style="display: block">
                                <table class="my-5">
                                    <thead>
                                        <tr class="text-center biasa">
                                            <th style="background: rgb(220, 218, 218)" rowspan="2">No</th>
                                            <th style="background: rgb(220, 218, 218)" rowspan="2">Perangkat Daerah</th>
                                            <th style="background: rgb(220, 218, 218)">Total Anggaran</th>
                                        </tr>
                                        <tr class="biasa">
                                            <th style="background: rgb(220, 218, 218)">Pagu</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr class="biasa">
                                            <td>{{$proker->count() > 0?'1':'-'}}</td>
                                            <td>{{$proker->count() > 0?$proker->first()->Opd->nama_perangkat_daerah:'-'}}</td>
                                            <td class="text-nowrap">
                                                {{-- {{$proker->count() > 0?'Rp'.number_format($proker->first()->Opd->PaguByYear , 0, ',', '.'):'-'}} --}}
                                                {{$proker->count() > 0?'Rp'.number_format($proker->first()->Opd->anggaran , 0, ',', '.'):'-'}}
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <div class="card">
                        <!-- Card body -->
                        <div class="card-body">
                            <div class="row">
                                <div class="col-7">
                                    <h3 class="mb-0">Data {{$title}}</h3>
                                </div>
                                {{-- <div class="col-2">
                                    <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> --}}
                                    @if($request->get('pd'))
                                    <div class="col-5 text-end">
                                       {{--  <a href="{{route('realisasi.import')}}" class="btn btn-danger mx-3"><i class="fa fa-file"></i>  Unggah Data</a> --}}
                                       @role('admin') 
                                       <button type="button" class="btn btn-primary" data-toggle="modal"
                                            data-target="#tambahProgram">
                                            <i class="fa fa-plus"></i> Tambah Program
                                        </button>
                                        @endrole
                                    </div>
                                    @endif
                                </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></th>
                                            <th>No</th>
                                            <th style="width: 10%">Kode</th>
                                            <th>Program/Kegiatan/Sub Kegiatan</th>
                                            <th>Anggaran</th>
                                            <th>OPD</th>
                                            <th>Bagian/Bidang/Kelurahan/UPT</th>
                                            <th>PA/KPA</th>
                                            <th>PPTK</th>
                                            <th>Aksi</th>
                                        </tr>
                                    </thead>
                                    <tbody>

                                        {{-- Proker --}}
                                        @forelse ($proker as $pr)
                                        {{-- Proker Program --}}
                                        @foreach ($pr->ProkerProgram as $pm)
                                        <tr class="table-primary">
                                            <td>
                                                <button type="button" url="{{ route('get.proker.kegiatan',$pm->id) }}" class="btn btn-sm btn-primary sub btn-program" id="{{ $pm->id }}"
                                                    data-toggle="collapse" data-target=".program_{{ $pm->id }}">
                                                    <i class="fa fa-arrow-down text-white"></i> </button>
                                            </td>
                                            <td>{{ $loop->iteration }}</td>
                                            <td>{{ $pm->program->kode }}</td>
                                            <td>{{ $pm->program->nama_program }}</td>
                                            <td class="text-nowrap text-end">Rp{{ number_format($pm->anggaran , 0, ',', '.') }}</td>
                                            <td>{{ $pr->opd->nama_perangkat_daerah }}</td>
                                            <td></td>
                                            <td></td>
                                            <td></td>
                                            <td class="nowrap">
                                                @role('admin|user-opd')
                                                <button type="button"
                                                    class="btn btn-sm btn-primary tombolTambahKegiatan"
                                                    data-proker-program-id="{{ $pm->id }}" data-toggle="modal"
                                                    data-target="#tambahKegiatan"> <i class="fa fa-plus text-white"></i>
                                                    Sub </button>
                                                <button type="button" class="btn btn-sm btn-warning tombolEditProgram"
                                                    data-proker-program-id="{{ $pm->id }}"
                                                    data-program-id="{{ $pm->id }}"> <i
                                                        class="fa fa-edit text-white"></i> </button>
                                                        <button type="button" class="btn btn-sm btn-danger tombolHapusProgram"
                                                        data-proker-program-id="{{ $pm->id }}"> <i
                                                        class="fa fa-trash text-white"></i> </button>
                                                @endrole
                                            </td>
                                        </tr>
                                        <tr class="table-warning collapse program_{{ $pm->id }} view_kegiatan_{{ $pm->id }}">
                                            <td colspan="10">
                                                <div align="center">
                                                    Memproses...
                                                </div>
                                            </td>
                                        </tr>

                                        {{-- Proker Kegiatan --}}
                                        {{-- @foreach ($pm->ProkerKegiatan as $kn)
                                        <tr class="table-warning collapse program_{{ $pm->program_id }}">
                                            <td></td>
                                            <td></td>
                                            <td>{{ $kn->kegiatan->kode }}</td>
                                            <td>{{ $kn->kegiatan->nama_kegiatan }}</td>
                                            <td>Rp{{ number_format($kn->anggaran) }}</td>
                                            <td></td>
                                            <td></td>
                                            <td></td>
                                            <td></td>
                                            <td class="nowrap">
                                                <button type="button"
                                                    class="btn btn-sm btn-primary tombolTambahSubKegiatan"
                                                    data-proker-kegiatan-id="{{ $kn->id }}" data-toggle="modal"
                                                    data-target="#tambahSubKegiatan"> <i
                                                        class="fa fa-plus text-white"></i> Sub </button>
                                                @role('admin|admin-opd')
                                                <button class="btn btn-sm btn-warning tombolEditKegiatan"
                                                    data-proker-kegiatan-id="{{ $kn->id }}"
                                                    data-kegiatan-id="{{ $kn->kegiatan_id }}"> <i
                                                        class="fa fa-edit text-white"></i> </button>
                                                @endrole
                                                <button class="btn btn-sm btn-danger tombolHapusKegiatan"
                                                    data-proker-kegiatan-id="{{ $kn->id }}"> <i
                                                        class="fa fa-trash text-white"></i> </button>
                                            </td>
                                        </tr> --}}

                                        {{-- Proker Sub Kegiatan --}}
                                        {{-- @foreach ($kn->ProkerSubKegiatan as $sk)
                                        <tr class="collapse program_{{ $pm->program_id }}">
                                            <td></td>
                                            <td></td>
                                            <td>{{ $sk->subKegiatan->kode }}</td>
                                            <td>{{ $sk->subKegiatan->nama_sub_kegiatan }}</td>
                                            <td>Rp{{ number_format($sk->anggaran) }}</td>
                                            <td></td>
                                            <td>{{ $sk->bagian }}</td>
                                            <td>{{ $sk->kpa->nama??'-' }}</td>
                                            <td> {{ $sk->pptk->nama }}</td>
                                            <td class="nowrap">
                                                <a href="{{ route('proker.show', $sk->id) }}" target="_blank"
                                                    class="btn btn-sm btn-primary"> <i class="fa fa-eye text-white"></i>
                                                </a>
                                                <button class="btn btn-sm btn-warning tombolEditSubKegiatan"
                                                    data-proker-sub-kegiatan-id="{{ $sk->id }}"
                                                    data-sub-kegiatan-id="{{ $sk->sub_kegiatan_id }}"
                                                    data-kpa-id="{{ $sk->kpa_id }}" data-pptk-id="{{ $sk->user_id }}"
                                                    data-sumber-dana-id="{{ $sk->sumber_dana_id }}"
                                                    data-bagian-id="{{ $sk->bagian }}"> <i
                                                        class="fa fa-edit text-white"></i> </button>
                                                <button class="btn btn-sm btn-danger tombolHapusSubKegiatan"
                                                    data-proker-sub-kegiatan-id="{{ $sk->id }}"> <i
                                                        class="fa fa-trash text-white"></i> </button>
                                            </td>
                                        </tr>
                                        @endforeach --}}
                                        {{-- Akhir Proker Sub Kegiatan --}}

                                        {{-- @endforeach --}}
                                        {{-- Akhir Proker Kegiatan --}}

                                        @endforeach
                                        {{-- Akhir Proker Program --}}
                                        @empty
                                        <tr>
                                            <td class="text-center" colspan="10">
                                                {{ $request->get('pd') == null ? "Mohon Pilih OPD Terlebih Dahulu" : 'Tidak Ada Data' }}
                                            </td>
                                        </tr>
                                        @endforelse
                                        {{-- Akhir Proker --}}

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

<!-- Modal Tambah Program -->
<div class="modal fade" id="tambahProgram" data-bs-backdrop="static" data-bs-keyboard="false"
    aria-labelledby="tambahProgramLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <form action="{{ route('proker.tambahProgram') }}" method="POST">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="tambahProgramLabel">Tambah Program</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" class="form-control" name="tahun" readonly
                                value="{{ $request->get('tahun') }}" required>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="opd_id"> OPD (Perangkat Daerah) <i
                                        class="text-danger">*</i> </label>
                                <input type="hidden" class="form-control" name="opd_id" readonly
                                    value="{{ $request->get('pd') }}" required>
                                <input type="text" class="form-control" name="nama_opd" readonly
                                    value="{{ @\Helper::getOpd($request->get('pd'))->nama_perangkat_daerah }}" required>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="program_id"> Tambah Program <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="program_id" required="required" style="width: 100%">
                                    <option value="">Cari Program (Kode/Nama Program)</option>
                                    @foreach($program as $data)
                                    <option value="{{$data->id}}">[{{$data->kode}}] {{$data->nama_program}}</option>
                                    @endforeach
                                </select>
                            </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">Simpan</button>
                </div>
        </form>
    </div>
</div>
</div>

<!-- Modal Edit Program -->
<div class="modal fade" id="editProgram" data-bs-backdrop="static" data-bs-keyboard="false"
    aria-labelledby="editProgramLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <form action="!#" method="POST">
            @csrf
            {{ method_field('PUT') }}
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="editProgramLabel">Edit Program</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" class="form-control" name="tahun" readonly
                                value="{{ $request->get('tahun') }}" required>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="opd_id"> OPD (Perangkat Daerah) <i
                                        class="text-danger">*</i> </label>
                                <input type="hidden" class="form-control" name="opd_id" readonly
                                    value="{{ $request->get('pd') }}" required>
                                <input type="text" class="form-control" name="nama_opd" readonly
                                    value="{{ @\Helper::getOpd($request->get('pd'))->nama_perangkat_daerah }}" required>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="program_id"> Edit Program <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="program_id" required="required" style="width: 100%">
                                    <option value="">Cari Program (Kode/Nama Program)</option>
                                    @foreach($program as $data)
                                    <option value="{{$data->id}}">[{{$data->kode}}] {{$data->nama_program}}</option>
                                    @endforeach
                                </select>
                            </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">Simpan</button>
                </div>
        </form>
    </div>
</div>
</div>

<!-- Modal Tambah Kegiatan -->
<div class="modal fade" id="tambahKegiatan" data-bs-backdrop="static" data-bs-keyboard="false"
    aria-labelledby="tambahKegiatanLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <form action="{{ route('proker.tambahKegiatan') }}" method="POST">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="tambahKegiatanLabel">Kegiatan</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" class="form-control" name="proker_program_id" readonly value=""
                                required>
                            <input type="hidden" class="form-control" name="tahun" readonly
                                value="{{ $request->get('tahun') }}" required>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="opd_id"> OPD (Perangkat Daerah) <i
                                        class="text-danger">*</i> </label>
                                <input type="hidden" class="form-control" name="opd_id" readonly
                                    value="{{ $request->get('pd') }}" required>
                                <input type="text" class="form-control" name="nama_opd" readonly
                                    value="{{ @\Helper::getOpd($request->get('pd'))->nama_perangkat_daerah }}" required>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="kegiatan_id"> Kegiatan <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="kegiatan_id" required="required" style="width: 100%">
                                    <option value="">Cari Kegiatan (Kode/Nama Kegiatan)</option>
                                    @foreach($kegiatan as $data)
                                    <option value="{{$data->id}}">[{{$data->kode}}] {{$data->nama_kegiatan}}</option>
                                    @endforeach
                                </select>
                            </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">Simpan</button>
                </div>
        </form>
    </div>
</div>
</div>

<!-- Modal Edit Kegiatan -->
<div class="modal fade" id="editKegiatan" data-bs-backdrop="static" data-bs-keyboard="false"
    aria-labelledby="editKegiatanLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <form action="!#" method="POST">
            @csrf
            {{ method_field('PUT') }}
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="editKegiatanLabel">Kegiatan</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" class="form-control" name="proker_program_id" readonly value=""
                                required>
                            <input type="hidden" class="form-control" name="tahun" readonly
                                value="{{ $request->get('tahun') }}" required>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="opd_id"> OPD (Perangkat Daerah) <i
                                        class="text-danger">*</i> </label>
                                <input type="hidden" class="form-control" name="opd_id" readonly
                                    value="{{ $request->get('pd') }}" required>
                                <input type="text" class="form-control" name="nama_opd" readonly
                                    value="{{ @\Helper::getOpd($request->get('pd'))->nama_perangkat_daerah }}" required>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="kegiatan_id"> Kegiatan <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="kegiatan_id" required="required" style="width: 100%">
                                    <option value="">Cari Kegiatan (Kode/Nama Kegiatan)</option>
                                    @foreach($kegiatan as $data)
                                    <option value="{{$data->id}}">[{{$data->kode}}] {{$data->nama_kegiatan}}</option>
                                    @endforeach
                                </select>
                            </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">Simpan</button>
                </div>
        </form>
    </div>
</div>
</div>

<!-- Modal Tambah Sub Kegiatan -->
<div class="modal fade" id="tambahSubKegiatan" data-bs-backdrop="static" data-bs-keyboard="false"
    aria-labelledby="tambahSubKegiatanLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <form action="{{ route('proker.tambahSubKegiatan') }}" method="POST">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="tambahSubKegiatanLabel">Sub Kegiatan</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" class="form-control" name="proker_kegiatan_id" readonly value=""
                                required>
                            <input type="hidden" class="form-control" name="tahun" readonly
                                value="{{ $request->get('tahun') }}" required>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="opd_id"> OPD (Perangkat Daerah) <i
                                        class="text-danger">*</i> </label>
                                <input type="hidden" class="form-control" name="opd_id" readonly
                                    value="{{ $request->get('pd') }}" required>
                                <input type="text" class="form-control" name="nama_opd" readonly
                                    value="{{ @\Helper::getOpd($request->get('pd'))->nama_perangkat_daerah }}" required>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="kpa_id"> PA / KPA <i class="text-danger">*</i>
                                </label>
                                <select class="form-control select2" data-toggle="select" name="kpa_id" required="required" style="width: 100%">
                                    <option value="">Pilih PA / KPA</option>
                                    @foreach($kpa as $data)
                                    <option value="{{$data->id}}">{{$data->nama}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="pptk"> PPTK <i class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="pptk_id" required="required" style="width: 100%">
                                    <option value="">Pilih PPTK</option>
                                    @foreach($pptk as $data)
                                    <option value="{{$data->id}}">{{$data->nama}}</option>
                                    @endforeach
                                </select>
                            </div>
                            {{-- <div class="form-group my-3">
                                <label class="form-control-label" for="sumber_dana"> Sumber Dana <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="sumber_dana_id" required="required">
                                    <option value="">Pilih Sumber Dana</option>
                                    @foreach($sumber_dana as $data)
                                    <option value="{{$data->id}}">{{$data->sumber_dana}}</option>
                                    @endforeach
                                </select>
                            </div> --}}
                            <div class="form-group my-3">
                                <label class="form-control-label" for="bagian"> Bagian/Bidang/Kelurahan/UPT <i
                                        class="text-danger">*</i> </label>
                                <input type="text" class="form-control" name="bagian" required
                                    placeholder="Bagian/Bidang/Kelurahan/UPT">
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="sub_kegiatan_id"> Sub Kegiatan <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="sub_kegiatan_id" required="required" style="width: 100%">
                                    <option value="">Cari Sub Kegiatan (Kode/Nama Sub Kegiatan)</option>
                                    @foreach($sub_kegiatan as $data)
                                    <option value="{{$data->id}}">[{{$data->kode}}] {{$data->nama_sub_kegiatan}}
                                    </option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="batas_anggaran"> Batas Anggaran <i
                                        class="text-danger">*</i> </label>
                                <input type="text" class="form-control money" name="batas_anggaran" required
                                    placeholder="Batas Anggaran">
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="sub unggulan"> {{ $kategori }} <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control" data-toggle="select" name="program_unggulan" required="required" style="width: 100%">
                                    <option value="null">Tidak</option>
                                    @foreach ($program_unggulans as $program_unggulan)
                                        <option value="{{ $program_unggulan->id }}">{{ $program_unggulan->nama }}</option>
                                    @endforeach
                                </select>
                            </div>
                            {{-- <div class="form-group my-3">
                                <label class="form-label">Target Fisik (%) <i
                                    class="text-danger">min: 1 , max: 100 *</i></label>
                                <table>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_1" required placeholder="Jan" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_2" required placeholder="Feb" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_3" required placeholder="Mar" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_4" required placeholder="Apr" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_5" required placeholder="Mei" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_6" required placeholder="Jun" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_7" required placeholder="Jul" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_8" required placeholder="Ags" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_9" required placeholder="Sep" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_10" required placeholder="Okt" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_11" required placeholder="Nov" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_12" required placeholder="Des" step="any" min="1" max="100">
                                    </td>
                                </table>
                            </div>

                            <div class="form-group my-3">
                                <label class="form-label">Target Keuangan (%) <i
                                    class="text-danger">min: 1 , max: 100 *</i></label>
                                <table>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_1" required placeholder="Jan" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_2" required placeholder="Feb" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_3" required placeholder="Mar" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_4" required placeholder="Apr" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_5" required placeholder="Mei" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_6" required placeholder="Jun" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_7" required placeholder="Jul" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_8" required placeholder="Ags" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_9" required placeholder="Sep" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_10" required placeholder="Okt" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_11" required placeholder="Nov" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_12" required placeholder="Des" step="any" min="1" max="100">
                                    </td>
                                </table>
                            </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">Simpan</button>
                </div>
        </form>
    </div>
</div>
</div>


<!-- Modal edit Sub Kegiatan -->
<div class="modal fade" id="editSubKegiatan" data-bs-backdrop="static" data-bs-keyboard="false"
    aria-labelledby="editSubKegiatanLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <form action="!#" method="POST">
            @csrf
            {{ method_field("PUT") }}
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="editSubKegiatanLabel">Sub Kegiatan</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" class="form-control" name="proker_kegiatan_id" readonly value=""
                                required>
                            <input type="hidden" class="form-control" name="tahun" readonly
                                value="{{ $request->get('tahun') }}" required>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="opd_id"> OPD (Perangkat Daerah) <i
                                        class="text-danger">*</i> </label>
                                <input type="hidden" class="form-control" name="opd_id" readonly
                                    value="{{ $request->get('pd') }}" required>
                                <input type="text" class="form-control" name="nama_opd" readonly
                                    value="{{ @\Helper::getOpd($request->get('pd'))->nama_perangkat_daerah }}" required>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="kpa_id"> PA / KPA <i class="text-danger">*</i>
                                </label>
                                <select class="form-control select2" data-toggle="select" name="kpa_id" required="required" style="width: 100%">
                                    <option value="">Pilih PA / KPA</option>
                                    @foreach($kpa as $data)
                                    <option value="{{$data->id}}">{{$data->nama}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="pptk"> PPTK <i class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="pptk_id" required="required" style="width: 100%">
                                    <option value="">Pilih PPTK</option>
                                    @foreach($pptk as $data)
                                    <option value="{{$data->id}}">{{$data->nama}}</option>
                                    @endforeach
                                </select>
                            </div>
                            {{-- <div class="form-group my-3">
                                <label class="form-control-label" for="sumber_dana"> Sumber Dana <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="sumber_dana_id" required="required">
                                    <option value="">Pilih Sumber Dana</option>
                                    @foreach($sumber_dana as $data)
                                    <option value="{{$data->id}}">{{$data->sumber_dana}}</option>
                                    @endforeach
                                </select>
                            </div> --}}
                            <div class="form-group my-3">
                                <label class="form-control-label" for="bagian"> Bagian/Bidang/Kelurahan/UPT <i
                                        class="text-danger">*</i> </label>
                                <input type="text" class="form-control" name="bagian" required
                                    placeholder="Bagian/Bidang/Kelurahan/UPT">
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="sub_kegiatan_id"> Sub Kegiatan <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control select2" data-toggle="select" name="sub_kegiatan_id" required="required" style="width: 100%" @role('admin-opd') data-readonly="true" @endrole>
                                    <option value="">Cari Sub Kegiatan (Kode/Nama Sub Kegiatan)</option>
                                    @foreach($sub_kegiatan as $data)
                                    <option value="{{$data->id}}">[{{$data->kode}}] {{$data->nama_sub_kegiatan}}
                                    </option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="form-group my-3">
                                <label class="form-control-label" for="batas_anggaran"> Batas Anggaran <i
                                        class="text-danger">*</i> </label>
                                <input type="text" class="form-control money" name="batas_anggaran" required
                                    placeholder="Batas Anggaran" @role('admin-opd') readonly @endrole>
                            </div>

                            <div class="form-group my-3">
                                <label class="form-control-label" for="sub unggulan"> {{ $kategori }} <i
                                        class="text-danger">*</i> </label>
                                <select class="form-control" data-toggle="select" name="program_unggulan" required="required" style="width: 100%" @role('admin-opd') disabled @endrole>
                                    <option value="null">Tidak</option>
                                    @foreach ($program_unggulans as $program_unggulan)
                                        <option value="{{ $program_unggulan->id }}">{{ $program_unggulan->nama }}</option>
                                    @endforeach
                                </select>
                            </div>

                            {{-- <div class="form-group my-3">
                                <label class="form-label">Target Fisik (%) <i
                                    class="text-danger">min: 1 , max: 100 *</i></label>
                                <table>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_1" required placeholder="Jan" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_2" required placeholder="Feb" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_3" required placeholder="Mar" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_4" required placeholder="Apr" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_5" required placeholder="Mei" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_6" required placeholder="Jun" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_7" required placeholder="Jul" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_8" required placeholder="Ags" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_9" required placeholder="Sep" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_10" required placeholder="Okt" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_11" required placeholder="Nov" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_fisik_12" required placeholder="Des" step="any" min="1" max="100">
                                    </td>
                                </table>
                            </div>

                            <div class="form-group my-3">
                                <label class="form-label">Target Keuangan (%) <i
                                    class="text-danger">min: 1 , max: 100 *</i></label>
                                <table>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_1" required placeholder="Jan" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_2" required placeholder="Feb" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_3" required placeholder="Mar" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_4" required placeholder="Apr" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_5" required placeholder="Mei" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_6" required placeholder="Jun" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_7" required placeholder="Jul" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_8" required placeholder="Ags" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_9" required placeholder="Sep" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_10" required placeholder="Okt" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_11" required placeholder="Nov" step="any" min="1" max="100">
                                    </td>
                                    <td>
                                        <input type="number" class="form-control input_target" name="target_keuangan_12" required placeholder="Des" step="any" min="1" max="100">
                                    </td>
                                </table>
                            </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">Simpan</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="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/jquery.mask/1.13.4/jquery.mask.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>
    document.addEventListener('DOMContentLoaded', function () {
        var inputs = document.querySelectorAll('input[name^="target_fisik_"]');
        
        inputs.forEach(function (input, index) {
            input.addEventListener('change', function () {
                // Mengambil nilai input saat ini
                var currentValue = parseFloat(input.value);

                // Mengambil nilai input bulan sebelumnya
                var previousInput = index > 0 ? inputs[index - 1] : null;
                var previousValue = previousInput ? parseFloat(previousInput.value) : 0;

                // Validasi: nilai saat ini tidak boleh kurang dari nilai bulan sebelumnya
                if (currentValue < previousValue) {
                    alert('Nilai tidak boleh kurang dari bulan sebelumnya!');
                    input.value = previousValue; // Mengembalikan nilai menjadi nilai bulan sebelumnya
                }
            });
        });
    });
</script>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        var inputs = document.querySelectorAll('input[name^="target_keuangan_"]');
        
        inputs.forEach(function (input, index) {
            input.addEventListener('change', function () {
                // Mengambil nilai input saat ini
                var currentValue = parseFloat(input.value);

                // Mengambil nilai input bulan sebelumnya
                var previousInput = index > 0 ? inputs[index - 1] : null;
                var previousValue = previousInput ? parseFloat(previousInput.value) : 0;

                // Validasi: nilai saat ini tidak boleh kurang dari nilai bulan sebelumnya
                if (currentValue < previousValue) {
                    alert('Nilai tidak boleh kurang dari bulan sebelumnya!');
                    input.value = previousValue; // Mengembalikan nilai menjadi nilai bulan sebelumnya
                }
            });
        });
    });
</script>

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

    $(document).ready(function () {
        // Inisialisasi Select2
        $('.select2').select2();

        // Periksa atribut data-readonly untuk menonaktifkan Select2
        $('.select2').each(function () {
            if ($(this).data('readonly') === true) {
                $(this).prop('disabled', true); // Nonaktifkan elemen <select>
                $(this).select2({ disabled: true }); // Nonaktifkan Select2
            }
        });
    });


    $('.money').mask("#,##0",{
        reverse: true
    });

    $('body').on('click','.btn-program',function(){
        var ini  = $(this);
        var loc = '.view_kegiatan_'+ini.attr('id');
        var progEl = $(".program_"+ini.attr('id'));
        var check = [];
        $.each(progEl,function(index){
            check.push(index);
        });
        if(check.length < 2){
            $.ajax({
                url: ini.attr('url'),
                method: "POST",
                dataType: 'json',
                data: {_token: "{{ csrf_token() }}"},
            }).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 = [];
        $.each(progEl,function(index){
            check.push(index);
        });
        if(check.length < 2){
            $.ajax({
                url: ini.attr('url'),
                method: "POST",
                dataType: 'json',
                data: {_token: "{{ csrf_token() }}"},
            }).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>');
            });
        }
    });
</script>
<script>
    $(document).ready(function () {
        // $.each($(".select2-container"), function (i, v) {
        //     $(v).attr("style", "width:100%;")
        // });

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

        $("body").on('click','.tombolTambahSubKegiatan',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)
        });

        $("body").on('click','.tombolEditKegiatan',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)
        });


        $("body").on('click','.tombolEditSubKegiatan',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')
            let batas_anggaran = $(this).attr('data-batas-anggaran');
            let program_unggulan = $(this).attr('data-program-unggulan');
            var route = '{{ route("proker.editSubKegiatan", ":id") }}';
            route = route.replace(':id', prokerSubKegiatanId);

            if (program_unggulan == null || program_unggulan == "") {
                program_unggulan = "null";
            }

            batas_anggaran = parseFloat(batas_anggaran.replace(/,/g, '')); 
            let formattedBatasAnggaran = batas_anggaran.toLocaleString('en-US'); 

            $('#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('input[name="batas_anggaran"]').val(formattedBatasAnggaran)
            $('#editSubKegiatan').find('select[name="program_unggulan"]').val(program_unggulan).trigger(
                'change')
            $('#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();
                    },
                });
            }

        });

        $("body").on('click','.tombolHapusKegiatan',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();
                    },
                });
            }

        });


        $("body").on('click','.tombolHapusSubKegiatan',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