From 45a634de927b33a371b66d1fe55dc3f9a1e37c27 Mon Sep 17 00:00:00 2001
From: lizerk <lizerk-dev@gmail.com>
Date: Wed, 18 Mar 2026 11:37:57 +0300
Subject: [PATCH] =?UTF-8?q?=D0=B4=D0=BE=D1=80=D0=B0=D0=B1=D0=BE=D1=82?=
 =?UTF-8?q?=D0=B0=D0=BB=20=D0=BE=D1=82=D0=BE=D0=B1=D1=80=D0=B0=D0=B6=D0=B5?=
 =?UTF-8?q?=D0=BD=D0=B8=D0=B5=20=D1=82=D0=B5=D0=BA=D1=83=D1=89=D0=B5=D0=B3?=
 =?UTF-8?q?=D0=BE=20=D1=81=D1=82=D0=B0=D1=82=D1=83=D1=81=D0=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/app/users/[id]/page.tsx | 153 +++++++++++++++------------
 1 file changed, 84 insertions(+), 69 deletions(-)

diff --git a/frontend/src/app/users/[id]/page.tsx b/frontend/src/app/users/[id]/page.tsx
index 07240609..d5bf49fe 100644
--- a/frontend/src/app/users/[id]/page.tsx
+++ b/frontend/src/app/users/[id]/page.tsx
@@ -75,15 +75,25 @@ export default function UserDetailPage() {
     return `${person.last_name || ""} ${person.first_name || ""} ${person.patronymic || ""}`.trim() || "Пользователь";
   }, [person]);
 
