# desktop-widget-app-demo2

**Repository Path**: yunianvh/desktop-widget-app-demo2

## Basic Information

- **Project Name**: desktop-widget-app-demo2
- **Description**: 桌面挂件2
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-08-22
- **Last Updated**: 2025-11-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 桌面挂件应用

这是一个基于Electron开发的桌面挂件应用，支持个人任务管理、工位状态展示及团队协作功能。

## 功能特性

### 1. 桌面挂件管理
- 在桌面任意位置添加、删除、移动和调整大小的挂件
- 支持样式自定义（透明度、颜色、字体等）
- 顶层窗口（Topmost Window）、窗口穿透/透明效果

### 2. 工位状态管理
- 预设状态：工作中、会议中、休息中、免打扰等
- 支持自定义状态标签和颜色
- 状态切换快捷操作

### 3. 任务列表管理
- 每日任务创建、编辑、删除功能
- 任务属性：标题、描述、进度状态、优先级、时间安排
- 任务排序和筛选功能

### 4. 报告生成
- 一键生成日报、周报、月报
- 支持复制文本或截图分享
- 导出为文本文件或Markdown格式

### 5. 局域网分享
- 支持局域网部署
- 提供本地数据存储能力
- 支撑局域网内分享给任意人员，点击打开后可以看到分享人的信息、工位状态、任务进度

## 安装依赖

```bash
npm install
```

## 运行应用

```bash
npm start
```

## 开发模式

```bash
npm run dev
```

## 构建应用

```bash
npm run build
```

## 使用说明

1. **启动应用**：运行`npm start`启动桌面挂件应用
2. **管理挂件**：
   - 点击挂件标题栏可以拖拽移动
   - 点击右下角的调整手柄可以调整挂件大小
   - 点击"新建挂件"按钮可以创建多个挂件
3. **设置状态**：
   - 点击"切换状态"按钮可以循环切换工位状态
   - 点击"管理状态"按钮可以添加自定义状态
4. **管理任务**：
   - 点击"添加任务"或"管理任务"按钮可以管理任务列表
   - 支持添加、编辑、删除和标记任务完成状态
5. **生成报告**：
   - 点击"日报"、"周报"或"月报"按钮可以生成相应报告
   - 支持预览、导出和复制报告内容
6. **局域网分享**：
   - 点击挂件标题栏的🌐按钮可以打开分享管理界面
   - 填写个人信息后点击"开始分享"即可开启局域网分享
   - 其他用户可以通过提供的URL访问您的信息

## 技术栈

- **Electron**：跨平台桌面应用框架
- **HTML/CSS/JavaScript**：前端界面开发
- **Express**：局域网分享服务端
- **Socket.IO**：实时数据通信
- **LocalStorage**：本地数据存储

## 项目结构

```
desktop-widget-app/
├── src/
│   ├── main.js              # 主进程
│   ├── renderer.js          # 渲染进程
│   ├── index.html           # 主界面
│   ├── settings.html        # 设置界面
│   ├── statusManager.html   # 状态管理界面
│   ├── taskManager.html     # 任务管理界面
│   ├── reportGenerator.html # 报告生成界面
│   ├── shareManager.html    # 分享管理界面
│   ├── statusManager.js     # 状态管理模块
│   ├── taskManager.js       # 任务管理模块
│   ├── reportGenerator.js   # 报告生成模块
│   └── networkManager.js    # 网络通信模块
├── styles/
│   ├── main.css             # 主界面样式
│   ├── settings.css         # 设置界面样式
│   ├── statusManager.css    # 状态管理界面样式
│   ├── taskManager.css      # 任务管理界面样式
│   ├── reportGenerator.css  # 报告生成界面样式
│   └── shareManager.css     # 分享管理界面样式
├── public/
│   ├── index.html           # 分享页面
│   ├── styles.css           # 分享页面样式
│   └── script.js            # 分享页面脚本
├── package.json             # 项目配置
└── README.md                # 项目说明
```

## 开发计划

- [x] 实现桌面挂件核心功能（添加、删除、移动、调整大小）
- [x] 实现样式自定义功能（透明度、颜色、字体等）
- [x] 实现工位状态管理功能
- [x] 实现任务列表管理功能
- [x] 实现报告生成功能
- [x] 实现局域网分享功能
- [x] 测试和优化应用性能

## 注意事项

1. 应用默认使用3000端口进行局域网分享，如端口被占用会自动尝试其他端口
2. 本地数据存储使用LocalStorage，数据保存在浏览器中
3. 分享功能需要确保防火墙允许相应端口的通信