@extends('layouts.vertical', ['subtitle' => 'Detail'])

@section('css')
@vite(['node_modules/gridjs/dist/theme/mermaid.min.css'])
@endsection

@section('content')

@include('layouts.partials/page-title', ['title' => 'Data', 'subtitle' => 'PBG'])

<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col-md-6">
                        <div class="mb-3">
                            <dt>Name</dt>
                            <dd>{{$data->name}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Owner Name</dt>
                            <dd>{{$data->owner_name}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Aplication Type Name</dt>
                            <dd>{{$data->application_type_name}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Condition</dt>
                            <dd>{{$data->condition}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Registration Number</dt>
                            <dd>{{$data->registration_number}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Document Number</dt>
                            <dd>{{$data->document_number}}</dd>
                        </div>
                        <div>
                            <dt>Status Name</dt>
                            <dd>{{$data->status_name}}</dd>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <dt>Address</dt>
                            <dd>{{$data->address}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>SLF Status Name</dt>
                            <dd>{{$data->slf_status_name}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Function Type</dt>
                            <dd>{{$data->function_type}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Consultation Type</dt>
                            <dd>{{$data->consultation_type}}</dd>
                        </div>
                        <div class="mb-3">
                            <dt>Due Date</dt>
                            <dd>{{$data->due_date}}</dd>
                        </div>
                        <div>
                            <dt>Task Created At</dt>
                            <dd>{{$data->task_created_at}}</dd>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <ul class="nav nav-tabs nav-justified">
                    <li class="nav-item">
                        <a href="#pbgTaskRetributions" data-bs-toggle="tab" aria-expanded="false"
                            class="nav-link active">
                            <span class="d-none d-sm-block">PBG Task Retributions</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="#pbgTaskIntegration" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
                            <span class="d-none d-sm-block">PBG Task Index Integrations</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="#pbgTaskPrasarana" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
                            <span class="d-none d-sm-block">PBG Task Prasarana</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="#pbgTaskAssignments" data-bs-toggle="tab" aria-expanded="false" class="nav-link">
                            <span class="d-none d-sm-block">Penugasan</span>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="card-body">
                <div class="tab-content">
                    <div class="tab-pane active" id="pbgTaskRetributions">
                        @if ($data->pbg_task_retributions)                    
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="mb-3">
                                        <dt>Luas Bangunan</dt>
                                        <dd>{{$data->pbg_task_retributions->luas_bangunan}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Indeks Lokalitas</dt>
                                        <dd>{{$data->pbg_task_retributions->indeks_lokalitas}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Wilayah SHST</dt>
                                        <dd>{{$data->pbg_task_retributions->wilayah_shst}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Kegiatan Name</dt>
                                        <dd>{{$data->pbg_task_retributions->kegiatan_name}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Nilai SHST</dt>
                                        <dd>{{$data->pbg_task_retributions->nilai_shst}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Indeks Integrasi</dt>
                                        <dd>{{$data->pbg_task_retributions->indeks_terintegrasi}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Indeks Bg Terbangun</dt>
                                        <dd>{{$data->pbg_task_retributions->indeks_bg_terbangun}}</dd>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="mb-3">
                                        <dt>Nilai Retribusi Bangunan</dt>
                                        <dd>{{$data->pbg_task_retributions->nilai_retribusi_bangunan}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Nilai Prasarana</dt>
                                        <dd>{{$data->pbg_task_retributions->nilai_prasarana}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>PBG Dokumen</dt>
                                        <dd>{{$data->pbg_task_retributions->pbg_document}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Underpayment</dt>
                                        <dd>{{$data->pbg_task_retributions->underpayment}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>SKRD Amount</dt>
                                        <dd>{{$data->pbg_task_retributions->skrd_amount}}</dd>
                                    </div>
                                </div>
                            </div>
                        @else
                            <div class="row">
                                <div class="col-md-12">
                                    Data Not Available
                                </div>
                            </div>
                        @endif
                    </div>
                    <div class="tab-pane" id="pbgTaskIntegration">
                        @if ($data->pbg_task_index_integrations)
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="mb-3">
                                        <dt>Indeks Fungsi Bangunan</dt>
                                        <dd>{{$data->pbg_task_index_integrations->indeks_fungsi_bangunan}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Indeks Parameter Kompleksitas</dt>
                                        <dd>{{$data->pbg_task_index_integrations->indeks_parameter_kompleksitas}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Indeks Parameter Permanensi</dt>
                                        <dd>{{$data->pbg_task_index_integrations->indeks_parameter_permanensi}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Indeks Paramter Ketinggian</dt>
                                        <dd>{{$data->pbg_task_index_integrations->indeks_parameter_ketinggian}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Faktor Kepemilikan</dt>
                                        <dd>{{$data->pbg_task_index_integrations->faktor_kepemilikan}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Indeks Terintegrasi</dt>
                                        <dd>{{$data->pbg_task_index_integrations->indeks_terintegrasi}}</dd>
                                    </div>
                                    <div class="mb-3">
                                        <dt>Total</dt>
                                        <dd>{{$data->pbg_task_index_integrations->total}}</dd>
                                    </div>
                                </div>
                            </div>
                        @else
                            <div class="row">
                                <div class="col-md-12">
                                    Data Not Available
                                </div>
                            </div>
                        @endif
                    </div>
                    <div class="tab-pane" id="pbgTaskPrasarana">
                        <div class="row d-flex flex-warp gap-3 justify-content-center">
                            @if ($data->pbg_task_retributions && $data->pbg_task_retributions->pbg_task_prasarana)
                                @foreach ($data->pbg_task_retributions->pbg_task_prasarana as $prasarana)
                                    <div class="border p-3 rounded shadow-sm col-md-4">
                                        <div class="mb-3">
                                            <dt>Prasarana Type</dt>
                                            <dd>{{$prasarana->prasarana_type}}</dd>
                                        </div>
                                        <div class="mb-3">
                                            <dt>Building Type</dt>
                                            <dd>{{$prasarana->building_type}}</dd>
                                        </div>
                                        <div class="mb-3">
                                            <dt>Total</dt>
                                            <dd>{{$prasarana->total}}</dd>
                                        </div>
                                        <div class="mb-3">
                                            <dt>Quantity</dt>
                                            <dd>{{$prasarana->quantity}}</dd>
                                        </div>
                                        <div class="mb-3">
                                            <dt>Unit</dt>
                                            <dd>{{$prasarana->unit}}</dd>
                                        </div>
                                        <div class="mb-3">
                                            <dt>Index Prasarana</dt>
                                            <dd>{{$prasarana->index_prasarana}}</dd>
                                        </div>
                                        <div class="mb-3">
                                            <dt>Created At</dt>
                                            <dd>{{$prasarana->created_at}}</dd>
                                        </div>
                                    </div>
                                @endforeach
                            @else
                                <div class="row">
                                    <div class="col-md-12">
                                        Data Not Available
                                    </div>
                                </div>
                            @endif
                        </div>
                    </div>
                    <div class="tab-pane" id="pbgTaskAssignments">
                        <input type="hidden" id="uuid" value="{{ $data->uuid }}" />
                        <div id="table-pbg-task-assignments"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@section('scripts')
@vite(['resources/js/pbg-task/show.js'])
@endsection