@extends('backend.layouts.app')
@section('content')
<div class="row mx-auto">
    <div class="col-sm-9">
        <div class="card">
            <div class="card-header align-items-center d-flex">
                <h4 class="card-title mb-0 flex-grow-1">{{ translate('Teacher Details') }}</h4>
                
            </div>
            <div class="card-body">
            <form action="{{ route('teacher.store') }}" method="POST" enctype="multipart/form-data" autocomplete="off">
                @csrf
                <div class="row mb-3">
                    <div class="col-lg-3">
                        <label for="address" class="form-label">{{ translate('School') }}<span class="text-danger">*</span></label>
                    </div>
                    <div class="col-lg-9">
                        <select title="Select School" name="school" id="school" class="form-control rns-selectpicker  @error('school') is-invalid @enderror">
                            @if ($schools->isNotEmpty())
                                @foreach ($schools as $school)
                                    <option value="{{$school->id}}">{{$school->name}}</option>
                                @endforeach
                            @endif
                        </select>
                        @error('school')
                            <div class="invalid-feedback">{{ $message }}</div> 
                        @enderror
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-lg-3">
                        <label for="address" class="form-label">{{ translate('Subjects') }}<span class="text-danger">*</span></label>
                    </div>
                    <div class="col-lg-9">
                        <select title="Select Subjects" name="subjects[]" multiple id="school" class="form-control rns-selectpicker @error('subjects') is-invalid @enderror">
                            @if ($subjects->isNotEmpty())
                                @foreach ($subjects as $subject)
                                    <option value="{{$subject->id}}">{{$subject->name}}</option>
                                @endforeach
                            @endif
                        </select>
                        @error('subjects')
                        <div class="invalid-feedback">{{ $message }}</div> 
                        @enderror
                    </div>
                </div>
                <x-input-component name="name" label="Name" value="0" type="text" :required="1"/>
                <x-input-component name="email" label="Email" value="0" type="email" :required="0"/>
                <x-input-component name="phone" label="Phone" value="0" type="text" :required="0"/>
                <div class="row mb-3">
                    <div class="col-lg-3">
                        <label for="address" class="form-label">User Name</label>
                    </div>
                    <div class="col-lg-9">
                        <input type="text" name="username" class="form-control @error('username') is-invalid @endif" placeholder="User name" required value="{{old('username')}}">
                        @error('username')<span class="invalid-feedback" role="alert">{{ $message }}</span>@enderror
                        <span class="text-danger fs-13" id="user_err">This User name is already exist</span>
                    </div>
                </div>
                <x-input-component name="password" label="Password" value="0" type="password" :required="1"/>
                <x-input-component name="emergency_phone" label="Emergency Phone" value="0" type="text" :required="0"/>
                <x-uploader-component name="image" label="Profile Image" value="" type="image"/>
               
                <div class="row mb-3">
                    <div class="col-lg-3">
                        <label for="dob" class="form-label">{{ translate('Date of birth') }}</label>
                    </div>
                    <div class="col-lg-9">
                        <input type="text" name="dob" class="form-control border-1 flatpickr-input active" data-provider="flatpickr" data-date-format="Y-m-d" readonly="readonly" placeholder="Date of Birth" value="{{old('dob')}}">
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-lg-3">
                        <label for="dob" class="form-label">{{ translate('Gender') }}</label>
                    </div>
                    <div class="col-lg-1">
                        <label for="dob" class="form-label">{{ translate('Male') }}</label>
                    </div>
                    <div class="col-lg-2">
                        <label class="rns-switch rns-switch-primary">
                            <input type="radio" name="gender" class="form-control demo-sw" value="male">
                            <span class="slider round"></span>
                        </label>                    </div>
                    <div class="col-lg-1">
                        <label for="dob" class="form-label">{{ translate('Female') }}</label>
                    </div>
                    <div class="col-lg-1">
                        <label class="rns-switch rns-switch-primary">
                            <input type="radio" name="gender" class="form-control demo-sw" value="female">
                            <span class="slider round"></span>
                        </label>
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-lg-3">
                        <label for="address" class="form-label">{{ translate('Address') }}</label>
                    </div>
                    <div class="col-lg-9">
                        <textarea name="address" class="form-control" id="address" rows="3" placeholder="Address">{{old('address')}}</textarea>
                    </div>
                </div>
                <div class="row mb-3">
                    <div class="col-lg-3">
                        <label for="about" class="form-label">{{ translate('About') }}</label>
                    </div>
                    <div class="col-lg-9">
                        <textarea name="about" class="form-control" id="about" rows="3" placeholder="About">{{old('about')}}</textarea>
                    </div>
                </div>
                <div class="text-end">
                    <button type="submit" class="btn btn-primary">Add Teacher</button>
                </div>
            </form>
            </div>
        </div>
    </div>
</div>
@endsection