theme.js 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. const theme = {
  2. state: {
  3. key: 'beiliyou',
  4. beiliyou: {
  5. '--base-color': '#018C39',
  6. '--base-color-a':'#FF5C03',
  7. '--base-bg':'#018C39',
  8. '--base-color-rgba': '1,140,57',
  9. '--user-topbg':'@/static/images/beiliyou/home_top_bg.png'
  10. },
  11. orange: {
  12. '--base-color': '#FC581C',
  13. '--base-color-a':'#FF5C03',
  14. '--base-bg':'#FC581C',
  15. '--base-color-rgba': '252,88,28',
  16. '--user-topbg':'@/static/images/orange/home_top_bg.png'
  17. },
  18. purple: {
  19. '--base-color': '#4C49E9',
  20. '--base-color-a':'#FF5C03',
  21. '--base-bg':'#4C49E9',
  22. '--base-color-rgba': '76,73,233',
  23. '--user-topbg':'@/static/images/purple/home_top_bg.png'
  24. },
  25. red: {
  26. '--base-color': '#C03E25',
  27. '--base-color-a':'#FF5C03',
  28. '--base-bg':'#C03E25',
  29. '--base-color-rgba': '192,62,37',
  30. '--user-topbg':'@/static/images/red/home_top_bg.png'
  31. },
  32. // 当前模板
  33. currentMoban: {
  34. '--base-color': '#018C39',
  35. '--base-color-a':'#FF5C03',
  36. '--base-bg':'#018C39',
  37. '--base-color-rgba': '1,140,57',
  38. '--user-topbg':'@/static/images/beiliyou/home_top_bg.png'
  39. }
  40. },
  41. mutations: {
  42. // 获取当前theme
  43. setTheme(state, value = 'red') {
  44. state.currentMoban = state[value]
  45. }
  46. },
  47. actions: {
  48. // 这是vuex中请求接口变色
  49. async getTheme({
  50. commit
  51. }) {
  52. setTimeout(() => {
  53. // 请求完成 调用 mutations得setTheme 设置模板为 moban2
  54. commit('setTheme', 'red')
  55. }, 100)
  56. }
  57. }
  58. }
  59. export default theme;