From 00a035653f7c4aa3906e991bc8a14ad00aecd5b8 Mon Sep 17 00:00:00 2001
From: MoonTestUse1 <crocoman7887@gmail.com>
Date: Wed, 1 Jan 2025 22:53:45 +0600
Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=BE=D1=87=D0=B8=D0=BD=D0=BA=D0=B0=20?=
 =?UTF-8?q?=D0=B0=D0=B4=D0=BC=D0=B8=D0=BD=D0=BA=D0=B8=20=D0=BF=D0=BE=D0=BB?=
 =?UTF-8?q?=D0=BD=D0=BE=D1=81=D1=82=D1=8C=D1=8E1=D0=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/layouts/AdminLayout.vue       | 62 +++++++++++++++++
 frontend/src/router/index.ts               | 67 ++++++++----------
 frontend/src/views/admin/EmployeesView.vue | 81 ++++++++++++++++++++++
 frontend/src/views/admin/RequestsView.vue  | 47 +++++++++++++
 4 files changed, 220 insertions(+), 37 deletions(-)
 create mode 100644 frontend/src/layouts/AdminLayout.vue
 create mode 100644 frontend/src/views/admin/EmployeesView.vue
 create mode 100644 frontend/src/views/admin/RequestsView.vue

diff --git a/frontend/src/layouts/AdminLayout.vue b/frontend/src/layouts/AdminLayout.vue
new file mode 100644
index 0000000..f6e2271
--- /dev/null
+++ b/frontend/src/layouts/AdminLayout.vue
@@ -0,0 +1,62 @@
+<template>
+  <div class="min-h-screen bg-gray-100">
+    <!-- Sidebar -->
+    <aside class="fixed inset-y-0 left-0 w-64 bg-slate-800 text-white">
+      <div class="p-4">
+        <h1 class="text-xl font-bold">Админ-панель</h1>
+      </div>
+      <nav class="mt-4">
+        <router-link 
+          v-for="item in menuItems" 
+          :key="item.path"
+          :to="item.path"
+          class="flex items-center px-4 py-2 text-gray-300 hover:bg-slate-700 hover:text-white"
+          :class="{ 'bg-slate-700 text-white': isCurrentRoute(item.path) }"
+        >
+          <component :is="item.icon" class="w-5 h-5 mr-2" />
+          {{ item.name }}
+        </router-link>
+      </nav>
+    </aside>
+
+    <!-- Main content -->
+    <main class="pl-64">
+      <div class="p-8">
+        <router-view></router-view>
+      </div>
+    </main>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useRoute } from 'vue-router';
+import { 
+  LayoutDashboard, 
+  ClipboardList, 
+  Users 
+} from 'lucide-vue-next';
+
+const route = useRoute();
+
+const menuItems = [
+  { 
+    name: 'Дашборд', 
+    path: '/admin/dashboard',
+    icon: LayoutDashboard 
+  },
+  { 
+    name: 'Заявки', 
+    path: '/admin/requests',
+    icon: ClipboardList 
+  },
+  { 
+    name: 'Сотрудники', 
+    path: '/admin/employees',
+    icon: Users 
+  }
+];
+
+const isCurrentRoute = (path: string) => {
+  return route.path.startsWith(path);
+};
+</script> 
\ No newline at end of file
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 2ffac53..97638ed 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -1,51 +1,44 @@
 import { createRouter, createWebHistory } from 'vue-router';
-import { useAuthStore } from '@/stores/auth';
-import LoginView from '../views/LoginView.vue';
 
 const router = createRouter({
   history: createWebHistory(),
   routes: [
-    {
-      path: '/',
-      name: 'login',
-      component: LoginView
-    },
-    {
-      path: '/support',
-      name: 'support',
-      component: () => import('../views/SupportView.vue'),
-      meta: { requiresAuth: true }
-    },
     {
       path: '/admin',
-      name: 'admin-login',
-      component: () => import('../views/admin/AdminLoginView.vue')
+      component: () => import('@/layouts/AdminLayout.vue'),
+      children: [
+        {
+          path: '',
+          redirect: '/admin/dashboard'
+        },
+        {
+          path: 'dashboard',
+          name: 'AdminDashboard',
+          component: () => import('@/views/admin/DashboardView.vue')
+        },
+        {
+          path: 'requests',
+          name: 'AdminRequests',
+          component: () => import('@/views/admin/RequestsView.vue')
+        },
+        {
+          path: 'employees',
+          name: 'AdminEmployees',
+          component: () => import('@/views/admin/EmployeesView.vue')
+        },
+        {
+          path: 'employees/add',
+          name: 'AdminEmployeeAdd',
+          component: () => import('@/views/admin/AddEmployeeView.vue')
+        }
+      ]
     },
     {
-      path: '/admin/dashboard',
-      name: 'admin-dashboard',
-      component: () => import('../views/admin/DashboardView.vue'),
-      meta: { requiresAdmin: true }
-    },
-    {
-      path: '/admin/employees/add',
-      name: 'add-employee',
-      component: () => import('../views/admin/AddEmployeeView.vue'),
-      meta: { requiresAdmin: true }
+      path: '/admin/login',
+      name: 'AdminLogin',
+      component: () => import('@/views/admin/AdminLoginView.vue')
     }
   ]
 });
 
