112 lines
3.4 KiB
Markdown
112 lines
3.4 KiB
Markdown
# 🚀 ChatOA 一站式 IM + OA 办公客户端新鲜上线
|
||
|
||
> 一个基于 Electron + React + NestJS 的即时通讯办公套件原型，把聊天、日程、表单、笔记、应用、网盘、AI 助手整合在一个工作台里。
|
||
|
||
---
|
||
|
||
## 📌 一句话定位
|
||
|
||
把企业最常用的 8 个高频场景装进同一个客户端：打开即聊、顺手审批、随时记录、一键找文件——让协作从反复切窗口变成只切一个侧边栏。
|
||
|
||
---
|
||
|
||
## 🖼️ 界面速览
|
||
|
||
### 1️⃣ 即时聊天
|
||
- 左侧会话列表 + 右侧对话窗口
|
||
- 顶部支持搜索会话、置顶、查看聊天记录
|
||
- 用户名后展示部门/职位，在线状态用彩色圆点
|
||
- 输入框支持图片、文件、单据、日程、云盘文件、笔记、表情、截图等快捷插入
|
||
|
||
|
||
|
||
### 2️⃣ 联系人
|
||
- 同事 / AI 助手 / 朋友 三栏分组
|
||
- 支持添加好友、在线人数徽章常驻底部
|
||
|
||
|
||
|
||
### 3️⃣ 日程
|
||
- 左侧小型月历 + 右侧事件列表
|
||
- 支持新建/编辑/删除日程
|
||
|
||
|
||
|
||
### 4️⃣ 表单
|
||
- 自定义表单模板：请假申请、会议室预约、办公室借用、公车借用、报销申请
|
||
- 模板库 + 我的实例，审批状态一目了然
|
||
|
||
|
||
|
||
### 5️⃣ 笔记（原知识库）
|
||
- 多级目录 + 笔记的树形结构
|
||
- 单击目录仅展开/选中，单击笔记进入编辑
|
||
- 标题、内容、标签自动保存
|
||
|
||
|
||
|
||
### 6️⃣ 应用
|
||
- 九宫格应用入口，支持应用搜索
|
||
- 预留第三方应用扩展位
|
||
|
||
|
||
|
||
### 7️⃣ 网盘
|
||
- 本机文件 / 我的文件 / 团队文件 / 系统文件 / 分享文件 / 回收站
|
||
- 面包屑导航、新建文件夹、上传、删除、还原、彻底删除
|
||
|
||
|
||
|
||
### 8️⃣ AI 助手
|
||
- 主导航独立入口，排在聊天之后
|
||
- 支持多模型切换（GPT-4o / Claude 3.5 / DeepSeek / 通义千问 / 豆包）
|
||
- 可插入图片、文件、表单，纯前端模拟对话
|
||
|
||
|
||
|
||
---
|
||
|
||
## ✨ 近期重点增强
|
||
|
||
- **商务化卡片**：聊天中发送的表单、日程、云盘文件、笔记不再是一串文字，而以公文信函、日历卡、文件卡、便签样式呈现；表单卡片更可点开详情并直接「同意 / 驳回」审批。
|
||
- **状态持久化**：审批结果写进 `localStorage`，刷新页面也不丢；会话列表同步显示处理状态。
|
||
- **统一标题区**：8 大页面左侧标题全部 52px + 图标 + 600 字重，右侧横线对齐，视觉更整齐。
|
||
|
||
---
|
||
|
||
## 🛠️ 技术栈
|
||
|
||
| 层级 | 技术 |
|
||
|------|------|
|
||
| 桌面端 | Electron + Vite |
|
||
| 前端 | React 18 + TypeScript + Ant Design 5 |
|
||
| 状态 | Zustand + Socket.IO 客户端 |
|
||
| 后端 | NestJS 11 + TypeScript + JWT + Socket.IO |
|
||
| 数据 | JSON 文件持久化（预留 Mongo/Redis 配置） |
|
||
|
||
---
|
||
|
||
## 📂 项目位置
|
||
|
||
`C:\Users\范先生\CodeBuddy\ChatOA`
|
||
|
||
服务端：`server/`
|
||
客户端：`client/`
|
||
截图：`screenshots/`
|
||
|
||
---
|
||
|
||
## 💡 下一步可以做的
|
||
|
||
- [ ] 接入真实大模型 API（OpenAI / Claude / 豆包等）
|
||
- [ ] 表单流程接入后端实例审批链路
|
||
- [ ] 网盘接入 OSS / 本地文件同步
|
||
- [ ] 移动端响应式适配
|
||
- [ ] 消息已读回执、撤回、引用
|
||
|
||
---
|
||
|
||
**#ChatOA #即时通讯 #OA办公 #Electron #React #NestJS #AI助手 #项目分享**
|
||
|
||
> 更多详情可查看项目 README 与需求文档。
|