@extends('layouts.app')

@section('title')
    Dashboard
@endsection

@section('content')
    <section class="section">
        <div class="card card-primary rounded mb-4">
            <div class="card-header">
                <h4>Dashboard</h4>
            </div>
        </div>
        <div class="section-body">
            <div class="card card-dark mb-4">
                <div class="card-header border-bottom shadow-sm">
                    <h4 class="text-dark"><span class="fas fa-cogs mr-3" style="font-size:16px;"></span>Pengaturan</h4>
                </div>
                <div class="card-body">
                    <form id="formConfig" method="post" action="{{ route('configs.update', ['id' => 'id']) }}">
                        <div class="row">
                            <div class="col-lg-6">
                                @csrf
                                @method('put')
                                <div class="form-group">
                                    <div class="control-label mb-0">Penilaian (Evaluasi) <strong>Tanpa</strong> Submit Form
                                        F-01</div>
                                    <label class="custom-switch mt-3 pl-0">
                                        <input type="checkbox" name="open_evaluation"
                                            data-cv="{{ $configs['OPEN-EVALUATION']['cv'] }}"
                                            data-id="{{ $configs['OPEN-EVALUATION']['id'] }}"
                                            class="custom-switch-input"{!! $configs['OPEN-EVALUATION']['data'] == 1 ? ' checked=""' : '' !!}>
                                        <span class="custom-switch-indicator"></span>
                                        <span class="custom-switch-description">Memperbolehkan Penilaian (Evaluasi) Tanpa
                                            Submit Form F-01</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <div class="control-label mb-0">Perhitungan IPP <strong>Tanpa</strong> Form F-03</div>
                                    <label class="custom-switch mt-3 pl-0">
                                        <input type="checkbox" name="exclude_f03_denominator"
                                            data-cv="{{ $configs['EXCLUDE-F03-DENOMINATOR']['cv'] }}"
                                            data-id="{{ $configs['EXCLUDE-F03-DENOMINATOR']['id'] }}"
                                            class="custom-switch-input"{!! $configs['EXCLUDE-F03-DENOMINATOR']['data'] == 1 ? ' checked=""' : '' !!}>
                                        <span class="custom-switch-indicator"></span>
                                        <span class="custom-switch-description">Memperbolehkan Perhitungan IPP Tanpa Form
                                            F-03</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <div class="control-label mb-0">Perhitungan IPP <strong>Menggunakan</strong> Instrumen
                                        Tipe A (Luring / Offline)</div>
                                    <label class="custom-switch mt-3 pl-0">
                                        <input type="checkbox" name="instrument_type_a"
                                            data-cv="{{ $configs['INSTRUMENT-TYPE-A']['cv'] }}"
                                            data-id="{{ $configs['INSTRUMENT-TYPE-A']['id'] }}"
                                            class="custom-switch-input"{!! $configs['INSTRUMENT-TYPE-A']['data'] == 1 ? ' checked=""' : '' !!}>
                                        <span class="custom-switch-indicator"></span>
                                        <span class="custom-switch-description">Mengharuskan Perhitungan IPP dengan Tipe
                                            Instrumen A (Luring / Offline)</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <div class="control-label mb-0">Perhitungan IPP <strong>Menggunakan</strong> Instrumen
                                        Tipe B (Daring / Online)</div>
                                    <label class="custom-switch mt-3 pl-0">
                                        <input type="checkbox" name="instrument_type_b"
                                            data-cv="{{ $configs['INSTRUMENT-TYPE-B']['cv'] }}"
                                            data-id="{{ $configs['INSTRUMENT-TYPE-B']['id'] }}"
                                            class="custom-switch-input"{!! $configs['INSTRUMENT-TYPE-B']['data'] == 1 ? ' checked=""' : '' !!}>
                                        <span class="custom-switch-indicator"></span>
                                        <span class="custom-switch-description">Mengharuskan Perhitungan IPP dengan
                                            Instrumen Tipe B (Daring / Online)</span>
                                    </label>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <div class="control-label mb-0">Sensor <strong>Nama Responden</strong> Form-03</div>
                                    <label class="custom-switch mt-3 pl-0">
                                        <input type="checkbox" name="censored_responden_name"
                                            data-cv="{{ $configs['CENSORED-RESPONDEN-NAME']['cv'] }}"
                                            data-id="{{ $configs['CENSORED-RESPONDEN-NAME']['id'] }}"
                                            class="custom-switch-input"{!! $configs['CENSORED-RESPONDEN-NAME']['data'] == 1 ? ' checked=""' : '' !!}>
                                        <span class="custom-switch-indicator"></span>
                                        <span class="custom-switch-description">Sensor Nama Responden</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <div class="control-label mb-0">Sensor <strong>Nomor Ponsel Responden</strong> Form-03
                                    </div>
                                    <label class="custom-switch mt-3 pl-0">
                                        <input type="checkbox" name="censored_responden_phone"
                                            data-cv="{{ $configs['CENSORED-RESPONDEN-PHONE']['cv'] }}"
                                            data-id="{{ $configs['CENSORED-RESPONDEN-PHONE']['id'] }}"
                                            class="custom-switch-input"{!! $configs['CENSORED-RESPONDEN-PHONE']['data'] == 1 ? ' checked=""' : '' !!}>
                                        <span class="custom-switch-indicator"></span>
                                        <span class="custom-switch-description">Sensor Nomor Ponsel Responden</span>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="text-center">
                            <button type="submit" class="btn btn-dark rounded-pill"
                                data-loading-text="<span class='spinner-border spinner-border-sm'></span> Menyimpan ...">
                                <i class="fas fa-save mr-2"></i>Simpan Pengaturan
                            </button>
                        </div>
                    </form>
                </div>
            </div>
            <div class="alert alert-info alert-has-icon mb-4 shadow-sm">
                <div class="alert-icon"><i class="fas fa-bullhorn"></i></div>
                <div class="alert-body">
                    <div class="alert-title">Info</div>
                    Nilai akan muncul setelah dilakukan penilaiain oleh Tim Penilai (Evaluator) dan disimpan.
                </div>
            </div>
            <div class="card rounded card-primary">
                <div class="card-header shadow-sm border-bottom">
                    <h4><span class="fas fa-trophy mr-3 text-warning" style="font-size:16px;"></span>IPP</h4>
                    <div class="card-header-form">
                        <input type="number" name="yp" id="yearPicker" class="form-control"
                            placeholder="Tahun Pelaksanaan" value="{{ date('Y') }}">
                    </div>
                </div>
                <div class="card-body p-0">
                    {{ $html->table(['width' => '100%', 'class' => 'table table-striped table-bordered table-hover']) }}
                </div>
            </div>
        </div>
    </section>
