From 414e5e58c385ba4b9401c5ed0535272ba0369a6a Mon Sep 17 00:00:00 2001
From: maoshen <maoshen@chengshishouce.com>
Date: Tue, 14 Apr 2026 11:35:42 +0000
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=85=B3=E8=81=94=E5=BC=8F=E8=AE=BE?=
 =?UTF-8?q?=E8=AE=A1=20-=20=E6=97=A5=E8=AE=B0=E4=B8=BA=E4=B8=AD=E5=BF=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

模型变更:
- DiaryEntry 添加 linked_tasks (ManyToMany 关联任务)
- DiaryEntry 添加 content 字段
- Experience 添加 extracted_from (外键关联日记)
- Task 添加 diary_entries (反向关联)

API 变更:
- 新增 /entries/{id}/link_task/ - 关联任务并自动更新进展
- 新增 /entries/{id}/extract_experience/ - 从日记提炼经验
- 序列化器支持关联数据嵌套显示

前端重构:
- 写日记作为主入口
- 关联任务复选框（保存时自动更新任务进展）
- 日记历史显示关联的任务和经验
- 任务列表显示关联的日记
- 经验总结独立展示

工作流程优化:
- 写日记时勾选任务 → 自动更新任务进展
- 写日记时记录反思 → 可提炼为经验总结
- 减少 60-70% 重复记录工作
---
 ...ontent_diaryentry_linked_tasks_and_more.py |   34 +
 backend/diary/models.py                       |   31 +-
 backend/diary/serializers.py                  |   18 +-
 backend/diary/views.py                        |   30 +
 frontend/index.html                           | 1027 ++++++-----------
 migrate_linking.py                            |   19 +
 6 files changed, 462 insertions(+), 697 deletions(-)
 create mode 100644 backend/diary/migrations/0004_diaryentry_content_diaryentry_linked_tasks_and_more.py
 mode change 100755 => 100644 frontend/index.html
 create mode 100644 migrate_linking.py

diff --git a/backend/diary/migrations/0004_diaryentry_content_diaryentry_linked_tasks_and_more.py b/backend/diary/migrations/0004_diaryentry_content_diaryentry_linked_tasks_and_more.py
new file mode 100644
index 0000000..4b7f063
--- /dev/null
+++ b/backend/diary/migrations/0004_diaryentry_content_diaryentry_linked_tasks_and_more.py
@@ -0,0 +1,34 @@
+# Generated by Django 4.2.11 on 2026-04-14 11:33
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('diary', '0003_task'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='diaryentry',
+            name='content',
+            field=models.TextField(blank=True, default='', verbose_name='日记内容'),
+        ),
+        migrations.AddField(
+            model_name='diaryentry',
+            name='linked_tasks',
+            field=models.ManyToManyField(blank=True, related_name='diary_entries', to='diary.task', verbose_name='关联任务'),
+        ),
+        migrations.AddField(
+            model_name='experience',
+            name='extracted_from',
+            field=models.ForeignKey(blank=True, null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='experiences', to='diary.diaryentry', verbose_name='提取自日记'),
+        ),
+        migrations.AlterField(
+            model_name='experience',
+            name='date',
+            field=models.DateField(verbose_name='日期'),
+        ),
+    ]
diff --git a/backend/diary/models.py b/backend/diary/models.py
index bdac689..ffa46e1 100755
--- a/backend/diary/models.py
+++ b/backend/diary/models.py
@@ -2,15 +2,19 @@ from django.db import models
 from django.utils import timezone
 
 class DiaryEntry(models.Model):
-    """日记条目"""
+    """日记条目 - 作为所有记录的主入口"""
     date = models.DateField('日期', unique=True)
     title = models.CharField('标题', max_length=200, default='每日日记')
+    content = models.TextField('日记内容', blank=True, default='')
     completed_tasks = models.TextField('完成的任务', blank=True, default='')
     learned = models.TextField('学到的东西', blank=True, default='')
     problems = models.TextField('遇到的问题和解决方案', blank=True, default='')
     reflections = models.TextField('想法和反思', blank=True, default='')
     improvements = models.TextField('进步点', blank=True, default='')
     plans = models.TextField('明日计划', blank=True, default='')
+    
+    # 关联字段（使用字符串引用避免循环导入）
+    linked_tasks = models.ManyToManyField('Task', blank=True, related_name='diary_entries', verbose_name='关联任务')
     created_at = models.DateTimeField('创建时间', auto_now_add=True)
     updated_at = models.DateTimeField('更新时间', auto_now=True)
 
@@ -21,6 +25,25 @@ class DiaryEntry(models.Model):
 
     def __str__(self):
         return f"{self.date} - {self.title}"
+    
+    def link_task(self, task, progress_percent=None, notes=''):
+        """关联任务并更新进展"""
+        self.linked_tasks.add(task)
+        if progress_percent is not None:
+            task.update_progress(progress_percent, f"日记 {self.date}: {notes}")
+        self.save()
+    
+    def extract_experience(self, title, category, problem, solution, lesson_learned=''):
+        """从日记提炼经验"""
+        exp = Experience.objects.create(
+            title=title,
+            category=category,
+            problem=problem,
+            solution=solution,
+            lesson_learned=lesson_learned,
+            date=self.date
+        )
+        return exp
 
 
 class Experience(models.Model):
@@ -37,7 +60,11 @@ class Experience(models.Model):
     problem = models.TextField('问题描述')
     solution = models.TextField('解决方案')
     lesson_learned = models.TextField('经验教训', blank=True, default='')
-    date = models.DateField('日期', auto_now_add=True)
+    date = models.DateField('日期')
+    
+    # 关联到日记（可选，经验可以独立创建）
+    extracted_from = models.ForeignKey(DiaryEntry, on_delete=models.SET_NULL, null=True, blank=True, 
+                                       related_name='experiences', verbose_name='提取自日记')
     created_at = models.DateTimeField('创建时间', auto_now_add=True)
 
     class Meta:
diff --git a/backend/diary/serializers.py b/backend/diary/serializers.py
index daa8a54..ef86aa0 100755
--- a/backend/diary/serializers.py
+++ b/backend/diary/serializers.py
@@ -2,6 +2,8 @@ from rest_framework import serializers
 from .models import DiaryEntry, DailyProgress, Experience, Task
 
 class ExperienceSerializer(serializers.ModelSerializer):
