refactor: 提取分配目标模态窗体为共享fragment，实现DRY

docs/DEVELOPMENT.md

@@ -143,6 +143,54 @@ deploy: v1.2.0 生产环境部署
 
 ---
 
+## 代码复用规范（铁律）
+
+### DRY 原则（Don't Repeat Yourself）
+
+> **复制粘贴代码是严重的 Code Smell。任何重复代码必须提取为可复用组件。**
+
+### 前端模板复用
+
+| 场景 | 复用方式 |
+|------|---------|
+| 多个页面共用 Modal | 提取为 `app/templates/fragments/` 下的 Fragment，用 `{% include %}` 引用 |
+| 多个页面共用样式 | 在 `base.html` 或页面级别 `<style>` 中定义 |
+| 多个页面共用 JavaScript 函数 | 提取到 `base.html` 的 `<script>` 或单独 JS 文件 |
+
+### Fragment 提取规范
+
+1. **创建 Fragment 文件**：`app/templates/fragments/{component_name}.html`
+2. **通过 data 属性传递上下文**：
+   ```html
+   <!-- 学员详情用 -->
+   <div id="assignGoalModal" data-student-id="{{ student.id }}">
+   
+   <!-- 班级管理用 -->
+   <div id="assignGoalModal" data-class-id="{{ class.id }}">
+   ```
+3. **JavaScript 读取 data 属性决定行为**：
+   ```javascript
+   const studentId = modalElement.dataset.studentId;
+   const classId = modalElement.dataset.classId;
+   ```
+
+### 检查清单
+
+新增代码前，先问：
+- [ ] 这个 UI 组件是否在其他页面也存在？
+- [ ] 这段 JavaScript 函数是否已有类似实现？
+- [ ] 这个 HTML 结构是否可以直接复用？
+
+如果答案是"是"，**先提取复用组件，再使用**。
+
+### 禁止的行为
+
+❌ 直接复制粘贴另一个页面的 Modal HTML
+❌ 复制粘贴另一个页面的 JavaScript 函数
+❌ 在不同文件里写功能完全相同的函数，仅变量名不同
+
+---
+
 ## 版本历史
 
 | 版本 | 日期 | 说明 |