@extends('cms::layouts.master', ['ckeditor' => true])

@section('title', 'Add New Country')

@section('content')
    <x-page-header page-title="Add New Country" active-title="Add New Country" back-link="{{ route('countries.index') }}" />

    <x-crud-form route="{{ route('countries.store') }}" type="create">
        <div class="row">
            <div class="col-12 col-md-6">
                <div class="form-group">
                    <label>Name <span class="text-danger">*</span></label>
                    <input value="{{ old('name') }}" name="name" type="text" class="form-control" placeholder="Country Name" required>
                    <span class="text-danger">{{ validationError($errors->get('name')) }}</span>
                </div>
            </div>

            <div class="col-12 col-md-4">
                <div class="form-group">
                    <label for="flag">Flag <span class="text-danger">*</span></label>
                    <div class="input-group">
                        <input type="file" name="flag" id="flag"
                            class="form-control @error('flag') is-invalid @enderror"
                            style="height: unset; padding: 9px 10px;" value="{{ old('flag') }}"
                            oninput="flagPreview.src=window.URL.createObjectURL(this.files[0]); flagPreview.style.display = this.files[0] ? 'inline' : 'none';"
                            accept="image/*" required>
                        <span class="input-group-addon">
                            <img id="flagPreview" style="width: 40px; height: 38px; display: none;">
                        </span>
                    </div>
                    <span class="text-danger">{{ validationError($errors->get('flag')) }}</span>
                </div>
            </div>

            <div class="col-12 col-md-2">
                <div class="form-group">
                    <label for="display_order">Display Order</label>
                    <input type="number" id="display_order" name="display_order" value="{{ old('display_order', 1) }}" class="form-control" placeholder="Display Order">
                    <span class="text-danger">{{ validationError($errors->get('display_order')) }}</span>
                </div>
            </div>

            <div class="col-12">
                <div class="form-group">
                    <label for="content">Content</label>
                    <textarea class="form-control" name="content" id="content" rows="10" placeholder="Content">{{ old('content') }}</textarea>
                    <span class="text-danger">{{ validationError($errors->get('content')) }}</span>
                </div>
            </div>
            <div class="col-12 text-right">
                <a href="{{ route('countries.index') }}" class="btn btn-danger">Cancel</a>
                <button type="submit" class="btn btn-success">Save</button>
            </div>
        </div>
    </x-crud-form>
@endsection