@extends('layout.master', ['headerTitle' => 'Setting Form'])

@section('style')
<link href="{{ asset('assets/plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.2.0/sweetalert2.min.css">
<style>
    .error {
        color: red;
    }

    .form-control.error {
        border-color: red;
    }
</style>
@endsection

@section('body')
<div class="content d-flex flex-column flex-column-fluid" id="kt_content">
    <div class="container-xxl" id="kt_content_container">
        <div>
            <div class="card card-flush h-lg-100" id="kt_contacts_main">
                <div class="card-header pt-7" id="kt_chat_contacts_header">
                    <div class="card-title">
                        <span class="svg-icon svg-icon-1 me-2">
                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M22 12C22 12.2 22 12.5 22 12.7L19.5 10.2L16.9 12.8C16.9 12.5 17 12.3 17 12C17 9.5 15.2 7.50001 12.8 7.10001L10.2 4.5L12.7 2C17.9 2.4 22 6.7 22 12ZM11.2 16.9C8.80001 16.5 7 14.5 7 12C7 11.7 7.00001 11.5 7.10001 11.2L4.5 13.8L2 11.3C2 11.5 2 11.8 2 12C2 17.3 6.09999 21.6 11.3 22L13.8 19.5L11.2 16.9Z" fill="currentColor" />
                                <path opacity="0.3" d="M22 12.7C21.6 17.9 17.3 22 12 22C11.8 22 11.5 22 11.3 22L13.8 19.5L11.2 16.9C11.5 16.9 11.7 17 12 17C14.5 17 16.5 15.2 16.9 12.8L19.5 10.2L22 12.7ZM10.2 4.5L12.7 2C12.5 2 12.2 2 12 2C6.7 2 2.4 6.1 2 11.3L4.5 13.8L7.10001 11.2C7.50001 8.8 9.5 7 12 7C12.3 7 12.5 7.00001 12.8 7.10001L10.2 4.5Z" fill="currentColor" />
                            </svg>
                        </span>
                        <h2>Setting Form</h2>
                    </div>
                    <div class="d-flex align-items-center py-3 py-md-1">
                        <a href="{{ route('generalSetting.create') }}" class="btn btn btn-dark me-3">Add Setting</a>
                        <a href="{{ url()->previous() }}" class="btn btn btn-dark">Back</a>
                    </div>
                </div>
                <div class="card-body pt-5">

                    <ul class="nav nav-custom nav-tabs nav-line-tabs nav-line-tabs-2x border-0 fs-4 fw-bold mb-8">
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4 active" data-bs-toggle="tab" href="#general">General</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4" data-kt-countup-tabs="true" data-bs-toggle="tab" href="#vch">Vch</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4" data-bs-toggle="tab" href="#eway">Eway</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4" data-bs-toggle="tab" href="#company">Company</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4" data-bs-toggle="tab" href="#smtp">Smtp</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4" data-bs-toggle="tab" href="#imap">Imap</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4" data-bs-toggle="tab" href="#tds">Tds</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-active-primary pb-4" data-bs-toggle="tab" href="#sms">Sms</a>
                        </li>
                    </ul>

                    <form class="form" id="settingForm" action="{{ route('generalSetting.update') }}" method="post">
                        @csrf
                        <div class="row gy-5 g-xl-10">

                            <div class="tab-content" id="myTabContent">
                                <div class="tab-pane fade show active" id="general" role="tabpanel">
                                    <div class="col-xxl-12">
                                        <div class="card card-xl-stretch">
                                            @foreach($getSettingData as $setting)
                                            @if (!str_contains($setting->name, "company") && !str_contains($setting->name, "smtp") && !str_contains($setting->name, "imap") && !str_contains($setting->name, "tds") && !str_contains($setting->name, "sms") && !str_contains($setting->name, "eway") && !str_contains($setting->name, "vch"))
                                            <div class="form-group row group{{$setting->id}}">
                                                <div class="col-md-10">
                                                    <label class="fs-6 fw-bold form-label mt-3">
                                                        <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                    </label>
                                                    <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                </div>
                                                <div class="col-md-2">
                                                    <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                        <i class="la la-trash-o"></i>Delete
                                                    </a>
                                                </div>
                                            </div>
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                <div class="tab-pane fade" id="vch" role="tabpanel">
                                    <div class="col-xxl-12">
                                        <div class="card card-xl-stretch">
                                            @foreach($getSettingData as $setting)
                                            @if (str_contains($setting->name, "vch"))
                                            <div class="form-group row group{{$setting->id}}">
                                                <div class="col-md-10">
                                                    <label class="fs-6 fw-bold form-label mt-3">
                                                        <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                    </label>
                                                    <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                </div>
                                                <div class="col-md-2">
                                                    <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                        <i class="la la-trash-o"></i>Delete
                                                    </a>
                                                </div>
                                            </div>
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                <div class="tab-pane fade" id="eway" role="tabpanel">
                                    <div class="col-xxl-12 mt-5">
                                        <div class="card card-xl-stretch">
                                            <div class="row gy-5 g-xl-10">
                                                @foreach($getSettingData as $setting)
                                                @if (str_contains($setting->name, "eway"))
                                                <div class="col-xxl-6 m-0">
                                                    <div class="form-group row mt-5 group{{$setting->id}}">
                                                        <div class="col-md-10">
                                                            <label class="fs-6 fw-bold form-label mt-3">
                                                                <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                            </label>
                                                            <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                        </div>
                                                        <div class="col-md-2">
                                                            <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                                <i class="la la-trash-o"></i>Delete
                                                            </a>
                                                        </div>
                                                    </div>
                                                </div>
                                                @endif
                                                @endforeach
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="tab-pane fade" id="company" role="tabpanel">
                                    <div class="col-xxl-12">
                                        <div class="card card-xl-stretch">
                                            @foreach($getSettingData as $setting)
                                            @if (str_contains($setting->name, "company"))
                                            <div class="form-group row group{{$setting->id}}">
                                                <div class="col-md-10">
                                                    <label class="fs-6 fw-bold form-label mt-3">
                                                        <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                    </label>
                                                    <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                </div>
                                                <div class="col-md-2">
                                                    <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                        <i class="la la-trash-o"></i>Delete
                                                    </a>
                                                </div>
                                            </div>
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                <div class="tab-pane fade" id="smtp" role="tabpanel">
                                    <div class="col-xxl-12">
                                        <div class="card card-xl-stretch">
                                            @foreach($getSettingData as $setting)
                                            @if (str_contains($setting->name, "smtp"))
                                            <div class="form-group row group{{$setting->id}}">
                                                <div class="col-md-10">
                                                    <label class="fs-6 fw-bold form-label mt-3">
                                                        <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                    </label>
                                                    <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                </div>
                                                <div class="col-md-2">
                                                    <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                        <i class="la la-trash-o"></i>Delete
                                                    </a>
                                                </div>
                                            </div>
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                <div class="tab-pane fade" id="imap" role="tabpanel">
                                    <div class="col-xxl-12">
                                        <div class="card card-xl-stretch">
                                            @foreach($getSettingData as $setting)
                                            @if (str_contains($setting->name, "imap"))
                                            <div class="form-group row group{{$setting->id}}">
                                                <div class="col-md-10">
                                                    <label class="fs-6 fw-bold form-label mt-3">
                                                        <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                    </label>
                                                    <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                </div>
                                                <div class="col-md-2">
                                                    <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                        <i class="la la-trash-o"></i>Delete
                                                    </a>
                                                </div>
                                            </div>
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                <div class="tab-pane fade" id="tds" role="tabpanel">
                                    <div class="col-xxl-12">
                                        <div class="card card-xl-stretch">
                                            @foreach($getSettingData as $setting)
                                            @if (str_contains($setting->name, "tds"))
                                            <div class="form-group row group{{$setting->id}}">
                                                <div class="col-md-10">
                                                    <label class="fs-6 fw-bold form-label mt-3">
                                                        <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                    </label>
                                                    <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                </div>
                                                <div class="col-md-2">
                                                    <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                        <i class="la la-trash-o"></i>Delete
                                                    </a>
                                                </div>
                                            </div>
                                            @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                <div class="tab-pane fade" id="sms" role="tabpanel">
                                    <div class="col-xxl-12 mt-5">
                                        <div class="card card-xl-stretch">
                                            <div class="row gy-5 g-xl-10">
                                                @foreach($getSettingData as $setting)
                                                @if (str_contains($setting->name, "sms"))
                                                <div class="col-xxl-6 m-0">
                                                    <div class="form-group row mt-5 group{{$setting->id}}">
                                                        <div class="col-md-10">
                                                            <label class="fs-6 fw-bold form-label mt-3">
                                                                <span>{{ucwords(str_replace('_', ' ', $setting->name))}}</span>
                                                            </label>
                                                            <input type="text" id="{{$setting->name}}" class="form-control form-control-solid" name="{{$setting->name}}" placeholder="{{ucwords(str_replace('_', ' ', $setting->name))}}" value="{{$setting->value}}" />
                                                        </div>
                                                        <div class="col-md-2">
                                                            <a href="javascript:;" data-id="{{$setting->id}}" class="btn btn-sm btn-light-danger mt-3 mt-md-8 deleteRecord">
                                                                <i class="la la-trash-o"></i>Delete
                                                            </a>
                                                        </div>
                                                    </div>
                                                </div>
                                                @endif
                                                @endforeach
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="separator"></div>
                            <div class="d-flex justify-content-end">
                                <button type="submit" data-kt-contacts-type="submit" class="btn btn-primary">
                                    <span class="indicator-label">Save</span>
                                    <span class="indicator-progress">Please wait...
                                        <span class="spinner-border spinner-border-sm align-middle ms-2"></span>
                                    </span>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script>
<script src="{{ asset('assets/plugins/custom/datatables/datatables.bundle.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.2.0/sweetalert2.all.min.js"></script>
<script>
    $(document).ready(function() {
        var _token = `{{ csrf_token() }}`;
        $('body').on('click', '.deleteRecord', function(e) {
            e.preventDefault();
            var current = $(this);
            swal({
                title: "Are you sure to Delete this Record?",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "green",
                cancelButtonColor: "red",
                confirmButtonText: "Yes, Delete!",
            }).then((result) => {
                console.log(result)
                if (result.value == true) {
                    var id = $(this).data("id");
                    console.log(id);
                    $.ajax({
                        headers: {
                            'x-csrf-token': _token
                        },
                        method: 'GET',
                        url: "{{ route('generalSetting.destroy', ':id') }}".replace(':id', id),
                    }).done(function(result) {
                        console.log(result, id);
                        console.log(result.status);
                        if (result.status == 200) {
                            console.log('hi');
                            swal({
                                confirmButtonColor: "#125c4f",
                                title: result.message,
                                type: result.type,
                            });

                            $('.group' + id).remove();

                        }
                    })
                } else {
                    swal({
                        confirmButtonColor: "#125c4f",
                        title: 'Record revert back :)',
                        type: "error",
                    })
                }
            })
        })

    })
</script>
@endpush