@extends('temp.admin')
@php
use NN\Module\DB;
use NN\Module\View;
@endphp
@section("content")

<style>
    input.form-control{
        height: 30px;
    }
    .card{
        margin-bottom: 0px;
    }
    .form-group .selection .select2-selection {
        height: auto;
        max-height: auto;
    }
</style>

<div class="content-header row">
    <div class="content-header-left col-md-6 col-12 mb-2 breadcrumb-new">
        <h3 class="content-header-title mb-0 d-inline-block">Laporan</h3>
        <div class="row breadcrumbs-top d-inline-block">
            <div class="breadcrumb-wrapper col-12">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item active">Kekayaan Anggota</li>
                </ol>
            </div>
        </div>
    </div>
    <div class="content-header-right col-md-6 col-12">
        <div class="btn-group float-md-right">
            <!-- <ul class="list-inline mb-0">
                <li style="max-width:140px">
                    <fieldset class="form-group position-relative">
                        <input type="text" value="18-04-2023" class="period datepicker form-control form-control-sm input-sm mb-1" id="tglawal" placeholder="Tanggal Awal">
                        <div class="form-control-position">
                            <i class="la la-calendar-o font-small-4"></i>
                        </div>
                    </fieldset>
                </li>
                <li style="max-width:140px">
                    <fieldset class="form-group position-relative">
                        <input type="text"value="18-04-2023" class="period datepicker form-control form-control-sm input-sm mb-1" id="tglakhir" placeholder="Tanggal Akhir">
                        <div class="form-control-position">
                            <i class="la la-calendar-o font-small-4"></i>
                        </div>
                    </fieldset>
                </li>
            </ul> -->
        </div>
    </div>
</div>
<div class="content-body">
    <section id="dasbor">
        <div class="row mb-4">
            
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-content">
                        <div class="card">
                            <div class="card-body row">
                                <div class="col-sm-6">
                                    <div class=" form-group" style="position: relative">
                                        <label id="layer" for="tahun">Tahun</label>
                                        <style>
                                            #layer:before, #layer:after {
                                                content: '';
                                                position: absolute;
                                                top: 0;
                                                left: 0;
                                                right: 0;
                                                height: 100%;
                                                background-color: transparent;
                                            }
                                            #layer:before {
                                                z-index: 1;
                                            }
                                            #layer:after {
                                                z-index: 2;
                                            }
                                        </style>
                                        <input id="tahun" name="tahun" class="form-control" type="number" value="{{$tahun}}" />
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class=" form-group">
                                        <label for="tahun">Anggota</label>
                                        <select multiple name="anggota" id="anggota"></select>
                                    </div>
                                </div>
                                <div class="col-sm-12">
                                    <button onclick="window.exportWSPlus?window.exportWSPlus():null" class="btn btn-primary" id="export"> <i class="fas fa-file-excel"></i> Export Excel</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-sm-12">
                <div id="kekayaan">

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


@endsection

@section('css')
<style>
    h3{
        font-size: 1rem;
    }
</style>
@endsection
@section('script')
<noscript id="data"> {!! json_encode($data) !!} </noscript>
<noscript id="totals"> {!! $total !!} </noscript>
<script>
    $(function () {
        $('#tahun').datepicker({
            format: "yyyy",
            viewMode: "years", 
            minViewMode: "years",
            beforeShowDay: function(date) {
                return {
                    inline: true,
                    classes: 'disabled'
                }
            },
            changeYear: function(e) {
                var tahun = $("#tahun").datepicker("getDate").getFullYear();
                $('#tahun').blur();
                $('#filter').click();
            }
        }).on('change', function() { 
            location.href = '{{PATH}}'+'/admin/laporan/kekayaan/anggota/'+this.value;
            return false;
         });
    });

</script>
{!! View::jsm('kekayaan2.js') !!}
@endsection