@php
    $title = $blade_data['title'];
    $routeLink = $blade_data['routesLink'];
@endphp

@extends('user.layouts.app')
@section('page-title', $title)
@section('breadcrumb')
    <x-breadcrumb :blades="$blade_data" />
@endsection

@section('content')
    @if (isset($form_data->id))
        @include('user.websites.tab')
    @endif
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card rounded-0 mb-2">
                <div class="card-body p-5">

                    <form
                        action="{{ $form_data->id ? route($routeLink . '.update', ['id' => $form_data->id]) : route($routeLink . '.store') }}"
                        method="POST" class="edit-form" enctype="multipart/form-data">
                        @csrf

                        <div class="form-group row">
                            <div class="col-sm-12 mb-3">
                                <label class="">{{ __('Category') }}</label>
                                <div class="">
                                    <select name="category_id" class="form-control @error('name') is-invalid @enderror"
                                        required>
                                        <option value="">Select</option>
                                        @if ($category_list)
                                            @foreach ($category_list as $key => $value)
                                                <option value="{{ $key }}"
                                                    {{ $key == $form_data->category_id ? 'selected' : '' }}>
                                                    {{ $value }}
                                                </option>
                                            @endforeach
                                        @endif
                                    </select>
                                    @error('category_id')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-sm-12 mb-3">
                                <label class="">{{ __('Website Name') }}</label>
                                <div class="">
                                    <input type="text" name="name" value="{{ old('name', $form_data->name) }}"
                                        class="form-control @error('name') is-invalid @enderror" required>
                                    @error('name')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>


                            <div class="col-sm-12 mb-3">
                                <label class="">{{ __('Website') }}</label>
                                <div class="">
                                    <input type="text" name="website" value="{{ old('website', $form_data->website) }}"
                                        class="form-control @error('website') is-invalid @enderror"
                                        placeholder="Ex: domain.com" required>
                                    @error('website')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                        </div>

                        <div class="row mt-3">
                            <div class="col-md-12">
                                <button type="submit" class="btn btn-sm btn-primary submitBtn">Save</button>
                                <a href="{{ route($routeLink . '.index') }}" class="btn btn-sm btn-secondary">Back</a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

@endsection


@push('scripts')
    <script>
        $(".edit-form").validate({
            highlight: function(element) {
                $(element).closest('.form-control').removeClass('is-valid').addClass(
                    'is-invalid'); // add the Bootstrap error class to the control group
            },
            ignore: ":hidden, [contenteditable='true']",
            unhighlight: function(element) {
                $(element).closest('.form-control').removeClass('is-invalid').addClass('is-valid');
            },
            success: function(element) {
                $(element).closest('.form-control').removeClass('is-invalid').addClass(
                    'is-valid'); // remove the Boostrap error class from the control group
            },
            submitHandler: function(form) {
                var loadingText = '<i class="fa fa-circle-notch fa-spin"></i> Saving..';
                $('.edit-form  .submitBtn').html(loadingText).prop('disabled', true);
                return true;
            }
        });
    </script>
@endpush