From 3a8f8e246d35f224b5faf1d17948669280ab70d7 Mon Sep 17 00:00:00 2001 From: "Satur@it-depot.ru" Date: Thu, 6 Mar 2025 17:05:42 +0300 Subject: [PATCH] dis fix --- templates/index.html | 145 +++++++++++++++++++++++++++++-------------- 1 file changed, 100 insertions(+), 45 deletions(-) diff --git a/templates/index.html b/templates/index.html index b12466d..7d8106a 100644 --- a/templates/index.html +++ b/templates/index.html @@ -271,7 +271,7 @@ max-width: 100%; /* Ограничение ширины изображений */ height: auto; } - #note-modal { + #add-modal, #note-modal { display: none; position: fixed; top: 50%; @@ -284,33 +284,33 @@ z-index: 1000; width: 500px; } - #note-modal.dark-theme { + #add-modal.dark-theme, #note-modal.dark-theme { background: #2a2a2a; border-color: #444; box-shadow: 0 0 10px rgba(0,0,0,0.5); } - #note-modal .markdown-buttons { margin-bottom: 10px; } - #note-modal .markdown-buttons button { margin-right: 5px; padding: 5px 10px; } - #note-modal textarea { width: 100%; height: 200px; margin-bottom: 10px; } - #note-modal.dark-theme textarea { + #add-modal .markdown-buttons, #note-modal .markdown-buttons { margin-bottom: 10px; } + #add-modal .markdown-buttons button, #note-modal .markdown-buttons button { margin-right: 5px; padding: 5px 10px; } + #add-modal textarea, #note-modal textarea { width: 100%; height: 200px; margin-bottom: 10px; } + #add-modal.dark-theme textarea, #note-modal.dark-theme textarea { background: #333; color: #e0e0e0; border: 1px solid #555; } - #note-modal .image-upload { + #add-modal .image-upload, #note-modal .image-upload { margin-bottom: 10px; } - #note-modal .image-upload input { + #add-modal .image-upload input, #note-modal .image-upload input { margin-right: 10px; } - #note-modal button { margin-right: 10px; } - #note-modal.dark-theme button { + #add-modal button, #note-modal button { margin-right: 10px; } + #add-modal.dark-theme button, #note-modal.dark-theme button { background: #007bff; color: white; border-color: #007bff; } - #note-modal button:hover { background: #0056b3; } - #note-modal.dark-theme button:hover { background: #004d99; } + #add-modal button:hover, #note-modal button:hover { background: #0056b3; } + #add-modal.dark-theme button:hover, #note-modal.dark-theme button:hover { background: #004d99; } #modal-overlay { display: none; position: fixed; @@ -379,23 +379,7 @@ -
-

Добавить запись

- - - - - - -
Пример: 2025-03-05 14:30:00
-
+
Имя компьютера
ID подключения
@@ -410,6 +394,24 @@
+
+

Добавить запись

+ + + + + + + +
Пример: 2025-03-05 14:30:00
+

Редактировать заметку

