初始化移动端提交

sheep/helper/theme.js

@@ -0,0 +1,125 @@
+// 主题工具函数
+import { themeConfig } from '@/sheep/config/theme';
+
+/**
+ * 获取主题色
+ * @param {string} type - 主题色类型 'main' | 'light' | 'dark'
+ * @returns {string} 颜色值
+ */
+export function getThemeColor(type = 'main') {
+  return themeConfig.primary[type] || themeConfig.primary.main;
+}
+
+/**
+ * 获取主题色透明度版本
+ * @param {number} opacity - 透明度 1-5
+ * @returns {string} rgba颜色值
+ */
+export function getThemeColorWithOpacity(opacity = 1) {
+  return themeConfig.primary.opacity[opacity] || themeConfig.primary.opacity[1];
+}
+
+/**
+ * 获取语义化颜色
+ * @param {string} type - 颜色类型 'success' | 'warning' | 'danger' | 'info'
+ * @returns {string} 颜色值
+ */
+export function getSemanticColor(type) {
+  return themeConfig.colors[type] || themeConfig.colors.info;
+}
+
+/**
+ * 获取文本颜色
+ * @param {string} type - 文本类型 'primary' | 'regular' | 'secondary' | 'placeholder'
+ * @returns {string} 颜色值
+ */
+export function getTextColor(type = 'primary') {
+  return themeConfig.colors.text[type] || themeConfig.colors.text.primary;
+}
+
+/**
+ * 获取边框颜色
+ * @param {string} type - 边框类型 'base' | 'light' | 'lighter' | 'extra_light'
+ * @returns {string} 颜色值
+ */
+export function getBorderColor(type = 'base') {
+  return themeConfig.colors.border[type] || themeConfig.colors.border.base;
+}
+
+/**
+ * 获取背景颜色
+ * @param {string} type - 背景类型 'base' | 'page' | 'card'
+ * @returns {string} 颜色值
+ */
+export function getBackgroundColor(type = 'base') {
+  return themeConfig.colors.background[type] || themeConfig.colors.background.base;
+}
+
+/**
+ * 设置主题色
+ * @param {string} color - 新的主题色
+ */
+export function setThemeColor(color) {
+  // 更新主题配置
+  themeConfig.primary.main = color;
+  // 生成相关颜色
+  themeConfig.primary.light = lightenColor(color, 20);
+  themeConfig.primary.dark = darkenColor(color, 20);
+  // 生成透明度颜色
+  const rgb = hexToRgb(color);
+  for (let i = 1; i <= 5; i++) {
+    themeConfig.primary.opacity[i] = `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.${i})`;
+  }
+}
+
+/**
+ * 十六进制颜色转RGB
+ */
+function hexToRgb(hex) {
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+  return result ? {
+    r: parseInt(result[1], 16),
+    g: parseInt(result[2], 16),
+    b: parseInt(result[3], 16)
+  } : null;
+}
+
+/**
+ * 颜色变亮
+ */
+function lightenColor(hex, percent) {
+  const rgb = hexToRgb(hex);
+  if (!rgb) return hex;
+  
+  const factor = percent / 100;
+  rgb.r = Math.round(rgb.r + (255 - rgb.r) * factor);
+  rgb.g = Math.round(rgb.g + (255 - rgb.g) * factor);
+  rgb.b = Math.round(rgb.b + (255 - rgb.b) * factor);
+  
+  return `#${rgb.r.toString(16).padStart(2, '0')}${rgb.g.toString(16).padStart(2, '0')}${rgb.b.toString(16).padStart(2, '0')}`;
+}
+
+/**
+ * 颜色变暗
+ */
+function darkenColor(hex, percent) {
+  const rgb = hexToRgb(hex);
+  if (!rgb) return hex;
+  
+  const factor = percent / 100;
+  rgb.r = Math.round(rgb.r * (1 - factor));
+  rgb.g = Math.round(rgb.g * (1 - factor));
+  rgb.b = Math.round(rgb.b * (1 - factor));
+  
+  return `#${rgb.r.toString(16).padStart(2, '0')}${rgb.g.toString(16).padStart(2, '0')}${rgb.b.toString(16).padStart(2, '0')}`;
+}
+
+export default {
+  getThemeColor,
+  getThemeColorWithOpacity,
+  getSemanticColor,
+  getTextColor,
+  getBorderColor,
+  getBackgroundColor,
+  setThemeColor
+};