const varyColor = require('webpack-theme-color-replacer/client/varyColor') const generate = require('@ant-design/colors/lib/generate').default const {theme} = require('../config/default') const themeMode = theme.mode // ant design vue 默认主题色 const antdPrimary = '#1890ff' // 获取 ant design 色系 function getAntdColors(color, mode) { let options = mode && (mode == themeMode.NIGHT) ? {theme: 'dark'} : undefined return generate(color, options) } // 获取菜单色系 function getMenuColors(color, mode) { if (mode == themeMode.NIGHT) { return ['#151515', '#1f1f1f', '#1e1e1e'] } else if (color == antdPrimary) { return ['#000c17', '#001529', '#002140'] } else { return [varyColor.darken(color, 0.93), varyColor.darken(color, 0.83), varyColor.darken(color, 0.73)] } } // 获取主题模式切换色系 function getThemeToggleColors(color, mode) { //主色系 const mainColors = getAntdColors(color, mode) const primary = mainColors[5] //辅助色系,因为 antd 目前没针对夜间模式设计,所以增加辅助色系以保证夜间模式的正常切换 const subColors = getAntdColors(primary, themeMode.LIGHT) //菜单色系 const menuColors = getMenuColors(color, mode) //内容色系(包含背景色、文字颜色等) const themeCfg = theme[mode] let contentColors = Object.keys(themeCfg) .map(key => themeCfg[key]) .map(color => isHex(color) ? color : toNum3(color).join(',')) // 内容色去重 // contentColors = [...new Set(contentColors)] // rgb 格式的主题色 let rgbColors = [toNum3(primary).join(',')] return {primary, mainColors, subColors, menuColors, contentColors, rgbColors} } function toNum3(color) { if (isHex(color)) { return varyColor.toNum3(color) } let colorStr = '' if (isRgb(color)) { colorStr = color.slice(5, color.length) } else if (isRgba(color)) { colorStr = color.slice(6, color.lastIndexOf(',')) } let rgb = colorStr.split(',') const r = parseInt(rgb[0]) const g = parseInt(rgb[1]) const b = parseInt(rgb[2]) return [r, g, b] } function isHex(color) { return color.length >= 4 && color[0] == '#' } function isRgb(color) { return color.length >= 10 && color.slice(0, 3) == 'rgb' } function isRgba(color) { return color.length >= 13 && color.slice(0, 4) == 'rgba' } module.exports = { isHex, isRgb, isRgba, toNum3, getAntdColors, getMenuColors, getThemeToggleColors }