Login System implements

This commit is contained in:
Jan_Hill 2024-12-19 09:02:32 +01:00
parent 0106c8c565
commit 13a0dcbc60
4 changed files with 118 additions and 13 deletions

View File

@ -0,0 +1,33 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Validation\ValidationException;
class AuthController extends Controller
{
public function authenticate(Request $request)
{
try {
$credits = $request->validate([
"email" => "required|email",
"password" => "required"
]);
if (Auth::attempt(["email" => $credits["email"], "password" => $credits["password"]])) {
$user = Auth::user();
return response()->json(["account" => $user->name], 200);
}
return response()->json(["error" => "Invalid email or password."], 401);
} catch (\Illuminate\Validation\ValidationException $exception) {
return response()->json(['error' => $exception->errors()], 422);
} catch (\Exception $exception) {
return response()->json(['error' => 'An unexpected error occurred.'], 500);
}
}
}

View File

@ -1 +1,9 @@
import 'flowbite';
import axios from 'axios';
import Swal from 'sweetalert2';
import 'animate.css';
window.axios = axios;
window.Swal = Swal;
console.log('Libraries are now available globally:', { axios, Swal });

View File

@ -10,31 +10,31 @@
<section class="bg-slate-900 text-gray-50">
<div class="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
<a href="#" class="flex items-center mb-6 text-2xl font-semibold text-gray-50">
<div class="col align-middle d-flex justify-center">
<img class="col-1 border-spacing-y-2.5 w-8 h-8 mr-2" src="{{asset('brand/secure.gif')}}" alt="Brand - NCORE Smart Firewall" style="width: 92px; height: auto;">
<b class="col-2">NCORE</b>
</div>
<div class="col align-middle d-flex justify-center">
<img class="col-1 border-spacing-y-2.5 w-8 h-8 mr-2" src="{{ asset('brand/secure.gif') }}" alt="Brand - NCORE Smart Firewall" style="width: 92px; height: auto;">
<b class="col-2">NCORE</b>
</div>
</a>
<div class="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
<div class="p-6 space-y-4 md:space-y-6 sm:p-8">
<h1 class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white">
Secure Login
</h1>
<form class="space-y-4 md:space-y-6">
<form id="loginForm" class="space-y-4 md:space-y-6">
<div>
<label for="email" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Your Account Email</label>
<input type="email" name="email" id="email" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="admin@domain.com" required="">
<input type="email" name="email" id="email" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="admin@domain.com">
</div>
<div>
<label for="password" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Your Account Password</label>
<input type="password" name="password" id="password" placeholder="••••••••" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" required="">
<input type="password" name="password" id="password" placeholder="••••••••" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
</div>
<div class="w-full d-flex justify-center">
<button type="button" onclick="submit()" class="relative inline-flex items-center justify-center p-0.5 mb-2 me-2 overflow-hidden text-sm font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-purple-600 to-blue-500 group-hover:from-purple-600 group-hover:to-blue-500 hover:text-white dark:text-white focus:ring-4 focus:outline-none focus:ring-blue-300 dark:focus:ring-blue-800">
<span class="relative px-5 py-2.5 transition-all ease-in duration-100 bg-white dark:bg-gray-900 rounded-md group-hover:bg-opacity-0">
Authentication
</span>
</button>
<button type="submit" class="relative inline-flex items-center justify-center p-0.5 mb-2 me-2 overflow-hidden text-sm font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-purple-600 to-blue-500 group-hover:from-purple-600 group-hover:to-blue-500 hover:text-white dark:text-white focus:ring-4 focus:outline-none focus:ring-blue-300 dark:focus:ring-blue-800">
<span class="relative px-5 py-2.5 transition-all ease-in duration-100 bg-white dark:bg-gray-900 rounded-md group-hover:bg-opacity-0">
Authentication
</span>
</button>
</div>
</form>
</div>
@ -42,6 +42,56 @@
</div>
</section>
<script>
document.addEventListener('DOMContentLoaded', () => {
const form = document.getElementById('loginForm');
if (form) {
form.addEventListener('submit', (event) => {
event.preventDefault(); // Prevent default form submission
const email = document.getElementById('email').value;
const password = document.getElementById('password').value;
axios.post("{{ route('post_login') }}", {
email: email,
password: password
})
.then(function (response) {
Swal.fire({
title: "Success!",
text: "You are Logged in as " + response.data.account,
icon: "success"
});
console.log(response);
})
.catch(function (error) {
Swal.fire({
title: "Error!",
text: error.response?.data?.message || "An error occurred.",
icon: "error",
showClass: {
popup: `
animate__animated
animate__fadeInUp
animate__faster
`
},
hideClass: {
popup: `
animate__animated
animate__fadeOutDown
animate__faster
`
}
});
console.log(error);
});
});
}
});
</script>
</body>
</html>

View File

@ -7,13 +7,27 @@ Route::get('/', function () {
return redirect('cp');
});
// The Login form when you are not Logged in
Route::Group(['prefix' => 'cp', 'middleware' => 'web'], function () {
Route::get('/', function (\Illuminate\Http\Request $request) {
if (!Auth::check()) {
return redirect()->route('auth');
} else {
return redirect()->route('dashboard');
return redirect()->route('internal');
}
});
Route::get('auth/',[\App\Http\Controllers\SmartController::class, 'index'])->name('auth');
});
// Calls for Controllers
Route::Group(['prefix' => 'call', 'middleware' => 'web'], function () {
Route::post('login', [\App\Http\Controllers\AuthController::class, 'authenticate'])->name('post_login');
});
// Internal Area when do you have permissions and logged in
Route::Group(['prefix' => 'internal', 'middleware' => 'auth'], function () {
Route::get('dashboard/', [\App\Http\Controllers\SmartController::class, 'dashboard'])->name('dashboard');
});