миграция для удаления имени пользователя, модальное окно, js-логика, клиентская…

миграция для удаления имени пользователя, модальное окно, js-логика, клиентская валидация, правки по верстке
parent e794075d
...@@ -19,19 +19,18 @@ class UserController extends Controller ...@@ -19,19 +19,18 @@ class UserController extends Controller
//dd($request->all()); //dd($request->all());
$request->validate([ $request->validate([
'name' => 'required',
'email' => 'required|email|unique:users', 'email' => 'required|email|unique:users',
'password' => 'required|confirmed', 'password' => 'required|confirmed',
]); ]);
$user = User::create([ $user = User::create([
'name' => $request->name, // || 'name' => $request->input('name'), //'name' => $request->name, // || 'name' => $request->input('name'),
'email' => $request->email, 'email' => $request->email,
'password' => Hash::make($request->password), 'password' => Hash::make($request->password),
'email_verified_at' => NOW(), 'email_verified_at' => NOW(),
]); ]);
session()->flash('success', 'Successful registration'); session()->flash('success', 'Реєстрація успішна');
Auth::login($user); Auth::login($user);
return redirect()->route('home'); // || redirect()->home(); || redirect('/'); return redirect()->route('home'); // || redirect()->home(); || redirect('/');
} }
...@@ -40,29 +39,32 @@ class UserController extends Controller ...@@ -40,29 +39,32 @@ class UserController extends Controller
//dd($request->all()); //dd($request->all());
$request->validate([ $request->validate([
'name' => 'required',
'email' => 'required|email', 'email' => 'required|email',
'password' => 'required|confirmed', 'password' => 'required|confirmed',
]); ]);
$user = Auth()->user(); $user = Auth()->user();
$user->name = $request->name;
$user->email = $request->email; $user->email = $request->email;
$user->password = Hash::make($request->password); $user->password = Hash::make($request->password);
$user->email_verified_at = NOW(); $user->email_verified_at = NOW();
if ($user->save()) { if ($user->save()) {
session()->flash('success', 'Sittings saved successful'); session()->flash('success', 'Налаштування збережено успішно');
return redirect()->back(); return redirect()->back();
} }
return redirect()->back()->with('error', 'Sittings saving error'); return redirect()->back()->with('error', 'Виникла помилка при збереженні налаштувань');
} }
public function loginForm() { public function loginForm() {
return view('user.login'); return view('user.login');
} }
public function loginAuth() {
$is_auth = true;
return view('user.auth', compact('is_auth'));
}
public function login(Request $request) { public function login(Request $request) {
$request->validate([ $request->validate([
...@@ -76,12 +78,13 @@ class UserController extends Controller ...@@ -76,12 +78,13 @@ class UserController extends Controller
])) { ])) {
return redirect()->route('home'); return redirect()->route('home');
} }
return redirect()->back()->with('error', 'Incorrect login or password'); return redirect()->back()->with('error', 'Введено невiрний Email або пароль');
} }
public function logout(Request $request) { public function logout(Request $request) {
Auth::logout(); Auth::logout();
return redirect()->route('login.create'); //return redirect()->route('login.create');
return redirect()->route('home');
} }
public function settings() { public function settings() {
...@@ -94,7 +97,6 @@ class UserController extends Controller ...@@ -94,7 +97,6 @@ class UserController extends Controller
$user = User::where('email','=', $googleUser->email)->first(); $user = User::where('email','=', $googleUser->email)->first();
if (!$user) { if (!$user) {
$user = User::create([ $user = User::create([
'name' => $googleUser->name,
'email' => $googleUser->email, 'email' => $googleUser->email,
'password' => Hash::make(config('project.empty_password')), 'password' => Hash::make(config('project.empty_password')),
]); ]);
...@@ -111,8 +113,7 @@ class UserController extends Controller ...@@ -111,8 +113,7 @@ class UserController extends Controller
$user = User::where('email','=', $appleUser->email)->first(); $user = User::where('email','=', $appleUser->email)->first();
if (!$user) { if (!$user) {
$user = User::create([ $user = User::create([
'name' => $googleUser->name, 'email' => $appleUser->email,
'email' => $googleUser->email,
'password' => Hash::make(config('project.empty_password')), 'password' => Hash::make(config('project.empty_password')),
]); ]);
} }
......
...@@ -12,6 +12,6 @@ class Authenticate extends Middleware ...@@ -12,6 +12,6 @@ class Authenticate extends Middleware
*/ */
protected function redirectTo(Request $request): ?string protected function redirectTo(Request $request): ?string
{ {
return $request->expectsJson() ? null : route('login'); // перенаправление для не зарегистрированного return $request->expectsJson() ? null : route('login.auth'); // перенаправление для не зарегистрированного
} }
} }
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
"license": "MIT", "license": "MIT",
"require": { "require": {
"php": "^8.1", "php": "^8.1",
"doctrine/dbal": "^3.6",
"genealabs/laravel-sign-in-with-apple": "^0.7.0", "genealabs/laravel-sign-in-with-apple": "^0.7.0",
"genealabs/laravel-socialiter": "^10.0", "genealabs/laravel-socialiter": "^10.0",
"guzzlehttp/guzzle": "^7.2", "guzzlehttp/guzzle": "^7.2",
......
This diff is collapsed.
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::table('users', function (Blueprint $table) {
$table -> dropColumn('name');
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::table('users', function (Blueprint $table) {
//
});
}
};
...@@ -6,23 +6,77 @@ ...@@ -6,23 +6,77 @@
z-index: 9999; z-index: 9999;
} }
.b-alerts .alert.m-hide
{
display: none;
}
.b-header-menu .b-header-menu
{ {
text-align: right; text-align: right;
} }
#navbar,
#navbar ul, /*
#navbar ul li.dropdown, +++ Обрезание логина-почты
#navbar ul li.dropdown span */
#navbar
{
max-width: 65%;
}
#navbar>ul
{
max-width: 100%;
}
#navbar ul li.dropdown
{
max-width: 100%;
}
#navbar ul li.dropdown>a
{ {
overflow: hidden; overflow: hidden;
max-width: 100%;
} }
#navbar ul li.dropdown span #navbar ul li.dropdown span
{ {
overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
/*
--- Обрезание логина-почты
*/
.b-social.m-hide,
.b-auth.m-hide,
.b-email.m-hide,
.b-reg.m-hide,
.soc-link.m-hide,
.modal-header .modal-title.auth.m-hide,
.modal-header .modal-title.reg.m-hide
{
display: none;
}
.modal-body
{
padding: 3rem;
}
.b-social
{
margin: 10px;
}
.b-auth-wrap .b-auth-wrap
...@@ -56,15 +110,3 @@ ...@@ -56,15 +110,3 @@
border: none !important; border: none !important;
} }
.b-email,
.b-social
{
//transition: all 1s ease-out;
//animation: 3s linear 1s slidein;
}
.b-email.m-hide,
.b-social.m-hide
{
display: none;
}
\ No newline at end of file
(function() { (function() {
"use strict"; "use strict";
console.log('AAA login page');
const select = (el, all = false) => { const select = (el, all = false) => {
el = el.trim() el = el.trim()
...@@ -23,13 +22,27 @@ ...@@ -23,13 +22,27 @@
} }
} }
let email = select('.b-email');
let social = select('.b-social');
function ToggleAuthBlock() let
social = select('.b-social'),
auth = select('.b-auth'),
email = select('.b-email'),
reg = select('.b-reg'),
authTitle = select('.modal-title.auth'),
regTitle = select('.modal-title.reg');
function ToggleLoginBlock()
{ {
email.classList.toggle('m-hide'); email.classList.toggle('m-hide');
reg.classList.toggle('m-hide');
authTitle.classList.toggle('m-hide');
regTitle.classList.toggle('m-hide');
}
function ToggleAuthBlock()
{
social.classList.toggle('m-hide'); social.classList.toggle('m-hide');
auth.classList.toggle('m-hide');
} }
on('click', '.btn-email', function(e) { on('click', '.btn-email', function(e) {
...@@ -37,13 +50,120 @@ ...@@ -37,13 +50,120 @@
ToggleAuthBlock(); ToggleAuthBlock();
}); });
on('click', '.b-email_back', function(e) { on('click', '.soc-link', function(e) {
e.preventDefault(); e.preventDefault();
ToggleAuthBlock(); ToggleAuthBlock();
});
on('click', '.soc-link2', function(e) {
e.preventDefault();
ToggleAuthBlock();
});
on('click', '.auth-link', function(e) {
e.preventDefault();
ToggleLoginBlock();
});
on('click', '.reg-link', function(e) {
e.preventDefault();
ToggleLoginBlock();
});
})();
(function() {
var constraintsAuth = {
email: {
presence: {message: "Email не повинен бути пустим"},
email: {message: "Перевiрте поштову адресу"}
},
password: {
presence: {message: "Пароль не повинен бути пустим"},
},
};
var constraintsReg = {
email: {
presence: {message: "Email не повинен бути пустим"},
email: {message: "Перевiрте поштову адресу"}
},
password: {
presence: {message: "Пароль не повинен бути пустим"},
},
'password_confirmation': {
presence: {message: "Повторiть пароль"},
equality: {
attribute: "password",
message: "Паролi не спiвпадають"
}
},
};
var alertForm = document.querySelector(".b-alerts .alert.form");
var alertAll = document.querySelectorAll(".b-alerts .alert");
// клик извне, чтобы закрыть сообщение ошибок
document.addEventListener( 'click', (e) => {
const withinAlertAll = e.composedPath().includes(alertAll);
if (!withinAlertAll) {
//alertAll.classList.add('m-hide');
alertAll.forEach(function(item){
item.classList.add('m-hide');
})
}
}); });
var formAuth = document.querySelector("form#auth-form");
formAuth.addEventListener("submit", function(ev) {
ev.preventDefault();
handleFormSubmit(formAuth, constraintsAuth);
});
var formReg = document.querySelector("form#reg-form");
formReg.addEventListener("submit", function(ev) {
ev.preventDefault();
handleFormSubmit(formReg, constraintsReg);
});
var formSet = document.querySelector("form#set-form");
if (formSet) {
formSet.addEventListener("submit", function(ev) {
ev.preventDefault();
handleFormSubmit(formSet, constraintsReg);
});
}
function handleFormSubmit(form, constraints) {
var errors = validate(form, constraints, {fullMessages: false});
showErrors(errors || {});
if (!errors) {
form.submit();
}
}
function showErrors(errors) {
if (!Object.keys(errors).length) {
return false;
}
var messageText = '<ul>';
for (const [key, value] of Object.entries(errors)) {
messageText += `<li>${value}</li>`;
}
messageText += '</ul>';
alertForm.innerHTML = messageText;
alertForm.classList.remove('m-hide');
}
})() })();
\ No newline at end of file \ No newline at end of file
...@@ -282,9 +282,11 @@ ...@@ -282,9 +282,11 @@
const withinDropdown = e.composedPath().includes(navbarDropdown); const withinDropdown = e.composedPath().includes(navbarDropdown);
const withinBoundaries = e.composedPath().includes(navbarDropdownUl); const withinBoundaries = e.composedPath().includes(navbarDropdownUl);
if (withinDropdown && !withinBoundaries) { if (withinDropdown && !withinBoundaries) {
console.log('AAA 1');
e.preventDefault(); e.preventDefault();
navbarDropdownUl.classList.toggle('visible'); navbarDropdownUl.classList.toggle('visible');
} else if (!withinBoundaries) { } else if (!withinBoundaries) {
console.log('AAA 2');
navbarDropdownUl.classList.remove('visible'); navbarDropdownUl.classList.remove('visible');
} }
}); });
......
...@@ -23,7 +23,6 @@ ...@@ -23,7 +23,6 @@
} }
thisForm.querySelector('.loading').classList.add('d-block'); thisForm.querySelector('.loading').classList.add('d-block');
thisForm.querySelector('.error-message').classList.remove('d-block'); thisForm.querySelector('.error-message').classList.remove('d-block');
thisForm.querySelector('.sent-message').classList.remove('d-block');
let formData = new FormData( thisForm ); let formData = new FormData( thisForm );
...@@ -65,7 +64,6 @@ ...@@ -65,7 +64,6 @@
.then(data => { .then(data => {
thisForm.querySelector('.loading').classList.remove('d-block'); thisForm.querySelector('.loading').classList.remove('d-block');
if (data.trim() == 'OK') { if (data.trim() == 'OK') {
thisForm.querySelector('.sent-message').classList.add('d-block');
thisForm.reset(); thisForm.reset();
} else { } else {
throw new Error(data ? data : 'Form submission failed and no error message returned from: ' + action); throw new Error(data ? data : 'Form submission failed and no error message returned from: ' + action);
...@@ -77,8 +75,11 @@ ...@@ -77,8 +75,11 @@
} }
function displayError(thisForm, error) { function displayError(thisForm, error) {
console.log('AAA error = ', error);
thisForm.querySelector('.loading').classList.remove('d-block'); thisForm.querySelector('.loading').classList.remove('d-block');
thisForm.querySelector('.error-message').innerHTML = error; thisForm.querySelector('.error-message').innerHTML = error.message;
thisForm.querySelector('.error-message').classList.add('d-block'); thisForm.querySelector('.error-message').classList.add('d-block');
} }
......
<div class="b-alerts row justify-content-center"> <div class="b-alerts row justify-content-center">
<div class="alert form alert-danger col-4 m-hide">
</div>
@if(session('success')) @if(session('success'))
<div class="alert alert-success col-4"> <div class="alert alert-success col-4">
{{ session('success') }} {{ session('success') }}
......
...@@ -25,6 +25,9 @@ ...@@ -25,6 +25,9 @@
<body> <body>
<!-- ======= Modal ======= -->
@include('layouts.modal')
<!-- ======= Header ======= --> <!-- ======= Header ======= -->
<header id="header" class="fixed-top"> <header id="header" class="fixed-top">
<div class="container d-flex align-items-center justify-content-between"> <div class="container d-flex align-items-center justify-content-between">
...@@ -34,10 +37,6 @@ ...@@ -34,10 +37,6 @@
<nav id="navbar" class="navbar"> <nav id="navbar" class="navbar">
<ul> <ul>
@auth @auth
<?php /*?>
$email = auth()->user()->email;
$email_brief = (strlen($email) > 30) ? substr_replace($email, '...', 5, 25) : $email;
<?php */ ?>
<li class="dropdown"><a href="#"><span class="fw-bold">{{ auth()->user()->email }}</span> <i class="bi bi-chevron-down"></i></a> <li class="dropdown"><a href="#"><span class="fw-bold">{{ auth()->user()->email }}</span> <i class="bi bi-chevron-down"></i></a>
<ul> <ul>
<li><a href="{{ url('settings') }}">Налаштування</a></li> <li><a href="{{ url('settings') }}">Налаштування</a></li>
...@@ -46,7 +45,9 @@ ...@@ -46,7 +45,9 @@
</li> </li>
@endauth @endauth
@guest @guest
<li><a class="getstarted" href="{{ route('login.create') }}">Увiйти</a></li> <li>
<a class="getstarted" href="#" data-bs-toggle="modal" data-bs-target="#loginModal">Увiйти</a>
</li>
@endguest @endguest
</ul> </ul>
......
<div class="modal fade" id="loginModal" data-bs-backdrop="static" tabindex="-1" aria-labelledby="loginModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title auth">Авторизацiя</h5>
<h5 class="modal-title reg m-hide">Новий акаунт</h5>
@isset ($is_auth)
<a class="btn-close" href="{{ route('home') }}" role="button"></a>
@else
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрити"></button>
@endisset
</div>
<div class="modal-body">
<div class="b-social text-center">
<div class="row">
<a class="btn btn-google" href="{{ route('login.google') }}" role="button"><img src="https://img.icons8.com/color/16/000000/google-logo.png"> Sign in with Google</a>
</div>
<br>
<div class="row b-social_apple">
@signInWithApple("white", true, "sign-in", 10)
</div>
<br>
<div class="row">
<a class="btn btn-email" href="#" role="button">Продовжити за допомогою e-mail</a>
</div>
</div>
<div class="b-auth m-hide">
<div class="b-email contact text-center">
<form method="post" action="{{ route('login') }}" class="php-email-form" id="auth-form">
@csrf
<div class="form-group">
<input class="form-control" type="email" id="email_1" name="email" placeholder="Ваша електронна пошта" value="{{ old('email') }}">
<div class="messages"></div>
</div>
<div class="form-group">
<input class="form-control" type="password" id="password_1" name="password" placeholder="Пароль">
<div class="messages"></div>
</div>
<div class="form-group d-flex justify-content-between align-items-center">
<a class="soc-link" href="#">Назад</a>
<a class="reg-link" href="#">Новий акаунт</a>
<button type="submit" class="btn btn-primary">Увiйти</button>
</div>
</form>
</div>
<div class="b-reg contact text-center m-hide">
<form method="post" action="{{ route('register.store') }}" class="php-email-form" id="reg-form">
@csrf
<div class="form-group">
<input class="form-control" type="email" id="email_2" name="email" placeholder="Ваша електронна пошта" value="{{ old('email') }}">
</div>
<div class="form-group">
<input class="form-control" type="password" id="password_2" placeholder="Пароль" name="password">
</div>
<div class="form-group">
<input class="form-control" type="password" id="password_confirmation" name="password_confirmation" placeholder="Підтвердіть пароль">
</div>
<div class="form-group d-flex justify-content-between align-items-center">
<a class="soc-link2" href="#">Назад</a>
<a class="auth-link" href="#">Вже є акаунт</a>
<button type="submit">Зареєструватись</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
...@@ -10,8 +10,11 @@ ...@@ -10,8 +10,11 @@
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script> <script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script> <script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script> <script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/validate.js/0.13.1/validate.min.js"></script>
<script src="assets/js/main.js"></script> <script src="assets/js/main.js"></script>
<script src="assets/js/login.js"></script>
@endif @endif
\ No newline at end of file
@extends('layouts.layout')
@section('title')Авторизацiя @endsection
@section('page_scripts')
@if(!config('project.minificate_static'))
<script>
document.querySelector('#navbar .getstarted').click();
</script>
@endif
@endsection
...@@ -50,12 +50,12 @@ ...@@ -50,12 +50,12 @@
@csrf @csrf
<div class="form-group"> <div class="form-group">
<label for='email'>Email address</label> <label for='email'>Ваша електронна пошта</label>
<input class="form-control" type="email" id="email" name="email" value="{{ old('email') }}"> <input class="form-control" type="email" id="email" name="email" value="{{ old('email') }}">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for='password'>Password</label> <label for='password'>Пароль</label>
<input class="form-control" type="password" id="password" name="password"> <input class="form-control" type="password" id="password" name="password">
</div> </div>
<br> <br>
......
...@@ -5,31 +5,26 @@ ...@@ -5,31 +5,26 @@
@section('content') @section('content')
<section> <section>
<div class='container'> <div class='container contact'>
<h4>Налаштування</h4> <h4>Налаштування</h4>
<form method="post" action="{{ route('settings.edit') }}"> <form method="post" action="{{ route('settings.edit') }}" class="php-email-form" id="set-form">
@csrf @csrf
<div class="form-group"> <div class="form-group">
<label for='name'>Ваше имя</label> <label for='email'>Ваша електронна пошта</label>
<input class="form-control" type="text" id="name" name="name" value="{{ auth()->user()->name }}">
</div>
<div class="form-group">
<label for='email'>Email address</label>
<input class="form-control" type="email" id="email" name="email" value="{{ auth()->user()->email }}"> <input class="form-control" type="email" id="email" name="email" value="{{ auth()->user()->email }}">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for='password'>Password</label> <label for='password'>Пароль</label>
<input class="form-control" type="password" id="password" name="password"> <input class="form-control" type="password" id="password" name="password">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for='password_confirmation'>Confirm password</label> <label for='password_confirmation'>Підтвердіть пароль</label>
<input class="form-control" type="password" id="password_confirmation" name="password_confirmation"> <input class="form-control" type="password" id="password_confirmation" name="password_confirmation">
</div> </div>
......
...@@ -30,10 +30,10 @@ Route::group(['middleware' => 'guest'], function(){ ...@@ -30,10 +30,10 @@ Route::group(['middleware' => 'guest'], function(){
Route::get('/register', [UserController::class, 'create']) -> name('register.create'); Route::get('/register', [UserController::class, 'create']) -> name('register.create');
Route::post('/register', [UserController::class, 'store']) -> name('register.store'); Route::post('/register', [UserController::class, 'store']) -> name('register.store');
Route::get('/login', [UserController::class, 'loginForm']) -> name('login.create'); Route::get('/login', [UserController::class, 'loginAuth']) -> name('login.auth');
//Route::get('/login', [UserController::class, 'loginForm']) -> name('login.create');
Route::post('/login', [UserController::class, 'login']) -> name('login'); Route::post('/login', [UserController::class, 'login']) -> name('login');
//Auth Google //Auth Google
Route::get('/login/google', function () { Route::get('/login/google', function () {
return Socialite::driver('google')->redirect(); return Socialite::driver('google')->redirect();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment