feat(config): 实现后端配置管理功能

- 添加 ApiUrl 和 theme 配置字段支持
- 新增根据 code 查询应用参数的 API 接口- 实现配置 store 管理网站配置数据
- 支持 API 地址优先级: 后台配置 > 本地配置- 配置数据自动存储到 localStorage 实现持久化- 添加配置管理说明文档 CONFIG_MANAGEMENT.md- 优化请求工具支持动态 API 地址切换- 移除无用的 openNew 工具函数引入
- 实现主题配置自动加载和存储功能

CONFIG_MANAGEMENT.md

@@ -0,0 +1,149 @@
+# 后端配置管理说明
+
+## 概述
+
+本项目实现了与小程序端一致的配置管理机制，后端管理端现在也支持优先使用后台配置的API地址。
+
+## 核心文件
+
+1. `src/store/modules/config.ts` - 配置状态管理模块
+2. `src/composables/useConfig.ts` - 配置初始化组合式函数
+3. `src/views/system/config-demo.vue` - 配置演示页面
+4. `src/utils/request.ts` - 更新后的请求工具，支持API地址优先级
+
+## 功能特性
+
+### 1. API地址优先级
+- 优先使用后台配置的API地址（存储在config中的ApiUrl字段）
+- 如果未配置，则回退使用本地配置的API_BASE_URL
+
+### 2. 配置存储
+- 使用Pinia进行状态管理
+- 同时存储在localStorage中，支持持久化
+- 提供获取、设置、刷新、清除配置的方法
+
+### 3. 自动初始化
+- 应用启动时自动加载配置
+- 支持从缓存中快速恢复配置
+
+## 使用方法
+
+### 在组件中使用配置store
+
+```typescript
+import { useConfigStore } from '@/store/modules/config';
+
+export default defineComponent({
+  setup() {
+    const configStore = useConfigStore();
+    
+    // 获取配置
+    const config = configStore.config;
+    
+    // 获取API地址
+    const apiUrl = configStore.getApiUrl;
+    
+    // 获取网站名称
+    const siteName = configStore.getSiteName;
+    
+    // 刷新配置
+    const refreshConfig = async () => {
+      try {
+        await configStore.refetchConfig();
+      } catch (error) {
+        console.error('刷新配置失败:', error);
+      }
+    };
+    
+    return {
+      config,
+      apiUrl,
+      siteName,
+      refreshConfig
+    };
+  }
+});
+```
+
+### 在组合式API中使用
+
+```typescript
+import { useConfigStore } from '@/store/modules/config';
+
+export default defineComponent({
+  setup() {
+    const configStore = useConfigStore();
+    
+    // 监听配置变化
+    watch(() => configStore.config, (newConfig) => {
+      console.log('配置已更新:', newConfig);
+    });
+    
+    return {};
+  }
+});
+```
+
+### 在请求工具中使用
+
+请求工具会自动优先使用配置中的API地址：
+
+```typescript
+// src/utils/request.ts
+const getBaseUrl = (): string => {
+  // 尝试从配置store获取后台配置的API地址
+  try {
+    const configStore = useConfigStore();
+    if (configStore.config && configStore.config.ApiUrl) {
+      return configStore.config.ApiUrl;
+    }
+    
+    // 回退到localStorage
+    const configStr = localStorage.getItem('config');
+    if (configStr) {
+      const config = typeof configStr === 'string' ? JSON.parse(configStr) : configStr;
+      if (config && config.ApiUrl) {
+        return config.ApiUrl;
+      }
+    }
+  } catch (error) {
+    console.warn('获取后台配置API地址失败:', error);
+  }
+
+  // 最后回退到本地配置
+  return API_BASE_URL;
+};
+```
+
+## 配置字段说明
+
+配置对象包含以下字段：
+
+- `siteName` - 网站名称
+- `siteLogo` - 网站Logo
+- `domain` - 域名
+- `icpNo` - ICP备案号
+- `copyright` - 版权信息
+- `loginBgImg` - 登录背景图
+- `address` - 联系地址
+- `tel` - 联系电话
+- `kefu2` - 客服2
+- `kefu1` - 客服1
+- `email` - 邮箱
+- `loginTitle` - 登录标题
+- `sysLogo` - 系统Logo
+- `ApiUrl` - API地址（新增）
+- `theme` - 主题（新增）
+
+## 菜单配置
+
+配置演示页面已添加到系统管理菜单中：
+- 路径：`/system/config-demo`
+- 组件：`/src/views/system/config-demo.vue`
+- 图标：`ExperimentOutlined`
+
+## 注意事项
+
+1. 配置数据会自动存储在localStorage中，键名为`config`
+2. 主题配置会存储在localStorage中，键名为`user_theme`
+3. 如果需要自定义配置字段，需要更新`src/api/cms/cmsWebsiteField/model/index.ts`中的Config接口定义

