|
@@ -1,8 +1,8 @@
|
|
|
@extends('layouts.login')
|
|
|
@section('content')
|
|
|
|
|
|
-<div class="blue-card p-4">
|
|
|
- <form action="{{route('process-confirm-auth-token')}}" method="post">
|
|
|
+<div id="confirmAuthTokenComponent" class="blue-card p-4" v-cloak>
|
|
|
+ <form action="{{route('process-confirm-auth-token')}}" method="post">
|
|
|
<div class="text-center d-flex align-items-center my-3">
|
|
|
<img src="/img/icon.svg" alt="Logo" height="35">
|
|
|
<h5 class="font-weight-bold ml-2 mb-0">Confirm Token</h5>
|
|
@@ -14,7 +14,7 @@
|
|
|
<div class="form-group">
|
|
|
<label>
|
|
|
<strong>
|
|
|
- Please enter the confirmation token.
|
|
|
+ Please enter the confirmation token sent to {{ $maskedCellNumber }}.
|
|
|
</strong>
|
|
|
</label>
|
|
|
<input class="form-control" name="confirmation_token" autocomplete="off" autofocus value="{{old('confirmation_token')}}">
|
|
@@ -25,6 +25,51 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
+ <div class="text-center mt-3">
|
|
|
+ <div class="d-flex align-items-center flex-wrap justify-content-center">
|
|
|
+ <a href="#" class="text-underline" resend-token>
|
|
|
+ <u v-if="!loading">Resend token</u>
|
|
|
+ <u v-else><i class="fas fa-circle-notch fa-spin"></i> Resending...</u>
|
|
|
+ </a>
|
|
|
+ <span class="mx-2 font-weight-bold">OR</span>
|
|
|
+ <a href="{{ route('login') }}"><u>Change phone number</u></a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="response" class="text-center">
|
|
|
+ <small v-if="!response.success" class="text-danger"><i class="fas fa-exclamation-triangle"></i> @{{ response.message }}</small>
|
|
|
+ <small v-else class="text-success"><i class="fas fa-check-circle"></i> Confirmation code has been resent!</small>
|
|
|
+ </div>
|
|
|
<p><small class="text-center d-block text-muted my-3">If you have any questions at all, please contact your Dedicated HR Representative at the phone number or email displayed inside this portal.</small></p>
|
|
|
</div>
|
|
|
-@endsection
|
|
|
+
|
|
|
+<script>
|
|
|
+ var confirmAuthTokenComponent = new Vue({
|
|
|
+ el: '#confirmAuthTokenComponent',
|
|
|
+ data: {
|
|
|
+ loading: false,
|
|
|
+ response: null
|
|
|
+ },
|
|
|
+ delimiters: ['@[[', ']]'],
|
|
|
+ methods: {
|
|
|
+ initResendConfirmationToken: function() {
|
|
|
+ var self = this;
|
|
|
+ $('[resend-token]').click(function(evt) {
|
|
|
+ evt.preventDefault();
|
|
|
+ if (self.loading) return;
|
|
|
+ self.loading = true;
|
|
|
+ $.post("{{ route('resend-sms-auth-token') }}", {}, function(response) {
|
|
|
+ self.loading = false;
|
|
|
+ self.response = response;
|
|
|
+ }, 'json');
|
|
|
+ });
|
|
|
+ },
|
|
|
+ init: function() {
|
|
|
+ this.initResendConfirmationToken();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted: function() {
|
|
|
+ this.init();
|
|
|
+ }
|
|
|
+ });
|
|
|
+</script>
|
|
|
+@endsection
|