@extends('layout.layout')

@section('content')
@include('custom::component.reply-btn', ['url' => route('login')])

<div class="row mb-3">
  @if(Session::has('forget')||$auto_verify)
  <div class="col-12 offset-md-1 col-md-10">
    <div class="card">
      <h5 class="card-header align-middle">輸入驗證碼</h5>
      <div class="card-body">
        <form method="POST" id="verify_form" class="py-2" action="{{ url('/user/forget/verify') }}">
          {{csrf_field()}}
          <input type="hidden" name="login" value="@if(Session::has('forget')) {{\Session::get('forget')}} @else {{$data['login']}} @endif">
          <div class="form-group row">
            <label class="col-form-label col-12 col-sm-3 text-sm-center">
              <span class="align-middle"><span class="text-red">※&ensp;</span><b>驗證碼(7碼)</b></span>
            </label>
            <div class="input-group col-12 col-sm-9">
              <input type="text" name="verify" class="form-control {{ $errors->has('verify') ? ' is-invalid' : '' }}" value="{{$data['token'] ?? null}}" placeholder="驗證碼(7碼)"  required>
              <small class="form-text text-danger" style="width:100%;">驗證碼有效時間為５分鐘。</small>
              @if ($errors->has('verify'))
                @foreach($errors->get('verify') as $error)
                <div class="invalid-feedback">
                  {{ $error }}
                </div>
                @endforeach
              @endif
            </div>
          </div>
          <input type="hidden" name="action" value="verify">
        </form>
        <form method="POST" id="reset_form"action="{{ url('/user/forget/verify') }}">
          {{csrf_field()}}
          <input type="hidden" name="action" value="reset">
        </form>
        <div class="col-12 text-center mt-3">
          <button data-form="reset_form" class="btn btn-lg btn-success font-weight-bold btn-reset btn-custom-submit mr-5">重新發送驗證碼</button>
          <button data-form="verify_form" class="btn btn-lg btn-success font-weight-bold btn-verify btn-custom-submit">驗證</button>
        </div>

      </div>
    </div>
  </div>
  @else
  <div class="col-12 offset-md-1 col-md-10">
    <div class="card">
      <h5 class="card-header align-middle">忘記密碼</h5>
      <div class="card-body">
        <form method="POST" class="py-2">
          {{csrf_field()}}
          <div class="form-group row">
            <label class="col-form-label col-12 col-sm-3 text-sm-center">
              <span class="align-middle"><span class="text-red">※&ensp;</span><b>帳號</b></span>
            </label>
            <div class="input-group col-12 col-sm-9">
              <input type="text" name="uid" class="form-control {{ $errors->has('uid') ? ' is-invalid' : '' }}" value="{{ old('uid',null) }}" placeholder="帳號" required>
              <small class="form-text text-muted" style="width:100%;"></small>
              @if ($errors->has('uid'))
                @foreach($errors->get('uid') as $error)
                <div class="invalid-feedback">
                  {{ $error }}
                </div>
                @endforeach
              @endif
            </div>
          </div>
          @if(FORGET_PWD_VERIFY_MODE=='sms')
          <div class="form-group row">
            <label class="col-form-label col-12 col-sm-3 text-sm-center">
              <span class="align-middle"><span class="text-red">※&ensp;</span><b>手機號碼(10碼)</b></span>
            </label>
            <div class="input-group col-12 col-sm-9">
              <input type="text" name="phone" class="form-control {{ $errors->has('phone') ? ' is-invalid' : '' }}" value="{{ old('phone',null) }}" placeholder="09XXXXXXXX" pattern="[\d]+" required>
              <small class="form-text text-muted" style="width:100%;"></small>
              @if ($errors->has('phone'))
                @foreach($errors->get('phone') as $error)
                <div class="invalid-feedback">
                  {{ $error }}
                </div>
                @endforeach
              @endif
            </div>
          </div>
          @endif
          <div class="col-12 text-center mt-5">
            <input type="submit" name="submit" class="btn btn-lg btn-success font-weight-bold" value="寄送驗證碼">
          </div>
        </form>
      </div>
    </div>
  </div>
  @endif
</div>
@endsection

{{-- Script --}}
@push('scripts')
@if($auto_verify)
<script>
$(document).ready(function() {
  var form = $("#verify_form");
  LoadingCover.show();
  form.submit();
});
</script>
@endif
<script>
$(document).ready(function() {
  $(document).on('click', '[name=submit]', function() {
      var form = $(this).parents('form');
      if (!form[0].checkValidity()) {
        return;
      }
      LoadingCover.show();
  });
  $(document).on('click', '.btn-custom-submit', function() {
    var form_id = $(this).data('form');
    var form = $("#"+form_id);
    if (!form[0].checkValidity()) {
      form[0].reportValidity();
      return;
    }
    LoadingCover.show();
    form.submit();
  });
});
</script>
@endpush