MainPage.jsx 3.09 KB
import React from 'react'
import Axios from 'axios'
import { Layout } from 'antd'
import uuid from 'uuid/v4'

import ContentRoutes from '../../routes/contentRoutes'
import SubmenuRoutes from '../../routes/submenuRoutes'

import Header from '../../templates/layout/header/WDSHeaderTemplate'
import Sider from '../../templates/layout/sider/WDSSiderTemplate'
import Breadcrumb from '../../templates/layout/breadcrumb/WDSBreadcrumbTemplate'
import Footer from '../../templates/layout/footer/WDSFooterTemplate'

import * as UrlConstants from '../../resources/js/constants/urlConstants'
import history from '../../history'

import './resources/style/css/mainPage.css'

const headerAction = {
  setSystemInfo: uuid(),
  logout: uuid()
}

const mainMenuAction = {
  setMainMenu: uuid(),
  setBreadcrumb: uuid()
}

const breadcrumbAction = {
  setMainMenu: uuid(),
  setBreadcrumb: uuid()
}

const footerAction = {
  setFooter: uuid()
}

export default class MainPage extends React.Component {
  constructor(props) {
    super(props)
    this.state = { collapsed: false }
  }

  componentDidMount() {
    this._requestGetSystemInfoApi()
    this._requestGetMenuApi()
    this._handleLogout()
  }

  componentWillUnmount() {
    this.props.eventEmitter.removeAllListeners(
      headerAction.setSystemInfo,
      headerAction.logout
    )
  }

  _requestGetSystemInfoApi = async () => {
    const params = {}
    const results = await Axios.post(UrlConstants.URL_GET_SYSTEM_INFO, params)

    if (results.data.success) {
      const { eventEmitter } = this.props
      eventEmitter.emit(headerAction.setSystemInfo, results.data)
    }
  }

  _requestGetMenuApi = async () => {
    const params = {}
    const results = await Axios.post(UrlConstants.URL_GET_MENU, params)

    if (results.data.success) {
      const { eventEmitter } = this.props
      eventEmitter.emit(mainMenuAction.setMainMenu, results.data.dataList)
    }
  }

  _handleLogout = () => {
    this.props.eventEmitter.on(headerAction.logout, async data => {
      const params = {}
      const results = await Axios.post(UrlConstants.URL_LOGOUT, params)

      if (results.data.success) {
        history.push('/login')
      }
    })
  }

  render() {
    return (
      <Layout style={{ minHeight: '100vh' }}>
        <Header
          actionEmitter={headerAction}
          eventEmitter={this.props.eventEmitter}
        />
        <Sider
          actionEmitter={mainMenuAction}
          eventEmitter={this.props.eventEmitter}
        />
        <Layout>
          <Breadcrumb
            actionEmitter={breadcrumbAction}
            eventEmitter={this.props.eventEmitter}
          />

          <div className="content" style={{ margin: 10 }}>
            <ContentRoutes
              match={this.props.match}
              eventEmitter={this.props.eventEmitter}
            />
            <SubmenuRoutes
              match={this.props.match}
              eventEmitter={this.props.eventEmitter}
            />
          </div>

          <Footer
            actionEmitter={footerAction}
            eventEmitter={this.props.eventEmitter}
          />
        </Layout>
      </Layout>
    )
  }
}