106 lines
4.8 KiB
JavaScript
106 lines
4.8 KiB
JavaScript
function openTaskChat(taskId) {
|
||
// Находим задачу
|
||
const task = tasks.find(t => t.id === taskId);
|
||
if (!task) {
|
||
alert('Задача не найдена');
|
||
return;
|
||
}
|
||
|
||
// Создаем модальное окно чата
|
||
const modalHtml = `
|
||
<div class="modal" id="task-chat-modal">
|
||
<div class="modal-content" style="max-width: 800px; max-height: 80vh;">
|
||
<div class="modal-header">
|
||
<h3>💬 Чат для задачи №${taskId}: "${task.title}"</h3>
|
||
<span class="close" onclick="closeTaskChat()">×</span>
|
||
</div>
|
||
<div class="modal-body" style="padding: 0;">
|
||
<div style="padding: 20px; text-align: center; height: 300px; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #666;">
|
||
<div style="font-size: 48px; margin-bottom: 20px;">🚧</div>
|
||
<h3 style="margin-bottom: 10px;">Функция чата в разработке</h3>
|
||
<p>Чат для обсуждения задачи №${taskId} находится в стадии разработки.</p>
|
||
<p style="margin-top: 10px;">Скоро здесь можно будет обмениваться сообщениями с другими участниками задачи.</p>
|
||
|
||
<div style="margin-top: 30px; padding: 15px; background-color: #f5f5f5; border-radius: 8px; max-width: 500px;">
|
||
<h4 style="margin-top: 0;">Что будет в чате:</h4>
|
||
<ul style="text-align: left; margin-bottom: 0;">
|
||
<li>Обмен сообщениями с исполнителями</li>
|
||
<li>Обсуждение деталей выполнения задачи</li>
|
||
<li>Уведомления о новых сообщениях</li>
|
||
<li>История обсуждений по задаче</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="modal-footer" style="display: flex; justify-content: space-between; align-items: center;">
|
||
<div style="font-size: 12px; color: #888;">
|
||
Последнее обновление: ${new Date().toLocaleDateString('ru-RU')}
|
||
</div>
|
||
<div>
|
||
<button type="button" class="btn-cancel" onclick="closeTaskChat()">Закрыть</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
`;
|
||
|
||
// Добавляем модальное окно в DOM
|
||
const modalContainer = document.createElement('div');
|
||
modalContainer.innerHTML = modalHtml;
|
||
document.body.appendChild(modalContainer);
|
||
|
||
// Показываем модальное окно
|
||
setTimeout(() => {
|
||
const modal = document.getElementById('task-chat-modal');
|
||
modal.style.display = 'block';
|
||
|
||
// Добавляем CSS для анимации (опционально)
|
||
const style = document.createElement('style');
|
||
style.textContent = `
|
||
#task-chat-modal {
|
||
display: none;
|
||
position: fixed;
|
||
z-index: 1000;
|
||
left: 0;
|
||
top: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
background-color: rgba(0,0,0,0.5);
|
||
animation: fadeIn 0.3s;
|
||
}
|
||
|
||
#task-chat-modal .modal-content {
|
||
animation: slideIn 0.3s ease-out;
|
||
background-color: #fefefe;
|
||
margin: 5% auto;
|
||
border-radius: 10px;
|
||
box-shadow: 0 4px 20px rgba(0,0,0,0.2);
|
||
overflow: hidden;
|
||
}
|
||
|
||
@keyframes fadeIn {
|
||
from { opacity: 0; }
|
||
to { opacity: 1; }
|
||
}
|
||
|
||
@keyframes slideIn {
|
||
from { transform: translateY(-50px); opacity: 0; }
|
||
to { transform: translateY(0); opacity: 1; }
|
||
}
|
||
`;
|
||
document.head.appendChild(style);
|
||
}, 10);
|
||
}
|
||
|
||
// Функция для закрытия чата
|
||
function closeTaskChat() {
|
||
const modal = document.getElementById('task-chat-modal');
|
||
if (modal) {
|
||
modal.style.display = 'none';
|
||
// Удаляем модальное окно из DOM через некоторое время
|
||
setTimeout(() => {
|
||
modal.parentElement.remove();
|
||
}, 300);
|
||
}
|
||
}
|