@extends('layouts.master')

@push('plugin-styles')
    {!! Html::style('/assets/plugins/select2/select2.min.css') !!}
    {!! Html::style('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.1/css/all.min.css') !!}
@endpush

@section('content')
<div class="row mb-3">
    <div class="col-lg-6">
        <h5 class="mb-3 mb-md-0">{{ENV('APP_TITLE')}}</h5>
    </div>
    <div class="col-lg-2">
        <select id="filter_periode" class="js-example-basic-single w-100" disabled>
            <option></option>
        </select>
    </div>
    <div class="col-lg-4">
        <select id="filter_unit_kerja" class="js-example-basic-single w-100">
            <option></option>
            @foreach ($unitKerja as $itemUnitKerja)
                <option value="{!! encrypt($itemUnitKerja->id_unit) !!}">{!! $itemUnitKerja->nama !!}</option>
            @endforeach
        </select>
    </div>
</div>


<div class="row" id="content">
    <div class="col-md-12">
        <div class="alert alert-primary" role="alert">
            <span class="spinner-grow spinner-grow-sm" role="status" aria-hidden="true"></span> Pilih SKPD terlebih dahulu.
        </div>
    </div>
</div>

{{-- @include('pages.adminKab.renstra.form.form-sasaran')--}}
<div class="modal fade" id="add_sasaran" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title text-uppercase" id="exampleModalLabel">Formulir Indikator Kinerja Utama SKPD</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true"><small><i data-feather="x-circle"></i></small></span>
                </button>
            </div>
            <div class="modal-body">
                <form>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label>Tahun Periode <code>*</code></label>
                                <select class="js-example-basic-single" style="width: 100% !important;">
                                    <option>Filter Tahun</option>
                                    <option selected>2018 - 2023</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label>Satuan Kerja Perangkat Daerah <code>*</code></label>
                                <select class="js-example-basic-single" style="width: 100% !important;">
                                    <option>Pilih SKPD</option>
                                    <option>1. Dinas Komunikasi dan Informatika</option>
                                    <option>2. Dinas Sosial</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label>Sasaran Strategis <code>*</code></label>
                                <select class="js-example-basic-single" style="width: 100% !important;">
                                    <option>Pilih Sasaran</option>
                                    <option>1. Meningkatkan Pelayanan kesekretariatan untuk mendukung kinerja perangkat
                                        daerah
                                        dalam rangka mewujudkan good governance</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <div class="form-group">
                                <label>Indikator Kinerja Sasaran <code>*</code></label>
                                <select class="js-example-basic-single" style="width: 100% !important;">
                                    <option>Pilih Indikator</option>
                                    <option>1. Indeks Survey kepuasan Masyarakat</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-2">
                            <div class="form-group">
                                <label>Satuan <code>*</code></label>
                                <input type="text" class="form-control" autocomplete="off" placeholder="Contoh : % ">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label>Alasan Pemilihan Indikator</label>
                                <textarea class="form-control"
                                          placeholder="Tulis alasan pemilihan indikator disini..."></textarea>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label>Formulasi Pengukuran <code>*</code></label>
                                <textarea class="form-control"
                                          placeholder="Tulis formulasi pengukuran disini..."></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-3">
                            <div class="form-group">
                                <label>Tipe Perhitungan <code>*</code></label>
                                <select class="js-example-basic-single" style="width: 100% !important;">
                                    <option>Pilih tipe</option>
                                    <option>Komulatif</option>
                                    <option>Non Komulatif</option>
                                    <option>Lainnya</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-3">
                            <div class="form-group">
                                <label>Penanggung Jawab <code>*</code></label>
                                <select class="js-example-basic-single" style="width: 100% !important;">
                                    <option>Pilih Penanggungjawab</option>
                                    <option>Bidang TIK</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label>Pendukung</label>
                                <select class="js-example-basic-multiple w-100" multiple="multiple" style="width: 100% !important;" placeholder="Pilih Pendukung">
                                    <option>Bidang TIK</option>
                                    <option>Bidang PPIP</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="form-group">
                                <label>Sumber Data</label>
                                <textarea class="form-control" placeholder="Tulis sumber data disini..."
                                          col="5"></textarea>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary text-uppercase" onclick="save(this)">Simpan</button>
                <button class="btn btn-primary" type="button" disabled>
                    <span class="spinner-grow spinner-grow-sm" role="status" aria-hidden="true"></span>
                    Processing...
                </button>
                <button type="button" class="btn btn-secondary text-uppercase" data-dismiss="modal">Batal</button>
            </div>
        </div>
    </div>
</div>
@endsection

@push('plugin-scripts')
    {!! Html::script('/assets/plugins/select2/select2.min.js') !!}
    {!! Html::script('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.1/js/all.min.js') !!}
@endpush

@push('custom-scripts')
    <script src="{!! asset('/js/global.js?id=' . substr(md5(base64_encode(env('APP_JS_VERSION'))), 0, 20)) !!}"></script>
    <script src="{!! asset('/js/adminKab/main.js?id=' . substr(md5(base64_encode(env('APP_JS_VERSION'))), 0, 20)) !!}"></script>
@endpush