gao/ljwx-children
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

feat: add visual task board HTML
CI - Continuous Integration / Run Tests (push) Failing after 0s
Details
CI - Continuous Integration / Security Scan (push) Failing after 1s
Details
CI - Continuous Integration / Build and Verify (push) Has been skipped
Details
Complete CI/CD Pipeline / Code Quality & Security (push) Failing after 0s
Details
Security Scanning / SAST (Bandit + Semgrep) (push) Failing after 1s
Details
Complete CI/CD Pipeline / Run Tests (push) Has been skipped
Details
Complete CI/CD Pipeline / Build Docker Image (push) Has been skipped
Details
Complete CI/CD Pipeline / Container Security Scan (push) Has been skipped
Details
Complete CI/CD Pipeline / Deploy to Development (GitOps) (push) Has been skipped
Details
Complete CI/CD Pipeline / Deploy to Production (GitOps) (push) Has been skipped
Details
Complete CI/CD Pipeline / Post-deployment Verification (push) Failing after 0s
Details
Complete CI/CD Pipeline / Notify Results (push) Successful in 0s
Details
Security Scanning / Container Scanning (push) Failing after 0s
Details
Security Scanning / Secret Scanning (push) Failing after 0s
Details
Security Scanning / Dependency Scanning (Safety + Trivy) (push) Failing after 3s
Details
Security Scanning / License Compliance (push) Failing after 3s
Details
Test Matrix / Security Scan (push) Failing after 2s
Details
Security Scanning / Security Summary (push) Failing after 1s
Details
TODO to Issue / Create Issues from TODOs (push) Failing after 0s
Details
Test Matrix / Lint (push) Failing after 18s
Details
Test Matrix / Test (${{ matrix.python-version }}, ${{ matrix.test-type }}) (macos-latest, 3.11, unit) (push) Has been skipped
Details
Test Matrix / Test (${{ matrix.python-version }}, ${{ matrix.test-type }}) (ubuntu-latest, 3.10, integration) (push) Has been skipped
Details
Test Matrix / Test (${{ matrix.python-version }}, ${{ matrix.test-type }}) (ubuntu-latest, 3.10, unit) (push) Has been skipped
Details
Test Matrix / Test (${{ matrix.python-version }}, ${{ matrix.test-type }}) (ubuntu-latest, 3.11, integration) (push) Has been skipped
Details
Test Matrix / Test (${{ matrix.python-version }}, ${{ matrix.test-type }}) (ubuntu-latest, 3.11, unit) (push) Has been skipped
Details
Test Matrix / Test (${{ matrix.python-version }}, ${{ matrix.test-type }}) (ubuntu-latest, 3.12, integration) (push) Has been skipped
Details
Test Matrix / Test (${{ matrix.python-version }}, ${{ matrix.test-type }}) (ubuntu-latest, 3.12, unit) (push) Has been skipped
Details
Test Matrix / E2E Tests (push) Has been skipped
Details
Test Matrix / Coverage Summary (push) Has been skipped
Details
Test Matrix / Build Docker Image (push) Has been skipped
Details
Test Matrix / All Tests Passed (push) Failing after 0s
Details

Browse Source 
- Interactive Kanban board for task tracking
- Beautiful gradient design with animations
- 3 columns: Todo (6), In Progress (0), Done (3)
- Click cards to view GitHub Issues
- Progress bar showing 33% completion
- Responsive layout for mobile/desktop
- Color-coded priorities

Can be opened locally: open task-board.html