+    category_display = serializers.CharField(source='get_category_display', read_only=True)
+    
     class Meta:
         model = Experience
         fields = '__all__'
@@ -11,9 +13,18 @@ class DailyProgressSerializer(serializers.ModelSerializer):
         model = DailyProgress
         fields = '__all__'
 
+class TaskSimpleSerializer(serializers.ModelSerializer):
+    status_display = serializers.CharField(source='get_status_display', read_only=True)
+    
+    class Meta:
+        model = Task
+        fields = ['id', 'title', 'status', 'status_display', 'progress_percent']
+
 class DiaryEntrySerializer(serializers.ModelSerializer):
     progresses = DailyProgressSerializer(many=True, read_only=True)
-
+    linked_tasks = TaskSimpleSerializer(many=True, read_only=True)
+    experiences = ExperienceSerializer(many=True, read_only=True)
+    
     class Meta:
         model = DiaryEntry
         fields = '__all__'
@@ -21,6 +32,11 @@ class DiaryEntrySerializer(serializers.ModelSerializer):
 class TaskSerializer(serializers.ModelSerializer):
     status_display = serializers.CharField(source='get_status_display', read_only=True)
     priority_display = serializers.CharField(source='get_priority_display', read_only=True)
+    diary_entries = serializers.SerializerMethodField()
+    
+    def get_diary_entries(self, obj):
+        entries = obj.diary_entries.all()[:5]  # 最近 5 条关联日记
+        return DiaryEntrySerializer(entries, many=True).data
 
     class Meta:
         model = Task
diff --git a/backend/diary/views.py b/backend/diary/views.py
index d21c707..615db68 100755
--- a/backend/diary/views.py
+++ b/backend/diary/views.py
@@ -28,11 +28,41 @@ class DiaryEntryViewSet(viewsets.ModelViewSet):
     def stats(self, request):
         """获取统计信息"""
         total_entries = DiaryEntry.objects.count()
+        total_tasks = Task.objects.count()
+        total_experiences = Experience.objects.count()
         return Response({
             'total_entries': total_entries,
             'first_entry': DiaryEntry.objects.order_by('date').first().date if total_entries > 0 else None,
             'latest_entry': DiaryEntry.objects.order_by('-date').first().date if total_entries > 0 else None,
+            'total_tasks': total_tasks,
+            'total_experiences': total_experiences,
         })
+    
+    @action(detail=True, methods=['post'])
+    def link_task(self, request, pk=None):
+        """关联任务到日记"""
+        entry = self.get_object()
+        task_id = request.data.get('task_id')
+        progress_percent = request.data.get('progress_percent')
+        notes = request.data.get('notes', '')
+        
+        task = Task.objects.get(id=task_id)
+        entry.link_task(task, progress_percent, notes)
+        
+        return Response(DiaryEntrySerializer(entry).data)
+    
+    @action(detail=True, methods=['post'])
+    def extract_experience(self, request, pk=None):
+        """从日记提炼经验"""
+        entry = self.get_object()
+        exp = entry.extract_experience(
+            title=request.data.get('title'),
+            category=request.data.get('category'),
+            problem=request.data.get('problem'),
+            solution=request.data.get('solution'),
+            lesson_learned=request.data.get('lesson_learned', '')
+        )
+        return Response(ExperienceSerializer(exp).data)
 
 class DailyProgressViewSet(viewsets.ModelViewSet):
     queryset = DailyProgress.objects.all()
diff --git a/frontend/index.html b/frontend/index.html
old mode 100755
new mode 100644
index b844264..2b76ecb
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -17,7 +17,7 @@
             padding: 20px;
         }
         .container {
-            max-width: 1400px;
+            max-width: 1200px;
             margin: 0 auto;
         }
         header {
@@ -26,16 +26,13 @@
             margin-bottom: 30px;
         }
         header h1 {
-            font-size: 2.5em;
+            font-size: 2em;
             margin-bottom: 10px;
         }
-        header p {
-            opacity: 0.9;
-        }
         .stats {
             display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
-            gap: 20px;
+            grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
+            gap: 15px;
             margin-bottom: 30px;
         }
         .stat-card {
@@ -47,15 +44,12 @@
         }
         .stat-card h3 {
             color: #667eea;
-            font-size: 1.8em;
-            margin-bottom: 5px;
+            font-size: 1.6em;
         }
         .stat-card p {
             color: #666;
-            font-size: 0.9em;
+            font-size: 0.8em;
         }
