The_evening_detective/evening_detective_frontend
1
0
Fork 0
generated from VLADIMIR/template_frontend
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add center

Browse Source
This commit is contained in:
Владимир Фёдоров
2026-07-19 15:24:36 +07:00
parent 3f8b8ba432
commit 2599be3f53
6 changed files with 81 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/main.css
+6 -1
View File
@@ -25,7 +25,7 @@ body {
.content-block {
margin-top: 70px;
padding: 10px;
background-color: #333333;
/* background-color: #553333; */
}
@media (min-width: 1024px) {
@@ -33,4 +33,9 @@ body {
width: 700px;
margin: 70px auto 0 auto;
}
.center-middle-block-custom {
display: grid;
place-items: center;
}
}
src/components/GamesPage.vue
+3 -1
View File
@@ -5,7 +5,9 @@ import HeaderMenu from '@/components/HeaderMenu.vue'
<template>
<HeaderMenu :add-logout="true" active="games" />
Игры
<div class="center-block-custom content-block">
Игры
</div>
</template>
<style scoped></style>
src/components/LoginPage.vue
+59 -53
View File
@@ -52,65 +52,67 @@ async function signup() {
</script>
<template>
<n-card style="margin-bottom: 16px" class="sign-card">
<n-tabs type="line" animated>
<div class="center-block-custom content-block center-middle-block-custom height100">
<n-card style="margin-bottom: 16px" class="sign-card">
<n-tabs type="line" animated>
<n-tab-pane name="signin" tab="Вход">
<n-space vertical>
<div class="form-label">Почта</div>
<n-auto-complete v-model:value="email" :input-props="{
autocomplete: 'disabled',
}" :options="options" placeholder="detective@mail.ru" clearable />
<div class="form-label">Пароль</div>
<n-input v-model:value="password" type="password" placeholder="********" />
<div class="form-button-wrapper">
<div class="form-label">
<n-button @click="signin" :disabled="email.length == 0 || password.length == 0">
<span v-if="!authStore.isLoading">
Вход
</span>
<span v-else>
Подождите...
</span>
</n-button>
<n-tab-pane name="signin" tab="Вход">
<n-space vertical>
<div class="form-label">Почта</div>
<n-auto-complete v-model:value="email" :input-props="{
autocomplete: 'disabled',
}" :options="options" placeholder="detective@mail.ru" clearable />
<div class="form-label">Пароль</div>
<n-input v-model:value="password" type="password" placeholder="********" />
<div class="form-button-wrapper">
<div class="form-label">
<n-button @click="signin" :disabled="email.length == 0 || password.length == 0">
<span v-if="!authStore.isLoading">
Вход
</span>
<span v-else>
Подождите...
</span>
</n-button>
</div>
</div>
</div>
</n-space>
</n-tab-pane>
</n-space>
</n-tab-pane>
<n-tab-pane name="signup" tab="Регистрация">
<n-space vertical>
<div class="form-label">Позывной</div>
<n-input v-model:value="username" type="text" placeholder="Шерлок" />
<div class="form-label">Почта</div>
<n-auto-complete v-model:value="email" :input-props="{
autocomplete: 'disabled',
}" :options="options" placeholder="detective@mail.ru" clearable />
<div class="form-label">
<n-checkbox v-model:checked="approval">
Я согласен с
<a href="/user-agreement" target="_blank" class="docs-link">пользовательским соглашением</a><br>
и
<a href="/privacy-policy" target="_blank" class="docs-link">соглашением о персональных данных</a>
</n-checkbox>
</div>
<div class="form-button-wrapper">
<n-tab-pane name="signup" tab="Регистрация">
<n-space vertical>
<div class="form-label">Позывной</div>
<n-input v-model:value="username" type="text" placeholder="Шерлок" />
<div class="form-label">Почта</div>
<n-auto-complete v-model:value="email" :input-props="{
autocomplete: 'disabled',
}" :options="options" placeholder="detective@mail.ru" clearable />
<div class="form-label">
<n-button @click="signup" :disabled="username.length == 0 || password.length == 0 || !approval">
<span v-if="!authStore.isLoading">
Регистрация
</span>
<span v-else>
Подождите...
</span>
</n-button>
<n-checkbox v-model:checked="approval">
Я согласен с
<a href="/user-agreement" target="_blank" class="docs-link">пользовательским соглашением</a><br>
и
<a href="/privacy-policy" target="_blank" class="docs-link">соглашением о персональных данных</a>
</n-checkbox>
</div>
</div>
</n-space>
</n-tab-pane>
<div class="form-button-wrapper">
<div class="form-label">
<n-button @click="signup" :disabled="username.length == 0 || password.length == 0 || !approval">
<span v-if="!authStore.isLoading">
Регистрация
</span>
<span v-else>
Подождите...
</span>
</n-button>
</div>
</div>
</n-space>
</n-tab-pane>
</n-tabs>
</n-card>
</n-tabs>
</n-card>
</div>
</template>
<style scoped>
@@ -135,6 +137,10 @@ async function signup() {
color: #63e2b7;
}
.height100 {
height: 80vh;
}
@media (min-width: 1024px) {
.sign-card {
width: 380px;
src/components/OfficePage.vue
+9 -7
View File
@@ -21,14 +21,16 @@ getPermissions()
<template>
<HeaderMenu :add-logout="true" active="office" />
<p>
Доброго времени суток, {{ authStore.username }}.
</p>
<!-- <p>
{{ authStore.userRoles }}
</p>
<div class="center-block-custom content-block">
<p>
Доброго времени суток, {{ authStore.username }}.
</p>
<!-- <p>
{{ authStore.userRoles }}
</p>
{{ permissions }} -->
{{ permissions }} -->
</div>
</template>
<style scoped></style>
src/components/ScenariosPage.vue
+1 -1
View File
@@ -5,7 +5,7 @@ import HeaderMenu from '@/components/HeaderMenu.vue'
<template>
<HeaderMenu :add-logout="true" active="scenarios" />
<div class="center-block-custom">
<div class="center-block-custom content-block">
Сценарии
</div>
</template>
src/components/UsersPage.vue
+3 -1
View File
@@ -5,7 +5,9 @@ import HeaderMenu from '@/components/HeaderMenu.vue'
<template>
<HeaderMenu :add-logout="true" active="users" />
Пользователи
<div class="center-block-custom content-block">
Пользователи
</div>
</template>
<style scoped></style>