@extends('layouts.app')

@section('page_title')
    {{ (!empty($page_title) && isset($page_title)) ? $page_title : '' }}
@endsection

@section('content')
    <div class="container-fluid mt-3">
        <div class="d-flex justify-content-between py-4">
            <p class="page-title">{{ (!empty($p_title) && isset($p_title)) ? $p_title : '' }}</p>
        </div>

        <div class="row">
            <div class="col-lg-3 col-md-12">
                <div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
                    <a href="{{ route('research.create') }}"
                       class="nav-link {{ request()->is('admin/research/*') ? 'active' : '' }}" >
                        <div class="d-flex align-items-center">
                            <div class="sidebar-number-count me-2">1</div>
                            Research
                        </div>
                    </a>

                    <div class="nav-link disabled {{ request()->is('admin/research/*/attachment') ? 'active' : '' }}">
                        <div class="d-flex align-items-center">
                            <div class="sidebar-number-count me-2">2</div>
                            Attachments
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-9 col-md-12">
                <form method="{{ $method }}" action="{{ $action }}" enctype="{{ $enctype }}">
                    @csrf
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="title" class="form-label">Title *</label>
                            <input type="text" class="form-control @error('title') is-invalid @enderror" name="title" id="title" placeholder="Title" value="{{ old('title') }}">
                            @error('title')
                            <strong class="text-danger">{{ $message }}</strong>
                            @enderror
                        </div>

                        <div class="col-md-6 mb-3">
                            <label for="author" class="form-label">Author *</label>
                            <input type="text" class="form-control @error('author') is-invalid @enderror" name="author" id="author" placeholder="Author" value="{{ old('author') }}">
                            @error('author')
                            <strong class="text-danger">{{ $message }}</strong>
                            @enderror
                        </div>

                        <div class="col-md-6 mb-3">
                            <label for="department_id" class="form-label">Department *</label>
                            <select id="department_id" class="form-control select2-options-department-id @error('department_id') is-invalid @enderror" name="department_id"></select>
                            @error('department_id')
                            <strong class="text-danger">{{ $message }}</strong>
                            @enderror
                        </div>

                        <div class="col-md-6 mb-3">
                            <label for="journal" class="form-label">Journal</label>
                            <input type="text" class="form-control @error('journal') is-invalid @enderror" name="journal" id="journal" placeholder="Journal" value="{{ old('journal') }}">
                            @error('journal')
                            <strong class="text-danger">{{ $message }}</strong>
                            @enderror
                        </div>

                        <div class="col-md-6 mb-3">
                            <label for="publish" class="form-label">Publish</label>
                            <input type="text" class="form-control @error('publish') is-invalid @enderror" name="publish" id="publish" placeholder="Publish" value="{{ old('publish') }}">
                            @error('publish')
                            <strong class="text-danger">{{ $message }}</strong>
                            @enderror
                        </div>

                        <div class="col-md-6 mb-3">
                            <label for="impact_factor" class="form-label">Impact Factor</label>
                            <input type="text" class="form-control @error('impact_factor') is-invalid @enderror" name="impact_factor" id="impact_factor" placeholder="Impact Factor" value="{{ old('impact_factor') }}">
                            @error('impact_factor')
                            <strong class="text-danger">{{ $message }}</strong>
                            @enderror
                        </div>

                        <div class="col-md-6 mb-3">
                            <label for="year" class="form-label">Year *</label>
                            <input type="date" class="form-control @error('year') is-invalid @enderror" name="year" id="year" value="{{ old('year') }}">
                            @error('year')
                            <strong class="text-danger">{{ $message }}</strong>
                            @enderror
                        </div>

                        <div class="col-12 mb-3">
                            <label for="detail" class="form-label">Detail</label>
                            <textarea name="detail" id="detail" cols="30" rows="4" class="form-control">{{ old('detail') }}</textarea>
                        </div>
                    </div>

                    <div class="d-flex justify-content-end">
                        <button type="submit" class="btn btn-sm btn-success">Submit</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    @if (!empty($p_description) && isset($p_description))
        <div class="card-footer">
            <p>{{ $p_description }}</p>
        </div>
    @endif
@endsection

@push('js')
    <script>
        $(document).ready(function () {
            CKEDITOR.replace('detail', {
                filebrowserUploadUrl: "{{ route('research-upload-ckeditor', ['_token' => csrf_token()]) }}",
                filebrowserUploadMethod: 'form'
            });

            $('.select2-options-department-id').select2({
                theme: 'bootstrap5',
                placeholder: 'Select Department',
                ajax: {
                    url: '{{ route('get.research-department-select') }}',
                    dataType: 'json',
                    delay: 250,
                    type: 'GET',
                    data: params => ({
                        q: params.term || '',
                        _token: '{{ csrf_token() }}'
                    }),
                    processResults: data => ({
                        results: data.map(item => ({ id: item.id, text: item.title }))
                    }),
                    cache: true
                }
            }).trigger('change.select2');
        });
    </script>
@endpush