@endsection

@push('css')
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/air-datepicker/css/datepicker.min.css') }}">
    @include('layouts.datatables_css')
@endpush

@push('js')
    <script type="text/javascript" src="{{ asset('assets/moment/moment-with-locales.js') }}"></script>
    <script type="text/javascript" src="{{ asset('assets/air-datepicker/js/datepicker.min.js') }}"></script>
    <script type="text/javascript" src="{{ asset('assets/air-datepicker/js/datepicker.en.js') }}"></script>
    <script type="text/javascript">
        function pointPaint(arrPoint) {
            let p1 = arrPoint[0];
            let p2 = arrPoint[1];
            let r = '';

            switch (p1) {
                case 'A':
                case 'A-':
                    r = '<button type="button" class="btn btn-sm btn-success mb-1">' + p1 +
                        '</button><br><div class="badge badge-pill badge-success">' + p2 + '</div>';
                    break;
                case 'B':
                case 'B-':
                    r = '<button type="button" class="btn btn-sm btn-info mb-1">' + p1 +
                        '</button><br><div class="badge badge-pill badge-info">' + p2 + '</div>';
                    break;
                case 'C':
                case 'C-':
                    r = '<button type="button" class="btn btn-sm btn-primary mb-1">' + p1 +
                        '</button><br><div class="badge badge-pill badge-primary">' + p2 + '</div>';
                    break;
                case 'D':
                case 'E':
                    r = '<button type="button" class="btn btn-sm btn-warning mb-1">' + p1 +
                        '</button><br><div class="badge badge-pill badge-warning">' + p2 + '</div>';
                    break;
                case 'F':
                    r = '<button type="button" class="btn btn-sm btn-danger mb-1">' + p1 +
                        '</button><br><div class="badge badge-pill badge-danger">' + p2 + '</div>';
                    break;
            }

            return r;
        }
    </script>
    @include('layouts.datatables_js')
    {!! $html->scripts() !!}
    <script type="text/javascript">
        $(document).ready(function() {
            $(document).on('submit', '#formConfig', function(e) {
                e.preventDefault();

                var f = $(this);
                var d = new FormData($(this).get(0));
                var bLoader = $(this).find('button[type=submit]');
                bLoader.button('loading');

                var cbxs = f.find('input[type=checkbox]');
                var configs = [];

                for (var i = cbxs.length - 1; i >= 0; i--) {
                    var cbx = $(cbxs[i]);
                    var cbxName = cbx.attr('name').replaceAll('_', '-').toUpperCase();
                    var ypx = $('#yearPicker').val();

                    if (cbx.is(':not(:checked)')) {
                        configs.push({
                            'id': cbx.attr('data-id'),
                            'name': cbxName,
                            'data': 0,
                            'year': ypx,
                            'cv': cbx.attr('data-cv')
                        });
                    } else {
                        configs.push({
                            'id': cbx.attr('data-id'),
                            'name': cbxName,
                            'data': 1,
                            'year': ypx,
                            'cv': cbx.attr('data-cv')
                        });
                    }
                }

                d.append('configs', JSON.stringify(configs));
                d.append('year', $('#yearPicker').val());

                $.ajax({
                    url: f.attr('action'),
                    type: f.attr('method'),
                    data: d,
                    processData: false,
                    contentType: false,
                    success: function(r) {
                        if (r && r.success) {
                            iziToast.success({
                                title: 'OK',
                                message: 'Data Pengaturan berhasil disimpan.',
                                position: 'topRight'
                            });

                            if (r.data) {
                                for (var i = r.data.length - 1; i >= 0; i--) {
                                    var nm = r.data[i]['name'].trim().toLowerCase().replaceAll(
                                        '-', '_');
                                    $('input[name=' + nm + ']').attr('data-cv', r.data[i]['cv'])
                                }
                            }
                        } else {
                            iziToast.warning({
                                title: 'Galat!',
                                message: 'Data Pengaturan gagal disimpan!',
                                position: 'topRight'
                            });
                        }

                        bLoader.button('reset');
                    },
                    error: function(x) {
                        bLoader.button('reset');
                        iziToast.error({
                            title: 'Server Error!',
                            message: 'Data Pengaturan gagal disimpan!',
                            position: 'topRight'
                        });
                    }
                });

                return false;
            });

            $('#dataTableBuilder').on('click', '.btn-reject', function(e) {
                e.preventDefault();

                var r = isDTB(window.LaravelDataTables["dataTableBuilder"]) ? window.LaravelDataTables[
                    "dataTableBuilder"].rows($(this).closest('tr').data('index')).data()[0] : null;

                var d = new FormData();
                d.append('form', r.f1id);
                d.append('_token', '{{ csrf_token() }}');

                var b = $(this);
                b.button('loading');

                $.ajax({
                    url: '{{ route('f1qa.reject') }}',
                    type: 'post',
                    data: d,
                    processData: false,
                    contentType: false,
                    success: function(r) {
                        // console.log(r);
                        b.button('reset');

                        if (r && r.success) {
                            iziToast.success({
                                title: 'OK',
                                message: 'Form F-01 berhasil dikembalikan ke Penanggung Jawab',
                                position: 'topRight'
                            });

                            drawDTB(window.LaravelDataTables["dataTableBuilder"]);
                        } else {
                            iziToast.warning({
                                title: 'Galat!',
                                message: 'Form F-01 gagal dikembalikan ke Penanggung Jawab!',
                                position: 'topRight'
                            });
                        }
                    },
                    error: function(x) {
                        b.button('reset');
                        iziToast.error({
                            title: 'Server Error!',
                            message: 'Form F-01 gagal dikembalikan ke Penanggung Jawab!',
                            position: 'topRight'
                        });
                    }
                });

                return false;
            });
        });
    </script>
@endpush