From e3a55901c115b2f9e308fbd578880ecccb53c2c4 Mon Sep 17 00:00:00 2001
From: MoonTestUse1 <crocoman7887@gmail.com>
Date: Thu, 2 Jan 2025 03:08:51 +0600
Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=B5=D1=80=D0=B5=D0=B4=D0=B5=D0=BB?=
 =?UTF-8?q?=D0=BA=D0=B06?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/views/AdminDashboardView.vue | 443 +++++++++-------------
 1 file changed, 185 insertions(+), 258 deletions(-)

diff --git a/frontend/src/views/AdminDashboardView.vue b/frontend/src/views/AdminDashboardView.vue
index 6afed3d..b69dd15 100644
--- a/frontend/src/views/AdminDashboardView.vue
+++ b/frontend/src/views/AdminDashboardView.vue
@@ -1,152 +1,82 @@
 <template>
-  <div class="min-h-screen bg-gray-50">
-    <!-- Header -->
-    <header class="bg-white shadow">
-      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center">
-        <h1 class="text-2xl font-bold text-gray-900">Панель администратора</h1>
-        <button 
-          @click="handleLogout"
-          class="px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 transition-colors flex items-center gap-2"
-        >
-          Выйти
-        </button>
+  <div class="min-h-screen bg-gray-100">
+    <!-- Верхняя панель -->
+    <header class="bg-white border-b">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div class="flex justify-between items-center h-16">
+          <h1 class="text-xl font-medium text-gray-900">Панель администратора</h1>
+          <button 
+            @click="handleLogout"
+            class="text-gray-500 hover:text-gray-700 font-medium"
+          >
+            Выйти
+          </button>
+        </div>
       </div>
     </header>
 
     <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
       <!-- Статистика -->
-      <div class="mb-8">
-        <h2 class="text-lg font-semibold text-gray-900 mb-4">Статистика заявок</h2>
-        <div class="grid grid-cols-1 gap-5 sm:grid-cols-3">
-          <!-- Новые заявки -->
-          <div class="bg-white overflow-hidden shadow-lg rounded-lg">
-            <div class="p-5">
-              <div class="flex items-center">
-                <div class="flex-shrink-0">
-                  <div class="rounded-md bg-blue-500 p-3">
-                    <svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-                    </svg>
-                  </div>
-                </div>
-                <div class="ml-5 w-0 flex-1">
-                  <dl>
-                    <dt class="text-sm font-medium text-gray-500 truncate">Новые заявки</dt>
-                    <dd class="flex items-baseline">
-                      <div class="text-2xl font-semibold text-gray-900">{{ statistics.new || 0 }}</div>
-                    </dd>
-                  </dl>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <!-- В работе -->
-          <div class="bg-white overflow-hidden shadow-lg rounded-lg">
-            <div class="p-5">
-              <div class="flex items-center">
-                <div class="flex-shrink-0">
-                  <div class="rounded-md bg-yellow-500 p-3">
-                    <svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
-                    </svg>
-                  </div>
-                </div>
-                <div class="ml-5 w-0 flex-1">
-                  <dl>
-                    <dt class="text-sm font-medium text-gray-500 truncate">В работе</dt>
-                    <dd class="flex items-baseline">
-                      <div class="text-2xl font-semibold text-gray-900">{{ statistics.inProgress || 0 }}</div>
-                    </dd>
-                  </dl>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <!-- Решенные -->
-          <div class="bg-white overflow-hidden shadow-lg rounded-lg">
-            <div class="p-5">
-              <div class="flex items-center">
-                <div class="flex-shrink-0">
-                  <div class="rounded-md bg-green-500 p-3">
-                    <svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
-                    </svg>
-                  </div>
-                </div>
-                <div class="ml-5 w-0 flex-1">
-                  <dl>
-                    <dt class="text-sm font-medium text-gray-500 truncate">Решенные</dt>
-                    <dd class="flex items-baseline">
-                      <div class="text-2xl font-semibold text-gray-900">{{ statistics.resolved || 0 }}</div>
-                    </dd>
-                  </dl>
-                </div>
-              </div>
-            </div>
-          </div>
+      <div class="grid grid-cols-1 gap-4 sm:grid-cols-3 mb-8">
+        <div class="bg-white p-6 rounded-lg">
+          <div class="text-sm font-medium text-gray-500 mb-1">Новые заявки</div>
+          <div class="text-2xl font-medium text-gray-900">{{ statistics.new || 0 }}</div>
+        </div>
+        <div class="bg-white p-6 rounded-lg">
+          <div class="text-sm font-medium text-gray-500 mb-1">В работе</div>
+          <div class="text-2xl font-medium text-gray-900">{{ statistics.inProgress || 0 }}</div>
+        </div>
+        <div class="bg-white p-6 rounded-lg">
+          <div class="text-sm font-medium text-gray-500 mb-1">Решенные</div>
+          <div class="text-2xl font-medium text-gray-900">{{ statistics.resolved || 0 }}</div>
         </div>
       </div>
 
       <!-- Заявки -->
       <div class="mb-8">
