@extends('admin._layouts.master')

@section('content')

    {!! html()->modelForm($employee, $method, $action)->open() !!}
    <div class="row">
        <div class="col-xl-8 col-lg-10 col-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">Personel Bilgileri</h3>
                </div>
                <div class="card-body">

                    <div class="form-group">
                        <label for="image" class="w100">Görsel (360x320)</label>
                        <label for="image" class="image w100 clickable" style="max-width: 400px">
                            <img id="image-preview" class="image-preview w100"
                                 src="{{ $employee->image ? $employee->image->getUrl('default') : '/assets/images/placeholder.png' }}"
                                 alt="">
                            <input type="hidden" name="image_id" data-image-type="1" value="{{ object_get($employee, 'image.id') }}">
                        </label>
                    </div>

                    <div class="form-group">
                        <label for="fullname">İsim, Soyisim :</label>
                        {!! html()->text('fullname') ->class('form-control') !!}
                    </div>

                    <div class="form-group">
                        <label for="title">Ünvan :</label>
                        {!! html()->text('title') ->class('form-control') !!}
                    </div>

                    <div class="form-group">
                        <label for="spot">Hakkında :</label>
                        {!! html()->textarea('spot') ->class('form-control') !!}
                    </div>

                    <div class="form-group">
                        <label for="linkedin">Email :</label>
                        {!! html()->text('email') ->class('form-control') !!}
                    </div>

                    <div class="form-group">
                        <label for="linkedin">Telefon :</label>
                        <div class="input-group">
                            {!! html()->text('phone') ->class('form-control') !!}

                            <div class="input-group-addon">
                                {!! html()->select('phone_type', $phoneTypes) ->class('form-control') !!}
                            </div>
                        </div>
                    </div>


                    <div class="form-group">
                        <label for="linkedin">Linkedin Hesabı :</label>
                        {!! html()->text('linkedin') ->class('form-control') !!}
                    </div>

                    <div class="form-group">
                        <label for="facebook">Facebook Hesabı :</label>
                        {!! html()->text('facebook') ->class('form-control') !!}
                    </div>

                    <div class="form-group">
                        <label for="twitter">Twitter Hesabı :</label>
                        {!! html()->text('twitter') ->class('form-control') !!}
                    </div>

                    <div class="form-group">
                        <label for="youtube">Youtube Hesabı :</label>
                        {!! html()->text('youtube') ->class('form-control') !!}
                    </div>

                    <br>
                    <div class="input-group">
                        <input class="btn-lg" type="checkbox" name="is_published" value="1" {{ $employee->is_published ? 'checked' : '' }}
                        data-toggle="toggle" data-on="Yayında" data-off="Taslak" data-size="small" data-onstyle="success"
                               data-offstyle="warning">
                    </div>

                </div>


                <div class="card-footer text-right">
                    <button type="submit" class="btn btn-outline-success shadow-sm text-bold">
                        Kaydet
                    </button>
                </div>
            </div>
        </div>

        {!! html()->closeModelForm() !!}
    </div>


@endsection

{{---------------------------------------------------------------------------------------------------------------------------------------- modals --}}
@push('modals')

    @include('admin._common.galleries.image.modal')
    @include('admin._common.galleries.image.gallery')

@endpush


{{--------------------------------------------------------------------------------------------------------------------------------------- scripts --}}
@push('scripts')

    <script src="/assets/admin/js/plugin.js"></script>
    <script src="/assets/admin/js/gallery.js"></script>

    <script>
        (function() {
            window.addEventListener('load', () => {

                const galleryModal = document.getElementById('image-gallery-modal')
                const imageInput   = document.querySelector('[name="image_id"]')
                const imagePreview = document.getElementById('image-preview')

                galleryModal.addEventListener('select-image.Gallery', e => {
                    imagePreview.setAttribute('src', e.detail.baseUrl.replace('{size}', 'index'))
                    imageInput.value = e.detail.id
                })

                const imageGallery = gallery(galleryModal, {
                    type        : 1,
                    relationType: 'employee',
                    relationId  : '{{ $employee->id }}',
                    url         : '{{ route('admin.images.index') }}'
                })

                imagePreview.addEventListener('click', () => {
                    imageGallery.show()
                })
            })
        })()
    </script>
@endpush