Поправил ссылку на главную, добавил показ пароля на формы входа и регистрации

This commit is contained in:
Dhaverd 2024-11-04 06:13:46 +08:00
parent a563672808
commit f64ea3c5e3
3 changed files with 27 additions and 18 deletions

View File

@ -34,7 +34,7 @@
<v-label class="text-h6 h-auto w-auto pa-2">Welcome {{ authenticated ? userStore.user['name'] : 'guest' }}!</v-label><br> <v-label class="text-h6 h-auto w-auto pa-2">Welcome {{ authenticated ? userStore.user['name'] : 'guest' }}!</v-label><br>
</div> </div>
<div class="d-flex" :class="menuOpen ? 'justify-center' : 'justify-end'"> <div class="d-flex" :class="menuOpen ? 'justify-center' : 'justify-end'">
<p class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><RouterLink to="/" class="nav-link text-decoration-none">Главная</RouterLink></p> <p class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><a href="/" class="nav-link text-decoration-none">Главная</a></p>
<p v-if="!authenticated" class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><RouterLink to="/login" class="nav-link text-decoration-none">Войти</RouterLink></p> <p v-if="!authenticated" class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><RouterLink to="/login" class="nav-link text-decoration-none">Войти</RouterLink></p>
<p v-if="!authenticated" class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><RouterLink to="/register" class="nav-link text-decoration-none">Регистрация</RouterLink></p> <p v-if="!authenticated" class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><RouterLink to="/register" class="nav-link text-decoration-none">Регистрация</RouterLink></p>
<p v-if="authenticated" class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><a href="#" class="nav-link text-decoration-none" @click="logout">Выйти</a></p> <p v-if="authenticated" class="ml-3 mr-3" :class="menuOpen ? 'text-body-1' : 'text-h6'"><a href="#" class="nav-link text-decoration-none" @click="logout">Выйти</a></p>

View File

@ -5,28 +5,22 @@
<v-label>Логин:</v-label> <v-label>Логин:</v-label>
<v-text-field type="email" v-model="email" label="E-mail" class="flex-grow-0" required></v-text-field> <v-text-field type="email" v-model="email" label="E-mail" class="flex-grow-0" required></v-text-field>
<v-label>Пароль:</v-label> <v-label>Пароль:</v-label>
<v-text-field type="password" v-model="password" label="Пароль" class="flex-grow-0" required></v-text-field> <v-text-field
:type="showPassword ? 'text' : 'password'"
v-model="password"
label="Пароль"
class="flex-grow-0"
:append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showPassword = !showPassword"
required></v-text-field>
<v-checkbox v-model="rememberMe" label="Запомнить меня"></v-checkbox> <v-checkbox v-model="rememberMe" label="Запомнить меня"></v-checkbox>
<div class="d-flex justify-center" :class="isWide ? '' : 'flex-column align-center'"> <div class="d-flex justify-center" :class="isWide ? '' : 'flex-column align-center'">
<!--<div>-->
<v-btn type="submit" color="#F0A068FF" class="ma-5 flex-grow-0" :class="isWide ? 'w-25' : 'w-100 text-body-1'" :loading="loading">Войти</v-btn> <v-btn type="submit" color="#F0A068FF" class="ma-5 flex-grow-0" :class="isWide ? 'w-25' : 'w-100 text-body-1'" :loading="loading">Войти</v-btn>
<!--</div>-->
<router-link to="/register" class="text-decoration-none link-no-color ma-5" :class="isWide ? 'w-25' : 'w-100'"> <router-link to="/register" class="text-decoration-none link-no-color ma-5" :class="isWide ? 'w-25' : 'w-100'">
<v-btn color="#F0A068FF" :class="isWide ? 'w-100' : 'w-100 text-body-1'">Регистрация</v-btn> <v-btn color="#F0A068FF" :class="isWide ? 'w-100' : 'w-100 text-body-1'">Регистрация</v-btn>
</router-link> </router-link>
</div> </div>
</v-form> </v-form>
<!--
<v-label>Логин:</v-label>
<v-text-field label="Логин" class="flex-grow-0"></v-text-field>
<v-label>Пароль:</v-label>
<v-text-field label="Пароль" class="flex-grow-0"></v-text-field>
<div class="d-flex justify-center" :class="isWide ? '' : 'flex-column align-center'">
<v-btn color="#F0A068FF" class="ma-5" :class="isWide ? 'w-25' : 'w-100 text-body-1'">Войти</v-btn>
<router-link to="/register" class="text-decoration-none link-no-color ma-5" :class="isWide ? 'w-25' : 'w-100'">
<v-btn color="#F0A068FF" :class="isWide ? 'w-100' : 'w-100 text-body-1'">Регистрация</v-btn>
</router-link>
</div>-->
</div> </div>
</div> </div>
</template> </template>
@ -46,7 +40,8 @@ export default {
rememberMe: false, rememberMe: false,
loading: false, loading: false,
errorMessage: '', errorMessage: '',
errorMessageContainerStyle: 'display: none;' errorMessageContainerStyle: 'display: none;',
showPassword: false
}; };
}, },
methods: { methods: {

View File

@ -54,8 +54,22 @@ export default {
<v-label>E-mail:</v-label> <v-label>E-mail:</v-label>
<v-text-field type="email" v-model="email" label="E-mail" class="flex-grow-0" required></v-text-field> <v-text-field type="email" v-model="email" label="E-mail" class="flex-grow-0" required></v-text-field>
<v-label>Пароль:</v-label> <v-label>Пароль:</v-label>
<v-text-field type="password" v-model="password" label="Пароль" class="flex-grow-0" required></v-text-field> <v-text-field
<v-text-field type="password" v-model="c_password" label="Повторите пароль" class="flex-grow-0" required></v-text-field> :type="showPassword ? 'text' : 'password'"
:append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showPassword = !showPassword"
v-model="password"
label="Пароль"
class="flex-grow-0"
required></v-text-field>
<v-text-field
:type="showRepeatPassword ? 'text' : 'password'"
:append-icon="showRepeatPassword ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showRepeatPassword = !showRepeatPassword"
v-model="c_password"
label="Повторите пароль"
class="flex-grow-0"
required></v-text-field>
<v-label :style="errorMessageContainerStyle">{{ errorMessage }}</v-label> <v-label :style="errorMessageContainerStyle">{{ errorMessage }}</v-label>
<div class="d-flex justify-center" :class="isWide ? '' : 'flex-column align-center'"> <div class="d-flex justify-center" :class="isWide ? '' : 'flex-column align-center'">
<v-btn type="submit" color="#F0A068FF" class="ma-5" :class="isWide ? 'w-25' : 'w-100 text-body-1'" :loading="loading">Зарегистрироваться</v-btn> <v-btn type="submit" color="#F0A068FF" class="ma-5" :class="isWide ? 'w-25' : 'w-100 text-body-1'" :loading="loading">Зарегистрироваться</v-btn>