# MyNote

**Repository Path**: newpc/my-note

## Basic Information

- **Project Name**: MyNote
- **Description**: 一个为考公复习场景定制的笔记应用。核心诉求是“快速做题 + 一键清屏”。相较于 OneNote 等工具，本项目支持在画布上快速草稿演算，做完一题后可以一键清空画面，而不需要用橡皮一点点擦。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-12-09
- **Last Updated**: 2025-12-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# MyNote：学习场景的笔记与草稿工具

一个为学习场景定制的笔记应用。核心诉求是“快速做题 + 一键清屏”。相较于 OneNote 等工具，本项目支持在画布上快速草稿演算，做完一题后可以一键清空画面，而不需要用橡皮一点点擦。

功能持续完善中

## 作用与目的

- 面向学习场景的“题目+草稿”场景，提升解题效率。
- 在 PDF/图片等资料上直接标注，同时右侧留出备注区做独立笔记。
- 支持一键清屏、自动保存与历史版本还原，避免误操作。

## 功能亮点

- 一键清屏：做完一题立即清空画布，开始下一题。
- 文件导入：支持 PDF/图片导入，内容居中铺满宽度，支持滚动与缩放。
- 备注笔记区：文件右侧可弹出笔记区，独立保存与历史记录，便于摘录要点。
- 历史记录：主画布和备注笔记都会保存版本，可预览与还原（最多 50 条）。
- 背景护眼色：白/灰/黄/绿快速切换，新建与已有笔记都可调整。
- 导航简化：分组与笔记列表，左侧支持折叠展开。
- 文件删除联动：删除笔记时，关联上传文件一并删除。
- 大 PDF 优化：使用本地 pdfjs worker、Blob URL 与批渲染，降低卡顿与内存占用。
- 计时器：支持计时/倒计时、语音提醒、暂停/继续。

## 效果展示

![历史记录](assets/历史记录.png)

![绘制效果](assets/绘制效果.png)

![背景色与清空画布](assets/背景色-清空画布.png)

![计时器](assets/计时器.png)

## ![倒计时](assets/倒计时.png)

## 快速开始（开发模式）

### 后端（Flask）

1. 进入后端目录：
   ```powershell
   cd backend
   ```
2. 建议创建并激活虚拟环境（可选）：
   ```powershell
   python -m venv venv
   .\venv\Scripts\activate
   ```
3. 安装依赖：
   ```powershell
   pip install -r requirements.txt
   ```
4. 初始化数据库（首次运行需要）：
   ```powershell
   $env:FLASK_APP = 'run.py'
   flask db upgrade
   ```
5. 创建默认管理员账号（admin / note@123）：
   ```powershell
   python create_admin.py
   ```
6. 启动后端：
   ```powershell
   python run.py
   ```
   - 默认端口：`http://localhost:5000`

### 前端（Vue 3 + Vite + Element Plus）

1. 进入前端目录：
   ```powershell
   cd frontend
   ```
2. 安装依赖（Node.js ≥ 18）：
   ```powershell
   npm install
   ```
3. 启动前端开发服务器：
   ```powershell
   npm run dev
   ```
   - 默认端口：`http://localhost:5173`

> 前端会直接请求后端 `http://localhost:5000/api/...`（后端已启用 CORS），前后端分开启动即可开发。

---

## 生产部署（静态托管）

1. 前端打包：
   ```powershell
   cd frontend
   npm run build
   ```
   会生成 `dist/` 目录。
2. 将打包产物复制到后端静态目录：
   - 后端静态目录：`backend/static`
   - 将 `frontend/dist` 的全部内容拷贝到 `backend/static`。
3. 启动后端：
   ```powershell
   cd backend
   python run.py
   ```
   - 后端会作为静态服务器直接返回前端页面（`routes.py` 已配置）。

---

## 常用说明

- 管理员账号：`admin / note@123`（可在 `backend/create_admin.py` 修改）。
- 修改后端端口：`backend/run.py` 中 `app.run(debug=True, port=5000)`。
- 上传大小限制：`backend/app/config.py:MAX_CONTENT_LENGTH`（默认约 200MB）。如遇 413，可适当增大或检查代理限制。
- PDF 加载卡顿：项目已使用本地 worker + Blob + 批渲染优化；如仍卡顿，可考虑进一步分页懒加载（滚动到可视区域时再渲染）。
- 历史记录：主画布与备注笔记都会进入版本；预览时不覆盖当前内容，点“还原”才生效。
- 一键清屏：在画笔工具栏提供清空按钮，适合做题后快速进入下一题。

## 计时器工具

- 入口：主页左侧切换至“工具”，选择“计时器”。
- 模式：
  - 计时（秒表）：支持开始、暂停、继续、结束、重置；按“间隔提醒”播报已用时。
  - 倒计时：设置目标时间（分、秒）；支持开始、暂停、继续、结束、重置；结束自动语音提醒。
- 语音提醒：
  - 间隔提醒（两种模式通用）：按设定的分钟+秒周期播报。计时模式播报“已用时”，倒计时模式播报“还剩多久”。
  - 剩余间隔提醒（倒计时）：按照“剩余时间每 X 分钟/秒”分档触发语音提醒，随剩余时间逐档提醒。
  - 阈值提醒（倒计时）：当剩余时间小于等于指定阈值（分+秒）时提醒一次。
  - 语音内容可自定义，用于作为提醒前缀。
- 目标时间与间隔单位：全部支持“分钟 + 秒”精确配置。
- 可视化：倒计时采用圆环进度 + 中心数字；计时采用大号数字显示。
- 浏览器要求：基于 Web Speech API（SpeechSynthesis）。如首次无声音，可点击页面任意处再试或检查系统/浏览器音量与权限。

---

## 目录结构（简要）

```
mynote/
├── backend/                # Flask 后端
│   ├── app/                # 应用与模型
│   ├── migrations/         # 数据库迁移
│   ├── static/             # 生产环境前端静态资源
│   ├── create_admin.py     # 创建默认管理员
│   └── run.py              # 启动后端服务（5000端口）
└── frontend/               # Vue 3 + Vite 前端
    ├── src/                # 前端源码
    └── package.json        # 前端脚本（dev/build/preview）
```

---

## 目标愿景

围绕“快速做题、快速清屏、立即保存、随时还原”的体验持续打磨，减少操作成本，避免内容丢失，让复习更专注更高效。