feat: 主题颜色的定义

client-configs.json

@@ -1,6 +1,6 @@
 {
   "zhinian": {
-    "clientId": "6",
+    "clientId": "8",
     "appId": "wx5e79df5996572539",
     "name": "智念",
     "placeholder": "快告诉智念您在想什么~",

src/manager/ThemeManager.js

@@ -0,0 +1,91 @@
+/**
+ * 主题颜色管理类
+ *
+ * 根据不同客户端切换主题颜色
+ * 支持5个颜色: color800, color700, color500, color100, color50
+ */
+
+import rawThemeConfigs from '../../theme-configs.json' with { type: 'json' };
+import { currentClientType } from '@/constant/base.js';
+
+// 主题颜色key定义
+export const ThemeColorKey = {
+  COLOR_800: 'color800',
+  COLOR_700: 'color700',
+  COLOR_500: 'color500',
+  COLOR_100: 'color100',
+  COLOR_50: 'color50',
+};
+
+// 所有颜色key数组
+const THEME_COLOR_KEYS = Object.values(ThemeColorKey);
+
+class ThemeManager {
+  constructor() {
+    this.currentClient = currentClientType().toLowerCase();
+    this.themeConfigs = rawThemeConfigs;
+    this.currentTheme = this.themeConfigs[this.currentClient] || this.themeConfigs.zhinian;
+  }
+
+  /** 获取当前客户端 */
+  getClient() {
+    return this.currentClient;
+  }
+
+  /** 获取指定颜色 */
+  getColor(key) {
+    return this.currentTheme[key] || '';
+  }
+
+  /** 获取所有颜色对象 */
+  getAllColors() {
+    return { ...this.currentTheme };
+  }
+
+  /** 切换主题 */
+  switchTheme(clientType) {
+    if (this.themeConfigs[clientType]) {
+      this.currentClient = clientType;
+      this.currentTheme = this.themeConfigs[clientType];
+    }
+  }
+
+  /** 生成CSS变量 */
+  generateCssVariables() {
+    const colors = this.currentTheme;
+    return THEME_COLOR_KEYS.map(key => `--theme-${key}: ${colors[key]};`).join('\n');
+  }
+
+  /** 应用主题到页面 */
+  applyTheme() {
+    const cssVars = this.generateCssVariables();
+
+    // #ifdef H5
+    const style = document.createElement('style');
+    style.id = 'theme-variables';
+    style.innerHTML = `:root { ${cssVars} }`;
+    document.head.appendChild(style);
+    // #endif
+
+    // #ifdef MP-WEIXIN
+    const pages = getCurrentPages();
+    const currentPage = pages[pages.length - 1];
+    currentPage?.setData({ themeCssVars: cssVars });
+    // #endif
+
+    return cssVars;
+  }
+}
+
+// 导出单例
+export const themeManager = new ThemeManager();
+
+// 便捷函数
+export const getThemeColor = (key) => themeManager.getColor(key);
+export const getAllThemeColors = () => themeManager.getAllColors();
+export const applyTheme = () => themeManager.applyTheme();
+
+// 便捷属性直接获取（推荐）
+export const themeColors = themeManager.currentTheme;
+
+export default ThemeManager;

theme-configs.json

@@ -0,0 +1,23 @@
+{
+  "zhinian": {
+    "color800": "#0B7034",
+    "color700": "#0B5C2D",
+    "color500": "#0CCD58",
+    "color100": "#E8FFF1",
+    "color50": "#F0F8F3"
+  },
+  "duohua": {
+    "color800": "#174BB6",
+    "color700": "#19428F",
+    "color500": "#2D91FF",
+    "color100": "#D9EEFF",
+    "color50": "#EEF8FF"
+  },
+  "tianmu": {
+    "color800": "#174BB6",
+    "color700": "#19428F",
+    "color500": "#2D91FF",
+    "color100": "#D9EEFF",
+    "color50": "#EEF8FF"
+  }
+}