🔧 chore: 更新依赖并优化聊天UI

- 更新 unocss 和 preset-rem-to-px 从 66.0.0 到 66.5.12 - 调整聊天气泡最大宽度为 90% 以改善显示效果 - 注释掉 rem 转 px 配置 - 添加 .claude 目录到 gitignore
feat(chat): 新增智能助手功能模块
2026-01-12 09:23:41 +08:00 · 2026-01-07 18:03:27 +08:00 · 2026-01-07 09:21:43 +08:00
14 changed files with 2213 additions and 877 deletions
--- a/.gitignore
+++ b/.gitignore
@ -3,6 +3,7 @@ dist
 node_modules
 .eslintcache
 vite.config.*.timestamp*
+.claude

 # MacOS
 .DS_Store
--- a/package.json
+++ b/package.json
@ -15,15 +15,17 @@
    "zip": "powershell -Command \"$timestamp = (Get-Date).ToString('yyyyMMdd-HHmmss'); 7z a -tzip dist/shop-web-$timestamp.zip ./dist/* -xr'!*.zip'\""
  },
  "dependencies": {
+    "@microsoft/fetch-event-source": "2.0.1",
    "@vant/touch-emulator": "1.4.0",
    "axios": "1.7.9",
    "compressorjs": "1.2.1",
    "dayjs": "1.11.13",
    "js-cookie": "3.0.5",
    "lodash-es": "4.17.21",
+    "marked": "17.0.1",
    "normalize.css": "8.0.1",
    "pinia": "3.0.1",
-    "unocss": "66.0.0",
+    "unocss": "66.5.12",
    "vant": "4.9.17",
    "vconsole": "3.15.1",
    "vue": "3.5.13",
@ -35,7 +37,7 @@
    "@types/lodash-es": "4.17.12",
    "@types/node": "22.13.5",
    "@types/nprogress": "0.2.3",
-    "@unocss/preset-rem-to-px": "66.0.0",
+    "@unocss/preset-rem-to-px": "66.5.12",
    "@vant/auto-import-resolver": "1.2.1",
    "@vitejs/plugin-legacy": "6.0.1",
    "@vitejs/plugin-vue": "5.2.1",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/src/common/apis/agent/index.ts
+++ b/src/common/apis/agent/index.ts
@ -0,0 +1,121 @@
+const AGENT_BASE_URL = 'http://115.190.18.84:7328/api/agent';
+// const AGENT_BASE_URL = 'http://localhost:7328/api/agent';
+
+import { useWxStore } from '@/pinia/stores/wx';
+import { fetchEventSource } from '@microsoft/fetch-event-source';
+
+export const baseInfoApi = () => {
+  return fetch(`${AGENT_BASE_URL}`, {
+    method: 'GET',
+  });
+}
+
+/**
+ * 流式对话接口，返回流式 JSON 数据，形如 {"text":"我来"}
+ * @param message 用户消息
+ * @param callbacks 回调函数对象
+ * @param options 可选配置，包含 abort signal
+ * @example
+ * // 使用示例：
+ * streamApi('你好', {
+ *   onopen(response) {
+ *     console.log('连接已建立', response);
+ *   },
+ *   onmessage(data) {
+ *     // data 是服务器发送的原始字符串，如 '{"text":"我来"}'
+ *     console.log('收到消息:', data);
+ *   },
+ *   onclose() {
+ *     console.log('连接已关闭');
+ *   },
+ *   onerror(error) {
+ *     console.error('连接错误:', error);
+ *   }
+ * }, { signal: abortController.signal });
+ */
+export const streamApi = (
+  message: string,
+  callbacks: {
+    onopen?: (response: Response) => void;
+    onmessage?: (data: string) => void;
+    onclose?: () => void;
+    onerror?: (error: Error) => void;
+  },
+  options?: { signal?: AbortSignal; thread?: string; resource?: string }
+) => {
+  const wxStore = useWxStore();
+  const thread = options?.thread;
+  const resource = options?.resource;
+
+  const requestBody: Record<string, any> = {
+    message: `企业微信id：${wxStore.corpid}
+      ${message}`,
+    options: {
+      temperature: 0.8,
+      /* thinking: {
+        type: 'enabled'
+      } */
+    }
+  };
+
+  if (thread && resource) {
+    requestBody.options.memory = {
+      thread,
+      resource
+    };
+  }
+
+  fetchEventSource(`${AGENT_BASE_URL}/stream`, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify(requestBody),
+    signal: options?.signal,
+    async onopen(response) {
+      // 检查响应是否正常
+      if (response.ok && response.headers.get('content-type')?.includes('text/event-stream')) {
+        // 连接成功，调用 onopen 回调
+        callbacks.onopen?.(response);
+      } else {
+        // 如果响应不正常，抛出错误
+        throw new Error(`SSE 连接失败: ${response.status} ${response.statusText}`);
+      }
+    },
+    onmessage(msg) {
+      // 处理服务器发送的消息
+      // msg.data 应该是 JSON 字符串，如 {"text":"..."}
+      try {
+        const data = msg.data;
+        console.log('Received message:', data);
+        if (data && data !== '[DONE]') {
+          callbacks.onmessage?.(data);
+        }
+      } catch (error) {
+        console.warn('处理 SSE 消息时出错:', error);
+      }
+    },
+    onclose() {
+      // 连接关闭
+      console.log('SSE 连接已关闭');
+      callbacks.onclose?.();
+    },
+    onerror(err) {
+      // 发生错误
+      console.error('SSE 连接错误:', err);
+      callbacks.onerror?.(err instanceof Error ? err : new Error(String(err)));
+
+      // 重新抛出错误以停止重试
+      throw err;
+    },
+  }).catch(error => {
+    // 捕获 fetchEventSource 的 Promise 拒绝
+    if (error.name !== 'AbortError') {
+      console.error('fetchEventSource 错误:', error);
+      callbacks.onerror?.(error instanceof Error ? error : new Error(String(error)));
+    } else {
+      // AbortError 是正常的取消操作，不需要调用 onerror
+      console.log('请求已被取消');
+    }
+  });
+}
--- a/src/common/apis/manage/ManageGoodsController接口文档.md
+++ b/src/common/apis/manage/ManageGoodsController接口文档.md
@ -1,295 +0,0 @@
-# ManageGoodsController 接口文档
-
-## 控制器概述
-
-**基础路径：** `/api/manage/goods`
-
-**控制器类：** `com.agileboot.api.controller.manage.ManageGoodsController`
-
-**功能描述：** 商品管理接口，提供商品的增删改查功能。
-
---
-
-## 接口列表
-
-### 1. 获取商品列表
-
-**接口路径：** `GET /api/manage/goods/list`
-
-**功能描述：** 分页查询商品列表，支持多条件筛选和排序。
-
-**请求参数：**
-
-| 参数名 | 类型 | 必填 | 描述 | 示例 |
-|--------|------|------|------|------|
-| `pageNum` | Integer | 否 | 页码，默认1，最大值200 | `1` |
-| `pageSize` | Integer | 否 | 每页大小，默认10，最大值500 | `10` |
-| `orderColumn` | String | 否 | 排序字段 | `"createTime"` |
-| `orderDirection` | String | 否 | 排序方向：`"ascending"`(升序) 或 `"descending"`(降序) | `"descending"` |
-| `beginTime` | Date | 否 | 开始时间（格式：yyyy-MM-dd） | `"2025-01-01"` |
-| `endTime` | Date | 否 | 结束时间（格式：yyyy-MM-dd） | `"2025-12-31"` |
-| `goodsName` | String | 否 | 商品名称（模糊查询） | `"测试商品"` |
-| `categoryId` | Long | 否 | 商品分类ID | `1` |
-| `externalGoodsId` | Long | 否 | 外部归属类型的商品ID | `1001` |
-| `corpid` | String | 否 | 企业微信id | `"wxcorpid123"` |
-| `status` | Integer | 否 | 商品状态（1上架 2下架） | `1` |
-| `autoApproval` | Integer | 否 | 免审批（0否 1是） | `1` |
-| `minPrice` | BigDecimal | 否 | 最低价格 | `10.00` |
-| `maxPrice` | BigDecimal | 否 | 最高价格 | `100.00` |
-| `belongType` | Integer | 否 | 归属类型（0-借还柜 1-固资通） | `0` |
-
-**返回类型：** `ResponseDTO<PageDTO<ShopGoodsDTO>>`
-
-**响应字段：**
-
-`ResponseDTO` 通用结构：
- `code`: Integer - 响应码
- `msg`: String - 响应消息
- `data`: `PageDTO<ShopGoodsDTO>` - 分页数据
-
-`PageDTO` 分页结构：
- `total`: Long - 总记录数
- `rows`: `List<ShopGoodsDTO>` - 当前页数据列表
-
-`ShopGoodsDTO` 商品详情字段：
-
-| 字段名 | 类型 | 描述 |
-|--------|------|------|
-| `goodsId` | Long | 商品唯一ID |
-| `goodsName` | String | 商品名称 |
-| `categoryId` | Long | 分类ID |
-| `externalGoodsId` | Long | 外部商品ID |
-| `corpid` | String | 企业微信id |
-| `categoryName` | String | 分类名称 |
-| `belongType` | Long | 归属类型（0-借还柜 1-固资通） |
-| `price` | BigDecimal | 销售价格 |
-| `stock` | Integer | 库存数量 |
-| `status` | Integer | 商品状态（1上架 2下架） |
-| `autoApproval` | Integer | 免审批（0否 1是） |
-| `coverImg` | String | 封面图URL |
-| `creatorId` | Long | 创建者ID |
-| `creatorName` | String | 创建者名称 |
-| `createTime` | Date | 创建时间 |
-| `remark` | String | 备注 |
-| `cabinetName` | String | 柜机名称 |
-| `cellNo` | Integer | 格口号 |
-| `cellNoStr` | String | 格口号（字符串格式） |
-| `totalStock` | Integer | 已分配库存 |
-| `shopNameStr` | String | 地址名称 |
-| `usageInstruction` | String | 商品使用说明 |
-| `monthlyPurchaseLimit` | Integer | 每人每月限购数量 |
-
-**示例请求：**
-```
-GET /api/manage/goods/list?pageNum=1&pageSize=10&status=1&goodsName=测试
-```
-
---
-
-### 2. 新增商品
-
-**接口路径：** `POST /api/manage/goods`
-
-**功能描述：** 创建新商品。
-
-**请求体类型：** `AddGoodsCommand` (继承自 `ShopGoodsEntity`)
-
-**请求字段：**
-
-| 字段名 | 类型 | 必填 | 描述 | 示例 |
-|--------|------|------|------|------|
-| `goodsName` | String | 是 | 商品名称 | `"测试商品"` |
-| `categoryId` | Long | 否 | 商品分类ID | `1` |
-| `externalGoodsId` | Long | 否 | 外部归属类型的商品ID | `1001` |
-| `corpid` | String | 否 | 企业微信id | `"wxcorpid123"` |
-| `monthlyPurchaseLimit` | Integer | 否 | 每人每月限购数量 | `5` |
-| `price` | BigDecimal | 是 | 销售价格 | `99.99` |
-| `stock` | Integer | 否 | 库存数量 | `100` |
-| `status` | Integer | 否 | 商品状态（1上架 2下架），默认值需确认 | `1` |
-| `autoApproval` | Integer | 否 | 免审批（0否 1是），默认值需确认 | `0` |
-| `coverImg` | String | 否 | 封面图URL | `"https://example.com/image.jpg"` |
-| `goodsDetail` | String | 否 | 商品详情（支持2000汉字+10个图片链接） | `"<p>商品描述</p>"` |
-| `remark` | String | 否 | 备注 | `"测试商品备注"` |
-| `usageInstruction` | String | 否 | 商品使用说明 | `"使用说明内容"` |
-| `belongType` | Integer | 否 | 归属类型（0-借还柜 1-固资通） | `0` |
-
-**注意：** `goodsId` 字段为自增主键，请求时无需提供。
-
-**返回类型：** `ResponseDTO<Void>`
-
-**响应字段：**
- `code`: Integer - 响应码
- `msg`: String - 响应消息
- `data`: null
-
-**示例请求：**
-```json
-{
-  "goodsName": "测试商品",
-  "price": 99.99,
-  "stock": 100,
-  "status": 1,
-  "coverImg": "https://example.com/image.jpg"
-}
-```
-
---
-
-### 3. 删除商品
-
-**接口路径：** `DELETE /api/manage/goods/{goodsIds}`
-
-**功能描述：** 批量删除商品。
-
-**路径参数：**
- `goodsIds`: 商品ID列表，多个ID用逗号分隔
-
-**请求示例：**
-```
-DELETE /api/manage/goods/1,2,3
-```
-
-**内部处理：** 控制器将路径参数转换为 `BulkOperationCommand<Long>` 对象：
-```java
-{
-  "ids": [1, 2, 3]  // Set<Long> 类型，自动去重
-}
-```
-
-**返回类型：** `ResponseDTO<Void>`
-
-**响应字段：**
- `code`: Integer - 响应码
- `msg`: String - 响应消息
- `data`: null
-
---
-
-### 4. 修改商品
-
-**接口路径：** `PUT /api/manage/goods/{goodsId}`
-
-**功能描述：** 更新商品信息。
-
-**路径参数：**
- `goodsId`: 商品ID
-
-**请求体类型：** `UpdateGoodsCommand` (继承自 `AddGoodsCommand`)
-
-**请求字段：** 与 `AddGoodsCommand` 相同，所有字段均为可选更新。
-
-**特殊处理：** 接口会自动将路径参数中的 `goodsId` 设置到 command 对象中。
-
-**返回类型：** `ResponseDTO<Void>`
-
-**响应字段：**
- `code`: Integer - 响应码
- `msg`: String - 响应消息
- `data`: null
-
-**示例请求：**
-```
-PUT /api/manage/goods/1
-```
-```json
-{
-  "goodsName": "更新后的商品名称",
-  "price": 88.88
-}
-```
-
---
-
-### 5. 获取单个商品信息
-
-**接口路径：** `GET /api/manage/goods/getGoodsInfo`
-
-**功能描述：** 根据商品ID获取单个商品的详细信息。
-
-**查询参数：**
-
-| 参数名 | 类型 | 必填 | 描述 | 示例 |
-|--------|------|------|------|------|
-| `goodsId` | Long | 是 | 商品ID | `1` |
-
-**返回类型：** `ResponseDTO<ShopGoodsDTO>`
-
-**响应字段：**
- `code`: Integer - 响应码
- `msg`: String - 响应消息
- `data`: `ShopGoodsDTO` - 商品详情（字段同接口1）
-
-**示例请求：**
-```
-GET /api/manage/goods/getGoodsInfo?goodsId=1
-```
-
---
-
-## 通用数据结构
-
-### ResponseDTO 通用响应结构
-```java
-public class ResponseDTO<T> {
-    private Integer code;  // 响应码
-    private String msg;    // 响应消息
-    private T data;        // 响应数据
-}
-```
-
-### PageDTO 分页结构
-```java
-public class PageDTO<T> {
-    private Long total;    // 总记录数
-    private List<T> rows;  // 当前页数据列表
-}
-```
-
-### BulkOperationCommand 批量操作命令
-```java
-public class BulkOperationCommand<T> {
-    private Set<T> ids;    // 操作ID集合（自动去重）
-}
-```
-
---
-
-## 注意事项
-
-1. **字段默认值：** 部分字段（如 `status`, `autoApproval`）的默认值需查看业务逻辑确认
-2. **ID 生成：** `goodsId` 为数据库自增字段，创建时无需提供
-3. **批量删除：** 删除接口支持批量操作，ID列表会自动去重
-4. **分页限制：** 最大页码200，每页最大大小500
-5. **时间格式：** 时间参数需使用 `yyyy-MM-dd` 格式
-6. **企业微信集成：** `corpid` 字段用于企业微信多租户支持
-
---
-
-## 相关实体类位置
-
-| 类名 | 路径 |
-|------|------|
-| `ManageGoodsController` | `agileboot-api/src/main/java/com/agileboot/api/controller/manage/` |
-| `ShopGoodsEntity` | `agileboot-domain/src/main/java/com/agileboot/domain/shop/goods/db/` |
-| `AddGoodsCommand` | `agileboot-domain/src/main/java/com/agileboot/domain/shop/goods/command/` |
-| `UpdateGoodsCommand` | `agileboot-domain/src/main/java/com/agileboot/domain/shop/goods/command/` |
-| `ShopGoodsDTO` | `agileboot-domain/src/main/java/com/agileboot/domain/shop/goods/dto/` |
-| `SearchShopGoodsQuery` | `agileboot-domain/src/main/java/com/agileboot/domain/shop/goods/query/` |
-| `BulkOperationCommand` | `agileboot-domain/src/main/java/com/agileboot/domain/common/command/` |
-
---
-
-## 架构设计说明
-
-本控制器遵循项目的 **DDD/CQRS 架构**：
-
- **查询操作**（GET）：使用 `SearchShopGoodsQuery` 对象，通过 `GoodsApplicationService.getGoodsList()` 处理
- **命令操作**（POST/PUT/DELETE）：使用 `AddGoodsCommand`/`UpdateGoodsCommand`/`BulkOperationCommand`，通过 `GoodsApplicationService` 的对应方法处理
- **数据流转**：Controller → Command/Query → ApplicationService → Domain Model → DB Entity
-
-**注意**：`AddGoodsCommand` 和 `UpdateGoodsCommand` 都继承自 `ShopGoodsEntity`，因此共享相同的字段定义。在实际使用中，`goodsId` 字段在新增时由数据库自增生成，在更新时通过路径参数传入。
-
---
-
-*文档生成时间：2025-12-11*
-*基于代码分析：`agileboot-api/src/main/java/com/agileboot/api/controller/manage/ManageGoodsController.java`*
--- a/src/common/apis/manage/cellOperation.ts
+++ b/src/common/apis/manage/cellOperation.ts
@ -0,0 +1,209 @@
+import { request } from '@/http/axios'
+
+// ==================== 类型定义 ====================
+
+/** 柜机格口操作基础查询参数 */
+export interface CellOperationQuery {
+  /** 页码，默认 1 */
+  pageNum?: number
+  /** 每页条数，默认 10 */
+  pageSize?: number
+  /** 操作流水号 */
+  operationId?: number
+  /** 关联格口ID */
+  cellId?: number
+  /** 关联商品ID */
+  goodsId?: number
+  /** 企业微信用户ID (精确匹配) */
+  userid?: string
+  /** 商品名称 (模糊匹配) */
+  goodsName?: string
+  /** 是否内部用户 (0否 1是) */
+  isInternal?: boolean
+  /** 成员名称 (模糊匹配) */
+  name?: string
+  /** 手机号码 (模糊匹配) */
+  mobile?: string
+  /** 操作类型 (1用户 2管理员) */
+  operationType?: number
+  /** 操作状态 (1正常 2操作失败) */
+  status?: number
+  /** 开始时间 (格式: yyyy-MM-dd HH:mm:ss) */
+  startTime?: string
+  /** 结束时间 (格式: yyyy-MM-dd HH:mm:ss) */
+  endTime?: string
+}
+
+/** 柜机格口操作详情查询参数（带关联信息） */
+export interface CellOperationDetailQuery extends CellOperationQuery {
+  /** 柜机ID */
+  cabinetId?: number
+  /** 店铺ID */
+  shopId?: number
+  /** 格口号 */
+  cellNo?: number
+}
+
+/** 柜机格口操作记录 */
+export interface CellOperationRecord {
+  /** 操作流水号 */
+  operationId: number
+  /** 关联格口ID */
+  cellId: number
+  /** 关联商品ID */
+  goodsId?: number
+  /** 商品名称 */
+  goodsName?: string
+  /** 企业微信用户ID */
+  userid?: string
+  /** 是否内部用户 (0否 1是) */
+  isInternal?: number
+  /** 成员名称 */
+  name?: string
+  /** 手机号码 */
+  mobile?: string
+  /** 操作类型 (1用户 2管理员) */
+  operationType?: number
+  /** 操作状态 (1正常 2操作失败) */
+  status?: number
+  /** 创建时间 */
+  createTime?: string
+  /** 更新时间 */
+  updateTime?: string
+  /** 状态描述 */
+  statusDesc?: string
+  /** 创建时间字符串 */
+  createTimeStr?: string
+  /** 关联柜机ID */
+  cabinetId?: number
+  /** 柜机名称 */
+  cabinetName?: string
+  /** 关联店铺ID */
+  shopId?: number
+  /** 店铺名称 */
+  shopName?: string
+  /** 格口号 */
+  cellNo?: number
+  /** 格口类型 (1小格 2中格 3大格 4超大格) */
+  cellType?: number
+}
+
+/** 新增柜机格口操作请求参数 */
+export interface AddCellOperationCommand {
+  /** 关联格口ID */
+  cellId: number
+  /** 关联商品ID */
+  goodsId?: number
+  /** 商品名称 */
+  goodsName?: string
+  /** 企业微信用户ID */
+  userid?: string
+  /** 是否内部用户 (0否 1是) */
+  isInternal?: number
+  /** 成员名称 */
+  name?: string
+  /** 手机号码 */
+  mobile?: string
+  /** 操作类型 (1用户 2管理员) */
+  operationType?: number
+  /** 操作状态 (1正常 2操作失败)，默认1 */
+  status?: number
+}
+
+/** 修改柜机格口操作请求参数 */
+export interface UpdateCellOperationCommand {
+  /** 关联格口ID */
+  cellId?: number
+  /** 关联商品ID */
+  goodsId?: number
+  /** 商品名称 */
+  goodsName?: string
+  /** 企业微信用户ID */
+  userid?: string
+  /** 是否内部用户 (0否 1是) */
+  isInternal?: number
+  /** 成员名称 */
+  name?: string
+  /** 手机号码 */
+  mobile?: string
+  /** 操作类型 (1用户 2管理员) */
+  operationType?: number
+  /** 操作状态 (1正常 2操作失败) */
+  status?: number
+}
+
+/** 分页响应数据 */
+export interface CellOperationPageResponse<T = CellOperationRecord> {
+  /** 数据列表 */
+  rows: T[]
+  /** 总条数 */
+  total: number
+  /** 每页条数 */
+  size: number
+  /** 当前页码 */
+  current: number
+}
+
+// ==================== API 函数 ====================
+
+/**
+ * 获取柜机格口操作列表
+ * @description 支持分页和条件筛选
+ * @param params 查询参数
+ */
+export function getCellOperationList(params: CellOperationQuery) {
+  return request<ApiResponseData<CellOperationPageResponse<CellOperationRecord>>>({
+    url: 'manage/cellOperations/list',
+    method: 'get',
+    params
+  })
+}
+
+/**
+ * 获取柜机格口操作详情列表
+ * @description 获取柜机格口操作详情列表（带柜机、店铺、格口等关联信息）
+ * @param data 查询参数
+ */
+export function getCellOperationPage(params: CellOperationDetailQuery) {
+  return request<ApiResponseData<CellOperationPageResponse<CellOperationRecord>>>({
+    url: 'manage/cellOperations/page',
+    method: 'post',
+    params
+  })
+}
+
+/**
+ * 新增柜机格口操作
+ * @param data 新增参数
+ */
+export function addCellOperation(data: AddCellOperationCommand) {
+  return request<ApiResponseData<void>>({
+    url: 'manage/cellOperations',
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * 修改柜机格口操作
+ * @param operationId 操作流水号
+ * @param data 修改参数
+ */
+export function updateCellOperation(operationId: number, data: UpdateCellOperationCommand) {
+  return request<ApiResponseData<void>>({
+    url: `manage/cellOperations/${operationId}`,
+    method: 'put',
+    data
+  })
+}
+
+/**
+ * 删除柜机格口操作
+ * @param ids 操作流水号列表，逗号分隔
+ */
+export function deleteCellOperations(ids: string) {
+  return request<ApiResponseData<void>>({
+    url: `manage/cellOperations/${ids}`,
+    method: 'delete'
+  })
+}
--- a/src/common/types/chat.ts
+++ b/src/common/types/chat.ts
@ -0,0 +1,15 @@
+/** 消息角色 */
+export type MessageRole = "user" | "assistant" | "system"
+
+/** 消息状态 */
+export type MessageStatus = "pending" | "sending" | "sent" | "error"
+
+/** 消息对象 */
+export interface ChatMessage {
+  id: string
+  role: MessageRole
+  content: string
+  timestamp: number
+  status: MessageStatus
+  extra?: Record<string, unknown>
+}
--- a/src/common/utils/storage.ts
+++ b/src/common/utils/storage.ts
@ -0,0 +1,76 @@
+import type { ChatMessage } from "@/common/types/chat"
+
+const CHAT_HISTORY_KEY = "chat_history";
+const CHAT_RESOURCE_KEY = "chat_resource";
+const CHAT_THREAD_KEY = "chat_thread";
+
+export const chatStorage = {
+  save(messages: ChatMessage[]) {
+    try {
+      localStorage.setItem(CHAT_HISTORY_KEY, JSON.stringify(messages))
+    }
+    catch (e) {
+      console.error("保存对话历史失败", e)
+    }
+  },
+
+  load(): ChatMessage[] {
+    try {
+      const data = localStorage.getItem(CHAT_HISTORY_KEY)
+      return data ? JSON.parse(data) : []
+    }
+    catch (e) {
+      console.error("加载对话历史失败", e)
+      return []
+    }
+  },
+
+  clear() {
+    localStorage.removeItem(CHAT_HISTORY_KEY)
+    localStorage.removeItem(CHAT_THREAD_KEY)
+  },
+
+  getResource(): string {
+    let resource = localStorage.getItem(CHAT_RESOURCE_KEY)
+    if (!resource) {
+      resource = `user-${Math.random().toString(36).substring(2, 11)}`
+      localStorage.setItem(CHAT_RESOURCE_KEY, resource)
+    }
+    return resource
+  },
+
+  getThread(): string {
+    let thread = localStorage.getItem(CHAT_THREAD_KEY)
+    if (!thread) {
+      thread = `t-${Date.now()}`
+      localStorage.setItem(CHAT_THREAD_KEY, thread)
+    }
+    return thread
+  },
+
+  clearThread() {
+    localStorage.removeItem(CHAT_THREAD_KEY)
+  }
+}
+
+export const intro = `
+您好！我是您的智能助手，很高兴为您服务！😊
+我可以帮您做以下事情：
+**1. 查询商品信息**
+- 查看商品列表或单个商品详情
+- 按价格、分类、状态等条件筛选商品
+- 支持模糊搜索商品名称
+**2. 查询门店和智能柜**
+- 查看您企业下的所有门店列表
+- 查询门店的运行模式（支付、审批、借还、会员、耗材、暂存等）
+- 查看智能柜的详细信息
+**3. 查询借还记录**
+- 查看商品的借出和归还记录
+- 按商品、格口、状态等条件筛选动态记录
+**使用示例：**
+- \"帮我查一下所有商品\"
+- \"查看XX门店的智能柜信息\"
+- \"查询最近借出的商品记录\"
+- \"价格在100-500元之间的商品有哪些\"
+有什么我可以帮您的吗？随时告诉我！✨
+`
--- a/src/layout/components/Tabbar.vue
+++ b/src/layout/components/Tabbar.vue
@ -21,6 +21,12 @@ const tabbarItemList = computed(() => {
      icon: 'manager-o',
      path: '/cabinet'
    });
+
+    items.push({
+      title: '智能助手',
+      icon: 'chat-o',
+      path: '/chat'
+    });
  }

  if (names.includes('ShopGoods')) {
--- a/src/pages/cabinet/index.vue
+++ b/src/pages/cabinet/index.vue
@ -199,66 +199,128 @@
        </VanPopup>

        <!-- 格口控制弹窗 -->
-        <VanPopup v-model:show="showLockerPopup" position="bottom" :style="{ height: '75%' }" round>
+        <VanPopup v-model:show="showLockerPopup" position="bottom" :style="{ height: '85%' }" round>
            <div class="locker-popup-content" v-if="selectedLocker">
                <div class="popup-header">
                    <span class="popup-title">格口 {{ selectedLocker.cellNo }}</span>
                    <van-icon name="cross" class="close-btn" @click="showLockerPopup = false" />
                </div>

-                <!-- 信息卡片 -->
-                <div class="locker-info-card">
-                    <div class="info-item">
-                        <span class="info-label">状态</span>
-                        <span class="info-value status-tag"
-                            :class="selectedLocker.usageStatus === 1 ? 'status-free' : 'status-occupied'">
-                            {{ selectedLocker.usageStatus === 1 ? '空闲' : '占用' }}
-                        </span>
-                    </div>
-                    <div class="info-item" v-if="selectedLocker.goodsName">
-                        <span class="info-label">商品</span>
-                        <span class="info-value">{{ selectedLocker.goodsName }}</span>
-                    </div>
-                    <div class="info-item" v-if="selectedShop?.mode !== 5">
-                        <span class="info-label">价格</span>
-                        <span class="info-value price">¥{{ (selectedLocker.price || 0).toFixed(2) }}</span>
-                    </div>
-                    <div class="info-item" v-if="selectedShop?.mode === 5 && selectedLocker?.password">
-                        <span class="info-label">密码</span>
-                        <span class="info-value password-value">
-                            <span class="password-text">{{ showPassword ? selectedLocker.password : '***' }}</span>
-                            <van-icon :name="showPassword ? 'eye' : 'eye-o'" size="18"
-                                class="password-toggle" @click="showPassword = !showPassword" />
-                        </span>
-                    </div>
-                </div>
+                <!-- Tabs切换 -->
+                <van-tabs v-model:active="activeTab" class="locker-tabs" sticky :offset-top="50">
+                    <!-- Tab 1: 格口控制 -->
+                    <van-tab title="格口控制">
+                        <div class="tab-content control-tab">
+                            <!-- 信息卡片 -->
+                            <div class="locker-info-card">
+                                <div class="info-item">
+                                    <span class="info-label">状态</span>
+                                    <span class="info-value status-tag"
+                                        :class="selectedLocker.usageStatus === 1 ? 'status-free' : 'status-occupied'">
+                                        {{ selectedLocker.usageStatus === 1 ? '空闲' : '占用' }}
+                                    </span>
+                                </div>
+                                <div class="info-item" v-if="selectedLocker.goodsName">
+                                    <span class="info-label">商品</span>
+                                    <span class="info-value">{{ selectedLocker.goodsName }}</span>
+                                </div>
+                                <div class="info-item" v-if="selectedShop?.mode !== 5">
+                                    <span class="info-label">价格</span>
+                                    <span class="info-value price">¥{{ (selectedLocker.price || 0).toFixed(2) }}</span>
+                                </div>
+                                <div class="info-item" v-if="selectedShop?.mode === 5 && selectedLocker?.password">
+                                    <span class="info-label">密码</span>
+                                    <span class="info-value password-value">
+                                        <span class="password-text">{{ showPassword ? selectedLocker.password : '***' }}</span>
+                                        <van-icon :name="showPassword ? 'eye' : 'eye-o'" size="18"
+                                            class="password-toggle" @click="showPassword = !showPassword" />
+                                    </span>
+                                </div>
+                            </div>

-                <!-- 备注输入 -->
-                <div class="remark-section">
-                    <div class="section-title">备注</div>
-                    <van-field v-model="editingRemark" placeholder="请输入备注信息" rows="2" type="textarea"
-                        class="remark-input" />
-                </div>
+                            <!-- 备注输入 -->
+                            <div class="remark-section">
+                                <div class="section-title">备注</div>
+                                <van-field v-model="editingRemark" placeholder="请输入备注信息" rows="2" type="textarea"
+                                    class="remark-input" />
+                            </div>

-                <!-- 按钮区域 -->
-                <div class="popup-actions">
-                    <van-button type="primary" :loading="openingLockerId === selectedLocker.lockerId"
-                        @click="handleOpenLocker(selectedLocker)" style="flex: 1;">
-                        开启格口
-                    </van-button>
-                    <van-button v-if="selectedShop?.mode === 5 && selectedLocker.password" plain type="danger"
-                        @click="handleClearPassword(selectedLocker)" style="flex: 1;">
-                        清除密码
-                    </van-button>
-                    <van-button v-else-if="selectedShop?.mode !== 5" plain type="warning"
-                        @click="handleBindFromLocker(selectedLocker)" style="flex: 1;">
-                        绑定商品
-                    </van-button>
-                </div>
+                            <!-- 按钮区域 -->
+                            <div class="popup-actions">
+                                <van-button type="primary" :loading="openingLockerId === selectedLocker.lockerId"
+                                    @click="handleOpenLocker(selectedLocker)" style="flex: 1;">
+                                    开启格口
+                                </van-button>
+                                <van-button v-if="selectedShop?.mode === 5 && selectedLocker.password" plain type="danger"
+                                    @click="handleClearPassword(selectedLocker)" style="flex: 1;">
+                                    清除密码
+                                </van-button>
+                                <van-button v-else-if="selectedShop?.mode !== 5" plain type="warning"
+                                    @click="handleBindFromLocker(selectedLocker)" style="flex: 1;">
+                                    绑定商品
+                                </van-button>
+                            </div>

-                <van-button @click="handleSaveRemark" :loading="isSavingRemark" class="save-btn">
-                    保存备注
-                </van-button>
+                            <van-button @click="handleSaveRemark" :loading="isSavingRemark" class="save-btn">
+                                保存备注
+                            </van-button>
+                        </div>
+                    </van-tab>
+
+                    <!-- Tab 2: 打开记录 -->
+                    <van-tab title="打开记录">
+                        <div class="tab-content record-tab">
+                            <van-list
+                                :loading="operationLoading"
+                                :finished="operationFinished"
+                                finished-text="没有更多了"
+                                @load="loadMoreOperations"
+                                class="operation-list"
+                            >
+                                <van-cell
+                                    v-for="record in operationRecords"
+                                    :key="record.operationId"
+                                    class="operation-cell"
+                                >
+                                    <template #title>
+                                        <div class="operation-header">
+                                            <span class="operation-id">操作流水号: {{ record.operationId }}</span>
+                                            <van-tag
+                                                :type="record.status === 1 ? 'success' : 'danger'"
+                                            >
+                                                {{ record.status === 1 ? '成功' : '失败' }}
+                                            </van-tag>
+                                        </div>
+                                    </template>
+
+                                    <template #label>
+                                        <div class="operation-details">
+                                            <div class="detail-row">
+                                                <span class="detail-label">操作类型:</span>
+                                                <span class="detail-value">
+                                                    {{ record.operationType === 2 ? '管理员' : '用户' }}
+                                                </span>
+                                            </div>
+                                            <div class="detail-row" v-if="record.userid">
+                                                <span class="detail-label">操作人:</span>
+                                                <span class="detail-value">{{ record.name || record.userid }}</span>
+                                            </div>
+                                            <div class="detail-row">
+                                                <span class="detail-label">操作时间:</span>
+                                                <span class="detail-value">{{ record.createTimeStr || record.createTime }}</span>
+                                            </div>
+                                        </div>
+                                    </template>
+                                </van-cell>
+
+                                <!-- 空状态 -->
+                                <div v-if="!operationLoading && operationRecords.length === 0" class="empty-state">
+                                    <van-empty description="暂无操作记录" />
+                                </div>
+                            </van-list>
+                        </div>
+                    </van-tab>
+                </van-tabs>
            </div>
        </VanPopup>
    </div>
@ -267,10 +329,13 @@
 <script setup lang="ts">
 import { throttle } from 'lodash-es';
 import { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue';
+import { storeToRefs } from 'pinia';
 import { getShopListApi, getModeListApi } from '@/common/apis/shop';
 import { ShopEntity } from '@/common/apis/shop/type';
 import { getCabinetDetailApi, openCabinet, changeGoodsCellsStock, clearGoodsCells, resetCellById, updateCellRemark } from '@/common/apis/cabinet';
 import type { CabinetDetailDTO } from '@/common/apis/cabinet/type';
+import { getCellOperationPage } from '@/common/apis/manage/cellOperation';
+import type { CellOperationDetailQuery, CellOperationRecord } from '@/common/apis/manage/cellOperation';
 import { useWxStore, useWxStoreOutside } from '@/pinia/stores/wx';
 import { useRouterStore } from '@/pinia/stores/router';
 import { publicPath } from "@/common/utils/path";
@ -305,6 +370,25 @@ const selectedLocker = ref<LockerItem | null>(null)
 const editingRemark = ref('')
 const isSavingRemark = ref(false)
 const showPassword = ref(false)
+// Tab控制
+const activeTab = ref(0)
+
+// 操作记录相关
+const operationRecords = ref<CellOperationRecord[]>([])
+const operationLoading = ref(false);
+const operationFinished = ref(false);
+(window as any).operationInfo = {
+    operationRecords: operationRecords.value,
+    operationLoading: operationLoading.value,
+    operationFinished: operationFinished.value,
+}
+const operationTotal = ref(0)
+const operationQueryParams = ref<CellOperationDetailQuery>({
+  pageNum: 1,
+  pageSize: 10,
+  cellId: undefined
+})
+
 // 分类选择相关状态
 const activeModeIndex = ref(0); // 默认选中第一个（全部）
 const modeList = ref<number[]>([]);
@ -603,6 +687,87 @@ const handleSaveRemark = async () => {
    }
 }

+// 重置操作记录查询
+function resetOperationQuery() {
+  operationQueryParams.value = {
+    pageNum: 1,
+    pageSize: 10,
+    cellId: selectedLocker.value?.lockerId
+  }
+  operationRecords.value = []
+  operationTotal.value = 0
+  operationFinished.value = false
+}
+
+// 获取操作记录列表
+async function fetchOperationRecords(isLoadMore = false) {
+  if (!selectedLocker.value) return
+
+  if (!isLoadMore) {
+    operationLoading.value = true
+  }
+
+  try {
+    // 设置格口ID筛选
+    operationQueryParams.value.cellId = selectedLocker.value.lockerId
+
+    const res = await getCellOperationPage(operationQueryParams.value)
+    if (res.code === 0) {
+      if (isLoadMore) {
+        // 加载更多：追加数据
+        operationRecords.value = [...operationRecords.value, ...(res.data?.rows || [])]
+      } else {
+        // 首次加载：替换数据
+        operationRecords.value = res.data?.rows || []
+      }
+      operationTotal.value = res.data?.total || 0
+      operationFinished.value = operationRecords.value.length >= operationTotal.value
+    }
+  } catch (error) {
+    console.error('获取操作记录失败:', error)
+  } finally {
+    operationLoading.value = false
+  }
+}
+
+// 加载更多操作记录
+function loadMoreOperations() {
+  console.log('loadMoreOperations operationQueryParams:', operationQueryParams.value);
+  console.log('loadMoreOperations operationLoading:', operationLoading.value);
+  console.log('loadMoreOperations operationFinished:', operationFinished.value);
+  if (operationLoading.value || operationFinished.value) return
+  operationQueryParams.value.pageNum!++
+  fetchOperationRecords(true)
+}
+
+// 监视tab切换
+watch(activeTab, (newTab) => {
+  if (newTab === 1 && operationRecords.value.length === 0) {
+    // 切换到"打开记录"tab时加载数据
+    resetOperationQuery()
+    fetchOperationRecords()
+  }
+})
+
+// 弹窗打开时重置状态
+watch(showLockerPopup, (isOpen) => {
+  if (isOpen) {
+    activeTab.value = 0  // 默认显示第一个tab
+    if (operationRecords.value.length > 0) {
+      operationRecords.value = []  // 清空旧数据
+    }
+  }
+})
+
+// 监听选中的格口变化
+watch(selectedLocker, (newLocker) => {
+  if (activeTab.value === 1 && newLocker) {
+    // 如果当前在"打开记录"tab，重新加载数据
+    resetOperationQuery()
+    fetchOperationRecords()
+  }
+})
+
 onMounted(() => {
    init();
    scrollListener.push(window.addEventListener('scroll', throttledScroll));
@ -1205,4 +1370,103 @@ onBeforeUnmount(() => {
        background: #a0c3ff;
    }
 }
+
+// Tabs样式
+.locker-tabs {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+
+  :deep(.van-tabs__wrap) {
+    flex-shrink: 0;
+  }
+
+  :deep(.van-tab__panel) {
+    height: 100%;
+  }
+
+  :deep(.van-tabs__content) {
+    flex: 1;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+  }
+}
+
+// Tab内容区域
+.tab-content {
+  height: 100%;
+  overflow-y: auto;
+  padding: 16px;
+  background: #f5f5f5;
+
+  &.control-tab {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+  }
+
+  &.record-tab {
+    padding: 12px 0 0 0;
+    flex: 1;
+    overflow-y: auto;
+    display: flex;
+    flex-direction: column;
+  }
+}
+
+// 操作记录列表
+.operation-list {
+  flex: 1;
+}
+
+.operation-cell {
+  margin-bottom: 10px;
+  background: white;
+  border-radius: 8px;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
+
+  .operation-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 8px;
+
+    .operation-id {
+      font-size: 14px;
+      font-weight: 500;
+      color: #333;
+    }
+  }
+}
+
+.operation-details {
+  .detail-row {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 6px;
+    font-size: 12px;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+
+    .detail-label {
+      color: #999;
+      min-width: 60px;
+    }
+
+    .detail-value {
+      color: #666;
+      text-align: right;
+      flex: 1;
+    }
+  }
+}
+
+// 空状态
+.empty-state {
+  padding: 40px 16px;
+}
 </style>
--- a/src/router/index.ts
+++ b/src/router/index.ts
@ -316,6 +316,25 @@ export const routes: RouteRecordRaw[] = [
    meta: {
      title: "登录"
    }
+  },
+  {
+    path: "/chat",
+    component: () => import("@/views/chat/index.vue"),
+    name: "Chat",
+    meta: {
+      title: "智能助手",
+      layout: {
+        navBar: {
+          showNavBar: false,
+          showLeftArrow: true
+        },
+        tabbar: {
+          showTabbar: true,
+          icon: "user-o"
+        }
+      },
+      requiresAuth: true
+    }
  }
 ]

--- a/src/views/chat/components/ChatBubble.vue
+++ b/src/views/chat/components/ChatBubble.vue
@ -0,0 +1,183 @@
+<template>
+  <div :class="['message-bubble', `message-${message.role}`]">
+    <van-image
+      v-if="message.role === 'user'"
+      round
+      width="36px"
+      height="36px"
+      :src="userAvatar"
+      class="avatar"
+    />
+    <div class="bubble-content" @click="showMenu = true">
+      <div v-if="message.status === 'pending'" class="thinking">
+        <span class="thinking-dot">●</span>
+        <span class="thinking-dot">●</span>
+        <span class="thinking-dot">●</span>
+      </div>
+      <div v-else class="message-text" v-html="marked.parse(message.content)"></div>
+    </div>
+    <van-image
+      v-if="message.role === 'assistant'"
+      round
+      width="36px"
+      height="36px"
+      :src="aiAvatar"
+      class="avatar"
+    />
+    <div v-if="message.role === 'user' && message.status === 'error'" class="message-status">
+      <span class="error" @click.stop="emit('retry', message)">重试</span>
+    </div>
+    <van-popup
+      v-model:show="showMenu"
+      position="bottom"
+      round
+      :style="{ height: '30%' }"
+    >
+      <div class="action-sheet">
+        <van-button block @click="handleCopy">复制</van-button>
+        <van-button block @click="handleDelete" v-if="message.role === 'user'">删除</van-button>
+      </div>
+    </van-popup>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+import { showConfirmDialog, showToast } from "vant";
+import type { ChatMessage } from "@/common/types/chat";
+import { marked } from 'marked';
+
+const props = defineProps<{
+  message: ChatMessage
+}>()
+
+const emit = defineEmits<{
+  (e: "retry", msg: ChatMessage): void
+  (e: "delete", msg: ChatMessage): void
+}>()
+
+const showMenu = ref(false)
+const userAvatar = ""
+const aiAvatar = ""
+
+const handleCopy = () => {
+  navigator.clipboard.writeText(props.message.content)
+  showToast("已复制")
+  showMenu.value = false
+}
+
+const handleDelete = () => {
+  showConfirmDialog({
+    message: "确定删除该消息？",
+    confirmButtonColor: "#f44"
+  }).then(() => {
+    emit("delete", props.message)
+    showMenu.value = false
+  })
+}
+</script>
+
+<style scoped lang="scss">
+.message-bubble {
+  display: flex;
+  align-items: flex-start;
+  margin-bottom: 16px;
+  position: relative;
+
+  &.message-user {
+    flex-direction: row-reverse;
+
+    .bubble-content {
+      background: #1989fa;
+      color: #fff;
+      border-radius: 16px 4px 16px 16px;
+    }
+  }
+
+  &.message-assistant {
+    flex-direction: column-reverse;
+
+    .bubble-content {
+      background: #fff;
+      color: #333;
+      border-radius: 4px 16px 16px 16px;
+      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+    }
+  }
+}
+
+.avatar {
+  flex-shrink: 0;
+}
+
+.bubble-content {
+  max-width: 90%;
+  padding: 12px 16px;
+  word-break: break-word;
+  line-height: 1.5;
+}
+
+.message-text {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  white-space: pre-wrap;
+  line-height: 1.2;
+  :deep(p) {
+    margin: 0;
+  }
+  :deep(ul) {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+}
+
+.thinking {
+  display: flex;
+  gap: 4px;
+  align-items: center;
+}
+
+.thinking-dot {
+  animation: blink 1.4s infinite;
+  color: #999;
+  font-size: 12px;
+
+  &:nth-child(2) {
+    animation-delay: 0.2s;
+  }
+
+  &:nth-child(3) {
+    animation-delay: 0.4s;
+  }
+}
+
+@keyframes blink {
+  0%, 60%, 100% {
+    opacity: 0.3;
+  }
+  30% {
+    opacity: 1;
+  }
+}
+
+.message-status {
+  position: absolute;
+  right: 60px;
+  bottom: 0;
+  font-size: 12px;
+
+  .error {
+    color: #f44;
+  }
+}
+
+.action-sheet {
+  padding: 16px;
+
+  > * {
+    margin-bottom: 8px;
+  }
+}
+</style>
--- a/src/views/chat/index.vue
+++ b/src/views/chat/index.vue
@ -0,0 +1,305 @@
+<template>
+  <div class="chat-page">
+    <div ref="scrollRef" class="chat-messages" @scroll="onScroll">
+      <div v-if="loadingHistory" class="loading-history">
+        <van-loading size="16px">加载中...</van-loading>
+      </div>
+      <template v-for="msg in messages" :key="msg.id">
+        <div v-if="shouldShowTime(msg.timestamp)" class="message-time">
+          {{ formatTime(msg.timestamp) }}
+        </div>
+        <ChatBubble
+          :message="msg"
+          @retry="onRetry"
+          @delete="onDelete(msg)"
+        />
+      </template>
+    </div>
+    <div class="clear-float" @click="onMoreAction">
+      <van-icon name="delete-o" />
+    </div>
+    <div class="chat-input-area">
+      <div class="input-row">
+        <van-field
+          v-model="inputValue"
+          type="textarea"
+          autosize
+          placeholder="请输入消息..."
+          maxlength="500"
+          show-word-limit
+          class="message-input"
+          @keydown.enter.exact.prevent="onSend"
+        />
+        <van-button
+          type="primary"
+          size="small"
+          :loading="sending"
+          :disabled="!inputValue.trim() || isThinking"
+          @click="onSend"
+        >
+          发送
+        </van-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, nextTick, watch, onMounted, onUnmounted } from "vue"
+import { useRouter } from "vue-router"
+import { showToast, showFailToast, showConfirmDialog } from "vant"
+import ChatBubble from "./components/ChatBubble.vue"
+import type { ChatMessage } from "@/common/types/chat"
+import { chatStorage, intro } from "@/common/utils/storage"
+import { streamApi } from "@/common/apis/agent"
+
+const router = useRouter()
+const abortController = ref<AbortController>()
+
+const agentName = ref("智能助手")
+const inputValue = ref("")
+const messages = ref<ChatMessage[]>([])
+const isThinking = ref(false)
+const sending = ref(false)
+const loadingHistory = ref(false)
+const scrollRef = ref<HTMLElement>()
+const currentAiMsgId = ref<string>("")
+
+onMounted(() => {
+  messages.value = chatStorage.load()
+
+  // 新对话时直接输出intro
+  if (messages.value.length === 0) {
+    const aiMsg: ChatMessage = {
+      id: (Date.now() + 1).toString(),
+      role: "assistant",
+      content: intro,
+      timestamp: Date.now(),
+      status: "sent"
+    }
+    messages.value.push(aiMsg)
+  }
+
+  nextTick(() => {
+    scrollToBottom()
+  })
+})
+
+watch(messages, () => {
+  chatStorage.save(messages.value)
+}, { deep: true })
+
+const loadHistory = async () => {
+  if (loadingHistory.value) return
+  loadingHistory.value = true
+  try {
+    await new Promise(resolve => setTimeout(resolve, 500))
+  }
+  finally {
+    loadingHistory.value = false
+  }
+}
+
+const onSend = async () => {
+  const content = inputValue.value.trim()
+  if (!content || isThinking.value) return
+
+  const userMsg: ChatMessage = {
+    id: Date.now().toString(),
+    role: "user",
+    content,
+    timestamp: Date.now(),
+    status: "sent"
+  }
+
+  messages.value.push(userMsg)
+  inputValue.value = ""
+  sending.value = true
+  await scrollToBottom()
+
+  isThinking.value = true
+  sending.value = false
+
+  // 创建AI消息占位
+  const aiMsgId = (Date.now() + 1).toString()
+  currentAiMsgId.value = aiMsgId
+  const aiMsg: ChatMessage = {
+    id: aiMsgId,
+    role: "assistant",
+    content: "",
+    timestamp: Date.now(),
+    status: "pending"
+  }
+  messages.value.push(aiMsg)
+
+  // 创建 AbortController
+  abortController.value = new AbortController()
+
+  const thread = chatStorage.getThread()
+  const resource = chatStorage.getResource()
+
+  streamApi(
+    content,
+    {
+      onmessage(data) {
+        try {
+          const parsed = JSON.parse(data)
+          if (parsed.text) {
+            const msg = messages.value.find(m => m.id === aiMsgId)
+            if (msg) {
+              msg.status = "sent"
+              msg.content += parsed.text
+              scrollToBottom()
+            }
+          }
+        }
+        catch (e) {
+          console.warn("解析SSE消息失败:", e)
+        }
+      },
+      onclose() {
+        const msg = messages.value.find(m => m.id === aiMsgId)
+        if (msg) {
+          msg.status = "sent"
+        }
+        isThinking.value = false
+        abortController.value = undefined
+      },
+      onerror(error) {
+        const msg = messages.value.find(m => m.id === aiMsgId)
+        if (msg) {
+          msg.status = "error"
+        }
+        showFailToast("连接失败，请重试")
+        isThinking.value = false
+        abortController.value = undefined
+      }
+    },
+    { signal: abortController.value.signal, thread, resource }
+  )
+}
+
+const scrollToBottom = async () => {
+  await nextTick()
+  if (scrollRef.value) {
+    scrollRef.value.scrollTop = scrollRef.value.scrollHeight
+  }
+}
+
+const onScroll = (e: Event) => {
+  const target = e.target as HTMLElement
+  if (target.scrollTop < 50 && !loadingHistory.value) {
+    loadHistory()
+  }
+}
+
+const shouldShowTime = (timestamp: number) => {
+  if (messages.value.length === 0) return true
+  const lastMsg = messages.value[messages.value.length - 1]
+  return timestamp - lastMsg.timestamp > 300000
+}
+
+const formatTime = (timestamp: number) => {
+  const date = new Date(timestamp)
+  return `${date.getHours().toString().padStart(2, "0")}:${date.getMinutes().toString().padStart(2, "0")}`
+}
+
+const onMoreAction = () => {
+  showConfirmDialog({
+    message: "确定清空对话历史？",
+    confirmButtonColor: "#f44"
+  }).then(() => {
+    messages.value = []
+    chatStorage.clear()
+    chatStorage.clearThread()
+  })
+}
+
+const onBack = () => {
+  router.back()
+}
+
+const onRetry = () => {
+  const lastUserMsg = messages.value.filter(m => m.role === "user").pop()
+  if (lastUserMsg) {
+    inputValue.value = lastUserMsg.content
+    onSend()
+  }
+}
+
+// 页面销毁时取消请求
+onUnmounted(() => {
+  abortController.value?.abort()
+})
+
+const onDelete = (msg: ChatMessage) => {
+  const index = messages.value.findIndex(m => m.id === msg.id)
+  if (index > -1) {
+    messages.value.splice(index, 1)
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.chat-page {
+  display: flex;
+  flex-direction: column;
+  height: calc(100vh - 50px);
+  background: #f7f8fa;
+}
+
+.chat-messages {
+  flex: 1;
+  overflow-y: auto;
+  padding: 16px;
+}
+
+.message-time {
+  text-align: center;
+  color: #999;
+  font-size: 12px;
+  margin: 16px 0;
+}
+
+.loading-history {
+  text-align: center;
+  padding: 16px;
+  color: #999;
+}
+
+.chat-input-area {
+  background: #fff;
+  border-top: 1px solid #eee;
+}
+
+.input-row {
+  display: flex;
+  align-items: flex-end;
+  padding: 12px;
+  gap: 8px;
+}
+
+.message-input {
+  flex: 1;
+  background: #f7f8fa;
+  border-radius: 20px;
+  padding: 8px 12px;
+}
+
+.clear-float {
+  position: fixed;
+  right: 20px;
+  bottom: 290px;
+  width: 40px;
+  height: 40px;
+  background: #fff;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  color: #666;
+  font-size: 20px;
+  z-index: 100;
+}
+</style>
--- a/uno.config.ts
+++ b/uno.config.ts
@ -1,4 +1,4 @@
-import presetRemToPx from "@unocss/preset-rem-to-px"
+// import presetRemToPx from "@unocss/preset-rem-to-px"
 import { defineConfig, presetAttributify, presetWind3 } from "unocss"

 export default defineConfig({
@ -14,7 +14,7 @@ export default defineConfig({
      important: "#app"
    }),
    // 将 unocss 默认采用的 rem 单位转为 px 单位
-    presetRemToPx()
+    // presetRemToPx()
  ],
  // 自定义主题
  theme: {