🤖 Generated with Claude Code
Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
This commit is contained in:
bruno
2026-01-01 14:06:26 +08:00
parent 1b0958210d
commit dca9dcbd9a
1 changed files with 536 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
task-board.html
+536
View File
@@ -0,0 +1,536 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>留守儿童心理风险检测平台 - 任务看板</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
padding: 20px;
min-height: 100vh;
}
.header {
text-align: center;
color: white;
margin-bottom: 30px;
}
.header h1 {
font-size: 2.5em;
margin-bottom: 10px;
text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
.header .subtitle {
font-size: 1.2em;
opacity: 0.9;
}
.stats {
display: flex;
justify-content: center;
gap: 20px;
margin-bottom: 30px;
flex-wrap: wrap;
}
.stat-card {
background: white;
padding: 20px 30px;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
text-align: center;
}
.stat-card .number {
font-size: 2.5em;
font-weight: bold;
color: #667eea;
}
.stat-card .label {
font-size: 0.9em;
color: #666;
margin-top: 5px;
}
.board {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 20px;
max-width: 1400px;
margin: 0 auto;
}
.column {
background: rgba(255, 255, 255, 0.95);
border-radius: 10px;
padding: 20px;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.column-header {
font-size: 1.3em;
font-weight: bold;
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 3px solid;
display: flex;
justify-content: space-between;
align-items: center;
}
.column-header .count {
font-size: 0.8em;
background: #f0f0f0;
padding: 3px 10px;
border-radius: 12px;
}
.column.todo .column-header {
border-color: #fbbf24;
color: #f59e0b;
}
.column.in-progress .column-header {
border-color: #60a5fa;
color: #3b82f6;
}
.column.done .column-header {
border-color: #34d399;
color: #10b981;
}
.task-card {
background: white;
border: 2px solid #e5e7eb;
border-radius: 8px;
padding: 15px;
margin-bottom: 12px;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
transition: all 0.3s ease;
cursor: pointer;
}
.task-card:hover {
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.task-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 10px;
}
.task-number {
font-size: 0.9em;
font-weight: bold;
color: #667eea;
}
.task-priority {
font-size: 0.75em;
padding: 3px 8px;
border-radius: 12px;
font-weight: bold;
}
.priority-critical {
background: #fee2e2;
color: #dc2626;
}
.priority-high {
background: #fef3c7;
color: #d97706;
}
.priority-medium {
background: #dbeafe;
color: #2563eb;
}
.priority-low {
background: #e5e7eb;
color: #6b7280;
}
.task-title {
font-weight: 600;
color: #1f2937;
margin-bottom: 8px;
font-size: 0.95em;
line-height: 1.4;
}
.task-meta {
display: flex;
gap: 10px;
font-size: 0.8em;
color: #6b7280;
}
.task-meta span {
display: flex;
align-items: center;
gap: 4px;
}
.task-link {
text-align: center;
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid #e5e7eb;
}
.task-link a {
color: #667eea;
text-decoration: none;
font-size: 0.85em;
font-weight: 500;
}
.task-link a:hover {
text-decoration: underline;
}
.progress-bar {
width: 100%;
height: 30px;
background: #e5e7eb;
border-radius: 15px;
overflow: hidden;
margin: 20px 0;
box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
}
.progress-fill {
height: 100%;
background: linear-gradient(90deg, #10b981 0%, #34d399 100%);
transition: width 0.5s ease;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: bold;
font-size: 0.9em;
}
.legend {
background: white;
padding: 15px 20px;
border-radius: 8px;
margin-top: 20px;
max-width: 1400px;
margin-left: auto;
margin-right: auto;
}
.legend h3 {
margin-bottom: 10px;
color: #1f2937;
}
.legend-items {
display: flex;
gap: 20px;
flex-wrap: wrap;
}
.legend-item {
display: flex;
align-items: center;
gap: 8px;
font-size: 0.9em;
}
.legend-color {
width: 20px;
height: 20px;
border-radius: 4px;
}
@media (max-width: 768px) {
.board {
grid-template-columns: 1fr;
}
.header h1 {
font-size: 1.8em;
}
.stats {
flex-direction: column;
}
}
</style>
</head>
<body>
<div class="header">
<h1>📊 留守儿童心理风险检测平台</h1>
<div class="subtitle">开发任务看板 - Phase 2</div>
</div>
<div class="stats">
<div class="stat-card">
<div class="number">9</div>
<div class="label">总任务数</div>
</div>
<div class="stat-card">
<div class="number" style="color: #10b981;">3</div>
<div class="label">已完成</div>
</div>
<div class="stat-card">
<div class="number" style="color: #3b82f6;">0</div>
<div class="label">进行中</div>
</div>
<div class="stat-card">
<div class="number" style="color: #f59e0b;">6</div>
<div class="label">待开始</div>
</div>
</div>
<div class="progress-bar">
<div class="progress-fill" style="width: 33%;">33% 完成</div>
</div>
<div class="board">
<!-- Todo Column -->
<div class="column todo">
<div class="column-header">
<span>📋 待办 (Todo)</span>
<span class="count">6</span>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">#37</span>
<span class="task-priority priority-critical">🔴 Critical</span>
</div>
<div class="task-title">Complete test coverage: risk assessments endpoints</div>
<div class="task-meta">
<span>⏱️ 4-6h</span>
<span>🧪 Testing</span>
</div>
<div class="task-link">
<a href="https://github.com/BrunoGaoSZ/ljwx-children/issues/37" target="_blank">
查看详情 →
</a>
</div>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">#38</span>
<span class="task-priority priority-low">⚪ Low</span>
</div>
<div class="task-title">Complete test coverage: data collection endpoints</div>
<div class="task-meta">
<span>⏱️ 4-6h</span>
<span>🧪 Testing</span>
</div>
<div class="task-link">
<a href="https://github.com/BrunoGaoSZ/ljwx-children/issues/38" target="_blank">
查看详情 →
</a>
</div>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">#39</span>
<span class="task-priority priority-medium">🟠 Medium</span>
</div>
<div class="task-title">Implement resource library endpoints</div>
<div class="task-meta">
<span>⏱️ 4-6h</span>
<span>📡 API</span>
</div>
<div class="task-link">
<a href="https://github.com/BrunoGaoSZ/ljwx-children/issues/39" target="_blank">
查看详情 →
</a>
</div>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">#40</span>
<span class="task-priority priority-medium">🟠 Medium</span>
</div>
<div class="task-title">Implement communication endpoints</div>
<div class="task-meta">
<span>⏱️ 6-8h</span>
<span>📡 API</span>
</div>
<div class="task-link">
<a href="https://github.com/BrunoGaoSZ/ljwx-children/issues/40" target="_blank">
查看详情 →
</a>
</div>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">#41</span>
<span class="task-priority priority-low">⚪ Low-Medium</span>
</div>
<div class="task-title">Implement analytics dashboard endpoints</div>
<div class="task-meta">
<span>⏱️ 6-8h</span>
<span>📊 Analytics</span>
</div>
<div class="task-link">
<a href="https://github.com/BrunoGaoSZ/ljwx-children/issues/41" target="_blank">
查看详情 →
</a>
</div>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">#42</span>
<span class="task-priority priority-high">🟡 High</span>
</div>
<div class="task-title">Deploy to OrbStack for local testing</div>
<div class="task-meta">
<span>⏱️ 4-6h</span>
<span>🚀 DevOps</span>
</div>
<div class="task-link">
<a href="https://github.com/BrunoGaoSZ/ljwx-children/issues/42" target="_blank">
查看详情 →
</a>
</div>
</div>
</div>
<!-- In Progress Column -->
<div class="column in-progress">
<div class="column-header">
<span>🚧 进行中 (In Progress)</span>
<span class="count">0</span>
</div>
<div style="text-align: center; color: #9ca3af; padding: 40px 20px;">
<p>暂无进行中的任务</p>
<p style="font-size: 0.9em; margin-top: 10px;">从待办列表中选择一个任务开始吧！</p>
</div>
</div>
<!-- Done Column -->
<div class="column done">
<div class="column-header">
<span>✅ 已完成 (Done)</span>
<span class="count">3</span>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">Task-001</span>
<span class="task-priority priority-critical">🔴 Critical</span>
</div>
<div class="task-title">Database Migration (Alembic)</div>
<div class="task-meta">
<span>⏱️ Completed</span>
<span>🗄️ Database</span>
</div>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">Task-002</span>
<span class="task-priority priority-high">🟡 High</span>
</div>
<div class="task-title">Redis Token Blacklist</div>
<div class="task-meta">
<span>⏱️ Completed</span>
<span>🔐 Auth</span>
</div>
</div>
<div class="task-card">
<div class="task-header">
<span class="task-number">Task-003</span>
<span class="task-priority priority-critical">🔴 Critical</span>
</div>
<div class="task-title">Ollama AI Integration (lingjingwanxiang:32b)</div>
<div class="task-meta">
<span>⏱️ Completed</span>
<span>🤖 AI/ML</span>
</div>
</div>
</div>
</div>
<div class="legend">
<h3>🎨 图例说明</h3>
<div class="legend-items">
<div class="legend-item">
<div class="legend-color" style="background: #fee2e2;"></div>
<span>Critical Priority - 需要立即处理</span>
</div>
<div class="legend-item">
<div class="legend-color" style="background: #fef3c7;"></div>
<span>High Priority - 高优先级</span>
</div>
<div class="legend-item">
<div class="legend-color" style="background: #dbeafe;"></div>
<span>Medium Priority - 中等优先级</span>
</div>
<div class="legend-item">
<div class="legend-color" style="background: #e5e7eb;"></div>
<span>Low Priority - 低优先级</span>
</div>
</div>
</div>
<div style="text-align: center; color: white; margin-top: 30px; opacity: 0.8;">
<p>📅 最后更新: 2026-01-01</p>
<p style="margin-top: 5px;">
<a href="https://github.com/BrunoGaoSZ/ljwx-children" target="_blank" style="color: white;">
🔗 GitHub Repository
</a>
</p>
</div>
<script>
// 添加点击任务卡片跳转到 GitHub Issue 的功能
document.querySelectorAll('.task-card').forEach(card => {
card.addEventListener('click', function() {
const link = this.querySelector('.task-link a');
if (link) {
window.open(link.href, '_blank');
}
});
});
// 动画效果
window.addEventListener('load', () => {
const cards = document.querySelectorAll('.task-card');
cards.forEach((card, index) => {
setTimeout(() => {
card.style.opacity = '0';
card.style.transform = 'translateY(20px)';
setTimeout(() => {
card.style.transition = 'all 0.5s ease';
card.style.opacity = '1';
card.style.transform = 'translateY(0)';
}, 50);
}, index * 100);
});
});
</script>
</body>
</html>