# cityLight

**Repository Path**: LetheGetaWay/city-light

## Basic Information

- **Project Name**: cityLight
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-28
- **Last Updated**: 2025-11-29

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README


# 智能助手演示项目使用文档

## 项目简介

本项目是一个基于 UmiJS 和 Ant Design 开发的智能助手演示界面，用于展示一个可配置的 AI 聊天组件（commentAIChat）的各种功能和配置选项。

### 主要功能包括：

- 动态配置窗口标题、高度等。

- 支持开启/关闭日志、文件上传、语音输入等功能。

- 支持新对话、历史对话记录查看。

- 消息发送与展示，支持用户与 AI 的交互。


### 启动方式

1. 环境准备

   确保本地已安装：

   - Node.js（建议 v14.x 或以上）

   - npm 或 yarn

2. 安装依赖

    `yarn install`


3. 启动开发服务器

    `yarn start`

   启动后，默认访问地址为：http://localhost:8000


### 功能说明

1. 配置面板（左侧）

- 标题：设置聊天窗口的标题。

- 场景：选择助手的使用场景（如“通用助手”）。

- 提示词组：设置输入框上方的提示语。

- 高度：通过滑动条动态调整聊天窗口高度（560px ~ 1200px）。

- 功能开关：

  - 启用日志：控制是否显示“执行日志”按钮。

  - 启用上传：控制是否启用文件上传按钮。

  - 启用语音输入：控制是否启用语音输入按钮。

所有配置实时保存，并通过 updateConfigs API 提交到后端(模拟)。

2. 聊天主界面（右侧）

- 顶部操作栏：

  - 显示当前标题与场景。

  - “历史记录”按钮：打开历史对话模态框，可选择并加载已有对话。

  - “新对话”按钮：发起一个新对话，清空当前内容。

- 消息区域：

  - 用户消息：右对齐。

  - AI 消息：左对齐。

- 输入区域：

  - 支持回车发送（Enter 发送）。

  - 最大输入长度：100 字符。

  - 上传与语音按钮受配置控制（完善中）。

  - 发送按钮：点击或回车触发消息发送。

3. 执行日志按钮（完善中）

- 位于页面右侧，垂直文字按钮。

- 受“启用日志”配置控制，禁用时为灰色。

### 注意事项

1. API 依赖：

  - 所有 API 方法（如 launchDialog, sendMessage, getHistoryDialogById）定义在 @/api/message(使用localStorage模拟)

  - 当前为演示项目，部分功能（如上传、语音、日志）尚未实现，点击时仅提示“功能完善中”。

2. 状态管理：

  - 当前对话状态（currentDialog）保存在组件状态中，页面刷新后丢失。

  - 历史记录通过 localStorage 或后端接口维护（示例中清空 localStorage）。

3. 样式与布局：

  - 使用 Ant Design 的 Row、Col 实现栅格布局。

  - 聊天区域高度自适应，支持滚动。

  - 本项目部分样式由AI生成，提示词统一为：代码+需求。如”...（tsx代码），将聊天文本输入框固定在下方“


### 目录结构

src/

├── pages/

│   └── IndexPage.tsx          # 主页面

├── components/

│   └── HistoryModal.tsx       # 历史记录弹窗

├── api/

│   └── message.ts             # API 请求封装


版本：v0.1.0
最后更新：2025-11-29




本项目仅作为面试题目测试使用