# 绿纤协同平台配置系统说明

## 📋 概述

本配置系统用于管理不同环境的API地址配置，支持本地开发环境和正式环境的快速切换。

## 🏗️ 文件结构

```
html/
├── config.js              # 主配置文件
├── expansion.html         # 拓客页面（已集成配置）
├── expansion-template.html # 拓客模板页面（已集成配置）
└── README-config.md       # 本说明文档
```

## ⚙️ 配置说明

### 环境配置

**1. 本地开发环境 (development)**
- 名称：本地开发环境
- API地址：`http://localhost:5000`
- 描述：本地开发服务器

**2. 正式环境 (production)**
- 名称：正式环境
- API地址：`http://lvqian.antissoft.com`
- 描述：生产环境服务器

### 默认环境

- 默认使用正式环境（production）
- 可通过修改 `config.js` 中的 `CURRENT_ENV` 变量来切换

## 🚀 使用方法

### 1. 基本使用

在HTML页面中引入配置文件：

```html
<script src="config.js"></script>
```

### 2. 获取配置信息

```javascript
// 获取当前环境配置
const config = window.APP_CONFIG.getCurrentConfig();

// 获取API基础地址
const apiUrl = window.APP_CONFIG.getApiBaseUrl();

// 获取环境名称
const envName = window.APP_CONFIG.getEnvName();

// 获取环境描述
const envDesc = window.APP_CONFIG.getEnvDescription();
```

### 3. 环境切换

```javascript
// 切换到开发环境
window.APP_CONFIG.switchEnvironment('development');

// 切换到正式环境
window.APP_CONFIG.switchEnvironment('production');
```

### 4. 环境检查

```javascript
// 检查是否为开发环境
if (window.APP_CONFIG.isDevelopment()) {
    console.log('当前为开发环境');
}

// 检查是否为生产环境
if (window.APP_CONFIG.isProduction()) {
    console.log('当前为生产环境');
}
```

## 🔧 页面集成

### 拓客页面 (expansion.html)

- 已完全集成配置系统
- 支持环境切换按钮
- 显示当前环境信息
- 自动加载默认配置

### 拓客模板页面 (expansion-template.html)

- 已集成配置系统
- 自动加载默认配置
- 支持配置持久化

## 💾 配置持久化

### localStorage 存储

- `expansionApiBaseUrl`: 拓客页面的API地址
- `expansionTemplateApiUrl`: 拓客模板页面的API地址

### 优先级

1. 用户手动输入的配置（localStorage）
2. 配置文件中的默认值
3. 硬编码的备用值

## 🎯 开发调试

### 控制台命令

```javascript
// 查看当前配置
console.log(window.APP_CONFIG.getCurrentConfig());

// 切换环境
window.APP_CONFIG.switchEnvironment('development');

// 查看所有可用环境
console.log(window.APP_CONFIG.getAvailableEnvironments());
```

### 环境切换事件

当环境切换时，会触发 `envChanged` 事件：

```javascript
window.addEventListener('envChanged', function(event) {
    console.log('环境已切换:', event.detail);
});
```

## 🔄 添加新页面

### 1. 引入配置文件

```html
<script src="config.js"></script>
```

### 2. 加载配置

```javascript
function loadConfig() {
    const savedApiUrl = localStorage.getItem('yourPageApiUrl');
    const defaultApiUrl = window.APP_CONFIG ? window.APP_CONFIG.getApiBaseUrl() : 'http://localhost:5000';
    const apiUrl = savedApiUrl || defaultApiUrl;
    
    // 设置到页面元素
    document.getElementById('apiUrl').value = apiUrl;
}
```

### 3. 保存配置

```javascript
function saveConfig() {
    const apiUrl = document.getElementById('apiUrl').value;
    localStorage.setItem('yourPageApiUrl', apiUrl);
}
```

## 🚨 注意事项

1. **配置文件加载顺序**: 确保在使用配置前已加载 `config.js`
2. **localStorage 键名**: 不同页面使用不同的键名避免冲突
3. **环境切换**: 切换环境后需要重新加载页面配置
4. **错误处理**: 配置加载失败时使用备用值

## 📝 更新日志

- **v1.0.0**: 初始版本，支持开发和生产环境
- 支持环境切换功能
- 集成到拓客相关页面
- 添加配置持久化支持