|
|
|
|
@@ -179,6 +179,7 @@ INDEX_TEMPLATE = '''
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
|
<title>Xian Favor - 收藏系统</title>
|
|
|
|
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>⭐</text></svg>">
|
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.0/font/bootstrap-icons.css" rel="stylesheet">
|
|
|
|
|
<style>
|
|
|
|
|
@@ -187,9 +188,14 @@ INDEX_TEMPLATE = '''
|
|
|
|
|
.sidebar a { color: #adb5bd; text-decoration: none; padding: 10px 20px; display: block; }
|
|
|
|
|
.sidebar a:hover, .sidebar a.active { background: #495057; color: #fff; }
|
|
|
|
|
.content { padding: 20px; }
|
|
|
|
|
.card { margin-bottom: 15px; transition: transform 0.2s; }
|
|
|
|
|
.card { margin-bottom: 8px; transition: transform 0.2s; }
|
|
|
|
|
.card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
|
|
|
|
|
.card-body { padding: 10px 15px; }
|
|
|
|
|
.tag { margin-right: 5px; }
|
|
|
|
|
.item-card { font-size: 14px; }
|
|
|
|
|
.item-card h6 { font-size: 14px; margin-bottom: 4px; }
|
|
|
|
|
.item-card p { margin-bottom: 4px; }
|
|
|
|
|
.item-card .text-muted.small { font-size: 12px; }
|
|
|
|
|
.type-text { border-left: 4px solid #17a2b8; }
|
|
|
|
|
.type-link { border-left: 4px solid #28a745; }
|
|
|
|
|
.type-column { border-left: 4px solid #6f42c1; }
|
|
|
|
|
@@ -221,6 +227,8 @@ INDEX_TEMPLATE = '''
|
|
|
|
|
<a href="#" data-filter="pending"><i class="bi bi-clock"></i> 待处理</a>
|
|
|
|
|
<a href="#" data-filter="in_progress"><i class="bi bi-arrow-repeat"></i> 进行中</a>
|
|
|
|
|
<a href="#" data-filter="completed"><i class="bi bi-check-circle"></i> 已完成</a>
|
|
|
|
|
<hr class="border-secondary">
|
|
|
|
|
<a href="#" onclick="showTagManager(); return false;"><i class="bi bi-tags"></i> 标签管理</a>
|
|
|
|
|
</nav>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
@@ -347,11 +355,13 @@ INDEX_TEMPLATE = '''
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3">
|
|
|
|
|
<label class="form-label">标签 (逗号分隔)</label>
|
|
|
|
|
<input type="text" id="addTags" class="form-control" placeholder="标签1, 标签2">
|
|
|
|
|
<input type="text" id="addTags" class="form-control" placeholder="标签1, 标签2" list="tagList">
|
|
|
|
|
<datalist id="tagList"></datalist>
|
|
|
|
|
<div id="addTagSuggestions" class="mt-1"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3">
|
|
|
|
|
<label class="form-label">备注</label>
|
|
|
|
|
<input type="text" id="addNote" class="form-control">
|
|
|
|
|
<label class="form-label">详情/备注</label>
|
|
|
|
|
<textarea id="addNote" class="form-control" rows="5"></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
@@ -363,6 +373,130 @@ INDEX_TEMPLATE = '''
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 详情模态框 -->
|
|
|
|
|
<div class="modal fade" id="detailModal" tabindex="-1">
|
|
|
|
|
<div class="modal-dialog modal-lg">
|
|
|
|
|
<div class="modal-content">
|
|
|
|
|
<div class="modal-header">
|
|
|
|
|
<h5 class="modal-title"><span id="detailTypeIcon"></span> <span id="detailTitle"></span></h5>
|
|
|
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-body">
|
|
|
|
|
<div id="detailContent">
|
|
|
|
|
<!-- 动态填充 -->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-footer">
|
|
|
|
|
<button type="button" class="btn btn-outline-primary" onclick="openEditModalFromDetail()">
|
|
|
|
|
<i class="bi bi-pencil"></i> 编辑
|
|
|
|
|
</button>
|
|
|
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 编辑模态框 -->
|
|
|
|
|
<div class="modal fade" id="editModal" tabindex="-1">
|
|
|
|
|
<div class="modal-dialog">
|
|
|
|
|
<div class="modal-content">
|
|
|
|
|
<div class="modal-header">
|
|
|
|
|
<h5 class="modal-title">编辑条目</h5>
|
|
|
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-body">
|
|
|
|
|
<form id="editForm">
|
|
|
|
|
<input type="hidden" id="editId">
|
|
|
|
|
<div class="mb-3">
|
|
|
|
|
<label class="form-label">类型</label>
|
|
|
|
|
<input type="text" id="editType" class="form-control" readonly>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3">
|
|
|
|
|
<label class="form-label">标题</label>
|
|
|
|
|
<input type="text" id="editTitle" class="form-control">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3" id="editContentGroup">
|
|
|
|
|
<label class="form-label">内容</label>
|
|
|
|
|
<textarea id="editContent" class="form-control" rows="5"></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3" id="editUrlGroup" style="display:none;">
|
|
|
|
|
<label class="form-label">URL</label>
|
|
|
|
|
<input type="url" id="editUrl" class="form-control">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3" id="editSourceGroup" style="display:none;">
|
|
|
|
|
<label class="form-label">来源</label>
|
|
|
|
|
<input type="text" id="editSource" class="form-control">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3" id="editTodoFields" style="display:none;">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col">
|
|
|
|
|
<label class="form-label">状态</label>
|
|
|
|
|
<select id="editStatus" class="form-select">
|
|
|
|
|
<option value="pending">⏳ 待处理</option>
|
|
|
|
|
<option value="in_progress">🔄 进行中</option>
|
|
|
|
|
<option value="completed">✅ 已完成</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col">
|
|
|
|
|
<label class="form-label">优先级</label>
|
|
|
|
|
<select id="editPriority" class="form-select">
|
|
|
|
|
<option value="low">🟢 低</option>
|
|
|
|
|
<option value="medium">🟡 中</option>
|
|
|
|
|
<option value="high">🟠 高</option>
|
|
|
|
|
<option value="urgent">🔴 紧急</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mt-3">
|
|
|
|
|
<label class="form-label">截止日期</label>
|
|
|
|
|
<input type="date" id="editDueDate" class="form-control">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3">
|
|
|
|
|
<label class="form-label">标签 (逗号分隔)</label>
|
|
|
|
|
<input type="text" id="editTags" class="form-control" placeholder="标签1, 标签2" list="tagList">
|
|
|
|
|
<div id="editTagSuggestions" class="mt-1"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mb-3">
|
|
|
|
|
<label class="form-label">详情/备注</label>
|
|
|
|
|
<textarea id="editNote" class="form-control" rows="5"></textarea>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-footer">
|
|
|
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
|
|
|
|
|
<button type="button" class="btn btn-primary" onclick="saveEdit()">保存</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 标签管理模态框 -->
|
|
|
|
|
<div class="modal fade" id="tagManagerModal" tabindex="-1">
|
|
|
|
|
<div class="modal-dialog modal-lg">
|
|
|
|
|
<div class="modal-content">
|
|
|
|
|
<div class="modal-header">
|
|
|
|
|
<h5 class="modal-title"><i class="bi bi-tags"></i> 标签管理</h5>
|
|
|
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-body">
|
|
|
|
|
<div class="mb-3">
|
|
|
|
|
<div class="input-group">
|
|
|
|
|
<input type="text" id="newTagName" class="form-control" placeholder="新标签名称">
|
|
|
|
|
<button class="btn btn-primary" onclick="createTag()"><i class="bi bi-plus"></i> 创建</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="tagListContainer">
|
|
|
|
|
<!-- 动态填充 -->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-footer">
|
|
|
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
|
|
|
<script>
|
|
|
|
|
const API_BASE = '/api';
|
|
|
|
|
@@ -372,6 +506,11 @@ let currentFilter = { type: '', status: '' };
|
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
|
loadItems();
|
|
|
|
|
loadStats();
|
|
|
|
|
loadTags();
|
|
|
|
|
|
|
|
|
|
// 标签输入自动提示
|
|
|
|
|
document.getElementById('addTags').addEventListener('input', showTagSuggestions);
|
|
|
|
|
document.getElementById('editTags').addEventListener('input', showTagSuggestionsEdit);
|
|
|
|
|
|
|
|
|
|
// 类型切换时显示/隐藏字段
|
|
|
|
|
document.getElementById('addType').addEventListener('change', (e) => {
|
|
|
|
|
@@ -436,33 +575,25 @@ function renderItems(items) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
container.innerHTML = items.map(item => `
|
|
|
|
|
<div class="card type-${item.type}">
|
|
|
|
|
<div class="card type-${item.type} item-card" style="cursor: pointer;" onclick="showDetail(${item.id})">
|
|
|
|
|
<div class="card-body">
|
|
|
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
|
|
|
<div>
|
|
|
|
|
<h6 class="card-title">
|
|
|
|
|
${getTypeIcon(item.type)} ${item.title || truncate(item.content || item.url, 50)}
|
|
|
|
|
<div style="flex: 1; min-width: 0;">
|
|
|
|
|
<h6 class="card-title text-truncate mb-1">
|
|
|
|
|
${getTypeIcon(item.type)} ${item.title || truncate(item.content || item.url, 30)}
|
|
|
|
|
</h6>
|
|
|
|
|
<p class="card-text text-muted small mb-2">
|
|
|
|
|
${item.url ? `<a href="${item.url}" target="_blank">${item.url}</a><br>` : ''}
|
|
|
|
|
${item.content ? truncate(item.content, 100) : ''}
|
|
|
|
|
<p class="card-text text-muted small mb-0 text-truncate" style="font-size:12px;">
|
|
|
|
|
${item.url ? truncate(item.url, 50) : item.content ? truncate(item.content, 50) : item.note ? truncate(item.note, 50) : ''}
|
|
|
|
|
${item.type === 'todo' ? `${getStatusLabelShort(item.status)} ${getPriorityLabelShort(item.priority)} ${item.due_date ? '📅' + item.due_date : ''}` : ''}
|
|
|
|
|
</p>
|
|
|
|
|
<div>
|
|
|
|
|
${item.tags.map(t => `<span class="badge bg-secondary tag">${t}</span>`).join('')}
|
|
|
|
|
${item.type === 'todo' ? `
|
|
|
|
|
<span class="badge status-${item.status}">${getStatusLabel(item.status)}</span>
|
|
|
|
|
<span class="badge priority-${item.priority}">${getPriorityLabel(item.priority)}</span>
|
|
|
|
|
${item.due_date ? `<span class="badge bg-light text-dark">📅 ${item.due_date}</span>` : ''}
|
|
|
|
|
` : ''}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btn-group btn-group-sm">
|
|
|
|
|
${item.type === 'todo' && item.status !== 'completed' ?
|
|
|
|
|
`<button class="btn btn-outline-success" onclick="completeItem(${item.id})" title="完成"><i class="bi bi-check-lg"></i></button>` : ''}
|
|
|
|
|
<button class="btn btn-outline-danger" onclick="deleteItem(${item.id})" title="删除"><i class="bi bi-trash"></i></button>
|
|
|
|
|
<div class="d-flex align-items-center gap-1 flex-wrap ms-2" onclick="event.stopPropagation();">
|
|
|
|
|
${item.tags.slice(0, 2).map(t => `<span class="badge bg-secondary" style="font-size:10px;">${t}</span>`).join('')}
|
|
|
|
|
<button class="btn btn-sm btn-outline-primary py-0 px-1" onclick="openEditModal(${item.id})" title="编辑"><i class="bi bi-pencil" style="font-size:11px;"></i></button>
|
|
|
|
|
${item.type === 'todo' && item.status !== 'completed' ? `<button class="btn btn-sm btn-outline-success py-0 px-1" onclick="completeItem(${item.id})" title="完成"><i class="bi bi-check-lg" style="font-size:11px;"></i></button>` : ''}
|
|
|
|
|
<button class="btn btn-sm btn-outline-danger py-0 px-1" onclick="deleteItem(${item.id})" title="删除"><i class="bi bi-trash" style="font-size:11px;"></i></button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="text-muted small mt-2">${formatDate(item.created_at)}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
`).join('');
|
|
|
|
|
@@ -525,19 +656,162 @@ async function deleteItem(id) {
|
|
|
|
|
loadStats();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 当前查看的条目ID
|
|
|
|
|
let currentDetailId = null;
|
|
|
|
|
|
|
|
|
|
// 显示详情
|
|
|
|
|
async function showDetail(id) {
|
|
|
|
|
currentDetailId = id;
|
|
|
|
|
const res = await fetch(`${API_BASE}/items/${id}`);
|
|
|
|
|
const data = await res.json();
|
|
|
|
|
|
|
|
|
|
if (!data.success) return;
|
|
|
|
|
|
|
|
|
|
const item = data.data;
|
|
|
|
|
document.getElementById('detailTypeIcon').textContent = getTypeIcon(item.type);
|
|
|
|
|
document.getElementById('detailTitle').textContent = item.title || '(无标题)';
|
|
|
|
|
|
|
|
|
|
let html = `<div class="mb-3"><strong>类型:</strong> ${getTypeLabel(item.type)}</div>`;
|
|
|
|
|
|
|
|
|
|
if (item.url) {
|
|
|
|
|
html += `<div class="mb-3"><strong>URL:</strong> <a href="${item.url}" target="_blank">${item.url}</a></div>`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (item.content) {
|
|
|
|
|
html += `<div class="mb-3"><strong>内容:</strong><br><div class="border rounded p-3 bg-light" style="white-space: pre-wrap; word-break: break-all;">${escapeHtml(item.content)}</div></div>`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (item.source) {
|
|
|
|
|
html += `<div class="mb-3"><strong>来源:</strong> ${escapeHtml(item.source)}</div>`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (item.type === 'todo') {
|
|
|
|
|
html += `<div class="mb-3"><strong>状态:</strong> ${getStatusLabel(item.status)}</div>`;
|
|
|
|
|
html += `<div class="mb-3"><strong>优先级:</strong> ${getPriorityLabel(item.priority)}</div>`;
|
|
|
|
|
if (item.due_date) {
|
|
|
|
|
html += `<div class="mb-3"><strong>截止日期:</strong> ${item.due_date}</div>`;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (item.tags.length) {
|
|
|
|
|
html += `<div class="mb-3"><strong>标签:</strong> ${item.tags.map(t => `<span class="badge bg-secondary">${escapeHtml(t)}</span>`).join(' ')}</div>`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (item.note) {
|
|
|
|
|
html += `<div class="mb-3"><strong>详情/备注:</strong><br><div class="border rounded p-3 bg-light" style="white-space: pre-wrap; word-break: break-all;">${escapeHtml(item.note)}</div></div>`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
html += `<div class="text-muted small"><strong>创建时间:</strong> ${formatDate(item.created_at)}<br><strong>更新时间:</strong> ${formatDate(item.updated_at)}</div>`;
|
|
|
|
|
|
|
|
|
|
document.getElementById('detailContent').innerHTML = html;
|
|
|
|
|
|
|
|
|
|
new bootstrap.Modal(document.getElementById('detailModal')).show();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 从详情页打开编辑
|
|
|
|
|
function openEditModalFromDetail() {
|
|
|
|
|
bootstrap.Modal.getInstance(document.getElementById('detailModal')).hide();
|
|
|
|
|
setTimeout(() => openEditModal(currentDetailId), 300);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 打开编辑模态框
|
|
|
|
|
async function openEditModal(id) {
|
|
|
|
|
currentDetailId = id;
|
|
|
|
|
const res = await fetch(`${API_BASE}/items/${id}`);
|
|
|
|
|
const data = await res.json();
|
|
|
|
|
|
|
|
|
|
if (!data.success) return;
|
|
|
|
|
|
|
|
|
|
const item = data.data;
|
|
|
|
|
const type = item.type;
|
|
|
|
|
|
|
|
|
|
document.getElementById('editId').value = id;
|
|
|
|
|
document.getElementById('editType').value = getTypeLabel(type);
|
|
|
|
|
document.getElementById('editTitle').value = item.title || '';
|
|
|
|
|
|
|
|
|
|
// 根据类型显示/隐藏字段
|
|
|
|
|
document.getElementById('editContentGroup').style.display = type === 'text' ? 'block' : 'none';
|
|
|
|
|
document.getElementById('editUrlGroup').style.display = ['link', 'column'].includes(type) ? 'block' : 'none';
|
|
|
|
|
document.getElementById('editSourceGroup').style.display = type === 'column' ? 'block' : 'none';
|
|
|
|
|
document.getElementById('editTodoFields').style.display = type === 'todo' ? 'block' : 'none';
|
|
|
|
|
|
|
|
|
|
document.getElementById('editContent').value = item.content || '';
|
|
|
|
|
document.getElementById('editUrl').value = item.url || '';
|
|
|
|
|
document.getElementById('editSource').value = item.source || '';
|
|
|
|
|
document.getElementById('editTags').value = item.tags.join(', ');
|
|
|
|
|
document.getElementById('editNote').value = item.note || '';
|
|
|
|
|
|
|
|
|
|
if (type === 'todo') {
|
|
|
|
|
document.getElementById('editStatus').value = item.status;
|
|
|
|
|
document.getElementById('editPriority').value = item.priority;
|
|
|
|
|
document.getElementById('editDueDate').value = item.due_date || '';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
new bootstrap.Modal(document.getElementById('editModal')).show();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 保存编辑
|
|
|
|
|
async function saveEdit() {
|
|
|
|
|
const id = document.getElementById('editId').value;
|
|
|
|
|
|
|
|
|
|
// 获取当前条目的类型
|
|
|
|
|
const detailRes = await fetch(`${API_BASE}/items/${currentDetailId}`);
|
|
|
|
|
const detailData = await detailRes.json();
|
|
|
|
|
const type = detailData.data.type;
|
|
|
|
|
|
|
|
|
|
const data = {
|
|
|
|
|
title: document.getElementById('editTitle').value,
|
|
|
|
|
content: type === 'text' ? document.getElementById('editContent').value : null,
|
|
|
|
|
url: ['link', 'column'].includes(type) ? document.getElementById('editUrl').value : null,
|
|
|
|
|
source: type === 'column' ? document.getElementById('editSource').value : null,
|
|
|
|
|
status: type === 'todo' ? document.getElementById('editStatus').value : null,
|
|
|
|
|
priority: type === 'todo' ? document.getElementById('editPriority').value : null,
|
|
|
|
|
due_date: type === 'todo' ? document.getElementById('editDueDate').value : null,
|
|
|
|
|
note: document.getElementById('editNote').value,
|
|
|
|
|
tags: document.getElementById('editTags').value.split(',').map(t => t.trim()).filter(t => t)
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const res = await fetch(`${API_BASE}/items/${id}`, {
|
|
|
|
|
method: 'PUT',
|
|
|
|
|
headers: { 'Content-Type': 'application/json' },
|
|
|
|
|
body: JSON.stringify(data)
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
if (res.ok) {
|
|
|
|
|
bootstrap.Modal.getInstance(document.getElementById('editModal')).hide();
|
|
|
|
|
loadItems();
|
|
|
|
|
loadStats();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 工具函数
|
|
|
|
|
function getTypeIcon(type) {
|
|
|
|
|
const icons = { text: '📝', link: '🔗', column: '📰', todo: '✅' };
|
|
|
|
|
return icons[type] || '📄';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getTypeLabel(type) {
|
|
|
|
|
const labels = { text: '📝 文本', link: '🔗 链接', column: '📰 专栏', todo: '✅ 待办' };
|
|
|
|
|
return labels[type] || type;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getStatusLabel(status) {
|
|
|
|
|
const labels = { pending: '待处理', in_progress: '进行中', completed: '已完成' };
|
|
|
|
|
const labels = { pending: '⏳ 待处理', in_progress: '🔄 进行中', completed: '✅ 已完成' };
|
|
|
|
|
return labels[status] || status;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getStatusLabelShort(status) {
|
|
|
|
|
const labels = { pending: '⏳', in_progress: '🔄', completed: '✅' };
|
|
|
|
|
return labels[status] || status;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getPriorityLabelShort(priority) {
|
|
|
|
|
const labels = { low: '🟢', medium: '🟡', high: '🟠', urgent: '🔴' };
|
|
|
|
|
return labels[priority] || '';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getPriorityLabel(priority) {
|
|
|
|
|
const labels = { low: '低', medium: '中', high: '高', urgent: '紧急' };
|
|
|
|
|
const labels = { low: '🟢 低', medium: '🟡 中', high: '🟠 高', urgent: '🔴 紧急' };
|
|
|
|
|
return labels[priority] || priority;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@@ -549,6 +823,131 @@ function formatDate(dateStr) {
|
|
|
|
|
return new Date(dateStr).toLocaleString('zh-CN');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function escapeHtml(str) {
|
|
|
|
|
if (!str) return '';
|
|
|
|
|
return str.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 标签管理
|
|
|
|
|
let allTags = [];
|
|
|
|
|
|
|
|
|
|
async function loadTags() {
|
|
|
|
|
const res = await fetch(`${API_BASE}/tags`);
|
|
|
|
|
const data = await res.json();
|
|
|
|
|
if (data.success) {
|
|
|
|
|
allTags = data.data.map(t => t.name);
|
|
|
|
|
updateTagDatalist();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function updateTagDatalist() {
|
|
|
|
|
const datalist = document.getElementById('tagList');
|
|
|
|
|
datalist.innerHTML = allTags.map(t => `<option value="${t}">`).join('');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function showTagSuggestions(e) {
|
|
|
|
|
const input = e.target.value;
|
|
|
|
|
const parts = input.split(',');
|
|
|
|
|
const current = parts[parts.length - 1].trim().toLowerCase();
|
|
|
|
|
const container = document.getElementById('addTagSuggestions');
|
|
|
|
|
|
|
|
|
|
if (!current) {
|
|
|
|
|
container.innerHTML = '';
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const suggestions = allTags.filter(t => t.toLowerCase().includes(current) && !parts.slice(0, -1).includes(t));
|
|
|
|
|
container.innerHTML = suggestions.slice(0, 5).map(t =>
|
|
|
|
|
`<span class="badge bg-light text-dark me-1" style="cursor:pointer;" onclick="addTagToInput('addTags', '${t}')">${t}</span>`
|
|
|
|
|
).join('');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function showTagSuggestionsEdit(e) {
|
|
|
|
|
const input = e.target.value;
|
|
|
|
|
const parts = input.split(',');
|
|
|
|
|
const current = parts[parts.length - 1].trim().toLowerCase();
|
|
|
|
|
const container = document.getElementById('editTagSuggestions');
|
|
|
|
|
|
|
|
|
|
if (!current) {
|
|
|
|
|
container.innerHTML = '';
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const suggestions = allTags.filter(t => t.toLowerCase().includes(current) && !parts.slice(0, -1).includes(t));
|
|
|
|
|
container.innerHTML = suggestions.slice(0, 5).map(t =>
|
|
|
|
|
`<span class="badge bg-light text-dark me-1" style="cursor:pointer;" onclick="addTagToInput('editTags', '${t}')">${t}</span>`
|
|
|
|
|
).join('');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function addTagToInput(inputId, tag) {
|
|
|
|
|
const input = document.getElementById(inputId);
|
|
|
|
|
const parts = input.value.split(',');
|
|
|
|
|
parts[parts.length - 1] = tag;
|
|
|
|
|
input.value = parts.join(', ') + ', ';
|
|
|
|
|
|
|
|
|
|
// 清空提示
|
|
|
|
|
if (inputId === 'addTags') {
|
|
|
|
|
document.getElementById('addTagSuggestions').innerHTML = '';
|
|
|
|
|
} else {
|
|
|
|
|
document.getElementById('editTagSuggestions').innerHTML = '';
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function showTagManager() {
|
|
|
|
|
await loadTagManagerList();
|
|
|
|
|
new bootstrap.Modal(document.getElementById('tagManagerModal')).show();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function loadTagManagerList() {
|
|
|
|
|
const res = await fetch(`${API_BASE}/tags`);
|
|
|
|
|
const data = await res.json();
|
|
|
|
|
if (!data.success) return;
|
|
|
|
|
|
|
|
|
|
const container = document.getElementById('tagListContainer');
|
|
|
|
|
if (!data.data.length) {
|
|
|
|
|
container.innerHTML = '<div class="text-center text-muted py-3">暂无标签</div>';
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
container.innerHTML = data.data.map(tag => `
|
|
|
|
|
<div class="d-flex justify-content-between align-items-center p-2 border-bottom">
|
|
|
|
|
<div>
|
|
|
|
|
<span class="badge bg-secondary">${tag.name}</span>
|
|
|
|
|
<span class="text-muted small ms-2">${tag.item_count || 0} 个条目</span>
|
|
|
|
|
</div>
|
|
|
|
|
<button class="btn btn-sm btn-outline-danger" onclick="deleteTagManager(${tag.id}, '${tag.name}')">
|
|
|
|
|
<i class="bi bi-trash"></i>
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
`).join('');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function createTag() {
|
|
|
|
|
const name = document.getElementById('newTagName').value.trim();
|
|
|
|
|
if (!name) return;
|
|
|
|
|
|
|
|
|
|
const res = await fetch(`${API_BASE}/tags`, {
|
|
|
|
|
method: 'POST',
|
|
|
|
|
headers: { 'Content-Type': 'application/json' },
|
|
|
|
|
body: JSON.stringify({ name })
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
if (res.ok) {
|
|
|
|
|
document.getElementById('newTagName').value = '';
|
|
|
|
|
loadTagManagerList();
|
|
|
|
|
loadTags();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function deleteTagManager(id, name) {
|
|
|
|
|
if (!confirm(`确认删除标签 "${name}"？此操作将移除所有条目中的该标签。`)) return;
|
|
|
|
|
|
|
|
|
|
await fetch(`${API_BASE}/tags/${id}`, { method: 'DELETE' });
|
|
|
|
|
loadTagManagerList();
|
|
|
|
|
loadTags();
|
|
|
|
|
loadItems();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function debounce(fn, delay) {
|
|
|
|
|
let timer;
|
|
|
|
|
return function(...args) {
|
|
|
|
|
|
