import React, { useState }  from 'react'
import { withRouter, matchPath } from 'dva/router'
import Header from './Header'
import Sider from './Sider'
import AlarmEditModal from '../components/Edit/AlarmEditModal'
import { $consts } from '../plugins'
import './main.less'
const BackendLayout = (props) => {
  return (
    <div className='main'>
      <div className='main__header'><Header /></div>
      <div className='main__backend'>
        {props.children}
      </div>
    </div>
  )
}

const MainLayout = (props) => {
  const { pathname } = props.location
  const matchLogin = matchPath(pathname, {
    path: $consts['ROUTE/LOGIN'],
    exact: true,
    strict: true
  })
  let matchHome =false;
  const [matchPost, setMatchPost] = useState(false)
  /** 手机端隐藏 */
  if (window.navigator.userAgent.indexOf("Windows") < 1) 
  {
    matchHome =true
  }
  const repost=()=>{
    setMatchPost(!matchPost)
  }
  
  return (
    <div className={`main ${matchLogin ? 'float' : ''}`}>
      <div className='main__header'><Header matchLogin={matchLogin} /></div>
      <div className={matchHome ? 'main__body2' : 'main__body'}>
        <div className='main__body-sider'><Sider matchLogin={matchLogin?matchLogin:matchHome} repost={matchPost}/></div>
        <div className='main__body-content' onClick={repost}>{props.children}</div>
      </div>
    </div>
  )
}

class Main extends React.Component {
  render () {
    const { pathname } = this.props.location
    const matchBackend = matchPath(pathname, {
      path: $consts['ROUTE/BACKEND'],
      exact: true,
      strict: true
    })
    const matchLogin = matchPath(pathname, {
      path: $consts['ROUTE/LOGIN'],
      exact: true,
      strict: true
    })
    return (
      <React.Fragment>
        {matchBackend ? <BackendLayout {...this.props} /> : <MainLayout {...this.props} />}
        {/* 去掉首页报警框 */}
        {/* {matchLogin ? null : <AlarmEditModal />} */}
      </React.Fragment>
    )
  }
}

export default withRouter(Main)