Fixed - Password & Confirm Password in create user now need to be the same.

Added new "see password" function on all password sites.
Fixed bugs
This commit is contained in:
Anders
2020-08-03 10:36:57 +02:00
parent 93198e5a54
commit b4263d8891
5 changed files with 69 additions and 52 deletions
@@ -11,6 +11,7 @@
@section("content")
<h1>Opret Bruger:</h1>
{!! session()->get('error#notsamepass') !!}
<form method="post" action="{{ route("users.store") }}">
@csrf
<label for="name_first">Fornavn:</label>
@@ -20,9 +21,15 @@
<label for="email">Email:</label>
<input type="email" name="email" id="email" placeholder="x@y.z" required>
<label for="password1">Password:</label>
<input type="password" name="password" placeholder="Password" id="password1" required>
<label for="password2">Bekræft Password:</label>
<input type="password" id="password2" placeholder="Bekræft Password" required>
<div class="input-group text-left">
<input type="password" class="form-control" name="password" id="password1" placeholder="******" required>
<span class="fa fa-fw fa-eye field-icon toggle-password" id="fa-new" onclick="show('password1', 'fa-new')"></span>
</div>
<label for="password2">Confirm Password:</label>
<div class="input-group text-left">
<input type="password" class="form-control" name="password2" id="password2" placeholder="******" required>
<span class="fa fa-fw fa-eye field-icon toggle-password" id="fa-confirm" onclick="show('password2', 'fa-confirm')"></span>
</div>
<label for="tel">Telefon nr:</label>
<input type="tel" name="phone" id="tel" placeholder="12345678" pattern="[0-9]{2}[0-9]{2}[0-9]{2}[0-9]{2}" required>
<label for="roles">Rolle:</label>
@@ -36,3 +43,20 @@
<input type="submit" class="btn btn-dark text-white" value="Opret">
</form>
@endsection
@section("scripts")
<script>
function show($passID, $faID) {
var inputPass = document.getElementById($passID);
var faEye = document.getElementById($faID);
if (inputPass.type === "password") {
inputPass.type = "text";
faEye.style.color = "#000";
} else {
inputPass.type = "password";
faEye.style.color = "#808080";
}
}
</script>
@endsection
@@ -11,8 +11,8 @@
@section("content")
<h1>Rediger Bruger:</h1>
{!! session()->get('error#passnotsame') !!}
<form method="post" action="{{ route("users.update", ['user' => $user]) }}" style="display: inline-table;">
{!! session()->get('error#notsamepass') !!}
<form method="post" action="{{ route("users.update", ['user' => $user]) }}">
@csrf
@method("put")
<label for="name_first">Fornavn:</label>
@@ -22,11 +22,15 @@
<label for="email">Email:</label>
<input type="email" name="email" id="email" value="{{ $user->email }}" required>
<label for="password1">Password: (Forblives blank, hvis password ikke skal ændres)</label>
<input type="password" name="password" id="password1" value="" placeholder="******">
<span toggle="#password-field" class="fa fa-fw fa-eye field-icon toggle-password" id="fa-new" onclick="show('password1', 'fa-new')"></span>
<div class="input-group text-left">
<input type="password" class="form-control" name="password" id="password1" value="" placeholder="******">
<span class="fa fa-fw fa-eye field-icon toggle-password" id="fa-new" onclick="show('password1', 'fa-new')"></span>
</div>
<label for="password2">Confirm Password: (Forblives blank, hvis password ikke skal ændres)</label>
<input type="password" name="password2" id="password2" value="" placeholder="******">
<span toggle="#password-field" class="fa fa-fw fa-eye field-icon toggle-password" id="fa-confirm" onclick="show('password2', 'fa-confirm')"></span>
<div class="input-group text-left">
<input type="password" class="form-control" name="password2" id="password2" value="" placeholder="******">
<span class="fa fa-fw fa-eye field-icon toggle-password" id="fa-confirm" onclick="show('password2', 'fa-confirm')"></span>
</div>
<label for="tel">Telefon nr:</label>
<input type="tel" name="phone" id="tel" value="{{ $user->phone }}" required>
<label for="role">Rolle: (Brug ctrl og shift til at vælge flere)</label>
@@ -54,19 +58,6 @@
</select>
<input type="submit" class="btn btn-dark text-white" value="Rediger">
</form>
<style>
input {
width: calc(100% - 8px);
}
.fa-eye {
position: absolute;
font-size: 25px;
color: grey;
margin: 7.5px 0 0 -45px;
}
</style>
@endsection
@section("scripts")
@@ -7,7 +7,7 @@
@section("content")
<main>
<h1 class="text-center sde-blue mt-0">Konto</h1>
<form method="post" action="{{ route("users.accountupdate", ['user' => Auth::user()]) }}" style="display: inline-table;">
<form method="post" action="{{ route("users.accountupdate", ['user' => Auth::user()]) }}">
@csrf
@method("put")
<span>Nuværende Password:</span>
@@ -20,7 +20,7 @@
<input type="password" class="form-control" name="password" id="new" placeholder="******" required>
<span class="fa fa-fw fa-eye field-icon toggle-password" id="fa-new" onclick="show('new', 'fa-new')"></span>
</div>
<span>Bekræft Nyt Password:</span>
<span>Confirm Password:</span>
<div class="input-group text-left">
<input type="password" class="form-control" name="confirmpassword" id="confirm" placeholder="******" required>
<span class="fa fa-fw fa-eye field-icon toggle-password" id="fa-confirm" onclick="show('confirm', 'fa-confirm')"></span>
@@ -12,7 +12,10 @@
<form action="{{ route("users.login") }}" method="post">
@csrf
<input class="appinput" type="email" name="email" placeholder="Email" required>
<input class="appinput" type="password" name="password" placeholder="Password" required>
<div class="input-group text-left">
<input type="password" class="appinput form-control" name="password" id="password" placeholder="Password" required>
<span class="fa fa-fw fa-eye field-icon toggle-password" id="fa-password" onclick="show('password', 'fa-password')" style="background-color: #00788a; color: white;"></span>
</div>
<label class="toggle">
<input class="toggle__input" type="checkbox" name="rememberpassword">
<span class="toggle__label">
@@ -25,3 +28,20 @@
<a class="text-white text-center" href="{{ route('users.show-forgot') }}">Forgot password?</a>
</main>
@endsection
@section("scripts")
<script>
function show($passID, $faID) {
var inputPass = document.getElementById($passID);
var faEye = document.getElementById($faID);
if (inputPass.type === "password") {
inputPass.type = "text";
faEye.style.color = "#999";
} else {
inputPass.type = "password";
faEye.style.color = "#fff";
}
}
</script>
@endsection