@extends('templates.master')

@section('breadcrumb')
  <div class="content content-full">
    <div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center py-2">
      <div class="flex-grow-1">
        <h1 class="h3 fw-bold mb-2">
          @php
          $title = "anggota"
          @endphp
          {{ strtoupper($title) }}
        </h1>
      </div>
      <nav class="flex-shrink-0 mt-3 mt-sm-0 ms-sm-3" aria-label="breadcrumb">
        <ol class="breadcrumb breadcrumb-alt">
          <li class="breadcrumb-item">
            <a class="link-fx" href="#">Dashboard</a>
          </li>
          <li class="breadcrumb-item">
            <a class="link-fx" href="#">{{ ucfirst($title) }}</a>
          </li>
          <li class="breadcrumb-item" aria-current="page">
            Tambah
          </li>
        </ol>
      </nav>
    </div>
  </div>
@endsection

@section('content')

  <div class="block block-rounded">
    <div class="block-header block-header-default">
      <h3 class="block-title">REGISTRASI {{ $title }}</h3>
      <a href="{{ url('anggota') }}/{{ session()->get('kantor') }}" class="btn btn-danger">Kembali</a>
    </div>
    <div class="block-content block-content-full">
      <div class="row">
        <div class="col">
          
            <nav>

              <div class="nav nav-pills nav-fill" id="nav-tab" role="tablist">
                <a class="nav-link" href="{{ url('anggota') }}/tambah/{{ session()->get('kantor') }}">Data Anggota</a>
                <a class="nav-link active" href="#">Data Pasangan</a>
                <a class="nav-link" href="{{ url('anggota-tanggungan') }}/tambah/{{ session()->get('kantor') }}">Data Anggota Keluarga</a>
                <a class="nav-link" id="step3-tab" data-bs-toggle="tab" href="#step3">Aset Rumah Tangga</a>
                <a class="nav-link" id="step3-tab" data-bs-toggle="tab" href="#step3">Usaha Rumah Tangga</a>
                <a class="nav-link" id="step3-tab" data-bs-toggle="tab" href="#step3">Pendapatan</a>
              </div>
            </nav>

            <div class="tab-content py-5">

              <!-- Anggota asangan -->
              <div class="tab-pane fade show active" id="step1">
                {{-- <h4>Data Pasangan</h4> --}}
                <form action="{{ url('anggota-pasangan') }}/store/{{ session()->get('kantor') }}" method="POST">
                  @csrf
                  <div class="row justify-content-center">
                    <div class="col-md-6">
                      <div class="form-group">
                        <label>Anggota</label>
                        <select name="idanggota" class="form-control mb-4" required>
                          <option value="" hidden>-- Pilih --</option>
                          @foreach($anggota as $item)
                          <option value="{{ $item['IDANGGOTA'] }}">{{ $item['NAMA'] }}</option>
                          @endforeach
                        </select>
                      </div>

                      <div class="form-group">
                        <label>Nama</label>
                        <input type="text" class="form-control mb-4" name="nama" value="" required>
                      </div>

                      <div class="form-group">
                        <label>Tempat Lahir</label>
                        <input type="text" class="form-control mb-4" name="tmplahir" value="" required>
                      </div>

                      <div class="form-group">
                        <label>Tanggal Lahir</label>
                        <input type="date" class="form-control mb-4" name="tglahir" value="" required>
                      </div>

                      <div class="form-group">
                        <label>Pendidikan</label>
                        <select name="penddk" class="form-control mb-4" required>
                          <option value="" hidden>-- Pilih --</option>
                          <option value="01">Kelas 1</option>
                          <option value="02">Kelas 2</option>
                          <option value="03">Kelas 3</option>
                        </select>
                      </div>

                      <div class="col-md">
                        <div class="row">
                          <div class="col">
                            <div class="form-group">
                              <label>Jenis Pekerjaan</label>
                              <select name="pekerj" class="form-control mb-4" required>
                                <option value="" hidden>-- Pilih --</option>
                                <option value="01">Swasta</option>
                                <option value="02">PNS</option>
                              </select>
                            </div>
                          </div>

                          <div class="col-md-8">
                            <div class="form-group">
                              <label>Keterangan</label>
                              <input type="text" class="form-control mb-4" name="ketkerj" value="" required>
                            </div>
                          </div>
                        </div>
                      </div>

                      <div class="form-group">
                        <label>Agama</label>
                        <select name="agama" class="form-control mb-4" required>
                          <option value="" hidden>-- Pilih --</option>
                          <option value="1">Islam</option>
                          <option value="2">Kristen</option>
                          <option value="3">Hindu</option>
                        </select>
                      </div>
                    </div>
                  </div>
                  <div class="modal-footer">
                    <a href="{{ url('anggota') }}/{{ session()->get('kantor') }}"></a>
                    <button type="submit" class="btn btn-primary">Submit</button>
                  </div>
                </form>

              </div>
              {{-- End Anggota Pasangan --}}
            </div>
              
          </div>
        </div>
      </div>
  </div>

@endsection