From 4ba05a43d39180645682de36f5c5cf46708bd52f Mon Sep 17 00:00:00 2001
From: MoonTestUse1 <crocoman7887@gmail.com>
Date: Fri, 27 Dec 2024 03:08:59 +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=B4=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8=D1=8F=20?=
 =?UTF-8?q?=D1=81=D0=BE=D1=82=D1=80=D1=83=D0=B4=D0=BD=D0=B8=D0=BA=D0=B010?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/admin/EmployeeList.vue     | 34 ++++++++++++++++---
 1 file changed, 30 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/admin/EmployeeList.vue b/frontend/src/components/admin/EmployeeList.vue
index 6016e10..3750696 100644
--- a/frontend/src/components/admin/EmployeeList.vue
+++ b/frontend/src/components/admin/EmployeeList.vue
@@ -3,7 +3,7 @@
     <div class="flex justify-between items-center mb-6">
       <h2 class="text-lg font-semibold">Сотрудники</h2>
       <button
-        @click="showAddForm = true"
+        @click="openAddForm"
         class="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 flex items-center gap-2"
       >
         <UserPlusIcon :size="18" />
@@ -51,9 +51,9 @@
     </div>
 
     <!-- Модальное окно -->
-    <div v-show="showAddForm || editingEmployee" class="fixed inset-0 overflow-y-auto" style="z-index: 100;">
+    <div v-if="showAddForm || editingEmployee" class="fixed inset-0 overflow-y-auto" style="z-index: 100;">
       <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
-        <div class="fixed inset-0 transition-opacity" aria-hidden="true">
+        <div class="fixed inset-0 transition-opacity" aria-hidden="true" @click="closeForm">
           <div class="absolute inset-0 bg-gray-500 opacity-75"></div>
         </div>
 
@@ -167,6 +167,12 @@ const formData = ref<EmployeeFormData>({
   password: ''
 });
 
+function openAddForm() {
+  console.log('Opening add form');
+  showAddForm.value = true;
+  console.log('showAddForm value:', showAddForm.value);
+}
+
 // Сброс формы при закрытии
 function resetForm() {
   formData.value = {
@@ -178,8 +184,14 @@ function resetForm() {
   };
 }
 
+// Наблюдаем за изменением showAddForm
+watch(showAddForm, (newValue) => {
+  console.log('showAddForm changed:', newValue);
+});
+
 // Наблюдаем за изменением editingEmployee
 watch(editingEmployee, (newEmployee) => {
+  console.log('editingEmployee changed:', newEmployee);
   if (newEmployee) {
     formData.value = {
       first_name: newEmployee.first_name,
@@ -198,17 +210,20 @@ function getDepartmentLabel(value: string) {
 }
 
 function editEmployee(employee: Employee) {
+  console.log('Editing employee:', employee);
   editingEmployee.value = employee;
   showAddForm.value = true;
 }
 
 function closeForm() {
+  console.log('Closing form');
   showAddForm.value = false;
   editingEmployee.value = null;
   resetForm();
 }
 
 async function handleSubmit() {
+  console.log('Submitting form:', formData.value);
   try {
     const data = { ...formData.value };
     if (editingEmployee.value && !data.password) {
@@ -260,6 +275,17 @@ async function fetchEmployees() {
 }
 
 onMounted(() => {
+  console.log('Component mounted');
   fetchEmployees();
 });
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+.fixed {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+</style>
\ No newline at end of file