app.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. import Vue from 'vue'
  2. import {
  3. SIDEBAR_TYPE,
  4. DEFAULT_THEME,
  5. DEFAULT_LAYOUT_MODE,
  6. DEFAULT_COLOR,
  7. DEFAULT_COLOR_WEAK,
  8. DEFAULT_FIXED_HEADER,
  9. DEFAULT_FIXED_SIDEMENU,
  10. DEFAULT_FIXED_HEADER_HIDDEN,
  11. DEFAULT_CONTENT_WIDTH_TYPE,
  12. DEFAULT_MULTI_TAB
  13. } from '@/store/mutation-types'
  14. const app = {
  15. state: {
  16. sidebar: true,
  17. device: 'desktop',
  18. theme: '',
  19. layout: '',
  20. contentWidth: '',
  21. fixedHeader: false,
  22. fixSiderbar: false,
  23. autoHideHeader: false,
  24. color: null,
  25. weak: false,
  26. multiTab: true,
  27. isNewTab: false,
  28. isNewSubTab: false,
  29. updateList: false
  30. },
  31. mutations: {
  32. SET_SIDEBAR_TYPE: (state, type) => {
  33. state.sidebar = type
  34. Vue.ls.set(SIDEBAR_TYPE, type)
  35. },
  36. CLOSE_SIDEBAR: (state) => {
  37. Vue.ls.set(SIDEBAR_TYPE, true)
  38. state.sidebar = false
  39. },
  40. TOGGLE_DEVICE: (state, device) => {
  41. state.device = device
  42. },
  43. TOGGLE_THEME: (state, theme) => {
  44. // setStore('_DEFAULT_THEME', theme)
  45. Vue.ls.set(DEFAULT_THEME, theme)
  46. state.theme = theme
  47. },
  48. TOGGLE_LAYOUT_MODE: (state, layout) => {
  49. Vue.ls.set(DEFAULT_LAYOUT_MODE, layout)
  50. state.layout = layout
  51. },
  52. TOGGLE_FIXED_HEADER: (state, fixed) => {
  53. Vue.ls.set(DEFAULT_FIXED_HEADER, fixed)
  54. state.fixedHeader = fixed
  55. },
  56. TOGGLE_FIXED_SIDERBAR: (state, fixed) => {
  57. Vue.ls.set(DEFAULT_FIXED_SIDEMENU, fixed)
  58. state.fixSiderbar = fixed
  59. },
  60. TOGGLE_FIXED_HEADER_HIDDEN: (state, show) => {
  61. Vue.ls.set(DEFAULT_FIXED_HEADER_HIDDEN, show)
  62. state.autoHideHeader = show
  63. },
  64. TOGGLE_CONTENT_WIDTH: (state, type) => {
  65. Vue.ls.set(DEFAULT_CONTENT_WIDTH_TYPE, type)
  66. state.contentWidth = type
  67. },
  68. TOGGLE_COLOR: (state, color) => {
  69. Vue.ls.set(DEFAULT_COLOR, color)
  70. state.color = color
  71. },
  72. TOGGLE_WEAK: (state, flag) => {
  73. Vue.ls.set(DEFAULT_COLOR_WEAK, flag)
  74. state.weak = flag
  75. },
  76. TOGGLE_MULTI_TAB: (state, bool) => {
  77. Vue.ls.set(DEFAULT_MULTI_TAB, bool)
  78. state.multiTab = bool
  79. }
  80. },
  81. actions: {
  82. setSidebar ({ commit }, type) {
  83. commit('SET_SIDEBAR_TYPE', type)
  84. },
  85. CloseSidebar ({ commit }) {
  86. commit('CLOSE_SIDEBAR')
  87. },
  88. ToggleDevice ({ commit }, device) {
  89. commit('TOGGLE_DEVICE', device)
  90. },
  91. ToggleTheme ({ commit }, theme) {
  92. commit('TOGGLE_THEME', theme)
  93. },
  94. ToggleLayoutMode ({ commit }, mode) {
  95. commit('TOGGLE_LAYOUT_MODE', mode)
  96. },
  97. ToggleFixedHeader ({ commit }, fixedHeader) {
  98. if (!fixedHeader) {
  99. commit('TOGGLE_FIXED_HEADER_HIDDEN', false)
  100. }
  101. commit('TOGGLE_FIXED_HEADER', fixedHeader)
  102. },
  103. ToggleFixSiderbar ({ commit }, fixSiderbar) {
  104. commit('TOGGLE_FIXED_SIDERBAR', fixSiderbar)
  105. },
  106. ToggleFixedHeaderHidden ({ commit }, show) {
  107. commit('TOGGLE_FIXED_HEADER_HIDDEN', show)
  108. },
  109. ToggleContentWidth ({ commit }, type) {
  110. commit('TOGGLE_CONTENT_WIDTH', type)
  111. },
  112. ToggleColor ({ commit }, color) {
  113. commit('TOGGLE_COLOR', color)
  114. },
  115. ToggleWeak ({ commit }, weakFlag) {
  116. commit('TOGGLE_WEAK', weakFlag)
  117. },
  118. ToggleMultiTab ({ commit }, bool) {
  119. commit('TOGGLE_MULTI_TAB', bool)
  120. }
  121. }
  122. }
  123. export default app