src/api/cms/cmsWebsiteField/index.ts

@@ -105,6 +105,19 @@ export async function getCmsWebsiteField(id: number) {
   return Promise.reject(new Error(res.data.message));
 }
 
+/**
+ * 根据code查询应用参数
+ */
+export async function getCmsWebsiteFieldByCode(code: string) {
+  const res = await request.get<ApiResult<CmsWebsiteField>>(
+    MODULES_API_URL + '/cms/cms-website-field/getByCode/' + code
+  );
+  if (res.data.code === 0 && res.data.data) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
 /**
  * 恢复项目参数
  */

src/api/cms/cmsWebsiteField/model/index.ts

@@ -58,4 +58,8 @@ export interface Config {
   email?: string;
   loginTitle?: string;
   sysLogo?: string;
+  // 添加API地址配置项
+  ApiUrl?: string;
+  // 添加主题配置项
+  theme?: string;
 }

src/layout/components/header-tools.vue

@@ -141,7 +141,7 @@ import {
   FullscreenExitOutlined
 } from '@ant-design/icons-vue';
 import {storeToRefs} from 'pinia';
-import {copyText, openNew, openUrl} from '@/utils/common';
+import {copyText, openUrl} from '@/utils/common';
 import {useThemeStore} from '@/store/modules/theme';
 import HeaderNotice from './header-notice.vue';
 import PasswordModal from './password-modal.vue';
@@ -152,6 +152,8 @@ import {listRoles} from '@/api/system/role';
 import { useSiteStore } from '@/store/modules/site';
 import Qrcode from "@/components/QrCode/index.vue";
 import {AppInfo} from "@/api/cms/cmsWebsite/model";
+import {getCmsWebsiteFieldByCode} from "@/api/cms/cmsWebsiteField";
+import {API_BASE_URL} from "@/config/setting";
 
 // 是否开启响应式布局
 const themeStore = useThemeStore();
@@ -244,6 +246,15 @@ const reload = () => {
       }
     });
   }
+  // 检查是否启动自定义接口
+  if(!localStorage.getItem('ApiUrl')){
+    localStorage.setItem('ApiUrl', `${API_BASE_URL}`)
+    getCmsWebsiteFieldByCode('ApiUrl').then(res => {
+      if(res){
+        localStorage.setItem('ApiUrl', `${res.value}`);
+      }
+    })
+  }
 };
 
 reload();

src/store/modules/template.ts