-        <div class="sm:flex sm:items-center sm:justify-between mb-4">
-          <h2 class="text-lg font-semibold text-gray-900">Список заявок</h2>
-          <div class="mt-3 sm:mt-0 sm:ml-4">
-            <button
-              @click="activeTab = 'requests'"
-              class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
-            >
-              Все заявки
-            </button>
-          </div>
+        <div class="flex justify-between items-center mb-4">
+          <h2 class="text-lg font-medium text-gray-900">Заявки</h2>
         </div>
-        
-        <div class="bg-white shadow-lg rounded-lg overflow-hidden">
+        <div class="bg-white rounded-lg overflow-hidden">
           <div class="overflow-x-auto">
             <table class="min-w-full divide-y divide-gray-200">
-              <thead class="bg-gray-50">
+              <thead>
                 <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>
-                  <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 bg-gray-50">ID</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Сотрудник</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Отдел</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Тип</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Приоритет</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Статус</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Действия</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 text-sm text-gray-900">{{ request.id }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap">
+              <tbody class="divide-y divide-gray-200">
+                <tr v-for="request in requests" :key="request.id" class="hover:bg-gray-50">
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ request.id }}</td>
+                  <td class="px-6 py-4">
                     <div class="text-sm text-gray-900">{{ request.employee?.last_name }}</div>
                     <div class="text-sm text-gray-500">{{ request.employee?.first_name }}</div>
                   </td>
-                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ request.department }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ request.request_type }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap">
-                    <span :class="getPriorityClass(request.priority)">
-                      {{ request.priority }}
-                    </span>
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ request.department }}</td>
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ request.request_type }}</td>
+                  <td class="px-6 py-4">
+                    <span :class="getPriorityClass(request.priority)">{{ request.priority }}</span>
                   </td>
-                  <td class="px-6 py-4 whitespace-nowrap">
-                    <span :class="getStatusClass(request.status)">
-                      {{ request.status }}
-                    </span>
+                  <td class="px-6 py-4">
+                    <span :class="getStatusClass(request.status)">{{ request.status }}</span>
                   </td>
-                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                  <td class="px-6 py-4 text-sm">
                     <button
                       @click="openRequestDetails(request)"
-                      class="text-blue-600 hover:text-blue-900 mr-3"
+                      class="text-gray-700 hover:text-gray-900 mr-3"
                     >
                       Подробнее
                     </button>
                     <button
                       v-if="request.status !== 'resolved'"
                       @click="updateRequestStatus(request)"
-                      class="text-green-600 hover:text-green-900"
+                      class="text-blue-600 hover:text-blue-700"
                     >
                       {{ request.status === 'new' ? 'Взять в работу' : 'Завершить' }}
                     </button>
@@ -160,42 +90,39 @@
 
       <!-- Сотрудники -->
       <div>
-        <div class="sm:flex sm:items-center sm:justify-between mb-4">
-          <h2 class="text-lg font-semibold text-gray-900">Список сотрудников</h2>
-          <div class="mt-3 sm:mt-0 sm:ml-4">
-            <button
-              @click="openAddEmployeeModal"
-              class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
-            >
-              Добавить сотрудника
-            </button>
-          </div>
+        <div class="flex justify-between items-center mb-4">
+          <h2 class="text-lg font-medium text-gray-900">Сотрудники</h2>
+          <button
+            @click="openAddEmployeeModal"
+            class="inline-flex items-center px-4 py-2 text-sm font-medium text-blue-600 hover:text-blue-700"
+          >
+            + Добавить сотрудника
+          </button>
         </div>