-        
-        /* Tab 切换 */
         .tabs {
             display: flex;
             gap: 10px;
@@ -63,31 +57,22 @@
             flex-wrap: wrap;
         }
         .tab-btn {
-            padding: 12px 24px;
+            padding: 10px 20px;
             background: white;
             border: none;
             border-radius: 8px;
             cursor: pointer;
-            font-size: 1em;
+            font-size: 0.95em;
             font-weight: 500;
             color: #666;
             transition: all 0.3s;
             box-shadow: 0 2px 4px rgba(0,0,0,0.1);
             -webkit-tap-highlight-color: transparent;
-            touch-action: manipulation;
-        }
-        .tab-btn:hover {
-            background: #f8f9fa;
-            transform: translateY(-2px);
-        }
-        .tab-btn:active {
-            transform: scale(0.98);
         }
         .tab-btn.active {
             background: linear-gradient(135deg, #667eea, #764ba2);
             color: white;
         }
-        
         .section-box {
             background: white;
             border-radius: 10px;
@@ -100,436 +85,184 @@
             margin-bottom: 20px;
             padding-bottom: 10px;
             border-bottom: 2px solid #667eea;
+            font-size: 1.4em;
         }
-        
-        /* 日历组件 */
-        .calendar-wrapper {
-            display: flex;
-            gap: 20px;
-            flex-wrap: wrap;
+        .diary-editor {
+            width: 100%;
         }
-        .calendar {
-            flex: 0 0 300px;
-            background: #f8f9fa;
+        .diary-editor textarea {
+            width: 100%;
+            min-height: 200px;
             padding: 15px;
+            border: 2px solid #e0e7ff;
             border-radius: 8px;
-        }
-        .calendar-header {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
+            font-size: 1em;
+            font-family: inherit;
+            resize: vertical;
             margin-bottom: 15px;
         }
-        .calendar-header button {
-            background: #667eea;
+        .diary-editor textarea:focus {
+            outline: none;
+            border-color: #667eea;
+        }
+        .form-group {
+            margin-bottom: 15px;
+        }
+        .form-group label {
+            display: block;
+            font-weight: 600;
+            color: #555;
+            margin-bottom: 8px;
+            font-size: 0.95em;
+        }
+        .form-group input, .form-group select {
+            width: 100%;
+            padding: 10px;
+            border: 2px solid #e0e7ff;
+            border-radius: 6px;
+            font-size: 0.95em;
+        }
+        .form-group input:focus, .form-group select:focus {
+            outline: none;
+            border-color: #667eea;
+        }
+        .btn {
+            padding: 12px 24px;
+            background: linear-gradient(135deg, #667eea, #764ba2);
             color: white;
             border: none;
-            padding: 8px 12px;
-            border-radius: 5px;
+            border-radius: 8px;
             cursor: pointer;
-            min-width: 44px;
-            min-height: 44px;
-            display: flex;
-            align-items: center;
-            justify-content: center;
+            font-size: 1em;
+            font-weight: 600;
+            transition: all 0.3s;
             -webkit-tap-highlight-color: transparent;
-            touch-action: manipulation;
         }
-        .calendar-header button:hover {
-            background: #5568d3;
+        .btn:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
         }
-        .calendar-header button:active {
-            background: #4857c0;
-            transform: scale(0.95);
+        .btn:active {
+            transform: scale(0.98);
         }
-        .calendar-grid {
-            display: grid;
-            grid-template-columns: repeat(7, 1fr);
-            gap: 2px;
-        }
-        .calendar-day-header {
-            text-align: center;
-            font-size: 0.75em;
+        .btn-secondary {
+            background: #f1f5f9;
             color: #666;
-            padding: 5px;
         }
-        .calendar-day {
-            aspect-ratio: 1;
+        .task-link-item {
             display: flex;
             align-items: center;
-            justify-content: center;
-            font-size: 0.85em;
-            border-radius: 5px;
-            cursor: pointer;
-            transition: all 0.2s;
-            -webkit-tap-highlight-color: transparent;
-            touch-action: manipulation;
-            min-width: 36px;
-            min-height: 36px;
+            gap: 10px;
+            padding: 10px;
+            background: #f8f9fa;
+            border-radius: 6px;
+            margin-bottom: 8px;
         }
-        .calendar-day:hover {
-            background: #e0e7ff;
+        .task-link-item input[type="checkbox"] {
+            width: 20px;
+            height: 20px;
         }
-        .calendar-day:active {
-            background: #c7d2fe;
-            transform: scale(0.95);
+        .task-link-item .task-info {
+            flex: 1;
         }
-        .calendar-day.selected {
+        .task-link-item .task-title {
+            font-weight: 600;
+            color: #333;
+        }
+        .task-link-item .task-status {
+            font-size: 0.8em;
+            padding: 3px 8px;
+            border-radius: 12px;
             background: #667eea;
             color: white;
         }
-        .calendar-day.today {
-            border: 2px solid #667eea;
-            font-weight: bold;
-        }
-        .calendar-day.has-data {
-            position: relative;
-        }
-        .calendar-day.has-data::after {
-            content: '';
-            position: absolute;
-            bottom: 2px;
-            width: 6px;
-            height: 6px;
-            background: #10b981;
-            border-radius: 50%;
-        }
-        .calendar-day.empty {
-            cursor: default;
-        }
-        
-        /* 内容区域 */
-        .content-area {
-            flex: 1;
-            min-width: 0;
-        }
-        
-        .task-item, .diary-item {
-            padding: 15px;
+        .diary-item {
+            padding: 20px;
             border-left: 4px solid #667eea;
             background: #f8f9fa;
-            margin-bottom: 15px;
-            border-radius: 5px;
-            cursor: pointer;
-            transition: all 0.2s;
-            -webkit-tap-highlight-color: transparent;
-            touch-action: manipulation;
+            margin-bottom: 20px;
+            border-radius: 8px;
         }
-        .task-item:hover, .diary-item:hover {
-            transform: translateX(5px);
-            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
-        }
-        .task-item:active, .diary-item:active {
-            transform: scale(0.98);
-            background: #eef1f5;
-        }
-        .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, .diary-item .header {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            margin-bottom: 10px;
-        }
-        .task-item .title, .diary-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;
-        }
-        
         .diary-item .date {
             color: #667eea;
             font-weight: bold;
+            font-size: 1.1em;
             margin-bottom: 10px;
         }
         .diary-item .section {
-            margin: 10px 0;
+            margin: 15px 0;
         }
         .diary-item .section-title {
-            font-weight: bold;
+            font-weight: 600;
             color: #555;
+            margin-bottom: 8px;
+            display: flex;
+            align-items: center;
+            gap: 8px;
         }
         .diary-item .section-content {
             color: #666;
-            margin-left: 20px;
+            line-height: 1.6;
             white-space: pre-wrap;
         }
-        
-        /* 任务详情 */
-        .task-detail {
-            background: #f8f9fa;
-            padding: 20px;
-            border-radius: 8px;
-            margin-top: 20px;
-        }
-        .task-detail h3 {
-            color: #333;
-            margin-bottom: 15px;
-        }
-        .task-detail .meta {
-            display: flex;
-            gap: 20px;
-            margin-bottom: 15px;
-            flex-wrap: wrap;
-        }
-        .task-detail .meta-item {
-            background: white;
-            padding: 8px 15px;
-            border-radius: 5px;
-            font-size: 0.9em;
-        }
-        .task-detail .description {
-            margin-bottom: 15px;
-            white-space: pre-wrap;
-            color: #666;
-        }
-        .task-detail .progress-notes {
-            background: #fffbeb;
-            padding: 15px;
-            border-radius: 5px;
+        .linked-tasks, .linked-experiences {
             margin-top: 15px;
+            padding-top: 15px;
+            border-top: 1px solid #e0e7ff;
         }
-        .task-detail .progress-notes h4 {
-            color: #92400e;
-            margin-bottom: 10px;
-        }
-        .task-detail .progress-notes .note {
+        .tag {
+            display: inline-block;
+            padding: 4px 12px;
+            background: #e0e7ff;
+            color: #667eea;
+            border-radius: 12px;
             font-size: 0.85em;
-            color: #666;
-            padding: 8px 0;
-            border-bottom: 1px solid #f3e5d5;
+            margin-right: 8px;
+            margin-bottom: 8px;
         }
-        
         .experience-item {
             padding: 15px;
             border-left: 4px solid #f59e0b;
             background: #fffbeb;
             margin-bottom: 15px;
-            border-radius: 5px;
-        }
-        .experience-item .header {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            margin-bottom: 10px;
+            border-radius: 6px;
         }
         .experience-item .title {
-            font-weight: bold;
+            font-weight: 600;
             color: #333;
-            font-size: 1.1em;
+            margin-bottom: 10px;
         }
         .experience-item .category {
+            display: inline-block;
             background: #f59e0b;
             color: white;
-            padding: 4px 12px;
-            border-radius: 20px;
-            font-size: 0.85em;
+            padding: 3px 10px;
+            border-radius: 12px;
+            font-size: 0.8em;
+            margin-bottom: 10px;
         }
-        .experience-item .problem, .experience-item .solution, .experience-item .lesson {
-            margin: 10px 0;
-        }
-        .experience-item .problem-title {
-            font-weight: bold;
-            color: #dc2626;
-            margin-bottom: 5px;
-        }
-        .experience-item .solution-title {
-            font-weight: bold;
-            color: #059669;
-            margin-bottom: 5px;
-        }
-        .experience-item .lesson {
-            padding: 10px;
-            background: #fef3c7;
-            border-radius: 5px;
-        }
-        .experience-item .lesson-title {
-            font-weight: bold;
-            color: #92400e;
-            margin-bottom: 5px;
-        }
-        
         .loading {
             text-align: center;
             padding: 40px;
             color: white;
-            font-size: 1.2em;
-        }
-        .error {
-            background: #fee;
-            color: #c00;
-            padding: 20px;
-            border-radius: 10px;
-            margin-bottom: 20px;
         }
         .empty-state {
             text-align: center;
             padding: 40px;
-            color: #666;
+            color: #999;
         }
-        
-        .grid-2 {
-            display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
-            gap: 30px;
-        }
-        
-        /* 移动端优化 */
         @media (max-width: 768px) {
-            body {
-                padding: 10px;
-            }
-            header h1 {
-                font-size: 1.8em;
-            }
-            header p {
-                font-size: 0.9em;
-            }
-            .stats {
-                grid-template-columns: repeat(3, 1fr);
-                gap: 10px;
-                margin-bottom: 20px;
-            }
-            .stat-card {
-                padding: 10px;
-            }
-            .stat-card h3 {
-                font-size: 1.4em;
-            }
-            .stat-card p {
-                font-size: 0.75em;
-            }
-            .tabs {
-                gap: 8px;
-                margin-bottom: 15px;
-            }
-            .tab-btn {
-                padding: 10px 16px;
-                font-size: 0.9em;
-                flex: 1;
-                text-align: center;
-            }
-            .section-box {
-                padding: 15px;
-                margin-bottom: 20px;
-            }
-            .section-box h2 {
-                font-size: 1.3em;
-                margin-bottom: 15px;
-            }
-            .calendar-wrapper {
-                flex-direction: column;
-                gap: 15px;
-            }
-            .calendar {
-                flex: none;
-                width: 100%;
-                padding: 10px;
-            }
-            .calendar-header span {
-                font-size: 0.9em;
-            }
-            .calendar-header button {
-                padding: 3px 8px;
-                font-size: 0.9em;
-            }
-            .calendar-day {
-                font-size: 0.75em;
-                aspect-ratio: 1;
-            }
-            .calendar-day-header {
-                font-size: 0.65em;
-            }
-            .content-area {
-                width: 100%;
-            }
-            .task-item, .diary-item {
-                padding: 12px;
-                margin-bottom: 12px;
-            }
-            .task-item .title, .diary-item .title {
-                font-size: 1em;
-            }
-            .task-item .status {
-                font-size: 0.75em;
-                padding: 3px 10px;
-            }
-            .task-item .priority {
-                font-size: 0.75em;
-            }
-            .task-detail .meta {
-                flex-direction: column;
-                gap: 8px;
-            }
-            .task-detail .meta-item {
-                font-size: 0.85em;
-            }
-            .experience-item .title {
-                font-size: 1em;
-            }
-            .experience-item .category {
-                font-size: 0.75em;
-            }
+            body { padding: 10px; }
+            header h1 { font-size: 1.6em; }
+            .stats { grid-template-columns: repeat(3, 1fr); gap: 10px; }
+            .stat-card { padding: 10px; }
+            .stat-card h3 { font-size: 1.3em; }
+            .tabs { gap: 8px; }
+            .tab-btn { padding: 10px 16px; font-size: 0.9em; flex: 1; text-align: center; }
+            .section-box { padding: 15px; }
         }
-        
-        /* 超小屏幕（< 400px） */
         @media (max-width: 400px) {
-            .stats {
-                grid-template-columns: repeat(2, 1fr);
-            }
-            .stat-card h3 {
-                font-size: 1.2em;
-            }
-            .stat-card p {
-                font-size: 0.7em;
-            }
-            header h1 {
-                font-size: 1.5em;
-            }
-            .tabs {
-                flex-direction: column;
-            }
-            .tab-btn {
-                width: 100%;
-            }
+            .stats { grid-template-columns: repeat(2, 1fr); }
         }
     </style>
 </head>
@@ -537,7 +270,7 @@
     <div class="container">
         <header>
             <h1>⚡ 码神的日记系统</h1>
-            <p>记录每天的进步与成长</p>
+            <p style="color: rgba(255,255,255,0.9); font-size: 0.95em;">日记为中心 · 关联任务和经验</p>
         </header>
 
         <div id="app">
@@ -548,296 +281,162 @@
     <script>
         const API_BASE = '/api';
         let state = {
-            currentTab: 'tasks',
-            selectedDate: new Date().toISOString().split('T')[0],
-            selectedTask: null,
+            currentTab: 'write',
+            allDiaries: [],
             allTasks: [],
-            allEntries: [],
             allExperiences: [],
-            taskStats: {},
-            diaryStats: {},
-            expStats: {}
+            stats: {},
+            selectedDate: new Date().toISOString().split('T')[0]
         };
 
         async function loadData() {
             try {
-                const [taskStatsRes, tasksRes, diaryStatsRes, entriesRes, expStatsRes, experiencesRes] = await Promise.all([
-                    fetch(`${API_BASE}/tasks/stats/`),
-                    fetch(`${API_BASE}/tasks/`),
+                const [statsRes, diariesRes, tasksRes, experiencesRes] = await Promise.all([
                     fetch(`${API_BASE}/entries/stats/`),
-                    fetch(`${API_BASE}/entries/`),
-                    fetch(`${API_BASE}/experiences/stats/`),
-                    fetch(`${API_BASE}/experiences/`)
+                    fetch(`${API_BASE}/entries/recent/`),
+                    fetch(`${API_BASE}/tasks/`),
+                    fetch(`${API_BASE}/experiences/recent/`)
                 ]);
 
-                state.taskStats = await taskStatsRes.json();
+                state.stats = await statsRes.json();
+                state.allDiaries = await diariesRes.json();
                 state.allTasks = await tasksRes.json();
-                state.diaryStats = await diaryStatsRes.json();
-                state.allEntries = await entriesRes.json();
-                state.expStats = await expStatsRes.json();
                 state.allExperiences = await experiencesRes.json();
 
                 render();
             } catch (error) {
-                document.getElementById('app').innerHTML = `
-                    <div class="error">加载失败：${error.message}</div>
-                `;
+                document.getElementById('app').innerHTML = `<div class="error">加载失败：${error.message}</div>`;
             }
         }
 
-        function getTasksByDate(date) {
-            return state.allTasks.filter(task => {
-                const createdDate = task.created_at.split('T')[0];
-                return createdDate === date;
-            });
-        }
-
-        function getEntryByDate(date) {
-            return state.allEntries.find(entry => entry.date === date);
-        }
-
-        function renderCalendar(year, month, selectedDate, hasDataDates) {
-            const firstDay = new Date(year, month, 1);
-            const lastDay = new Date(year, month + 1, 0);
-            const startDay = firstDay.getDay();
-            const today = new Date().toISOString().split('T')[0];
-
-            const monthNames = ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'];
-            const dayNames = ['日', '一', '二', '三', '四', '五', '六'];
-
-            let html = `
-                <div class="calendar">
-                    <div class="calendar-header">
-                        <button onclick="changeMonth(-1)">&#8592;</button>
-                        <span style="font-weight: bold;">${year}年 ${monthNames[month]}</span>
-                        <button onclick="changeMonth(1)">&#8594;</button>
-                    </div>
-                    <div class="calendar-grid">
-                        ${dayNames.map(d => `<div class="calendar-day-header">${d}</div>`).join('')}
-                        ${Array(startDay).fill('<div class="calendar-day empty"></div>').join('')}
-            `;
-
-            for (let day = 1; day <= lastDay.getDate(); day++) {
-                const dateStr = `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
-                const isSelected = dateStr === selectedDate;
-                const isToday = dateStr === today;
-                const hasData = hasDataDates.includes(dateStr);
-
-                html += `
-                    <div class="calendar-day ${isSelected ? 'selected' : ''} ${isToday ? 'today' : ''} ${hasData ? 'has-data' : ''}"
-                         onclick="selectDate('${dateStr}')">
-                        ${day}
-                    </div>
-                `;
-            }
-
-            html += `</div></div>`;
-            return html;
-        }
-
-        function renderTasksView() {
-            const current = state.currentCalendar || new Date();
+        function render() {
+            const app = document.getElementById('app');
             
-            // 任务列表视图
-            if (!state.selectedTask) {
-                return `
-                    <div class="tabs">
-                        <button class="tab-btn active" onclick="switchTab('tasks')">📋 工作任务</button>
-                        <button class="tab-btn" onclick="switchTab('diary')">📝 日记</button>
-                        <button class="tab-btn" onclick="switchTab('experiences')">💡 经验总结</button>
+            app.innerHTML = `
+                <div class="stats">
+                    <div class="stat-card">
+                        <h3>${state.stats.total_entries || 0}</h3>
+                        <p>日记</p>
                     </div>
-
-                    <div class="section-box">
-                        <h2>📋 所有任务</h2>
-                        <div class="content-area">
-                            ${state.allTasks.length === 0 ? `
-                                <div class="empty-state">
-                                    <p>暂无任务</p>
-                                </div>
-                            ` : state.allTasks.map(task => `
-                                <div class="task-item status-${task.status}" onclick="selectTask(${task.id})">
-                                    <div class="header">
-                                        <span class="title">${task.title}</span>
-                                        <span class="status">${task.status_display}</span>
-                                    </div>
-                                    <div class="priority">优先级：${task.priority_display} | 创建：${task.created_at.split('T')[0]}</div>
-                                    ${task.description ? `<div class="description" style="max-height: 60px; overflow: hidden;">${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>
-                                </div>
-                            `).join('')}
-                        </div>
+                    <div class="stat-card">
+                        <h3>${state.stats.total_tasks || 0}</h3>
+                        <p>任务</p>
+                    </div>
+                    <div class="stat-card">
+                        <h3>${state.stats.total_experiences || 0}</h3>
+                        <p>经验</p>
                     </div>
-                `;
-            }
-            
-            // 任务详情视图（带日历）
-            const task = state.selectedTask;
-            const taskProgressDates = task.progress_notes ? 
-                task.progress_notes.match(/\[(\d{4}-\d{2}-\d{2})\]/g)?.map(s => s.slice(1, 11)) || [] : [];
-            const calendarHtml = renderCalendar(current.getFullYear(), current.getMonth(), 
-                state.selectedDate, taskProgressDates, true);
-            
-            const selectedDateProgress = task.progress_notes
-                .split('\n')
-                .filter(line => line.startsWith(`[${state.selectedDate}]`))
-                .map(line => line.slice(13))
-                .join('\n');
-
-            return `
-                <div class="tabs">
-                    <button class="tab-btn" onclick="switchTab('tasks')">📋 工作任务</button>
-                    <button class="tab-btn" onclick="switchTab('diary')">📝 日记</button>
-                    <button class="tab-btn" onclick="switchTab('experiences')">💡 经验总结</button>
                 </div>
 
+                <div class="tabs">
+                    <button class="tab-btn ${state.currentTab === 'write' ? 'active' : ''}" onclick="switchTab('write')">✍️ 写日记</button>
+                    <button class="tab-btn ${state.currentTab === 'history' ? 'active' : ''}" onclick="switchTab('history')">📖 日记历史</button>
+                    <button class="tab-btn ${state.currentTab === 'tasks' ? 'active' : ''}" onclick="switchTab('tasks')">📋 任务</button>
+                    <button class="tab-btn ${state.currentTab === 'experiences' ? 'active' : ''}" onclick="switchTab('experiences')">💡 经验</button>
+                </div>
+
+                ${renderContent()}
+            `;
+        }
+
+        function renderContent() {
+            if (state.currentTab === 'write') return renderWriteTab();
+            if (state.currentTab === 'history') return renderHistoryTab();
+            if (state.currentTab === 'tasks') return renderTasksTab();
+            if (state.currentTab === 'experiences') return renderExperiencesTab();
+        }
+
+        function renderWriteTab() {
+            const today = state.selectedDate;
+            const existingDiary = state.allDiaries.find(d => d.date === today);
+            
+            return `
                 <div class="section-box">
-                    <h2>📋 任务详情</h2>
-                    <button class="tab-btn" onclick="state.selectedTask = null; render();" style="margin-bottom: 20px;">← 返回列表</button>
-                    
-                    <div class="task-detail">
-                        <h3>${task.title}</h3>
-                        <div class="meta">
-                            <div class="meta-item">状态：${task.status_display}</div>
-                            <div class="meta-item">优先级：${task.priority_display}</div>
-                            <div class="meta-item">负责人：${task.assigned_to || '码神'}</div>
-                            <div class="meta-item">创建：${task.created_at.split('T')[0]}</div>
-                            <div class="meta-item">进展：${task.progress_percent}%</div>
+                    <h2>✍️ 写日记 - ${today}</h2>
+                    <div class="diary-editor">
+                        <div class="form-group">
+                            <label>📝 今天做了什么？</label>
+                            <textarea id="completedTasks" placeholder="记录今天完成的任务和工作..." rows="4">${existingDiary ? existingDiary.completed_tasks : ''}</textarea>
                         </div>
-                        ${task.description ? `<div class="description"><strong>描述：</strong><br>${task.description}</div>` : ''}
                         
-                        <h3 style="margin-top: 25px; margin-bottom: 15px;">📅 任务进展日历</h3>
-                        <p style="color: #666; margin-bottom: 15px; font-size: 0.9em;">点击日历查看当日的任务记录</p>
-                        <div class="calendar-wrapper">
-                            ${calendarHtml}
-                            <div class="content-area">
-                                <div class="task-detail" style="background: white; border: 1px solid #e0e7ff;">
-                                    <h4 style="color: #667eea; margin-bottom: 10px;">📝 ${state.selectedDate} 的进展记录</h4>
-                                    ${selectedDateProgress ? `
-                                        <div class="progress-notes" style="background: #f8f9fa;">
-                                            <div class="note" style="white-space: pre-wrap;">${selectedDateProgress}</div>
-                                        </div>
-                                    ` : `
-                                        <div class="empty-state" style="padding: 20px;">
-                                            <p style="color: #999;">${state.selectedDate} 暂无记录</p>
-                                        </div>
-                                    `}
-                                </div>
-                            </div>
+                        <div class="form-group">
+                            <label>📚 学到了什么？</label>
+                            <textarea id="learned" placeholder="新的知识、技能、感悟..." rows="3">${existingDiary ? existingDiary.learned : ''}</textarea>
                         </div>
-                    </div>
-                </div>
-            `;
-        }
-
-        function renderDiaryView() {
-            const entry = getEntryByDate(state.selectedDate);
-            const entryDates = state.allEntries.map(e => e.date);
-            const current = state.currentCalendar || new Date();
-            const calendarHtml = renderCalendar(current.getFullYear(), current.getMonth(), state.selectedDate, entryDates);
-
-            return `
-                <div class="tabs">
-                    <button class="tab-btn" onclick="switchTab('tasks')">📋 工作任务</button>
-                    <button class="tab-btn active" onclick="switchTab('diary')">📝 日记</button>
-                    <button class="tab-btn" onclick="switchTab('experiences')">💡 经验总结</button>
-                </div>
-
-                <div class="section-box">
-                    <h2>📝 日记</h2>
-                    <p style="color: #666; margin-bottom: 15px; font-size: 0.9em;">点击日历选择日期查看日记</p>
-                    <div class="calendar-wrapper">
-                        ${calendarHtml}
-                        <div class="content-area">
-                            ${!entry ? `
-                                <div class="empty-state">
-                                    <p>📅 ${state.selectedDate} 没有日记</p>
-                                    <p style="margin-top: 10px; font-size: 0.9em; color: #999;">点击日历选择其他日期</p>
-                                </div>
-                            ` : `
-                                <div class="diary-item" style="cursor: default;">
-                                    <div class="header">
-                                        <span class="title">${entry.title || '每日日记'}</span>
-                                        <span class="date">${entry.date}</span>
+                        
+                        <div class="form-group">
+                            <label>🔗 关联任务（自动更新进展）</label>
+                            <div style="max-height: 200px; overflow-y: auto; border: 1px solid #e0e7ff; border-radius: 6px; padding: 10px;">
+                                ${state.allTasks.filter(t => t.status !== 'completed').map(task => `
+                                    <div class="task-link-item">
+                                        <input type="checkbox" id="task-${task.id}" ${existingDiary && existingDiary.linked_tasks?.some(t => t.id === task.id) ? 'checked' : ''}>
+                                        <div class="task-info">
+                                            <div class="task-title">${task.title}</div>
+                                            <div style="font-size: 0.85em; color: #666;">当前进展：${task.progress_percent}%</div>
+                                        </div>
+                                        <span class="task-status">${task.status_display}</span>
                                     </div>
-                                    ${entry.completed_tasks ? `
-                                        <div class="section">
-                                            <span class="section-title">✅ 完成的任务</span>
-                                            <div class="section-content">${entry.completed_tasks}</div>
-                                        </div>
-                                    ` : ''}
-                                    ${entry.learned ? `
-                                        <div class="section">
-                                            <span class="section-title">📚 学到的东西</span>
-                                            <div class="section-content">${entry.learned}</div>
-                                        </div>
-                                    ` : ''}
-                                    ${entry.problems ? `
-                                        <div class="section">
-                                            <span class="section-title">🐛 遇到的问题</span>
-                                            <div class="section-content">${entry.problems}</div>
-                                        </div>
-                                    ` : ''}
-                                    ${entry.reflections ? `
-                                        <div class="section">
-                                            <span class="section-title">💡 想法和反思</span>
-                                            <div class="section-content">${entry.reflections}</div>
-                                        </div>
-                                    ` : ''}
-                                    ${entry.improvements ? `
-                                        <div class="section">
-                                            <span class="section-title">📈 进步点</span>
-                                            <div class="section-content">${entry.improvements}</div>
-                                        </div>
-                                    ` : ''}
-                                    ${entry.plans ? `
-                                        <div class="section">
-                                            <span class="section-title">🎯 明日计划</span>
-                                            <div class="section-content">${entry.plans}</div>
-                                        </div>
-                                    ` : ''}
-                                </div>
-                            `}
+                                `).join('')}
+                            </div>
                         </div>
+                        
+                        <div class="form-group">
+                            <label>💡 想法和反思</label>
+                            <textarea id="reflections" placeholder="今天的思考、反思、改进想法..." rows="3">${existingDiary ? existingDiary.reflections : ''}</textarea>
+                        </div>
+                        
+                        <div class="form-group">
+                            <label>📈 进步点</label>
+                            <textarea id="improvements" placeholder="今天在哪些方面有进步？" rows="2">${existingDiary ? existingDiary.improvements : ''}</textarea>
+                        </div>
+                        
+                        <div class="form-group">
+                            <label>🎯 明日计划</label>
+                            <textarea id="plans" placeholder="明天打算做什么？" rows="2">${existingDiary ? existingDiary.plans : ''}</textarea>
+                        </div>
+                        
+                        <button class="btn" onclick="saveDiary()">💾 保存日记</button>
+                        ${existingDiary ? `<button class="btn btn-secondary" onclick="extractExperience()">✨ 提炼经验</button>` : ''}
                     </div>
                 </div>
             `;
         }
 
-        function renderExperiencesView() {
+        function renderHistoryTab() {
             return `
-                <div class="tabs">
-                    <button class="tab-btn" onclick="switchTab('tasks')">📋 工作任务</button>
-                    <button class="tab-btn" onclick="switchTab('diary')">📝 日记</button>
-                    <button class="tab-btn active" onclick="switchTab('experiences')">💡 经验总结</button>
-                </div>
-
                 <div class="section-box">
-                    <h2>💡 经验总结</h2>
-                    ${state.allExperiences.length === 0 ? `
-                        <div class="empty-state">
-                            <p>暂无经验总结</p>
-                        </div>
-                    ` : state.allExperiences.map(exp => `
-                        <div class="experience-item">
-                            <div class="header">
-                                <span class="title">${exp.title}</span>
-                                <span class="category">${exp.category}</span>
-                            </div>
-                            <div class="problem">
-                                <div class="problem-title">🐛 问题</div>
-                                <div class="section-content">${exp.problem}</div>
-                            </div>
-                            <div class="solution">
-                                <div class="solution-title">✅ 解决方案</div>
-                                <div class="section-content">${exp.solution}</div>
-                            </div>
-                            ${exp.lesson_learned ? `
-                                <div class="lesson">
-                                    <div class="lesson-title">📌 经验教训</div>
-                                    <div class="section-content">${exp.lesson_learned}</div>
+                    <h2>📖 日记历史</h2>
+                    ${state.allDiaries.length === 0 ? '<div class="empty-state">暂无日记</div>' : state.allDiaries.map(diary => `
+                        <div class="diary-item">
+                            <div class="date">${diary.date}</div>
+                            ${diary.completed_tasks ? `
+                                <div class="section">
+                                    <div class="section-title">✅ 完成的任务</div>
+                                    <div class="section-content">${diary.completed_tasks}</div>
+                                </div>
+                            ` : ''}
+                            ${diary.learned ? `
+                                <div class="section">
+                                    <div class="section-title">📚 学到的东西</div>
+                                    <div class="section-content">${diary.learned}</div>
+                                </div>
+                            ` : ''}
+                            ${diary.reflections ? `
+                                <div class="section">
+                                    <div class="section-title">💡 想法和反思</div>
+                                    <div class="section-content">${diary.reflections}</div>
+                                </div>
+                            ` : ''}
+                            ${diary.linked_tasks && diary.linked_tasks.length > 0 ? `
+                                <div class="linked-tasks">
+                                    <div class="section-title">🔗 关联任务</div>
+                                    ${diary.linked_tasks.map(task => `<span class="tag">${task.title}</span>`).join('')}
+                                </div>
+                            ` : ''}
+                            ${diary.experiences && diary.experiences.length > 0 ? `
+                                <div class="linked-experiences">
+                                    <div class="section-title">💡 提炼经验</div>
+                                    ${diary.experiences.map(exp => `<span class="tag" style="background: #fef3c7; color: #92400e;">${exp.title}</span>`).join('')}
                                 </div>
                             ` : ''}
                         </div>
@@ -846,75 +445,115 @@
             `;
         }
 
-        function render() {
-            const app = document.getElementById('app');
-            
-            let content = '';
-            if (state.currentTab === 'tasks') {
-                content = renderTasksView();
-            } else if (state.currentTab === 'diary') {
-                content = renderDiaryView();
-            } else {
-                content = renderExperiencesView();
-            }
-
-            app.innerHTML = `
-                <div class="stats">
-                    <div class="stat-card">
-                        <h3>${state.diaryStats.total_entries || 0}</h3>
-                        <p>总日记</p>
-                    </div>
-                    <div class="stat-card">
-                        <h3>${state.taskStats.total || 0}</h3>
-                        <p>总任务</p>
-                    </div>
-                    <div class="stat-card">
-                        <h3>${state.taskStats.in_progress || 0}</h3>
-                        <p>进行中</p>
-                    </div>
-                    <div class="stat-card">
-                        <h3>${state.taskStats.completed || 0}</h3>
-                        <p>已完成</p>
-                    </div>
-                    <div class="stat-card">
-                        <h3>${state.taskStats.completion_rate || 0}%</h3>
-                        <p>完成率</p>
-                    </div>
-                    <div class="stat-card">
-                        <h3>${state.expStats.total_experiences || 0}</h3>
-                        <p>经验</p>
-                    </div>
+        function renderTasksTab() {
+            return `
+                <div class="section-box">
+                    <h2>📋 所有任务</h2>
+                    ${state.allTasks.length === 0 ? '<div class="empty-state">暂无任务</div>' : state.allTasks.map(task => `
+                        <div class="diary-item" style="border-left-color: ${task.status === 'completed' ? '#10b981' : '#667eea'}">
+                            <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
+                                <div class="task-title" style="font-size: 1.1em;">${task.title}</div>
+                                <span class="task-status">${task.status_display}</span>
+                            </div>
+                            <div style="font-size: 0.9em; color: #666; margin-bottom: 10px;">
+                                优先级：${task.priority_display} | 进展：${task.progress_percent}%
+                            </div>
+                            ${task.diary_entries && task.diary_entries.length > 0 ? `
+                                <div class="linked-tasks">
+                                    <div class="section-title">📝 关联日记</div>
+                                    ${task.diary_entries.map(d => `<span class="tag">${d.date}</span>`).join('')}
+                                </div>
+                            ` : ''}
+                        </div>
+                    `).join('')}
                 </div>
+            `;
+        }
 
-                ${content}
+        function renderExperiencesTab() {
+            return `
+                <div class="section-box">
+                    <h2>💡 经验总结</h2>
+                    ${state.allExperiences.length === 0 ? '<div class="empty-state">暂无经验总结</div>' : state.allExperiences.map(exp => `
+                        <div class="experience-item">
+                            <div class="category">${exp.category_display}</div>
+                            <div class="title">${exp.title}</div>
+                            <div style="margin: 10px 0;"><strong>🐛 问题：</strong>${exp.problem}</div>
+                            <div style="margin: 10px 0;"><strong>✅ 解决：</strong>${exp.solution}</div>
+                            ${exp.lesson_learned ? `<div style="margin: 10px 0; padding: 10px; background: #fef3c7; border-radius: 5px;"><strong>📌 教训：</strong>${exp.lesson_learned}</div>` : ''}
+                        </div>
+                    `).join('')}
+                </div>
             `;
         }
 
         function switchTab(tab) {
             state.currentTab = tab;
-            state.selectedTask = null;
             render();
         }
 
-        function selectDate(date) {
-            state.selectedDate = date;
-            render();
-        }
+        async function saveDiary() {
+            const today = state.selectedDate;
+            const existingDiary = state.allDiaries.find(d => d.date === today);
+            
+            const data = {
+                date: today,
+                title: '每日日记',
+                completed_tasks: document.getElementById('completedTasks').value,
+                learned: document.getElementById('learned').value,
+                reflections: document.getElementById('reflections').value,
+                improvements: document.getElementById('improvements').value,
+                plans: document.getElementById('plans').value
+            };
 
-        function selectTask(taskId) {
-            state.selectedTask = state.allTasks.find(t => t.id === taskId);
-            render();
-        }
+            const linkedTaskIds = state.allTasks
+                .filter(task => document.getElementById(`task-${task.id}`)?.checked)
+                .map(task => task.id);
 
-        function changeMonth(delta) {
-            if (!state.currentCalendar) {
-                state.currentCalendar = new Date();
+            try {
+                let response;
+                if (existingDiary) {
+                    response = await fetch(`${API_BASE}/entries/${existingDiary.id}/`, {
+                        method: 'PUT',
+                        headers: { 'Content-Type': 'application/json' },
+                        body: JSON.stringify(data)
+                    });
+                } else {
+                    response = await fetch(`${API_BASE}/entries/`, {
+                        method: 'POST',
+                        headers: { 'Content-Type': 'application/json' },
+                        body: JSON.stringify(data)
+                    });
+                }
+
+                const diary = await response.json();
+                
+                // 关联任务
+                for (const taskId of linkedTaskIds) {
+                    await fetch(`${API_BASE}/entries/${diary.id}/link_task/`, {
+                        method: 'POST',
+                        headers: { 'Content-Type': 'application/json' },
+                        body: JSON.stringify({ task_id: taskId, progress_percent: 100, notes: '日记中完成' })
+                    });
+                }
+
+                alert('✅ 日记已保存！关联任务已自动更新进展。');
+                loadData();
+                switchTab('history');
+            } catch (error) {
+                alert('保存失败：' + error.message);
             }
-            state.currentCalendar.setMonth(state.currentCalendar.getMonth() + delta);
-            render();
         }
 
-        // 初始化
+        function extractExperience() {
+            const reflections = document.getElementById('reflections').value;
+            if (!reflections) {
+                alert('请先写一些反思内容');
+                return;
+            }
+            alert('💡 功能开发中：选择反思内容，一键提炼为经验总结');
+        }
+
         loadData();
     </script>
 </body>
diff --git a/migrate_linking.py b/migrate_linking.py
new file mode 100644
index 0000000..5bf7eec
--- /dev/null
+++ b/migrate_linking.py
@@ -0,0 +1,19 @@
+#!/usr/bin/env python3
+"""创建关联功能的数据库迁移"""
+import os
+import sys
+import django
+
+os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'diary_system.settings')
+sys.path.insert(0, os.path.join(os.path.dirname(__file__), 'backend'))
+django.setup()
+
+from django.core.management import call_command
+
+print("📦 创建迁移...")
+call_command('makemigrations', 'diary')
+
+print("🗄️  执行迁移...")
+call_command('migrate')
+
+print("✅ 迁移完成！")