|
|
|
|
@@ -241,10 +241,13 @@
|
|
|
|
|
|
|
|
|
|
function buildData() {
|
|
|
|
|
var morningItems = [];
|
|
|
|
|
var mEls = document.querySelectorAll('#morning-list .item-row input');
|
|
|
|
|
for (var i=0; i<mEls.length; i++) {
|
|
|
|
|
var v = mEls[i].value.trim();
|
|
|
|
|
if (v) morningItems.push(v);
|
|
|
|
|
var mRows = document.querySelectorAll('#morning-list .item-row');
|
|
|
|
|
for (var i=0; i<mRows.length; i++) {
|
|
|
|
|
var input = mRows[i].querySelector('input');
|
|
|
|
|
var noteEl = mRows[i].querySelector('.item-note');
|
|
|
|
|
var v = input ? input.value.trim() : '';
|
|
|
|
|
var n = noteEl ? noteEl.value.trim() : '';
|
|
|
|
|
if (v) morningItems.push(n ? {text: v, note: n} : v);
|
|
|
|
|
}
|
|
|
|
|
// 收集日历日程
|
|
|
|
|
var calEls = document.querySelectorAll('#morning-calendar-list .cal-task-item span:last-child');
|
|
|
|
|
@@ -345,15 +348,39 @@
|
|
|
|
|
var idx = container.children.length;
|
|
|
|
|
var text = typeof val === 'string' ? val : (val && val.text ? val.text : '');
|
|
|
|
|
text = text || '';
|
|
|
|
|
var note = (val && val.note) ? val.note : '';
|
|
|
|
|
var hasNote = !!note;
|
|
|
|
|
var div = document.createElement('div');
|
|
|
|
|
div.className = 'item-row';
|
|
|
|
|
div.innerHTML = '<span class="idx">' + (idx+1) + '.</span>' +
|
|
|
|
|
div.draggable = true;
|
|
|
|
|
div.innerHTML = '<span class="drag-handle" title="拖动排序">⋮⋮</span>' +
|
|
|
|
|
'<span class="idx">' + (idx+1) + '.</span>' +
|
|
|
|
|
'<input type="text" value="' + esc(text) + '" placeholder="本周最重要的一件事…">' +
|
|
|
|
|
'<button class="btn-del" onclick="this.parentElement.remove();renumberMorning()"><svg class="icon-sm"><use href="#icon-x"/></svg></button>';
|
|
|
|
|
'<button class="btn-note-toggle' + (hasNote ? ' has-note' : '') + '" onclick="toggleItemNote(this)" title="备注">💬</button>' +
|
|
|
|
|
'<button class="btn-del" onclick="this.parentElement.remove();renumberMorning()"><svg class="icon-sm"><use href="#icon-x"/></svg></button>' +
|
|
|
|
|
'<textarea class="item-note" placeholder="备注…" style="display:' + (hasNote ? 'block' : 'none') + '">' + esc(note) + '</textarea>';
|
|
|
|
|
div.addEventListener('dragstart', dragStart);
|
|
|
|
|
div.addEventListener('dragover', dragOver);
|
|
|
|
|
div.addEventListener('drop', function(e){ dragDrop.call(this, e, 'morning-list'); });
|
|
|
|
|
div.addEventListener('dragend', dragEnd);
|
|
|
|
|
container.appendChild(div);
|
|
|
|
|
renumberMorning();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
window.toggleItemNote = function(btn) {
|
|
|
|
|
var row = btn.closest('.item-row');
|
|
|
|
|
var note = row.querySelector('.item-note');
|
|
|
|
|
var showing = note.style.display === 'block';
|
|
|
|
|
note.style.display = showing ? 'none' : 'block';
|
|
|
|
|
if (!showing) {
|
|
|
|
|
btn.classList.add('has-note');
|
|
|
|
|
note.focus();
|
|
|
|
|
} else if (!note.value.trim()) {
|
|
|
|
|
btn.classList.remove('has-note');
|
|
|
|
|
}
|
|
|
|
|
triggerAutoSave();
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
function renumberMorning() {
|
|
|
|
|
var rows = document.querySelectorAll('#morning-list .item-row');
|
|
|
|
|
for (var i=0; i<rows.length; i++) {
|
|
|
|
|
@@ -368,10 +395,16 @@
|
|
|
|
|
improve = improve || '';
|
|
|
|
|
var div = document.createElement('div');
|
|
|
|
|
div.className = 'evening-row';
|
|
|
|
|
div.draggable = true;
|
|
|
|
|
div.innerHTML =
|
|
|
|
|
'<span class="drag-handle evening-drag" title="拖动排序">⋮⋮</span>' +
|
|
|
|
|
'<button class="btn-del" onclick="this.parentElement.remove()"><svg class="icon-sm"><use href="#icon-x"/></svg></button>' +
|
|
|
|
|
'<input type="text" value="' + esc(mistake) + '" placeholder="犯的错误…">' +
|
|
|
|
|
'<input type="text" value="' + esc(improve) + '" placeholder="改进方案…">';
|
|
|
|
|
div.addEventListener('dragstart', dragStart);
|
|
|
|
|
div.addEventListener('dragover', dragOver);
|
|
|
|
|
div.addEventListener('drop', function(e){ dragDrop.call(this, e, 'evening-list'); });
|
|
|
|
|
div.addEventListener('dragend', dragEnd);
|
|
|
|
|
container.appendChild(div);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@@ -404,6 +437,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;
|
|
|
|
|
|
