@extends('admin.zsi.layouts.admin')

@section('content')
    <div class="breadcrumbs">
        <div class="col-sm-4">
            <div class="page-header float-left">
                <div class="page-title">
                    <h1>About Us</h1>
                </div>
            </div>
        </div>

        <div class="col-sm-8">
            <div class="page-header float-right">
                <div class="page-title">
                    <ol class="breadcrumb text-right">
                        {{-- <li>
                            <a href="{{ route('admin.dashboard') }}">
                                Dashboard
                            </a>
                        </li> --}}

                        <li class="active">
                            About Us
                        </li>
                    </ol>
                </div>
            </div>
        </div>
    </div>


    <div class="content mt-3">

        @if (session('success'))
            <div class="alert alert-success">
                {{ session('success') }}
            </div>
        @endif

        @if ($errors->any())
            <div class="alert alert-danger">
                Invalid Data! Please fix the errors below and try again.
            </div>
        @endif

        <div class="animated fadeIn">

            <div class="row">

                <div class="col-sm-2"></div>

                <div class="col-sm-8">

                    <form action="{{ route('admin.aboutUs.update', $about->szUniqueKey) }}" method="POST"
                        enctype="multipart/form-data">

                        @csrf
                        @method('PUT')

                        <input type="hidden" name="id" value="{{ $about->id }}">

                        <div class="card">

                            <div class="card-header">

                                <strong class="card-title">
                                    <i class="fa fa-user"></i>

                                    Home Page About Us
                                </strong>

                            </div>

                            <div class="card-body">


                                {{-- Menu --}}

                                <div class="form-group">

                                    <label>

                                        Menu List

                                        <span class="text-danger">*</span>

                                    </label>

                                    <select name="idParent" class="form-control">

                                        <option value="">
                                            <-- Select Regional Centres -->
                                        </option>

                                        @foreach ($menus as $menu)
                                            <option value="{{ $menu->id }}"
                                                {{ old('idParent', $about->idParent) == $menu->id ? 'selected' : '' }}>

                                                {{ $menu->szName }}

                                            </option>
                                        @endforeach

                                    </select>

                                </div>



                                {{-- Image --}}

                                <div class="form-group">

                                    <label>

                                        About Us Image

                                    </label>

                                    @if ($about->szImageName)
                                        <div class="mb-2">

                                            <img src="{{ asset('uploads/aboutUs/' . $about->szImageName) }}"
                                                class="img-thumbnail" width="220">

                                        </div>
                                    @endif

                                    <input type="file" name="szImageName" class="form-control">

                                    <small class="text-muted">

                                        370 x 520

                                    </small>

                                </div>



                                {{-- Image Alt --}}

                                <div class="form-group">

                                    <label>

                                        Image Alt (English)

                                    </label>

                                    <input type="text" class="form-control" name="szImageAlt"
                                        value="{{ old('szImageAlt', $about->szImageAlt) }}">

                                </div>



                                {{-- Title --}}

                                <div class="form-group">

                                    <label>

                                        Title (English)

                                    </label>

                                    <input type="text" class="form-control" name="szTitle"
                                        value="{{ old('szTitle', $about->szTitle) }}">

                                </div>



                                {{-- Hindi Title --}}

                                <div class="form-group">

                                    <label>

                                        Title (Hindi)

                                    </label>

                                    <input type="text" class="form-control" name="szTitleHindi"
                                        value="{{ old('szTitleHindi', $about->szTitleHindi) }}">

                                </div>



                                {{-- Subtitle --}}

                                <div class="form-group">

                                    <label>

                                        Subtitle (English)

                                    </label>

                                    <input type="text" class="form-control" name="szSubTitle"
                                        value="{{ old('szSubTitle', $about->szSubTitle) }}">

                                </div>



                                {{-- Subtitle Hindi --}}

                                <div class="form-group">

                                    <label>

                                        Subtitle (Hindi)

                                    </label>

                                    <input type="text" class="form-control" name="szSubTitleHindi"
                                        value="{{ old('szSubTitleHindi', $about->szSubTitleHindi) }}">

                                </div>



                                {{-- English --}}

                                <div class="form-group">

                                    <label>

                                        About Us (English)

                                        <span class="text-danger">*</span>

                                    </label>

                                    <textarea name="szAboutUsText" class="form-control ckeditor" rows="12">{!! old('szAboutUsText', $about->szAboutUsText) !!}</textarea>

                                </div>



                                {{-- Hindi --}}

                                <div class="form-group">

                                    <label>

                                        About Us (Hindi)

                                        <span class="text-danger">*</span>

                                    </label>

                                    <textarea name="szAboutUsTextHindi" class="form-control ckeditor" rows="12">
                                    {!! old('szAboutUsTextHindi', $about->szAboutUsTextHindi) !!}
                                    </textarea>
                                </div>

                            </div>

                            <div class="card-footer">

                                <button type="submit" class="btn btn-primary float-right">

                                    Save About Us

                                </button>

                            </div>

                        </div>

                    </form>

                </div>

            </div>

        </div>

    </div>

    <script>
        tinymce.init({
            selector: '.ckeditor',
            height: 500,
            menubar: true,
            plugins: [
                'advlist', 'autolink', 'lists', 'link', 'image', 'charmap',
                'preview', 'searchreplace', 'visualblocks', 'code',
                'fullscreen', 'insertdatetime', 'media', 'table', 'wordcount'
            ],
            toolbar: 'undo redo | blocks | bold italic underline | alignleft aligncenter alignright alignjustify | bullist numlist | link image table | code preview',
            branding: false,
            promotion: false
        });
    </script>
@endsection