-
-        <div class="bg-white shadow-lg rounded-lg overflow-hidden">
+        <div class="bg-white rounded-lg overflow-hidden">
           <div class="overflow-x-auto">
             <table class="min-w-full divide-y divide-gray-200">
-              <thead class="bg-gray-50">
+              <thead>
                 <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>
-                  <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 bg-gray-50">ID</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Имя</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Фамилия</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Отдел</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Кабинет</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Действия</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 text-sm text-gray-900">{{ employee.id }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.first_name }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.last_name }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.department }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.office }}</td>
-                  <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
+              <tbody class="divide-y divide-gray-200">
+                <tr v-for="employee in employees" :key="employee.id" class="hover:bg-gray-50">
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ employee.id }}</td>
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ employee.first_name }}</td>
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ employee.last_name }}</td>
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ employee.department }}</td>
+                  <td class="px-6 py-4 text-sm text-gray-900">{{ employee.office }}</td>
+                  <td class="px-6 py-4 text-sm">
                     <button
                       @click="openEditEmployeeModal(employee)"
-                      class="text-blue-600 hover:text-blue-900"
+                      class="text-gray-700 hover:text-gray-900"
                     >
                       Редактировать
                     </button>
@@ -209,57 +136,59 @@
     </main>
 
     <!-- Модальное окно для заявки -->
-    <div v-if="showRequestModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center p-4">
-      <div class="bg-white rounded-lg max-w-2xl w-full p-6">
-        <div class="flex justify-between items-center mb-4">
-          <h3 class="text-lg font-medium">Детали заявки #{{ selectedRequest?.id }}</h3>
+    <div v-if="showRequestModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4">
+      <div class="bg-white rounded-lg max-w-2xl w-full">
+        <div class="flex justify-between items-center p-6 border-b">
+          <h3 class="text-lg font-medium text-gray-900">Заявка #{{ selectedRequest?.id }}</h3>
           <button @click="showRequestModal = false" class="text-gray-400 hover:text-gray-500">
-            <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
               <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
             </svg>
           </button>
         </div>
-        <div class="space-y-4">
-          <div>
-            <label class="block text-sm font-medium text-gray-700">Описание</label>
-            <p class="mt-1 text-sm text-gray-900">{{ selectedRequest?.description }}</p>
-          </div>
-          <div class="grid grid-cols-2 gap-4">
+        <div class="p-6">
+          <div class="space-y-4">
             <div>
-              <label class="block text-sm font-medium text-gray-700">Сотрудник</label>
-              <p class="mt-1 text-sm text-gray-900">
-                {{ selectedRequest?.employee?.last_name }} {{ selectedRequest?.employee?.first_name }}
-              </p>
+              <div class="text-sm font-medium text-gray-500">Описание</div>
+              <div class="mt-1 text-sm text-gray-900">{{ selectedRequest?.description }}</div>
             </div>
-            <div>
-              <label class="block text-sm font-medium text-gray-700">Отдел</label>
-              <p class="mt-1 text-sm text-gray-900">{{ selectedRequest?.department }}</p>
-            </div>
-            <div>
-              <label class="block text-sm font-medium text-gray-700">Тип заявки</label>
-              <p class="mt-1 text-sm text-gray-900">{{ selectedRequest?.request_type }}</p>
-            </div>
-            <div>
-              <label class="block text-sm font-medium text-gray-700">Приоритет</label>
-              <p class="mt-1">
-                <span :class="getPriorityClass(selectedRequest?.priority)">
-                  {{ selectedRequest?.priority }}
-                </span>
-              </p>
+            <div class="grid grid-cols-2 gap-4">
+              <div>
+                <div class="text-sm font-medium text-gray-500">Сотрудник</div>
+                <div class="mt-1 text-sm text-gray-900">
+                  {{ selectedRequest?.employee?.last_name }} {{ selectedRequest?.employee?.first_name }}
+                </div>
+              </div>
+              <div>
+                <div class="text-sm font-medium text-gray-500">Отдел</div>
+                <div class="mt-1 text-sm text-gray-900">{{ selectedRequest?.department }}</div>
+              </div>
+              <div>
+                <div class="text-sm font-medium text-gray-500">Тип заявки</div>
+                <div class="mt-1 text-sm text-gray-900">{{ selectedRequest?.request_type }}</div>
+              </div>
+              <div>
+                <div class="text-sm font-medium text-gray-500">Приоритет</div>
+                <div class="mt-1">
+                  <span :class="getPriorityClass(selectedRequest?.priority)">
+                    {{ selectedRequest?.priority }}
+                  </span>
+                </div>
+              </div>
             </div>
           </div>
         </div>
