@extends('layouts.app')
@include('plugins.dropify')
@include('plugins.wizard')

@section('content')
<div class="app-content content">
    <div class="content-overlay"></div>
    <div class="content-wrapper">
        <div class="content-header row">
            <div class="content-header-left col-md-6 col-12 mb-2">
                <h3 class="content-header-title">Edit Device</h3>
                <div class="row breadcrumbs-top">
                    <div class="breadcrumb-wrapper col-12">
                        {{ Breadcrumbs::render('systemconfiguration.systemsettings') }}
                    </div>
                </div>
            </div>
        </div>
        <div class="content-body">
            <section>
                <div class="card">
                    <div class="card-body">
                        <ul class="nav nav-tabs nav-underline no-hover-bg">
                            <li class="nav-item">
                                <a class="nav-link active" data-toggle="tab" href="#" data-target="#tab1" role="tab"><i class="la la-check tab-icon text-success"></i> <span>Basic Information</span></a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" data-toggle="tab" href="#" data-target="#tab2" role="tab"><i class="la la-check tab-icon text-success"></i> <span>System Time Configuration</span></a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" data-toggle="tab" href="#" data-target="#tab3" role="tab"><i class="la la-check tab-icon text-success"></i> <span>Network Service</span></a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" data-toggle="tab" href="#" data-target="#tab5" role="tab"><i class="la la-check tab-icon text-success"></i> <span>Sounds</span></a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" data-toggle="tab" href="#" data-target="#tab6" role="tab"><i class="la la-check tab-icon text-success"></i> <span>Temperature</span></a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" data-toggle="tab" href="#" data-target="#tab7" role="tab"><i class="la la-check tab-icon text-success"></i> <span>Access Condition</span></a>
                            </li>
                        </ul>
                        <div class="tab-content px-1 pt-1">
                            <div role="tabpanel" class="tab-pane active" id="tab1" aria-labelledby="home-tab3" aria-expanded="true">
                                @include('device.edit.tab1')
                            </div>
                            <div role="tabpanel" class="tab-pane" id="tab2" aria-labelledby="home-tab3" aria-expanded="false">
                                @include('device.edit.tab2')
                            </div>
                            <div role="tabpanel" class="tab-pane" id="tab3" aria-labelledby="home-tab3" aria-expanded="false">
                                @include('device.edit.tab3')
                            </div>
                            <div role="tabpanel" class="tab-pane" id="tab5" aria-labelledby="home-tab3" aria-expanded="false">
                                @include('device.edit.tab5')
                            </div>
                            <div role="tabpanel" class="tab-pane" id="tab6" aria-labelledby="home-tab3" aria-expanded="false">
                                @include('device.edit.tab6')
                            </div>
                            <div role="tabpanel" class="tab-pane" id="tab7" aria-labelledby="home-tab3" aria-expanded="false">
                                @include('device.edit.tab7')
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>
</div>
@endsection

@push('js')

<script type="text/javascript">


$(function() {
    $('#form_digital_tax_service').validate({
        rules: {
            TAXATION_CHARGE: {
                required: true,
                min: 0,
                max: 100,
            }

        }
    })
})

$("form").submit(function(e) {
    e.preventDefault();
    var form = $(this);

    if(!form.valid())
      return '';

    swal({
        title: "Proceed?",
        text: "Are you sure to update system configuration",
        icon: "warning",
        buttons: {
            cancel: "Cancel",
            confirm: {
                text: "Proceed",
                value: "confirm",
                closeModal: false,
                className: "btn-info",
            },
        },
        dangerMode: true,
    })
    .then((confirm) => {

            if(confirm){
                $.ajax({
                    url: form.attr('action'),
                    method: form.attr('method'),
                    data: new FormData(form[0]),
                    dataType: 'json',
                    async: true,
                    contentType: false,
                    processData: false,
                    success: function(data) {
                      swal(data.title, data.message, data.status);
                      location.reload();
                    }
                });
            }

    });

});

$('body').on('click','#test_email',function(){

    var form = $("form.form-email");

    if(!form.valid())
      return;

    swal({
        title: "Send Test Email",
        text: "Before proceed please click at Save to save System Configuration",
        icon: "warning",
        buttons: {
            cancel: "Cancel",
            confirm: {
                text: "Proceed",
                value: "confirm",
                closeModal: false,
                className: "btn-info",
            },
        },
        dangerMode: true,
    })
    .then((confirm) => {

        if(confirm){
            $.ajax({
                url: '{{ route('admin.settings.checkemail') }}',
                method: form.attr('method'),
                data: new FormData(form[0]),
                dataType: 'json',
                async: true,
                contentType: false,
                processData: false,
                success: function(data) {
                  swal(data.title, data.message, data.status);
                }
            });
        }

    });

})

$('.dropify').dropify();
$("#form-edit").validate();
function handOver() {
    $("#modal-handover").modal("show");
    $("#form-handover").validate();
    $("#form-handover").trigger("reset");
}
</script>
@endpush