@@ -0,0 +1,119 @@
+/**
+ * 网站配置 store
+ */
+import { defineStore } from 'pinia';
+import {configWebsiteField} from '@/api/cms/cmsWebsiteField';
+import type { Config } from '@/api/cms/cmsWebsiteField/model';
+
+export interface ConfigState {
+  config: Config | null;
+  loading: boolean;
+  error: Error | null;
+}
+
+export const useConfigStore = defineStore({
+  id: 'config',
+  state: (): ConfigState => ({
+    // 网站配置数据
+    config: null,
+    // 加载状态
+    loading: false,
+    // 错误信息
+    error: null
+  }),
+  getters: {
+    /**
+     * 获取网站配置
+     */
+    getConfig(state): Config | null {
+      return state.config;
+    },
+
+    /**
+     * 获取API地址
+     */
+    getApiUrl(state): string | undefined {
+      return state.config?.ApiUrl;
+    },
+
+    /**
+     * 获取网站名称
+     */
+    getSiteName(state): string | undefined {
+      return state.config?.siteName;
+    },
+
+    /**
+     * 获取网站Logo
+     */
+    getSiteLogo(state): string | undefined {
+      return state.config?.siteLogo;
+    }
+  },
+  actions: {
+    /**
+     * 获取网站配置数据
+     */
+    async fetchConfig() {
+      try {
+        this.loading = true;
+        this.error = null;
+        const data = await configWebsiteField();
+        this.config = data;
+
+        // 保存到localStorage中，供其他地方使用
+        localStorage.setItem('config', JSON.stringify(data));
+
+        // 设置主题
+        if (data.theme && !localStorage.getItem('user_theme')) {
+          localStorage.setItem('user_theme', data.theme);
+        }
+
+        return data;
+      } catch (err) {
+        this.error = err instanceof Error ? err : new Error('获取配置失败');
+        console.error('获取网站配置失败:', err);
+        throw err;
+      } finally {
+        this.loading = false;
+      }
+    },
+
+    /**
+     * 更新配置数据
+     */
+    setConfig(value: Config) {
+      this.config = value;
+      // 同时更新localStorage
+      localStorage.setItem('config', JSON.stringify(value));
+    },
+
+    /**
+     * 重新获取配置数据
+     */
+    async refetchConfig() {
+      try {
+        this.loading = true;
+        this.error = null;
+        const data = await configWebsiteField();
+        this.config = data;
+        localStorage.setItem('config', JSON.stringify(data));
+        return data;
+      } catch (err) {
+        this.error = err instanceof Error ? err : new Error('获取配置失败');
+        console.error('重新获取网站配置失败:', err);
+        throw err;
+      } finally {
+        this.loading = false;
+      }
+    },
+
+    /**
+     * 清除配置数据
+     */
+    clearConfig() {
+      this.config = null;
+      localStorage.removeItem('config');
+    }
+  }
+});

src/utils/enhanced-request.ts

@@ -1,8 +1,7 @@
 /**
  * 增强的 API 请求工具
  */
-import axios, { AxiosRequestConfig, AxiosResponse, AxiosError } from 'axios';
-import { message } from 'ant-design-vue';
+import axios, { AxiosRequestConfig, AxiosError } from 'axios';
 import { apiPerformanceMonitor } from './performance';
 import { memoryCache } from './cache-manager';
 import { getToken } from './token-util';

src/utils/request.ts

@@ -13,8 +13,26 @@ import type { ApiResult } from '@/api';
 import { getHostname, getTenantId } from '@/utils/domain';
 import { getMerchantId } from "@/utils/merchant";
 
+// 获取API基础地址的函数
+const getBaseUrl = (): string => {
+  // 尝试从配置store获取后台配置的API地址
+  try {
+    // 如果store中没有，则尝试从localStorage获取
+    const ApiUrl = localStorage.getItem('ApiUrl');
+    if (ApiUrl) {
+      return ApiUrl;
+    }
+  } catch (error) {
+    console.warn('获取后台配置API地址失败:', error);
+  }
+
+  // 如果后台没有配置API地址，则使用本地配置
+  console.log('使用本地配置的API地址:', API_BASE_URL);
+  return API_BASE_URL;
+};
+
 const service = axios.create({
-  baseURL: API_BASE_URL
+  baseURL: getBaseUrl()
 });
 
 /**

src/views/passport/login/index.vue

@@ -284,7 +284,6 @@ import {Config} from '@/api/cms/cmsWebsiteField/model';
 import {phoneReg} from 'ele-admin-pro';
 import router from "@/router";
 import {listAdminsByPhoneAll} from "@/api/system/user";
-import {getUserInfo} from "@/api/layout";
 import {QrCodeStatusResponse} from "@/api/passport/qrLogin";
 
 const useForm = Form.useForm;