-        <div class="mt-6 flex justify-end gap-3">
+        <div class="flex justify-end gap-3 p-6 border-t bg-gray-50">
           <button
             @click="showRequestModal = false"
-            class="px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700 hover:bg-gray-50"
+            class="px-4 py-2 text-sm font-medium text-gray-700 hover:text-gray-900"
           >
             Закрыть
           </button>
           <button
             v-if="selectedRequest?.status !== 'resolved'"
             @click="updateRequestStatus(selectedRequest)"
-            class="px-4 py-2 bg-blue-600 text-white rounded-md text-sm font-medium hover:bg-blue-700"
+            class="px-4 py-2 text-sm font-medium text-blue-600 hover:text-blue-700"
           >
             {{ selectedRequest?.status === 'new' ? 'Взять в работу' : 'Завершить' }}
           </button>
@@ -268,82 +197,84 @@
     </div>
 
     <!-- Модальное окно для сотрудника -->
-    <div v-if="showEmployeeModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center p-4">
-      <div class="bg-white rounded-lg max-w-md w-full p-6">
-        <div class="flex justify-between items-center mb-4">
-          <h3 class="text-lg font-medium">
+    <div v-if="showEmployeeModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4">
+      <div class="bg-white rounded-lg max-w-md w-full">
+        <div class="flex justify-between items-center p-6 border-b">
+          <h3 class="text-lg font-medium text-gray-900">
             {{ isEditingEmployee ? 'Редактировать сотрудника' : 'Добавить сотрудника' }}
           </h3>
           <button @click="showEmployeeModal = false" class="text-gray-400 hover:text-gray-500">
-            <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
               <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
             </svg>
           </button>
         </div>
-        <form @submit.prevent="handleEmployeeSubmit" class="space-y-4">
-          <div>
-            <label class="block text-sm font-medium text-gray-700">Имя</label>
-            <input
-              v-model="employeeForm.first_name"
-              type="text"
-              required
-              class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"
-            />
-          </div>
-          <div>
-            <label class="block text-sm font-medium text-gray-700">Фамилия</label>
-            <input
-              v-model="employeeForm.last_name"
-              type="text"
-              required
-              class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"
-            />
-          </div>
-          <div>
-            <label class="block text-sm font-medium text-gray-700">Отдел</label>
-            <input
-              v-model="employeeForm.department"
-              type="text"
-              required
-              class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"
-            />
-          </div>
-          <div>
-            <label class="block text-sm font-medium text-gray-700">Кабинет</label>
-            <input
-              v-model="employeeForm.office"
-              type="text"
-              required
-              class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"
-            />
-          </div>
-          <div>
-            <label class="block text-sm font-medium text-gray-700">
-              Пароль {{ isEditingEmployee ? '(оставьте пустым, чтобы не менять)' : '' }}
-            </label>
-            <input
-              v-model="employeeForm.password"
-              type="password"
-              :required="!isEditingEmployee"
-              class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"
-            />
-          </div>
-          <div class="flex justify-end gap-3">
-            <button
-              type="button"
-              @click="showEmployeeModal = false"
-              class="px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700 hover:bg-gray-50"
-            >
-              Отмена
-            </button>
-            <button
-              type="submit"
-              class="px-4 py-2 bg-blue-600 text-white rounded-md text-sm font-medium hover:bg-blue-700"
-            >
-              {{ isEditingEmployee ? 'Сохранить' : 'Добавить' }}
-            </button>
+        <form @submit.prevent="handleEmployeeSubmit" class="p-6">
+          <div class="space-y-4">
+            <div>
+              <label class="block text-sm font-medium text-gray-700">Имя</label>
+              <input
+                v-model="employeeForm.first_name"
+                type="text"
+                required
+                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
+              />
+            </div>
+            <div>
+              <label class="block text-sm font-medium text-gray-700">Фамилия</label>
+              <input
+                v-model="employeeForm.last_name"
+                type="text"
+                required
+                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
+              />
+            </div>
+            <div>
+              <label class="block text-sm font-medium text-gray-700">Отдел</label>
+              <input
+                v-model="employeeForm.department"
+                type="text"
+                required
+                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
+              />
+            </div>
+            <div>
+              <label class="block text-sm font-medium text-gray-700">Кабинет</label>
+              <input
+                v-model="employeeForm.office"
+                type="text"
+                required
+                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
+              />
+            </div>
+            <div>
+              <label class="block text-sm font-medium text-gray-700">
+                Пароль {{ isEditingEmployee ? '(оставьте пустым, чтобы не менять)' : '' }}
+              </label>
+              <input
+                v-model="employeeForm.password"
+                type="password"
+                :required="!isEditingEmployee"
+                class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
+              />
+            </div>
           </div>
         </form>
