feat: custom theme colors support for dark mode; 🌟

新增：自定义主题色对暗黑模式的支持；

src/components/setting/Setting.vue

@@ -89,7 +89,7 @@ import { mapState, mapMutations } from 'vuex'
 
 const ColorCheckboxGroup = ColorCheckbox.Group
 const ImgCheckboxGroup = ImgCheckbox.Group
-const colors = ['#f5222d', '#fa541c', '#faad14', '#13c2c2', '#52c41a', '#1890ff', '#2f54eb', '#722ed1']
+const colors = ['#f5222d', '#fa541c', '#fadb14', '#49aa19', '#13c2c2', '#1890ff', '#722ed1', '#eb2f96']
 export default {
   name: 'Setting',
   i18n: require('./i18n'),

src/utils/colors.js

@@ -0,0 +1,17 @@
+const {generate} = require('@ant-design/colors')
+// ant design vue 默认主题色
+const antPrimaryColor = '#1890ff'
+// ant design vue 默认dark主题色，若主题色为默认主题色则返回此 dark 主题色系
+const antDarkColors = ['#000c17', '#001529', '#002140']
+
+function getDarkColors(color, theme) {
+  if (color == antPrimaryColor) {
+    return antDarkColors
+  }
+  const lightColors = generate(color, {theme: theme, backgroundColor: '#000000'})
+  const darkColors = generate(lightColors[5], {theme: theme, backgroundColor: '#000000'})
+  let deepDark = darkColors.slice(0, 3)
+  return deepDark
+}
+
+module.exports = {getDarkColors}

src/utils/themeUtil.js

@@ -2,6 +2,7 @@ const varyColor = require('webpack-theme-color-replacer/client/varyColor')
 const client = require('webpack-theme-color-replacer/client')
 const generate =  require('@ant-design/colors/lib/generate').default
 const themeColor = require('../config').themeColor
+const getDarkColors = require('../utils/colors').getDarkColors
 
 module.exports = {
   primaryColor: themeColor,
@@ -11,7 +12,8 @@ module.exports = {
     })
     const palettes = generate(color)
     const rgb = varyColor.toNum3(color.replace('#', '')).join(',')
-    return palettes.concat(lightens).concat(rgb)
+    let darkBgColors = getDarkColors(color, 'dark')
+    return palettes.concat(lightens).concat(rgb).concat(darkBgColors)
   },
   changeThemeColor (newColor) {
     let lastColor = this.lastColor || this.primaryColor