From 0266c0c07b2f06d80996c9cce687a0955ebfffe8 Mon Sep 17 00:00:00 2001
From: Dhaverd <jedi55@mail.ru>
Date: Sun, 27 Oct 2024 14:05:23 +0800
Subject: [PATCH] =?UTF-8?q?=D0=9D=D0=B5=D0=BC=D0=BD=D0=BE=D0=B3=D0=BE=20?=
 =?UTF-8?q?=D0=BF=D1=80=D0=BE=D0=BA=D0=B0=D1=87=D0=B0=D0=BB=20=D1=84=D0=BE?=
 =?UTF-8?q?=D1=80=D0=BC=D1=8B=20=D0=92=D1=85=D0=BE=D0=B4=D0=B0=20=D0=B8=20?=
 =?UTF-8?q?=D0=A0=D0=B5=D0=B3=D0=B8=D1=81=D1=82=D1=80=D0=B0=D1=86=D0=B8?=
 =?UTF-8?q?=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/js/rules.js                 |  9 +++++++++
 resources/views/Auth/Login.vue        | 18 ++++++++++++++++--
 resources/views/Auth/Registration.vue | 27 ++++++++++++++++++++++++---
 resources/views/Welcome.vue           |  1 +
 4 files changed, 50 insertions(+), 5 deletions(-)
 create mode 100644 resources/js/rules.js

diff --git a/resources/js/rules.js b/resources/js/rules.js
new file mode 100644
index 0000000..f91263d
--- /dev/null
+++ b/resources/js/rules.js
@@ -0,0 +1,9 @@
+export const rules = {
+    email: value => {
+        const pattern = /^[A-Za-z0-9\._]+@{1}[A-Za-z0-9]+\.[a-z]+$/
+        return pattern.test(value) || 'Неверный email'
+    },
+    notNull: value => {
+        return (value !== null && value !== undefined && value !== '') || 'Поле не может быть пустым';
+    }
+}
diff --git a/resources/views/Auth/Login.vue b/resources/views/Auth/Login.vue
index 89e6162..3a60f92 100644
--- a/resources/views/Auth/Login.vue
+++ b/resources/views/Auth/Login.vue
@@ -1,8 +1,14 @@
 <script>
 import {useUserStore} from "../../store/user.js";
+import {rules} from "../../js/rules.js";
 
 export default {
     name: "Login",
+    computed: {
+        rules() {
+            return rules
+        }
+    },
     data: () => ({
         userStore: useUserStore(),
         valid: false,
@@ -10,7 +16,8 @@ export default {
         password: '',
         rememberMe: false,
         errorMessage: '',
-        errorMessageContainerStyle: ''
+        errorMessageContainerStyle: '',
+        showPassword: false
     }),
     methods: {
         loginAction(){
@@ -41,12 +48,19 @@ export default {
         <v-text-field class="w-100"
                       v-model="email"
                       label="E-mail"
+                      type="email"
+                      v-on:keyup.enter="this.loginAction"
+                      :rules="[rules.email]"
                       required
         ></v-text-field>
         <v-text-field class="w-100"
                       v-model="password"
                       label="Пароль"
-                      type="password"
+                      :type="showPassword ? 'text' : 'password'"
+                      :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
+                      @click:append="showPassword = !showPassword"
+                      v-on:keyup.enter="this.loginAction"
+                      :rules="[rules.notNull]"
                       required
         ></v-text-field>
         <div class="d-flex justify-start align-content-start w-100">
diff --git a/resources/views/Auth/Registration.vue b/resources/views/Auth/Registration.vue
index f12b271..7a475ae 100644
--- a/resources/views/Auth/Registration.vue
+++ b/resources/views/Auth/Registration.vue
@@ -1,5 +1,6 @@
 <script>
 import {useUserStore} from "../../store/user.js";
+import {rules} from "../../js/rules.js";
 
 export default {
     name: "Registration",
@@ -11,8 +12,15 @@ export default {
         password: '',
         repeatPassword: '',
         errorMessage: '',
-        errorMessageContainerStyle: 'display: none;'
+        errorMessageContainerStyle: 'display: none;',
+        showPassword: false,
+        showRepeatPassword: false
     }),
+    computed: {
+        rules() {
+            return rules
+        }
+    },
     methods: {
         registrationAction(){
             this.userStore.registration(this.login, this.email, this.password, this.repeatPassword).then((isRegistred)=>{
@@ -40,23 +48,36 @@ export default {
         <v-text-field class="w-100"
                       v-model="login"
                       label="Логин"
+                      v-on:keyup.enter="this.registrationAction"
+                      :rules="[rules.notNull]"
                       required
         ></v-text-field>
         <v-text-field class="w-100"
                       v-model="email"
                       label="E-mail"
+                      type="email"
+                      v-on:keyup.enter="this.registrationAction"
+                      :rules="[rules.email]"
                       required
         ></v-text-field>
         <v-text-field class="w-100"
                       v-model="password"
                       label="Пароль"
-                      type="password"
+                      :type="showPassword ? 'text' : 'password'"
+                      :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
+                      @click:append="showPassword = !showPassword"
+                      v-on:keyup.enter="this.registrationAction"
+                      :rules="[rules.notNull]"
                       required
         ></v-text-field>
         <v-text-field class="w-100"
                       v-model="repeatPassword"
                       label="Повторите пароль"
-                      type="password"
+                      :type="showRepeatPassword ? 'text' : 'password'"
+                      :append-icon="showRepeatPassword ? 'mdi-eye' : 'mdi-eye-off'"
+                      @click:append="showRepeatPassword = !showRepeatPassword"
+                      v-on:keyup.enter="this.registrationAction"
+                      :rules="[rules.notNull]"
                       required
         ></v-text-field>
         <v-label :style="errorMessageContainerStyle">{{ errorMessage }}</v-label>
diff --git a/resources/views/Welcome.vue b/resources/views/Welcome.vue
index 9b7aa26..0d68a9b 100644
--- a/resources/views/Welcome.vue
+++ b/resources/views/Welcome.vue
@@ -71,6 +71,7 @@ export default {
 .link-no-decor {
     color: white;
     text-decoration: none;
+    cursor: pointer;
 }
 
 .link-no-decor:hover {