@extends('dashboard.layouts.master')
@section('title', 'Add Plan Type | Admin Panel')
@section('content')
    @can('subscription_plan_type.create')
        <div class="padding">
            <div class="box">
                <div class="box-header m-b-2">
                    <div class="box-header-left">
                        <h3 class="d-block">Add Subscription Plan Type</h3>
                        <small class="d-inline-block">
                            <a href="{{ route('adminHome') }}">{{ __('backend.dashboard') }}</a> /
                            <a href="{{ route('subscription_plan_type') }}">Plan Types</a> /
                            <span>Add</span>
                        </small>
                    </div>
                    <div class="box-header-right">
                        <ul class="nav">
                            <li class="nav-item inline">
                                <a class="nav-link" href="{{ route('subscription_plan_type') }}">
                                    <i class="material-icons md-18">×</i>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="box-body">
                    {{ Form::open(['method' => 'POST', 'id' => 'createForm']) }}
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-control-label">Name (EN) <span class="valid_field">*</span></label>
                                <input type="text" name="name" id="name" class="form-control"
                                       maxlength="100" placeholder="Plan Type Name [EN]" value="{{ old('name') }}">
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label class="form-control-label">Name (AR)</label>
                                <input type="text" name="name_ar" id="name_ar" class="form-control"
                                       maxlength="100" placeholder="Plan Type Name [AR]" value="{{ old('name_ar') }}" dir="rtl">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12">
                        <div class="form-group m-t-md">
                            <button type="submit" class="solid-button m-r-1" id="submitBtn">
                                {{ __('backend.add') }}
                            </button>
                            <a href="{{ route('subscription_plan_type') }}" class="border-btn">
                                {{ __('backend.cancel') }}
                            </a>
                        </div>
                    </div>
                    {{ Form::close() }}
                </div>
            </div>
        </div>
    @else
        <input type="hidden" value="{{ route('adminHome') }}" id="redirect_url">
        <script>window.location.replace($('#redirect_url').val());</script>
    @endcan
@endsection

@push('after-scripts')
    <script src="https://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script>
    <script>
        $(document).ready(function () {
            $.validator.addMethod('remoteName', function (value, element) {
                return this.optional(element) || value;
            }, '');

            $('#createForm').validate({
                rules: {
                    name: {
                        required: true,
                        maxlength: 100,
                        remote: {
                            url: "{{ route('subscription_plan_type.checkName') }}",
                            type: 'POST',
                            data: {
                                _token: $('meta[name="csrf-token"]').attr('content'),
                                name: function () { return $('#name').val(); }
                            }
                        }
                    }
                },
                messages: {
                    name: {
                        required: 'Plan type name is required.',
                        maxlength: 'Maximum 100 characters allowed.',
                        remote: 'This plan type name already exists.'
                    }
                },
                errorElement: 'span',
                errorClass: 'text-danger',
                submitHandler: function (form) {
                    var fd = new FormData(form);
                    $.ajax({
                        url: "{{ route('subscription_plan_type.store') }}",
                        type: 'POST',
                        headers: { 'X-CSRF-TOKEN': "{{ csrf_token() }}" },
                        processData: false,
                        contentType: false,
                        data: fd,
                        success: function (data) {
                            if (data.success) {
                                Swal.fire({ icon: 'success', title: 'Success', text: data.msg })
                                    .then(() => window.location.href = "{{ route('subscription_plan_type') }}");
                            }
                        }
                    });
                }
            });
        });
    </script>
@endpush