@extends('layouts.index')

@push('css')
<style>
    .break-word {
        max-width: 200px !important;
        word-wrap: break-word !important;
        white-space: inherit !important;
    }

    .table-responsive {
        max-height: 800px !important;
        overflow-y: scroll;
    }

    td {
        vertical-align: middle !important;
        text-align: center !important;
    }

    th {
        vertical-align: middle !important;
        text-align: center !important;
    }

    table td {
        position: relative;
    }

    thead {
        position: sticky;
        top: -30px;
        z-index: 1;
    }

    .parent {
        background: greenyellow;
    }

    .child {
        background: bisque;
    }

    .pointer {
        cursor: pointer;
    }

    .table-bordered th,
    .table-bordered td {
        border: 1px solid #0A1D37 !important
    }

    .icon-shape i,
    .icon-shape svg {
        font-size: 28px !important;
    }

    .bg-kayu {
        background-image: url({{ asset('assets/img/bg-kayu.jpg')}});
    }

</style>
@endpush

@section('content')

@include('layouts.include._breadcrumb')

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

    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                    <form style="width: 100%;" method="GET">
                        <div class="form-group">
                            <div class="row">

                                <div class="col-md-3">
                                    <label for="pd" class="form-control-label">Pilih Kecamatan : </label>
                                    <select name="pd" class="form-control select2" id="perangkat_daerah_id"
                                        data-toggle="select">
                                        <option value="">Pilih Kecamatan</option>
                                        @foreach ($perangkatDaerah as $item)
                                        <option value="{{ $item->id }}" @if($request->get('pd') == $item->id ) SELECTED
                                            @endif>{{ $item->nama_perangkat_daerah }}</option>
                                        @endforeach
                                    </select>
                                </div>

                                <div class="col-md-3">
                                    <label for="kelurahan_id" class="form-control-label">Pilih Kelurahan : </label>
                                    <select name="kelurahan_id" class="form-control select2" id="kelurahan_id"
                                        data-toggle="select">
                                        @if($request->get('pd'))
                                        <option value="">Pilih Kelurahan</option>
                                        @foreach(\Helper::findKelurahanByKecamatanId($request->get('pd')) as $data)
                                        <option value="{{$data->id}}" @if($request->get('kelurahan_id') == $data->id )
                                            SELECTED @endif >{{$data->nama_kelurahan}}</option>
                                        @endforeach
                                        @else
                                        <option value="">Pilih Kecamatan Terlebih dahulu</option>
                                        @endif
                                    </select>
                                </div>
                                
                                <div class="col-md-3">
                                    <label for="rt" class="form-control-label">Pilih RT : </label>
                                    <select name="rt" class="form-control select2" id="rt"
                                        data-toggle="select">
                                        @if($request->get('kelurahan_id'))
                                        <option value="">Pilih RT</option>
                                        @foreach(\Helper::findRtByKelurahanId($request->get('kelurahan_id')) as $data)
                                        <option value="{{$data->no_rt}}" @if($request->get('rt') == $data->no_rt ) SELECTED @endif >{{$data->no_rt}}</option>
                                        @endforeach
                                        @else
                                        <option value="">Pilih Kelurahan Terlebih dahulu</option>
                                        @endif
                                    </select>
                                </div>

                                <div class="col-md-3">
                                    <label for="tahun" class="form-control-label">Pilih Tahun : </label>
                                    <select name="tahun" class="form-control" data-toggle="select">
                                        <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>
                                </div>

                                <div class="col-md-3 mt-3">
                                    <label for="pasal_id" class="form-control-label">Pilih Pasal : </label>
                                    <select name="pasal_id" class="form-control select2" 
                                        data-toggle="select">
                                        <option value="">Pilih Pasal</option>
                                        @foreach ($datas2['pasals'] as $pasal)
                                        <option value="{{ $pasal->id }}" @if($request->get('pasal_id') == $pasal->id ) SELECTED @endif>
                                            {{ $pasal->NomorPasal->desc }} -
                                            {{ $pasal->NomorPasal->pasal }}. {{ $pasal->kode_uraian }}</option>
                                        @endforeach
                                    </select>
                                </div>

                            </div>
                        </div>
                        <div class="row mt-3">
                            <div class="col-md-12">
                                <button class="btn btn-info btn-sm" type="submit">Tampil</button>
                                <a href="{{ url()->current() }}" class="btn btn-info btn-sm">Refresh</a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="card">
            <div class="card-body">
                <div class="card-title">
                    <div class="row">
                        <div class="col-12">
                            <h3 class="mb-0">Total Keseluruhan {{ $title }} {{ \Helper::judulUntukPasal($request->get('pasal_id')) }} </h3>
                        </div>
                    </div>
                </div>
                <div class="table-responsive py-4">
                    <table class="table table-hover" id="datatablePrint">
                        <thead class="table-dark">
                            <tr>
                                <th>Total Rencana Pembangunan</th>
                                <th>Total Rencana Pemberdayaan</th>
                                <th>Total Realisasi Keseluruhan Pembangunan</th>
                                <th>Total Realisasi Keseluruhan Pemberdayaan</th>

                                <th>Total Realisasi Pembangunan T1</th>
                                <th>Total Realisasi Pemberdayaan T1</th>
                                <th>Total Realisasi Pembangunan T2</th>
                                <th>Total Realisasi Pemberdayaan T2</th>
                                <th>Total Realisasi Pembangunan T3</th>
                                <th>Total Realisasi Pemberdayaan T3</th>
                                <th>Total Realisasi Pembangunan T4</th>
                                <th>Total Realisasi Pemberdayaan T4</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if($datas2)
                            <tr>
                                <td>
                                    Rp. {{ number_format($datas2['total_rencana_pembangunan']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_rencana_pemberdayaan']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pembangunan']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pemberdayaan']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pembangunan_tri1']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pemberdayaan_tri1']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pembangunan_tri2']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pemberdayaan_tri2']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pembangunan_tri3']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pemberdayaan_tri3']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pembangunan_tri4']) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($datas2['total_realisasi_pemberdayaan_tri4']) }}
                                </td>
                            </tr>
                            @else
                            <tr>
                                <td colspan="100%" class="break-word">
                                    Kosong
                                </td>
                            </tr>
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="card">
            <div class="card-body">
                <div class="card-title">
                    <div class="row">
                        <div class="col-6">
                            <h3 class="mb-0">{{ $title }}</h3>
                        </div>
                        <div class="col-6 text-right">
                            <a class="btn btn-warning"
                                href="{{ route('print', 'probebaya') . '?pd='.$request->get('pd', null) . '&kelurahan_id='.$request->get('kelurahan_id', null) . '&tahun='.$request->get('tahun', $tahun) }}"
                                target="_blank">Print PDF</a>
                            <a class="btn btn-success"
                                href="{{ route('print', 'rekap_excel_probebaya') . '?pd='.$request->get('pd', null) . '&kelurahan_id='.$request->get('kelurahan_id', null) . '&tahun='.$request->get('tahun', $tahun) }}"
                                target="_blank">Download Excel Rekap Probebaya</a>
                        </div>
                    </div>
                </div>
                <div class="table-responsive py-4">
                    <table class="table table-hover" id="datatable">
                        <thead class="table-dark">
                            <tr>
                                <th>No</th>
                                <th>Kecamatan</th>
                                <th>Kelurahan</th>
                                <th>No RT</th>
                                <th>Tahun</th>
                                <th>Rencana Anggaran Pembangunan</th>
                                <th>Rencana Anggaran Pemberdayaan</th>
                                <th>Realisasi Anggaran Pembangunan Triwulan 1</th>
                                <th>Realisasi Anggaran Pemberdayaan Triwulan 1</th>
                                <th>Realisasi Anggaran Pembangunan Triwulan 2</th>
                                <th>Realisasi Anggaran Pemberdayaan Triwulan 2</th>
                                <th>Realisasi Anggaran Pembangunan Triwulan 3</th>
                                <th>Realisasi Anggaran Pemberdayaan Triwulan 3</th>
                                <th>Realisasi Anggaran Pembangunan Triwulan 4</th>
                                <th>Realisasi Anggaran Pemberdayaan Triwulan 4</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if($datas)
                            @foreach ($datas as $data)
                            <tr>
                                <td>{{ $loop->iteration }}</td>
                                <td>{{ $data->kelurahan->kecamatan->nama_perangkat_daerah }}</td>
                                <td>{{ $data->kelurahan->nama_kelurahan }}</td>
                                <td>{{ $data->no_rt }}</td>
                                <td>{{ $data->tahun }}</td>
                                <td>
                                    Rp. {{ number_format($data->ttl_rencana_anggaran_pembangunan) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_rencana_anggaran_pemberdayaan) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pembangunan_tri1) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pemberdayaan_tri1) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pembangunan_tri2) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pemberdayaan_tri2) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pembangunan_tri3) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pemberdayaan_tri3) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pembangunan_tri4) }}
                                </td>
                                <td>
                                    Rp. {{ number_format($data->ttl_realisasi_anggaran_pemberdayaan_tri4) }}
                                </td>
                            </tr>
                            @endforeach
                            @else
                            <tr>
                                <td colspan="100%" class="break-word">
                                    Kosong
                                </td>
                            </tr>
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