-  // Последний статус сотрудника
+  // Последний статус сотрудника (только события которые уже наступили)
   const latestAction = useMemo(() => {
     if (!person?.actions || person.actions.length === 0) return null;
-    return person.actions.reduce((latest, action) => 
+    
+    const now = new Date();
+    // Фильтруем только события которые уже наступили
+    const pastActions = person.actions.filter(action => 
+      new Date(action.date) <= now
+    );
+    
+    if (pastActions.length === 0) return null;
+    
+    // Из них берём последнее
+    return pastActions.reduce((latest, action) => 
       new Date(action.date) > new Date(latest.date) ? action : latest
     );
   }, [person?.actions]);
 
-  // Отсортированная история событий (от новых к старым)
+  // Отсортированная история событий (от новых к старым, показываем все включая будущие)
   const sortedActions = useMemo(() => {
     if (!person?.actions || person.actions.length === 0) return [];
     return [...person.actions].sort((a, b) => 
@@ -681,77 +691,82 @@ export default function UserDetailPage() {
                   </div>
                 </div>
                 <div className="space-y-3">
-                  {sortedActions.map((action, index) => (
-                    <div
-                      key={action.id}
-                      className="flex gap-3 border-l-2 pl-3 py-1"
-                      style={{
-                        borderColor: 
-                          action.action === 'on_leave' ? '#eab308' :
-                          action.action === 'on_maternity' ? '#a855f7' :
-                          action.action === 'transferred' ? '#3b82f6' :
-                          action.action === 'dismissed' ? '#ef4444' :
-                          '#22c55e'
-                      }}
-                    >
-                      <div className="flex-1 min-w-0">
-                        <div className="flex items-start justify-between gap-2">
-                          <div className="flex-1">
-                            <div className="flex items-center gap-2">
-                              <span className={`inline-block rounded-full px-2 py-0.5 text-xs font-medium ${
-                                action.action === 'on_leave' ? 'bg-yellow-100 text-yellow-700' :
-                                action.action === 'on_maternity' ? 'bg-purple-100 text-purple-700' :
-                                action.action === 'transferred' ? 'bg-blue-100 text-blue-700' :
-                                action.action === 'dismissed' ? 'bg-red-100 text-red-700' :
-                                'bg-green-100 text-green-700'
-                              }`}>
-                                {action.action_display || action.action}
-                              </span>
-                              {index === 0 && (
-                                <span className="text-xs text-gray-500">текущий</span>
+                  {sortedActions.map((action, index) => {
+                    // Проверяем является ли это событие текущим (последнее из наступивших)
+                    const isCurrent = latestAction?.id === action.id;
+                    
+                    return (
+                      <div
+                        key={action.id}
+                        className="flex gap-3 border-l-2 pl-3 py-1"
+                        style={{
+                          borderColor: 
+                            action.action === 'on_leave' ? '#eab308' :
+                            action.action === 'on_maternity' ? '#a855f7' :
+                            action.action === 'transferred' ? '#3b82f6' :
+                            action.action === 'dismissed' ? '#ef4444' :
+                            '#22c55e'
+                        }}
+                      >
+                        <div className="flex-1 min-w-0">
+                          <div className="flex items-start justify-between gap-2">
+                            <div className="flex-1">
+                              <div className="flex items-center gap-2">
+                                <span className={`inline-block rounded-full px-2 py-0.5 text-xs font-medium ${
+                                  action.action === 'on_leave' ? 'bg-yellow-100 text-yellow-700' :
+                                  action.action === 'on_maternity' ? 'bg-purple-100 text-purple-700' :
+                                  action.action === 'transferred' ? 'bg-blue-100 text-blue-700' :
+                                  action.action === 'dismissed' ? 'bg-red-100 text-red-700' :
+                                  'bg-green-100 text-green-700'
+                                }`}>
+                                  {action.action_display || action.action}
+                                </span>
+                                {isCurrent && (
+                                  <span className="text-xs text-gray-500">текущий</span>
+                                )}
+                              </div>
+                              {action.comment && (
+                                <p className="mt-1 text-sm text-gray-600">{action.comment}</p>
+                              )}
+                            </div>
+                            <div className="flex items-center gap-2">
+                              <time className="flex-shrink-0 text-xs text-gray-500">
+                                {new Date(action.date).toLocaleDateString('ru-RU', {
+                                  day: 'numeric',
+                                  month: 'short',
+                                  year: 'numeric'
+                                })}
+                              </time>
+                              {canManageActions && (
+                                <div className="flex gap-1">
+                                  <button
+                                    onClick={() => handleEditAction(action)}
+                                    className="rounded p-1 text-gray-400 hover:bg-gray-100 hover:text-sky-600 transition"
+                                    title="Редактировать"
+                                    disabled={actionLoading === `delete-${action.id}`}
+                                  >
+                                    <Pencil size={14} />
+                                  </button>
+                                  <button
+                                    onClick={() => handleDeleteAction(action.id)}
+                                    className="rounded p-1 text-gray-400 hover:bg-red-50 hover:text-red-600 transition"
+                                    title="Удалить"
+                                    disabled={actionLoading === `delete-${action.id}`}
+                                  >
+                                    {actionLoading === `delete-${action.id}` ? (
+                                      <div className="h-3.5 w-3.5 animate-spin rounded-full border-2 border-red-600 border-t-transparent" />
+                                    ) : (
+                                      <Trash2 size={14} />
+                                    )}
+                                  </button>
+                                </div>
                               )}
                             </div>
-                            {action.comment && (
-                              <p className="mt-1 text-sm text-gray-600">{action.comment}</p>
-                            )}
-                          </div>
-                          <div className="flex items-center gap-2">
-                            <time className="flex-shrink-0 text-xs text-gray-500">
-                              {new Date(action.date).toLocaleDateString('ru-RU', {
-                                day: 'numeric',
-                                month: 'short',
-                                year: 'numeric'
-                              })}
-                            </time>
-                            {canManageActions && (
-                              <div className="flex gap-1">
-                                <button
-                                  onClick={() => handleEditAction(action)}
-                                  className="rounded p-1 text-gray-400 hover:bg-gray-100 hover:text-sky-600 transition"
-                                  title="Редактировать"
-                                  disabled={actionLoading === `delete-${action.id}`}
-                                >
-                                  <Pencil size={14} />
-                                </button>
-                                <button
-                                  onClick={() => handleDeleteAction(action.id)}
-                                  className="rounded p-1 text-gray-400 hover:bg-red-50 hover:text-red-600 transition"
-                                  title="Удалить"
-                                  disabled={actionLoading === `delete-${action.id}`}
-                                >
-                                  {actionLoading === `delete-${action.id}` ? (
-                                    <div className="h-3.5 w-3.5 animate-spin rounded-full border-2 border-red-600 border-t-transparent" />
-                                  ) : (
-                                    <Trash2 size={14} />
-                                  )}
-                                </button>
-                              </div>
-                            )}
                           </div>
                         </div>
                       </div>
-                    </div>
-                  ))}
+                    );
+                  })}
                 </div>
               </section>
             )}