# claw-office

**Repository Path**: ai_1024/claw-office

## Basic Information

- **Project Name**: claw-office
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-04-02
- **Last Updated**: 2026-04-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Claw Office

OpenClaw 游戏化桌面监控仪表盘 — 一个基于 Tauri 2.x 的跨平台桌面应用，以像素风格游戏界面实时展示 Agent 系统的运行状态。

## 功能特性

- **像素风格游戏界面** — 基于 Phaser 3 引擎的复古像素风格办公室场景
- **实时状态监控** — WebSocket 连接 Gateway，实时接收 Agent 状态更新
- **多 Agent 管理** — 支持 Agent、Sub-Agent 层级结构的可视化展示
- **会话与消息追踪** — 查看会话列表、消息流、工具调用详情
- **主题切换** — 支持亮色/暗色主题
- **离线消息缓存** — 本地存储历史消息，支持快速检索

## 技术栈

| 技术                                          | 版本 | 用途                   |
| --------------------------------------------- | ---- | ---------------------- |
| [Tauri](https://tauri.app/)                   | 2.x  | 跨平台桌面应用框架     |
| [React](https://react.dev/)                   | 18.x | UI 组件框架            |
| [Phaser](https://phaser.io/)                  | 3.x  | 游戏引擎，像素场景渲染 |
| [TypeScript](https://www.typescriptlang.org/) | 5.x  | 类型安全               |
| [Vite](https://vitejs.dev/)                   | 6.x  | 前端构建工具           |
| [Vitest](https://vitest.dev/)                 | 4.x  | 单元测试框架           |

## 开发指南

### 环境要求

- **Node.js** >= 18.x
- **Rust** >= 1.70 (通过 [rustup](https://rustup.rs/) 安装)
- **pnpm** >= 8.x (推荐)

### 快速开始

```bash
# 克隆仓库
git clone https://github.com/openclaw/claw-office.git
cd claw-office

# 安装依赖
pnpm install

# 开发模式（启动前端 + Tauri 窗口）
pnpm tauri:dev

# 仅启动前端开发服务器
pnpm dev
```

### 构建发布

```bash
# 构建生产版本
pnpm tauri:build
```

构建产物位于 `src-tauri/target/release/bundle/` 目录。

### 常用脚本

```bash
pnpm dev          # 启动 Vite 开发服务器
pnpm build        # 构建前端资源
pnpm tauri:dev    # 启动 Tauri 开发模式
pnpm tauri:build  # 构建桌面应用安装包
pnpm lint         # 代码检查
pnpm typecheck    # 类型检查
pnpm test         # 运行测试
```

## 项目结构

```
claw-office/
├── src/                    # 前端源码
│   ├── components/         # React 组件
│   │   ├── chat/           # 聊天/消息相关组件
│   │   └── status/         # 状态展示组件
│   ├── scenes/             # Phaser 游戏场景
│   │   ├── BootScene.ts    # 启动场景
│   │   └── OfficeScene.ts  # 办公室主场景
│   ├── services/           # 业务服务
│   │   ├── gateway-client.ts   # WebSocket 客户端
│   │   ├── gateway-api.ts      # API 封装
│   │   └── event-bus.ts        # 事件总线
│   ├── stores/             # 状态管理 (React Context)
│   ├── types/              # TypeScript 类型定义
│   └── theme/              # 主题配置
├── src-tauri/              # Tauri 后端
│   ├── src/                # Rust 源码
│   ├── Cargo.toml          # Rust 依赖配置
│   └── tauri.conf.json     # Tauri 配置
├── public/                 # 静态资源
├── package.json            # 项目配置
└── vite.config.ts          # Vite 配置
```

## 配置说明

### 环境变量

复制 `.env.example` 为 `.env` 并配置：

```bash
VITE_GATEWAY_URL=ws://127.0.0.1:18789
VITE_AUTH_TOKEN=your-auth-token
```

| 变量               | 说明                   | 默认值                 |
| ------------------ | ---------------------- | ---------------------- |
| `VITE_GATEWAY_URL` | Gateway WebSocket 地址 | `ws://127.0.0.1:18789` |
| `VITE_AUTH_TOKEN`  | 认证令牌               | -                      |

## 截图

<!-- TODO: 添加应用截图 -->

## 许可证

MIT License

## 贡献

欢迎提交 Issue 和 Pull Request！详见 [CONTRIBUTING.md](./CONTRIBUTING.md)