</div>
@endsection

@push('js')
<script>
    $(document).ready(function () {
        $('#datatablePrint').DataTable({
            dom: 'Bfrtip',
            paging: false,
            ordering: false,
            searching: false,
            buttons: [
                'csv', 'excel'
            ]
        });
    });

    $("#perangkat_daerah_id").change(function (e) {
        const kecamatan_id = $(this).val();
        $.ajax({
            type: "get",
            url: "{{ url('api/kelurahan') }}" + "/" + kecamatan_id,
            success: function (res) {
                if (res.status == "success") {
                    let option = '<option value="">Pilih Kelurahan</option>';
                    res.data.forEach((data) => {
                        option +=
                            `<option value="${data.id}" data-jumlah-rt=${data.jumlah_rt}>${data.nama_kelurahan}</option>`;
                    });

                    $('select[id="kelurahan_id"]').html(option);
                } else {
                    alert("gagal.. : " + res.message);
                }
            }
        });
    });

    $("#kelurahan_id").change(function (e) {
        const kelurahan_id = $(this).val();
        $.ajax({
            type: "get",
            url: "{{ url('api/no_rt') }}" + "/" + kelurahan_id,
            success: function (res) {
                if (res.status == "success") {
                    let option = '<option value="">Pilih RT</option>';
                    res.data.forEach((data) => {
                        option +=
                            `<option value="${data.no_rt}">${data.no_rt}</option>`;
                    });

                    $('select[id="rt"]').html(option);
                } else {
                    alert("gagal.. : " + res.message);
                }
            }
        });
    });

</script>

{{-- chart --}}
{{-- <script src="https://cdn.anychart.com/releases/8.9.0/js/anychart-core.min.js"></script> --}}
<script src=" {{ asset('assets/anychart/anychart-core.min.js') }}"></script>
<script src=" {{ asset('assets/anychart/anychart-venn.min.js') }}"></script>
<script src=" {{ asset('assets/anychart/pastel.min.js') }} "></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital@0;1&display=swap" rel="stylesheet">

<script src="https://cdn.jsdelivr.net/npm/chart.js@3.6.0/dist/chart.min.js"></script>
<script src="https://unpkg.com/chart.js-plugin-labels-dv/dist/chartjs-plugin-labels.min.js"></script>
@endpush