# 火情监控全链路业务监控视图

Vue 3 + TypeScript 开发的监控视图展示项目，带有动态流动效果的连线动画。

## 项目特点

- 使用 Vue 3 + TypeScript + Vite 构建
- 连线流动动画效果（8-12秒循环）
- 红色线条使用 #EB5017 颜色流动

## 本地开发

```bash
# 安装依赖
npm install

# 启动开发服务器
npm run dev

# 构建生产版本
npm run build

# 预览生产版本
npm run preview
```

## 部署到网站

项目已构建完成，生产文件位于 `dist` 目录。

## 目录结构

```
/Users/gavin/monitor/
├── dist/                 # 生产构建文件（可直接部署）
├── src/
│   ├── App.vue          # 主组件（包含动画逻辑）
│   ├── main.ts          # 入口文件
│   ├── style.css        # 全局样式
│   └── vite-env.d.ts    # TypeScript 类型定义
├── index.html           # HTML 模板
├── monitor.svg          # 监控视图 SVG 文件
├── package.json         # 项目配置
├── tsconfig.json        # TypeScript 配置
└── vite.config.ts       # Vite 配置
```

## 技术栈

- Vue 3
- TypeScript
- Vite
- CSS3 动画