@@ -460,6 +462,7 @@ document.getElementById('installs-container').classList.add('dark-theme'); document.getElementById('tree-container').classList.add('dark-theme'); document.getElementById('notes-panel').classList.add('dark-theme'); + document.getElementById('add-modal').classList.add('dark-theme'); document.getElementById('note-modal').classList.add('dark-theme'); document.getElementById('search-container').classList.add('dark-theme'); document.getElementById('import-label').classList.add('dark-theme'); @@ -507,6 +510,29 @@ isResizing = false; document.body.style.cursor = 'default'; }); + + // Обработка клавиш для навигации + document.addEventListener('keydown', (e) => { + if (!selectedFolderId || !allInstalls.length) return; + + const items = $('#installs-list .install-item'); + let currentIndex = items.index($('.install-item.selected')); + + if (e.key === 'ArrowUp' && currentIndex > 0) { + e.preventDefault(); + currentIndex--; + } else if (e.key === 'ArrowDown' && currentIndex < items.length - 1) { + e.preventDefault(); + currentIndex++; + } else { + return; + } + + selectedInstallId = $(items[currentIndex]).data('id'); + $('.install-item').removeClass('selected'); + $(items[currentIndex]).addClass('selected'); + updateNotesPanel(); + }); }); function toggleTheme() { @@ -514,6 +540,7 @@ const installsContainer = document.getElementById('installs-container'); const treeContainer = document.getElementById('tree-container'); const notesPanel = document.getElementById('notes-panel'); + const addModal = document.getElementById('add-modal'); const noteModal = document.getElementById('note-modal'); const searchContainer = document.getElementById('search-container'); const importLabel = document.getElementById('import-label'); @@ -528,6 +555,7 @@ installsContainer.classList.remove('dark-theme'); treeContainer.classList.remove('dark-theme'); notesPanel.classList.remove('dark-theme'); + addModal.classList.remove('dark-theme'); noteModal.classList.remove('dark-theme'); searchContainer.classList.remove('dark-theme'); importLabel.classList.remove('dark-theme'); @@ -543,6 +571,7 @@ installsContainer.classList.add('dark-theme'); treeContainer.classList.add('dark-theme'); notesPanel.classList.add('dark-theme'); + addModal.classList.add('dark-theme'); noteModal.classList.add('dark-theme'); searchContainer.classList.add('dark-theme'); importLabel.classList.add('dark-theme'); @@ -827,12 +856,27 @@ } } + function openAddModal() { + $('#add-rustId').val(''); + $('#add-computerName').val(''); + $('#add-installTime').val(''); + $('#add-protocol').val('rustdesk'); + $('#add-note').val(''); + $('#add-modal').show(); + $('#modal-overlay').show(); + } + + function closeAddModal() { + $('#add-modal').hide(); + $('#modal-overlay').hide(); + } + function addInstall() { - const rustId = $('#rustId').val(); - const computerName = $('#computerName').val(); - const installTime = $('#installTime').val() || ''; - const protocol = $('#protocol').val(); - const note = $('#note').val() || ''; + const rustId = $('#add-rustId').val(); + const computerName = $('#add-computerName').val(); + const installTime = $('#add-installTime').val() || ''; + const protocol = $('#add-protocol').val(); + const note = $('#add-note').val() || ''; if (installTime && !/^\d{4}-\d{2}-\d{2}\s\d{2}:\d{2}:\d{2}$/.test(installTime)) { alert("Неверный формат времени. Используйте ГГГГ-ММ-ДД ЧЧ:ММ:СС (например, 2025-03-05 14:30:00)"); @@ -846,6 +890,7 @@ data: JSON.stringify({ rust_id: rustId, computer_name: computerName, install_time: installTime, folder_id: selectedFolderId, protocol: protocol, note: note }), success: function () { loadInstalls(selectedFolderId); + closeAddModal(); }, error: function (xhr, status, error) { if (xhr.status === 400) { @@ -979,11 +1024,11 @@ function openNoteModal(installId, currentNote) { console.log('Opening note modal for installId:', installId, 'with note:', currentNote); - selectedInstallId = installId; // Устанавливаем выбранный ID - $('#note-textarea').val(currentNote || ''); // Устанавливаем текущую заметку или пустую строку + selectedInstallId = installId; // Сохраняем выделение + $('#note-textarea').val(currentNote || ''); $('#note-modal').show(); $('#modal-overlay').show(); - document.getElementById('image-upload-input').value = ''; // Сбрасываем поле загрузки + document.getElementById('image-upload-input').value = ''; } function uploadImage() { @@ -995,8 +1040,8 @@ } const formData = new FormData(); - formData.append('install_id', selectedInstallId); // Отправляем как часть формы - formData.append('file', file); // Отправляем файл + formData.append('install_id', selectedInstallId); + formData.append('file', file); $.ajax({ url: `${API_URL}/upload-image`, @@ -1006,7 +1051,7 @@ contentType: false, success: function (response) { console.log('Image uploaded:', response); - const imageUrl = response.url; // Предполагаем, что сервер возвращает { url: "path/to/image" } + const imageUrl = response.url; const textarea = $('#note-textarea'); const cursorPos = textarea[0].selectionStart; const text = textarea.val(); @@ -1048,7 +1093,7 @@ }), success: function () { console.log('Note saved successfully'); - loadInstalls(selectedFolderId); // Обновляем список установок + loadInstalls(selectedFolderId); closeNoteModal(); }, error: function (xhr, status, error) { @@ -1062,16 +1107,26 @@ function closeNoteModal() { $('#note-modal').hide(); $('#modal-overlay').hide(); - $('#note-textarea').val(''); // Очищаем текстовое поле - selectedInstallId = null; // Сбрасываем выбранный ID - document.getElementById('image-upload-input').value = ''; // Сбрасываем поле загрузки + $('#note-textarea').val(''); + document.getElementById('image-upload-input').value = ''; + // Фокус остаётся на текущей записи + if (selectedInstallId) { + const items = $('#installs-list .install-item'); + $(`#installs-list .install-item[data-id="${selectedInstallId}"]`).addClass('selected'); + updateNotesPanel(); + } + } + + function closeAddModal() { + $('#add-modal').hide(); + $('#modal-overlay').hide(); } function updateNotesPanel() { if (selectedInstallId) { const install = allInstalls.find(i => i.id === selectedInstallId); if (install && install.note) { - $('#notes-content').html(marked.parse(install.note)); // Рендеринг Markdown с изображениями + $('#notes-content').html(marked.parse(install.note)); } else { $('#notes-content').html('

Нет заметок

'); }