main.vue 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. <template>
  2. <div
  3. class="site-wrapper"
  4. :class="{ 'site-sidebar--fold': sidebarFold }"
  5. v-loading.fullscreen.lock="loading"
  6. element-loading-text="拼命加载中">
  7. <template v-if="!loading">
  8. <main-navbar />
  9. <main-sidebar />
  10. <div class="site-content__wrapper" :style="{ 'min-height': documentClientHeight + 'px' }">
  11. <main-content v-if="!$store.state.common.contentIsNeedRefresh" />
  12. </div>
  13. </template>
  14. </div>
  15. </template>
  16. <script>
  17. import MainNavbar from './main-navbar'
  18. import MainSidebar from './main-sidebar'
  19. import MainContent from './main-content'
  20. export default {
  21. provide () {
  22. return {
  23. // 刷新
  24. refresh () {
  25. this.$store.commit('common/updateContentIsNeedRefresh', true)
  26. this.$nextTick(() => {
  27. this.$store.commit('common/updateContentIsNeedRefresh', false)
  28. })
  29. }
  30. }
  31. },
  32. data () {
  33. return {
  34. loading: true
  35. }
  36. },
  37. components: {
  38. MainNavbar,
  39. MainSidebar,
  40. MainContent
  41. },
  42. computed: {
  43. documentClientHeight: {
  44. get () { return this.$store.state.common.documentClientHeight },
  45. set (val) { this.$store.commit('common/updateDocumentClientHeight', val) }
  46. },
  47. sidebarFold: {
  48. get () { return this.$store.state.common.sidebarFold }
  49. },
  50. userId: {
  51. get () { return this.$store.state.user.id },
  52. set (val) { this.$store.commit('user/updateId', val) }
  53. },
  54. userName: {
  55. get () { return this.$store.state.user.name },
  56. set (val) { this.$store.commit('user/updateName', val) }
  57. },
  58. // token: {
  59. // get () { return this.$store.state.user.token },
  60. // set (val) { this.$store.commit('user/updateToken', val) }
  61. // }
  62. },
  63. created () {
  64. this.getUserInfo()
  65. },
  66. mounted () {
  67. this.resetDocumentClientHeight()
  68. },
  69. methods: {
  70. // 重置窗口可视高度
  71. resetDocumentClientHeight () {
  72. this.documentClientHeight = document.documentElement['clientHeight']
  73. window.onresize = () => {
  74. this.documentClientHeight = document.documentElement['clientHeight']
  75. }
  76. },
  77. // 获取当前管理员信息
  78. getUserInfo () {
  79. this.$http({
  80. url: this.$http.adornUrl('/sys/user/info'),
  81. method: 'get',
  82. params: this.$http.adornParams()
  83. }).then(({data}) => {
  84. if (data && data.code === 0) {
  85. this.loading = false
  86. this.userId = data.user.userId
  87. this.userName = data.user.username
  88. // this.token = data.user.token
  89. }
  90. })
  91. }
  92. }
  93. }
  94. </script>