@extends('layouts.app')
@section('title', 'Glossary')
@section('content')
    <div class="container page-content">
        <div class="row justify-content-xl-center page-col">
            <div class="col-xl-10 col-12">
                <h1 class="font-weight-bold typography-4 mb-0">{{ $glossary ? 'Glossary Details' : 'Create Glossary' }}</h1>
            </div>
        </div>
        <!-- Header -->
        <div class="row justify-content-xl-center page-col">
            <div class="col-xl-10 col-12">
                <div class="card">
                    <div class="card-body">
                        <div class="row mb-3">
                            <div class="col-md">
                                <div class="row mb-3">
                                    <form id="glossaryManageForm" method="POST" action="{{ route('glossary-update') }}">
                                        @csrf
                                        @if( $glossary )
                                            <input id="id" name="id" type="hidden" value="{{ $glossary->id }}"/>
                                        @endif
                                        <div class="row">
                                            <label for="term" class="col-sm-2 col-form-label required-label">{{ __('Term') }}</label>
                                            <div class="col-sm-10">
                                                <input id="term" name="term" type="text" class="form-control @error('term') is-invalid @enderror"  placeholder="Term of the word" value="{{ old('term') ?? ($glossary?->term ?? '') }}"/>
                                                @error('term')
                                                <span class="invalid-feedback mt-2" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                                @enderror
                                            </div> 
                                        </div>
                                        <div class="row my-4">
                                            <label for="definition" class="col-sm-2 col-form-label required-label">{{ __('Definition') }}</label>
                                            <div class="col-sm-10">
                                                <textarea id="definition" name="definition" type="text" class="form-control @error('definition') is-invalid @enderror"  placeholder="Definition of the term/example of the term">{{ old('definition') ?? ($glossary?->definition ?? '') }}</textarea>
                                                @error('definition')
                                                <span class="invalid-feedback mt-2" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="row my-4">
                                            <label for="references" class="col-sm-2 col-form-label">{{ __('Reference') }}</label>
                                            <div class="col-sm-10">
                                                <input id="references" name="references" type="text" class="form-control @error('references') is-invalid @enderror" placeholder="Reference link" value="{{ old('references') ?? ($glossary?->references ?? '') }}"/>
                                                @error('references')
                                                <span class="invalid-feedback mt-2" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="row my-4">
                                            <label for="keywords" class="col-sm-2 col-form-label required-label">{{ __('Keywords') }}</label>
                                            <div class="col-sm-10">
                                                <input id="keywords" name="keywords" type="text" class="form-control @error('keywords') is-invalid @enderror" placeholder="Use ; to seperate between new keyword" value="{{  old('keywords') ?? ($glossary && $glossary->keywords ? implode('; ', $glossary->keywords) : '') }}"/>
                                                @error('keywords')
                                                <span class="invalid-feedback mt-2" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="row my-4">
                                            <label for="department_id" class="col-sm-2 col-form-label required-label">
                                                {{ __('Department') }}
                                            </label>
                                            <div class="col-sm-10">
                                                <select class="form-select" id="department_id" name="department_id" aria-label="Department">
                                                    <option {{ old('department_id') || $glossary ? '' : 'selected' }} disabled>
                                                        Select department
                                                    </option>
                                                    @foreach( $departments as $department )
                                                        <option value="{{ $department->id }}" {{ old('department_id') && old('department_id') == $department->id ? 'selected' : ( $glossary && $glossary->department_id == $department->id ? 'selected' : '' ) }}> {{ $department->name }}
                                                    @endforeach
                                                </select>
                                                @error('department_id')
                                                <span class="invalid-feedback mt-2" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="row mt-4">
                                            <div class="col-12 text-end d-flex pt-3">
                                                <a class="btn btn-black btn-custom" href="{{ route('glossary-index') }}">Back</a>
                                                <button type="submit" class="ms-3 btn btn-purple">Submit</button>
                                            </div>
                                        </div>
                                    </form>
                                    
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection