@extends('layouts.genindex')

@section('title')
    <i class="fas fa-user-circle filter-royalblue"></i> Teacher Registration
@endsection

@section('subtitle')
    Fill correct info
@endsection

@section('list')
    <div class="fdb-box row mx-1">
        <div class="col-12">
            @include('layouts.messages')
            <form method="post" action="{{ route('teacher.create') }}" autocomplete="off" id="regform"
            enctype="multipart/form-data">
                @csrf

                <div class="row">
                    <div class="col-12 col-md">
                        <label class="required">E-mel</label>
                        <input name='email' type="email" class="form-control" value="{{ old('email') }}"
                            data-parsley-trigger="change" required>
                    </div>
                    <div class="col-12 col-md">
                        <label class="required">Name</label>
                        <input name='name' type="name" class="form-control" value="{{ old('name') }}"
                            data-parsley-trigger="change" required>
                    </div>
                </div>

                <div class="row mt-4">
                    <div class="col-12 col-md">
                        <label for="password" class="required">Password</label>
                        <input name="password" id="password" type="password" class="form-control"
                        data-parsley-trigger="change"
                        data-parsley-minlength="8"
                        required>
                        <p>Minimum 8 characters</p>
                    </div>
                    <div class="col-12 col-md">
                        <label for="password_confirmation" class="required">Confirm Password</label>
                        <input name='password_confirmation' id="password-confirm" type="password" class="form-control"
                        data-parsley-trigger="change"
                        data-parsley-equalto="#password"
                        required>
                    </div>
                </div>
                <div class="row mt-4">
                    <div class="col-12 col-md-6">
                        <label class="required">No ID/Pendaftaran</label>
                        <input name='id_no' type="text" class="form-control" value="{{ old('id_no') }}"
                        data-parsley-trigger="change"
                        data-parsley-type="alphanum"
                        required>
                </div>
                <div class="col-12 col-md-6">
                    <label class="required">Sekolah</label>
                    <select name="pusat" class="form-control" required>
                      <option {{ old('pusat') ? "" : "selected" }} disabled>Sila pilih</option>
                      @foreach($maktabs as $maktab)
                        <option {{ old('pusat') == $maktab->nama_mrsm ? "selected" : "" }} value="{{ $maktab->kod_pusat }}">{{ $maktab->nama_mrsm }}</option>
                      @endforeach
                    </select>
                  </div>
            </div>
                <div class="row mt-4">
                    <div class="col">
                      <label class="required">Alamat <small>(Baris 1: Nombor/unit rumah/bangunan)</small></label>
                      <input name="address1" type="text" class="form-control" value="{{ old('address1') }}"
                      data-parsley-trigger="change"
                      data-parsley-pattern="^[a-zA-Z0-9\s\/\'\.\,\-\@\(\)\&]+"
                      required>
                    </div>
                  </div>
                  <div class="row mt-4">
                    <div class="col">
                      <label class="required">Alamat <small>(Baris 2: Nama jalan/taman/kampung)</small></label>
                      <input name="address2" type="text" class="form-control" value="{{ old('address2') }}"
                      data-parsley-trigger="change"
                      data-parsley-pattern="^[a-zA-Z0-9\s\/\'\.\,\-\@\(\)\&]+"
                      required>
                    </div>
                  </div>
                  <div class="row mt-4">
                    <div class="col-12 col-md-6">
                      <label class="required">Bandar</label>
                      <input name="city" type="text" class="form-control" value="{{ old('city') }}"
                      data-parsley-trigger="change"
                      data-parsley-pattern="^[a-zA-Z0-9\s\/\'\.\,\-\@\(\)\&]+"
                      required>
                    </div>
                    <div class="col-12 col-md-2 mt-4 mt-md-0">
                      <label class="required">Poskod</label>
                      <input name="postcode" type="text" class="form-control" value="{{ old('postcode') }}"
                      data-parsley-trigger="change"
                      data-parsley-type="digits"
                      data-parsley-length="[5, 5]"
                      data-parsley-error-message="Poskod perlu 5 angka"
                      required>
                    </div>
                    <div class="col-12 col-md-4 mt-4 mt-md-0">
                      <label class="required">Negeri</label>
                      <select name="state" class="form-control" required>
                        <option {{ old('state') ? "" : "selected" }} disabled>Sila pilih</option>
                        @foreach($states as $state)
                          <option {{ old('state') == $state->shortname ? "selected" : "" }} value="{{ $state->shortname }}">{{ $state->shortname }}</option>
                        @endforeach
                      </select>
                    </div>
                  </div>

                <div class="row mt-4">
                    <div class="col-12 col-md text-right">
                        <button type="submit" class="btn btn-primary">Register</button>
                    </div>
                </div>

            </form>

        </div>
    </div>
@endsection

@section('page_scripts')
<script>
    $('#regform').parsley();
</script>
@endsection