【Code With SOLO】用 SOLO 开发一个支持局域网和悬浮窗的同步任务追踪系统

1. 摘要

用 TRAE SOLO 快速开发了一个桌面任务管理应用,实现了 Windows 登录账户自动识别、局域网用户任务同步、60×60 悬浮窗等功能,解决了团队内部任务分配和跟踪的问题。

2. 背景

我是一名PM,团队日常需要分配和跟踪任务,现有工具要么太复杂,要么需要服务器。我希望有一个轻量级的桌面应用,能直接读取 Windows 登录账户,支持局域网任务同步,而且界面友好。

3. 实践过程

任务拆解

  1. 基础框架搭建:使用 Electron 构建桌面应用

  2. 用户识别:通过 Node.js os 模块读取 Windows 登录用户名

  3. 任务管理:使用 localStorage 持久化任务数据

  4. 局域网同步:通过 UDP 广播实现任务同步

  5. 悬浮窗设计:实现 60×60 悬浮图标,点击展开完整内容

关键代码

  • [main.js](file:///workspace/windows-app/release/win-unpacked/resources/app/main.js) - Electron 主进程,窗口管理和 UDP 通信

  • [index.html](file:///workspace/windows-app/release/win-unpacked/resources/app/index.html) - 界面和交互逻辑

踩过的坑

  1. asar 打包问题:最初使用默认 asar 打包,导致无法启动,改成非 asar 格式解决

  2. TypeScript 编译:直接用纯 JS 实现,避免复杂的 TS 配置

  3. 鼠标事件丢失:收起窗口时设置了 setIgnoreMouseEvents(true),导致悬浮后无法展开,后来移除了这个调用

4. 成果展示

最终产品是一个完整的 Windows 桌面应用,包含以下功能:

:white_check_mark: 自动读取 Windows 登录账户作为默认用户
:white_check_mark: 创建、编辑、删除任务,支持任务分配
:white_check_mark: 任务状态管理(待处理 / 进行中 / 已完成)
:white_check_mark: 用户管理功能(手动添加其他用户)
:white_check_mark: 60×60 悬浮窗模式,点击展开/收起
:white_check_mark: 局域网任务自动同步(UDP 广播)
:white_check_mark: 完全中文界面

5. 效果与总结

原本团队开发这个应用可能需要一到两周,用 SOLO 几个小时就完成了!SOLO 在以下环节帮了大忙:

  1. 代码生成:直接生成了完整的 Electron 应用结构

  2. 错误修复:快速定位并解决了启动问题

  3. 迭代优化:从 Chrome 插件→桌面应用→悬浮窗,一步步完善功能

这是一个完全可复用的快速开发模式,下次开发类似桌面应用,直接用同样的流程!

1 个赞

局域网同步用UDP广播……emmm如果跨网段或者网络拓扑复杂的话,估计会丢一批同步吧?不过本地小团队用用确实够了。

1 个赞