upload files

public/script.js

@@ -427,10 +427,10 @@ function renderTasks() {
                     
                     <div class="task-assignments">
                         <strong>Исполнители:</strong>
-                        ${task.assignments && task.assignments.length > 0 ? 
-                            task.assignments.map(assignment => renderAssignment(assignment, task.id, canEdit)).join('') : 
+${task.assignments && task.assignments.length > 0 ? 
+    renderAssignmentList(task.assignments, task.id, canEdit) : 
     '<div>Не назначены</div>'
-                        }
+}
                     </div>
                     
                     <div class="task-meta">
@@ -443,7 +443,61 @@ function renderTasks() {
         `;
     }).join('');
 }
+function renderAssignmentList(assignments, taskId, canEdit) {
+    if (!assignments || assignments.length === 0) {
+        return '<div>Не назначены</div>';
+    }
 
+    // Создаем контейнер с возможностью фильтрации
+    return `
+        <div class="assignments-container">
+            <div class="assignments-filter">
+                <input type="text" 
+                       class="assignment-filter-input" 
+                       placeholder="Поиск исполнителя..." 
+                       data-task-id="${taskId}"
+                       oninput="filterAssignments(${taskId})">
+                <span class="filter-count" id="filter-count-${taskId}">${assignments.length} исполнителей</span>
+            </div>
+            <div class="assignments-scroll-container" id="assignments-${taskId}">
+                ${assignments.map(assignment => renderAssignment(assignment, taskId, canEdit)).join('')}
+            </div>
+        </div>
+    `;
+}
+
+// Функция для фильтрации исполнителей в конкретной задаче
+function filterAssignments(taskId) {
+    const filterInput = document.querySelector(`.assignment-filter-input[data-task-id="${taskId}"]`);
+    const scrollContainer = document.getElementById(`assignments-${taskId}`);
+    const filterCount = document.getElementById(`filter-count-${taskId}`);
+    
+    if (!filterInput || !scrollContainer) return;
+    
+    const searchTerm = filterInput.value.toLowerCase();
+    const assignments = scrollContainer.querySelectorAll('.assignment');
+    
+    let visibleCount = 0;
+    
+    assignments.forEach(assignment => {
+        const userName = assignment.querySelector('strong')?.textContent?.toLowerCase() || '';
+        const userLogin = assignment.querySelector('small')?.textContent?.toLowerCase() || '';
+        
+        const isVisible = userName.includes(searchTerm) || 
+                         userLogin.includes(searchTerm) ||
+                         searchTerm === '';
+        
+        assignment.style.display = isVisible ? '' : 'none';
+        
+        if (isVisible) {
+            visibleCount++;
+        }
+    });
+    
+    if (filterCount) {
+        filterCount.textContent = `${visibleCount} из ${assignments.length} исполнителей`;
+    }
+}
 function toggleTask(taskId) {
     if (expandedTasks.has(taskId)) {
         expandedTasks.delete(taskId);

public/style.css

@@ -1735,3 +1735,91 @@ button.reopen-btn:hover {
         font-size: 0.65rem;
     }
 }
+/* Добавьте эти стили в style.css */
+
+.assignments-container {
+    margin-top: 10px;
+    border: 1px solid #e1e5e9;
+    border-radius: 8px;
+    padding: 10px;
+    background: #f8fafc;
+}
+
+.assignments-filter {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 10px;
+    padding-bottom: 8px;
+    border-bottom: 1px solid #e1e5e9;
+}
+
+.assignment-filter-input {
+    flex: 1;
+    padding: 6px 10px;
+    border: 1px solid #d1d5db;
+    border-radius: 4px;
+    font-size: 14px;
+    margin-right: 10px;
+}
+
+.assignment-filter-input:focus {
+    outline: none;
+    border-color: #3498db;
+    box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.2);
+}
+
+.filter-count {
+    font-size: 12px;
+    color: #6c757d;
+    background: #e9ecef;
+    padding: 2px 8px;
+    border-radius: 12px;
+    white-space: nowrap;
+}
+
+.assignments-scroll-container {
+    max-height: 300px;
+    overflow-y: auto;
+    padding-right: 5px;
+}
+
+/* Стили для скроллбара */
+.assignments-scroll-container::-webkit-scrollbar {
+    width: 8px;
+}
+
+.assignments-scroll-container::-webkit-scrollbar-track {
+    background: #f1f1f1;
+    border-radius: 4px;
+}
+
+.assignments-scroll-container::-webkit-scrollbar-thumb {
+    background: #c1c1c1;
+    border-radius: 4px;
+}
+
+.assignments-scroll-container::-webkit-scrollbar-thumb:hover {
+    background: #a8a8a8;
+}
+
+/* Стили для отдельных исполнителей */
+.assignment {
+    display: flex;
+    align-items: flex-start;
+    padding: 8px;
+    margin-bottom: 8px;
+    background: white;
+    border: 1px solid #e9ecef;
+    border-radius: 6px;
+    transition: all 0.2s;
+}
+
+.assignment:hover {
+    background: #f8f9fa;
+    border-color: #dee2e6;
+}
+
+.assignment:last-child {
+    margin-bottom: 0;
+}