From e09883a33fe2602b63873997be096ce7a82d361d Mon Sep 17 00:00:00 2001 From: mac Date: Tue, 28 Jul 2026 14:07:49 +0800 Subject: [PATCH] =?UTF-8?q?v2.1.24=20=E2=80=94=20=E6=9C=AC=E5=91=A8?= =?UTF-8?q?=E9=87=8D=E7=82=B9+=E8=B4=A3=E5=96=84=E6=94=AF=E6=8C=81?= =?UTF-8?q?=E6=8B=96=E6=8B=BD=E6=8E=92=E5=BA=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- static/app.js | 49 +++++++++++++++++++++++++++++++++++++++++++++++- static/style.css | 7 +++++++ 2 files changed, 55 insertions(+), 1 deletion(-) diff --git a/static/app.js b/static/app.js index 7a71bfd..5f230d7 100644 --- a/static/app.js +++ b/static/app.js @@ -347,9 +347,15 @@ text = text || ''; var div = document.createElement('div'); div.className = 'item-row'; - div.innerHTML = '' + (idx+1) + '.' + + div.draggable = true; + div.innerHTML = '⋮⋮' + + '' + (idx+1) + '.' + '' + ''; + div.addEventListener('dragstart', dragStart); + div.addEventListener('dragover', dragOver); + div.addEventListener('drop', function(e){ dragDrop(e, 'morning-list'); }); + div.addEventListener('dragend', dragEnd); container.appendChild(div); renumberMorning(); } @@ -368,10 +374,16 @@ improve = improve || ''; var div = document.createElement('div'); div.className = 'evening-row'; + div.draggable = true; div.innerHTML = + '⋮⋮' + '' + '' + ''; + div.addEventListener('dragstart', dragStart); + div.addEventListener('dragover', dragOver); + div.addEventListener('drop', function(e){ dragDrop(e, 'evening-list'); }); + div.addEventListener('dragend', dragEnd); container.appendChild(div); } @@ -404,6 +416,41 @@ btn.classList.toggle('active', editing); }; + /* ── 拖拽排序 ── */ + var dragSrc = null; + + function dragStart(e) { + dragSrc = this; + this.classList.add('dragging'); + e.dataTransfer.effectAllowed = 'move'; + } + + function dragOver(e) { + e.preventDefault(); + e.dataTransfer.dropEffect = 'move'; + if (this !== dragSrc) this.classList.add('drag-over'); + } + + function dragDrop(e, listId) { + e.preventDefault(); + this.classList.remove('drag-over'); + if (dragSrc === this) return; + var container = document.getElementById(listId); + var items = container.querySelectorAll('.' + (dragSrc.classList.contains('evening-row') ? 'evening-row' : 'item-row')); + var from = Array.prototype.indexOf.call(items, dragSrc); + var to = Array.prototype.indexOf.call(items, this); + if (from < to) { container.insertBefore(dragSrc, this.nextSibling); } + else { container.insertBefore(dragSrc, this); } + if (listId === 'morning-list') renumberMorning(); + triggerAutoSave(); + } + + function dragEnd() { + this.classList.remove('dragging'); + document.querySelectorAll('.drag-over').forEach(function(el){ el.classList.remove('drag-over'); }); + dragSrc = null; + } + window.addStudyItem = function() { var name = prompt('请输入新习惯名称:'); if (!name || !name.trim()) return; diff --git a/static/style.css b/static/style.css index f4d8fb8..5f0ee22 100644 --- a/static/style.css +++ b/static/style.css @@ -1810,3 +1810,10 @@ body { .cal-task-item { display: flex; align-items: flex-start; gap: 8px; padding: 6px 0; font-size: 13px; color: var(--text-dim); line-height: 1.5; border-bottom: 1px solid var(--bg); } .cal-task-item:last-child { border-bottom: none; } .cal-task-dot { flex-shrink: 0; font-size: 14px; margin-top: 1px; } + +/* 拖拽排序 */ +.drag-handle { display: none; cursor: grab; color: var(--text-muted); font-size: 14px; user-select: none; padding: 0 4px; line-height: 1; letter-spacing: -2px; } +.card.editing .drag-handle { display: block; } +.item-row.dragging, .evening-row.dragging { opacity: 0.5; } +.item-row.drag-over, .evening-row.drag-over { border-color: var(--primary) !important; background: var(--primary-light); } +.evening-drag { position: absolute; left: 6px; top: 8px; }