修复刷新按钮宽度抖动:改用固定 width:120px

- min-width 改为固定 width:120px,容纳最长文案'↻ 同步中...'
- transition 从 all 改为仅 color/border/opacity,避免宽度动画
- 添加 box-sizing:border-box 确保 padding 不撑大按钮
This commit is contained in:
admin committed 2026-07-17 13:24:13 +08:00
1 parent 7bc02075bd
commit baeda63646
2 files changed
+25 -2

No files matched your search

+22
View File
@@ -114,3 +114,25 @@
- KeepAlive=true: 崩溃自动重启 - KeepAlive=true: 崩溃自动重启
- RunAtLoad=true: 开机自动启动 - RunAtLoad=true: 开机自动启动
- 需要用户在终端手动执行 launchctl load 加载 - 需要用户在终端手动执行 launchctl load 加载
## 13:19 刷新按钮支持完整数据同步
### 问题
- 之前刷新按钮只从 MySQL 重新读取,数据不会变(用户新增书后看不到变化)
- 按钮宽度因文字变化抖动
### 解决方案
- app.py 新增 `/api/sync` POST 接口:
- 运行 fetch_data.py(微信读书API → SQLite)
- 运行 migrate_to_mysql.py(SQLite → MySQL)
- 返回每步结果和状态
- refreshShelf() 改为:先 POST /api/sync → 再 loadShelfCategories + loadShelf
- 按钮三阶段文案:同步中... → 加载中... → 刷新
- CSS min-width:96px 防止宽度抖动
- launchd plist 和 start_server.sh 均注入 WEREAD_API_KEY
### 数据流
微信读书API → fetch_data.py → weread.db(SQLite) → migrate_to_mysql.py → MySQL → app.py → 前端
### 测试验证
- /api/sync 返回 ok:true,406本书同步成功
+3 -2
View File
@@ -774,10 +774,11 @@ body {
color: var(--text-secondary); color: var(--text-secondary);
background: var(--bg-card); background: var(--bg-card);
cursor: pointer; cursor: pointer;
transition: all 0.2s; transition: color 0.2s, border-color 0.2s, opacity 0.2s;
white-space: nowrap; white-space: nowrap;
min-width: 96px; width: 120px;
text-align: center; text-align: center;
box-sizing: border-box;
} }
.shelf-refresh-btn:hover:not(:disabled) { .shelf-refresh-btn:hover:not(:disabled) {