+        <div class="flex justify-end gap-3 p-6 border-t bg-gray-50">
+          <button
+            type="button"
+            @click="showEmployeeModal = false"
+            class="px-4 py-2 text-sm font-medium text-gray-700 hover:text-gray-900"
+          >
+            Отмена
+          </button>
+          <button
+            type="submit"
+            class="px-4 py-2 text-sm font-medium text-blue-600 hover:text-blue-700"
+          >
+            {{ isEditingEmployee ? 'Сохранить' : 'Добавить' }}
+          </button>
+        </div>
       </div>
     </div>
   </div>
@@ -390,7 +321,6 @@ interface EmployeeForm {
 }
 
 const router = useRouter()
-const activeTab = ref('statistics')
 const statistics = ref<Statistics>({ new: 0, inProgress: 0, resolved: 0 })
 const requests = ref<Request[]>([])
 const employees = ref<Employee[]>([])
@@ -505,7 +435,6 @@ const updateRequestStatus = async (request: Request | null) => {
 
     const headers = { Authorization: `Bearer ${token}` }
     
-    // Определяем следующий статус
     let newStatus: Request['status'] = 'in_progress'
     if (request.status === 'new') {
       newStatus = 'in_progress'
@@ -520,18 +449,17 @@ const updateRequestStatus = async (request: Request | null) => {
   }
 }
 
-// Вспомогательные функции для стилей
 const priorityClasses = {
-  low: 'px-2 py-1 text-sm rounded-full bg-gray-100 text-gray-800',
-  medium: 'px-2 py-1 text-sm rounded-full bg-yellow-100 text-yellow-800',
-  high: 'px-2 py-1 text-sm rounded-full bg-orange-100 text-orange-800',
-  critical: 'px-2 py-1 text-sm rounded-full bg-red-100 text-red-800'
+  low: 'px-2 py-1 text-xs rounded-full bg-gray-100 text-gray-800',
+  medium: 'px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800',
+  high: 'px-2 py-1 text-xs rounded-full bg-orange-100 text-orange-800',
+  critical: 'px-2 py-1 text-xs rounded-full bg-red-100 text-red-800'
 } as const
 
 const statusClasses = {
-  new: 'px-2 py-1 text-sm rounded-full bg-blue-100 text-blue-800',
-  in_progress: 'px-2 py-1 text-sm rounded-full bg-yellow-100 text-yellow-800',
-  resolved: 'px-2 py-1 text-sm rounded-full bg-green-100 text-green-800'
+  new: 'px-2 py-1 text-xs rounded-full bg-gray-100 text-gray-800',
+  in_progress: 'px-2 py-1 text-xs rounded-full bg-blue-100 text-blue-800',
+  resolved: 'px-2 py-1 text-xs rounded-full bg-green-100 text-green-800'
 } as const
 
 const getPriorityClass = (priority: Request['priority'] | undefined) => {
@@ -543,6 +471,5 @@ const getStatusClass = (status: Request['status']) => {
   return statusClasses[status]
 }
 
-// Загрузка данных при монтировании
 onMounted(fetchData)
 </script>