Remnants/AdministrationItDepartmens
1
0
Fork 0
mirror of https://gitlab.com/MoonTestUse1/AdministrationItDepartmens.git synced 2025-08-14 00:25:46 +02:00
Code Activity

чиним билд02

Browse Source
This commit is contained in:
MoonTestUse1
2025-01-02 01:41:45 +06:00
parent 6ff4ca1ab1
commit a5a742ce55
4 changed files with 147 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
frontend/src/layouts/MainLayout.vue Normal file
View File

@@ -0,0 +1,33 @@
<template>
<div class="min-h-screen bg-gray-100">
<nav class="bg-white shadow">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
<div class="flex">
<div class="flex-shrink-0 flex items-center">
<router-link to="/" class="text-xl font-bold text-gray-800">
IT Form Help
</router-link>
</div>
</div>
<div class="flex items-center">
<router-link
to="/login"
class="ml-4 px-4 py-2 rounded-md text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700"
>
Войти
</router-link>
</div>
</div>
</div>
</nav>
<main class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
<router-view></router-view>
</main>
</div>
</template>
<script setup lang="ts">
// Layout для главной страницы и страницы входа
</script>

16
frontend/src/router/index.ts
View File

@@ -4,6 +4,22 @@ import { useAuthStore } from '@/stores/auth';
const router = createRouter({ const router = createRouter({
history: createWebHistory(), history: createWebHistory(),
routes: [ routes: [
{
path: '/',
component: () => import('@/layouts/MainLayout.vue'),
children: [
{
path: '',
name: 'Home',
component: () => import('@/views/HomeView.vue')
},
{
path: 'login',
name: 'Login',
component: () => import('@/views/LoginView.vue')
}
]
},
{ {
path: '/admin', path: '/admin',
component: () => import('@/layouts/AdminLayout.vue'), component: () => import('@/layouts/AdminLayout.vue'),

28
frontend/src/views/HomeView.vue Normal file
View File

@@ -0,0 +1,28 @@
<template>
<div class="text-center">
<h1 class="text-4xl font-bold text-gray-900 mb-8">
Добро пожаловать в IT Form Help
</h1>
<p class="text-xl text-gray-600 mb-8">
Система поддержки и обработки IT-заявок
</p>
<div class="space-x-4">
<router-link
to="/login"
class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700"
>
Войти как сотрудник
</router-link>
<router-link
to="/admin/login"
class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-gray-50"
>
Войти как администратор
</router-link>
</div>
</div>
</template>
<script setup lang="ts">
// Главная страница
</script>

149
frontend/src/views/LoginView.vue
View File

@@ -1,98 +1,89 @@
<template> <template>
<div class="max-w-md mx-auto bg-white rounded-lg shadow-lg p-6"> <div class="min-h-full flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
<h2 class="text-2xl font-semibold text-slate-800 mb-4">Вход в систему</h2> <div class="max-w-md w-full space-y-8">
<form @submit.prevent="handleSubmit" class="space-y-4">
<div> <div>
<label class="block text-sm font-medium text-slate-700 mb-1"> <h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
Фамилия Вход для сотрудников
</label> </h2>
<div class="relative"> </div>
<div class="absolute inset-y-0 left-0 pl-3 flex items-center"> <form class="mt-8 space-y-6" @submit.prevent="handleLogin">
<UserIcon :size="18" class="text-slate-400" /> <div class="rounded-md shadow-sm -space-y-px">
<div>
<label for="last-name" class="sr-only">Фамилия</label>
<input
id="last-name"
v-model="lastName"
name="last-name"
type="text"
required
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-t-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm"
placeholder="Фамилия"
/>
</div> </div>
<input <div>
v-model="lastName" <label for="password" class="sr-only">Пароль</label>
type="text" <input
required id="password"
class="w-full pl-10 pr-3 py-2 border border-slate-300 rounded-md focus:ring-2 focus:ring-blue-500" v-model="password"
placeholder="Введите фамилию" name="password"
/> type="password"
</div> required
</div> class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm"
placeholder="Пароль"
<div> />
<label class="block text-sm font-medium text-slate-700 mb-1">
Пароль
</label>
<div class="relative">
<div class="absolute inset-y-0 left-0 pl-3 flex items-center">
<LockIcon :size="18" class="text-slate-400" />
</div> </div>
<input
v-model="password"
type="password"
required
class="w-full pl-10 pr-3 py-2 border border-slate-300 rounded-md focus:ring-2 focus:ring-blue-500"
placeholder="Введите пароль"
/>
</div> </div>
</div>
<button <div>
type="submit" <button
:disabled="isLoading" type="submit"
class="w-full bg-blue-600 text-white py-2 px-4 rounded-md hover:bg-blue-700 transition-colors disabled:opacity-50 flex items-center justify-center gap-2" class="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
> :disabled="loading"
<component >
:is="isLoading ? LoaderIcon : LogInIcon" <span v-if="loading">Загрузка...</span>
:size="18" <span v-else>Войти</span>
:class="{ 'animate-spin': isLoading }" </button>
/> </div>
{{ isLoading ? 'Вход...' : 'Войти' }}
</button>
<div class="text-center"> <div v-if="error" class="text-red-600 text-center">
<router-link {{ error }}
to="/admin" </div>
class="text-sm text-blue-600 hover:text-blue-800" </form>
> </div>
Вход для администраторов
</router-link>
</div>
</form>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'; import { ref } from 'vue'
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router'
import { useAuthStore } from '@/stores/auth'; import axios from 'axios'
import { UserIcon, LockIcon, LogInIcon, LoaderIcon } from 'lucide-vue-next';
const router = useRouter(); const router = useRouter()
const authStore = useAuthStore(); const lastName = ref('')
const password = ref('')
const loading = ref(false)
const error = ref('')
const lastName = ref(''); const handleLogin = async () => {
const password = ref(''); loading.value = true
const isLoading = ref(false); error.value = ''
async function handleSubmit() {
if (isLoading.value) return;
isLoading.value = true;
try { try {
const success = await authStore.login(lastName.value, password.value); const response = await axios.post('/api/auth/login', {
if (success) { last_name: lastName.value,
router.push('/support'); password: password.value
} else { })
alert('Неверная фамилия или пароль');
} // Сохраняем данные сотрудника и токен
} catch (error) { localStorage.setItem('employee', JSON.stringify(response.data))
console.error('Error:', error); localStorage.setItem('token', response.data.access_token)
alert('Ошибка авторизации');
// Перенаправляем на страницу заявок
router.push('/requests')
} catch (e: any) {
error.value = e.response?.data?.detail || 'Произошла ошибка при входе'
} finally { } finally {
isLoading.value = false; loading.value = false
} }
} }
</script> </script>