feat: 添加工作任务管理功能
- 新增 Task 模型（状态、优先级、进展百分比） - 任务 API（列表、统计、进展更新、完成标记） - 前端任务板块（统计卡片 + 任务列表） - 进展可视化（进度条 + 进展记录）
This commit is contained in:
maoshen
@@ -167,11 +167,85 @@
|
||||
grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
|
||||
gap: 30px;
|
||||
}
|
||||
.grid-3 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
|
||||
gap: 30px;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.grid-2 {
|
||||
.grid-2, .grid-3 {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
.task-item {
|
||||
padding: 15px;
|
||||
border-left: 4px solid #667eea;
|
||||
background: #f8f9fa;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.task-item.status-pending { border-left-color: #6b7280; }
|
||||
.task-item.status-in_progress { border-left-color: #3b82f6; }
|
||||
.task-item.status-blocked { border-left-color: #f59e0b; }
|
||||
.task-item.status-completed { border-left-color: #10b981; }
|
||||
.task-item.status-cancelled { border-left-color: #ef4444; opacity: 0.6; }
|
||||
.task-item .header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.task-item .title {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
.task-item .status {
|
||||
padding: 4px 12px;
|
||||
border-radius: 20px;
|
||||
font-size: 0.85em;
|
||||
color: white;
|
||||
}
|
||||
.status-pending .status { background: #6b7280; }
|
||||
.status-in_progress .status { background: #3b82f6; }
|
||||
.status-blocked .status { background: #f59e0b; }
|
||||
.status-completed .status { background: #10b981; }
|
||||
.status-cancelled .status { background: #ef4444; }
|
||||
.task-item .priority {
|
||||
font-size: 0.8em;
|
||||
color: #666;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.task-item .progress-bar {
|
||||
height: 8px;
|
||||
background: #e5e7eb;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
margin: 10px 0;
|
||||
}
|
||||
.task-item .progress-fill {
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, #667eea, #764ba2);
|
||||
transition: width 0.3s;
|
||||
}
|
||||
.task-item .progress-text {
|
||||
font-size: 0.85em;
|
||||
color: #666;
|
||||
text-align: right;
|
||||
}
|
||||
.task-item .description {
|
||||
color: #666;
|
||||
margin: 10px 0;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
.task-item .progress-notes {
|
||||
background: #fef3c7;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
font-size: 0.85em;
|
||||
color: #92400e;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -191,19 +265,23 @@
|
||||
|
||||
async function loadDiary() {
|
||||
try {
|
||||
const [statsRes, entriesRes, expStatsRes, experiencesRes] = await Promise.all([
|
||||
const [statsRes, entriesRes, expStatsRes, experiencesRes, taskStatsRes, tasksRes] = await Promise.all([
|
||||
fetch(`${API_BASE}/entries/stats/`),
|
||||
fetch(`${API_BASE}/entries/recent/`),
|
||||
fetch(`${API_BASE}/experiences/stats/`),
|
||||
fetch(`${API_BASE}/experiences/recent/`)
|
||||
fetch(`${API_BASE}/experiences/recent/`),
|
||||
fetch(`${API_BASE}/tasks/stats/`),
|
||||
fetch(`${API_BASE}/tasks/active/`)
|
||||
]);
|
||||
|
||||
const stats = await statsRes.json();
|
||||
const entries = await entriesRes.json();
|
||||
const expStats = await expStatsRes.json();
|
||||
const experiences = await experiencesRes.json();
|
||||
const taskStats = await taskStatsRes.json();
|
||||
const tasks = await tasksRes.json();
|
||||
|
||||
render(stats, entries, expStats, experiences);
|
||||
render(stats, entries, expStats, experiences, taskStats, tasks);
|
||||
} catch (error) {
|
||||
document.getElementById('app').innerHTML = `
|
||||
<div class="error">加载失败：${error.message}</div>
|
||||
@@ -211,7 +289,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
function render(stats, entries, expStats, experiences) {
|
||||
function render(stats, entries, expStats, experiences, taskStats, tasks) {
|
||||
const app = document.getElementById('app');
|
||||
|
||||
app.innerHTML = `
|
||||
@@ -220,18 +298,45 @@
|
||||
<h3>${stats.total_entries || 0}</h3>
|
||||
<p>总日记数</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>${taskStats.total || 0}</h3>
|
||||
<p>总任务</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>${taskStats.in_progress || 0}</h3>
|
||||
<p>进行中</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>${taskStats.completed || 0}</h3>
|
||||
<p>已完成</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>${taskStats.completion_rate || 0}%</h3>
|
||||
<p>完成率</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>${expStats.total_experiences || 0}</h3>
|
||||
<p>经验总结</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>${stats.first_entry || '-'}</h3>
|
||||
<p>第一天</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>${stats.latest_entry || '-'}</h3>
|
||||
<p>最新日记</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section-box" style="margin-bottom: 30px;">
|
||||
<h2>📋 工作任务</h2>
|
||||
${tasks.length === 0 ? '<p>暂无活跃任务</p>' : tasks.map(task => `
|
||||
<div class="task-item status-${task.status}">
|
||||
<div class="header">
|
||||
<span class="title">${task.title}</span>
|
||||
<span class="status">${task.status_display}</span>
|
||||
</div>
|
||||
<div class="priority">优先级：${task.priority_display} | 负责人：${task.assigned_to || '码神'}</div>
|
||||
${task.description ? `<div class="description">${task.description}</div>` : ''}
|
||||
<div class="progress-bar">
|
||||
<div class="progress-fill" style="width: ${task.progress_percent}%"></div>
|
||||
</div>
|
||||
<div class="progress-text">进展：${task.progress_percent}%</div>
|
||||
${task.progress_notes ? `<div class="progress-notes"><strong>进展记录：</strong><br>${task.progress_notes}</div>` : ''}
|
||||
</div>
|
||||
`).join('')}
|
||||
</div>
|
||||
|
||||
<div class="grid-2">
|
||||
|
||||
Reference in New Issue
Block a user