@extends('pwa.template.main')
@section('content')
  <!-- Login Wrapper Area-->
  <div class="login-wrapper d-flex align-items-center justify-content-center text-center"
    style="background-color: #9E0E13; background: #9E0E13;">
    <!-- Background Shape-->
    <div class="background-shape"></div>
    <div class="container">
      <div class="row justify-content-center">
        <div class="col-10 col-lg-8"><img class="big-logo" src="img/core-img/logo-white.png" alt="">
          <!-- Register Form-->
          <div class="register-form mt-5">
            <form enctype="multipart/form-data" action="{{ route('register.action') }}" method="POST">
              @csrf
              <h1 class="mb-2 text-white">Desa Digital</h1>
              <p class="mb-5 text-white">
                Bersama Desa Digital Membangun Negeri
              </p>
              <div class="form-group text-start mb-4">
                <span>Foto Anda</span>
                {{-- <input class="form-control" id="foto" type="text" name="foto" /> --}}
                <input type="file" class="dropify" name="foto" required value="{{ old('foto') }}" />
              </div>
              <div class="form-group text-start mb-4">
                <span>Nama</span>
                <label for="Nama"><i class="fa-solid fa-user"></i></label>
                <input class="form-control" id="Nama" type="text" placeholder="Nama Lengkap" name="nama"
                  required value="{{ old('nama') }}" />
              </div>
              <div class="form-group text-start mb-4">
                <span>Username</span>
                <label for="username"><i class="fa-solid fa-user"></i></label>
                <input class="form-control @error('username')
                is-invalid
                @enderror"
                  id="username" type="text" placeholder="username Lengkap" name="username" required
                  value="{{ old('username') }}" />
                @error('username')
                  <div id="validationServer04Feedback" class="invalid-feedback">
                    {{ $message }}
                  </div>
                @enderror
              </div>
              <div class="form-group text-start mb-4">
                <span>Nomor KTP</span>
                <label for="no_ktp"><i class="fa-solid fa-user"></i></label>
                <input class="form-control @error('no_ktp')
                is-invalid
              @enderror"
                  id="no_ktp" type="text" placeholder="Nomor KTP Anda" name="no_ktp" required
                  value="{{ old('no_ktp') }}" />

                @error('no_ktp')
                  <div class="invalid-feedback">
                    {{ $message }}
                  </div>
                @enderror
              </div>
              <div class="form-group text-start mb-4">
                <span>Nomor Hp</span>
                <label for="no_hp"><i class="fa-solid fa-mobile-screen"></i></label>
                <input class="form-control" id="no_hp" type="text" name="no_hp" placeholder="+62XXXXXXXXXXX"
                  name="no_hp" required value="{{ old('no_hp') }}" />
              </div>
              <div class="form-group text-start mb-4">
                <span>Alamat</span>
                <label for="alamat"><i class="fa-solid fa-house-chimney"></i></label>
                <input class="form-control" id="alamat" type="text" name="alamat" placeholder="Jl. Contoh No.8"
                  name="alamat" required value="{{ old('alamat') }}" />
              </div>

              <div class="form-group text-start mb-4">
                <span>Foto TTD</span>
                {{-- <input class="form-control" id="foto" type="text" name="foto" /> --}}
                <input type="file" class="dropify" name="ttd" required value="{{ old('foto') }}" />
              </div>
              <div class="form-group text-start mb-4">
                <span>Password</span>
                <label for="password"><i class="fa-solid fa-key"></i></label>
                <input class="form-control" id="password" type="password" placeholder="Password" name="password"
                  required />
              </div>
              <button class="btn btn-warning btn-lg w-100" type="submit">Daftar</button>
            </form>
          </div>
          <!-- Login Meta-->
          <div class="login-meta-data">
            <p class="mt-3 mb-0">Sudah Punya Akun ?<a class="mx-1" href="{{ route('login') }}">Masuk</a></p>
          </div>
        </div>
      </div>
    </div>
  </div>
@endsection
@section('script')
  <script>
    $('.dropify').dropify({
      tpl: {
        message: '<div class="dropify-message"><span class="file-icon" /></div>',
      }
    });
  </script>
  @if (session('failed'))
    <script>
      Swal.fire({
        icon: 'error',
        title: 'Gagal Registrasi',
        text: "{{ session('failed') }}",
      })
    </script>
  @endif
@endsection