@extends('layouts.dashboardPenduduk')
@section('title', 'Data Penduduk - Monitoring Kelurahan')
@section('dashboard_content')
<!-- Show Kader Dasawisma Modal -->
<div class="modal fade" id="showdaswis" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
    aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5>Dasawisma RT <b id="daswis-rt-modal"></b> RW <b id="daswis-rw-modal"></b> <b
                        id="daswis-lurah-modal"></b></h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <center id="loading-data-daswis" style="display:none;">
                    <div class="loader mb-2"></div>
                    <h5>Sedang memproses data...</h5>
                </center>
                <div id="data-daswis" style="display:none;">
                    <p><b>Anggota : <span id="daswis-anggota-modal"></span></b></p>
                    <hr>
                    <p><i class="fas fa-user"></i> Nama Kader : <b id="daswis-nama-modal"></b></p>
                    <hr>
                    <p><i class="fas fa-city"></i> Total Bangunan : <b id="daswis-bangunan-modal"></b> Bangunan
                    </p>
                    <hr>
                    <p><i class="fas fa-id-card"></i> Total Kartu Keluarga : <b id="daswis-kk-modal"></b> lembar
                    </p>
                    <hr>
                    <p><i class="fas fa-users"></i> Total Warga di Lingkungan Dasawisma : <b
                            id="daswis-warga-modal"></b> orang</p>
                    <hr>
                    <p><i class="fas fa-map-marker-alt"></i> Lokasi Rumah Daswis (Latitude / Longitude) : <b
                            id="rumahDaswis-latitude-modal"></b> / <b id="rumahDaswis-longitude-modal"></b></p>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<!-- Show Ketua RT Modal -->
<div class="modal fade" id="showrt" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5><i class="fas fa-user"></i> Rumah Ketua RT : <span id="rt-nomorRt-modal"></span></h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p><i class="fas fa-home"></i> RW Nomor : <span id="rt-nomorRw-modal"></span> <span
                        id="rt-lurah-modal"></span></p>
                <hr>
                <ul style="list-style:none;left:-40px;position:relative">
                    <li><i class="fas fa-user"></i> Ketua RT : <span id="rt-ketuart-modal"></span>
                        <ul>
                            <li>Sekretaris : <span id="rt-sekretaris-modal"></span>
                            </li>
                            <li>Bendahara : <span id="rt-bendahara-modal"></span>
                            </li>
                        </ul>
                    </li>
                </ul>
                <hr>
                <p><i class="fas fa-city"></i> Total Bangunan : <span id="rt-bangunan-modal"></span> Bangunan</p>
                <hr>
                <p><i class="fas fa-id-card"></i> Kartu keluarga : <span id="rt-kk-modal"></span> Lembar</p>
                <hr>
                <p><i class="fas fa-users"></i> Total Warga : <span id="rt-totalWarga-modal"></span> orang</p>
                <hr>
                <p><i class="fas fa-map-marker-alt"></i> Lokasi rumah ketua RT (Latitude / Longitude) : <span
                        id="ketuaRt-latitude-modal"></span> / <span id="ketuaRt-longitude-modal"></span></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<!-- Content -->
<div id="mapid"></div>
<div id="modalisi"></div>
@endsection

@section('jsExternalAdd')
@include('layouts.mapsJS.pendudukJS')
@endsection