-router.beforeEach((to, _, next) => {
-  const authStore = useAuthStore();
-
-  if (to.meta.requiresAuth && !authStore.isAuthenticated) {
-    next({ name: 'login' });
-  } else if (to.meta.requiresAdmin && !authStore.isAdmin) {
-    next({ name: 'admin-login' });
-  } else {
-    next();
-  }
-});
-
 export default router;
\ No newline at end of file
diff --git a/frontend/src/views/admin/EmployeesView.vue b/frontend/src/views/admin/EmployeesView.vue
new file mode 100644
index 0000000..a4c6bfc
--- /dev/null
+++ b/frontend/src/views/admin/EmployeesView.vue
@@ -0,0 +1,81 @@
+<template>
+  <div class="space-y-6">
+    <div class="flex justify-between items-center">
+      <h1 class="text-2xl font-bold">Сотрудники</h1>
+      <router-link 
+        to="/admin/employees/add"
+        class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 inline-flex items-center gap-2"
+      >
+        <PlusCircle class="w-5 h-5" />
+        Добавить сотрудника
+      </router-link>
+    </div>
+
+    <!-- Employees table -->
+    <div class="bg-white rounded-lg shadow">
+      <div class="overflow-x-auto">
+        <table class="w-full">
+          <thead class="bg-gray-50">
+            <tr>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Фамилия</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Имя</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Отдел</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Кабинет</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Действия</th>
+            </tr>
+          </thead>
+          <tbody class="bg-white divide-y divide-gray-200">
+            <tr v-for="employee in employees" :key="employee.id">
+              <td class="px-6 py-4 whitespace-nowrap">{{ employee.last_name }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">{{ employee.first_name }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">{{ employee.department }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">{{ employee.office }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">
+                <button 
+                  @click="editEmployee(employee)"
+                  class="text-blue-600 hover:text-blue-900"
+                >
+                  Редактировать
+                </button>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import { PlusCircle } from 'lucide-vue-next';
+
+interface Employee {
+  id: number;
+  first_name: string;
+  last_name: string;
+  department: string;
+  office: string;
+}
+
+const employees = ref<Employee[]>([]);
+
+const fetchEmployees = async () => {
+  try {
+    const response = await fetch('/api/employees/');
+    if (!response.ok) throw new Error('Failed to fetch employees');
+    employees.value = await response.json();
+  } catch (error) {
+    console.error('Error fetching employees:', error);
+  }
+};
+
+const editEmployee = (employee: Employee) => {
+  // Implement edit functionality
+  console.log('Edit employee:', employee);
+};
+
+onMounted(() => {
+  fetchEmployees();
+});
+</script> 
\ No newline at end of file
diff --git a/frontend/src/views/admin/RequestsView.vue b/frontend/src/views/admin/RequestsView.vue
new file mode 100644
index 0000000..26956d7
--- /dev/null
+++ b/frontend/src/views/admin/RequestsView.vue
@@ -0,0 +1,47 @@
+<template>
+  <div class="space-y-6">
+    <h1 class="text-2xl font-bold">Заявки</h1>
+    
+    <!-- Requests table -->
+    <div class="bg-white rounded-lg shadow">
+      <div class="overflow-x-auto">
+        <table class="w-full">
+          <thead class="bg-gray-50">
+            <tr>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Сотрудник</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Тип</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Статус</th>
+              <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Дата</th>
+            </tr>
+          </thead>
+          <tbody class="bg-white divide-y divide-gray-200">
+            <tr v-for="request in requests" :key="request.id">
+              <td class="px-6 py-4 whitespace-nowrap">{{ request.id }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">{{ request.employee_last_name }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">{{ getRequestTypeLabel(request.request_type) }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">{{ getStatusLabel(request.status) }}</td>
+              <td class="px-6 py-4 whitespace-nowrap">{{ formatDate(request.created_at) }}</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { onMounted } from 'vue';
+import { useRequests } from '@/composables/useRequests';
+import { getRequestTypeLabel, getStatusLabel } from '@/utils/labels';
+
+const { requests, fetchRequests } = useRequests();
+
+const formatDate = (date: string) => {
+  return new Date(date).toLocaleString('ru-RU');
+};
+
+onMounted(() => {
+  fetchRequests();
+});
+</script> 
\ No newline at end of file