import React from 'react';
import Media from 'react-media';
import { connect } from 'dva';
import PageLoading from '@/components/PageLoading';
import BasicLayout from './BasicLayout';

class LayoutWrapper extends React.PureComponent {
  componentDidMount() {
    const { dispatch, currentSite, location } = this.props;
    const isApplyPage = location.pathname.includes('/apply');

    // 非 apply 页 & currentSite 为空，初始化请求
    if (!isApplyPage) {
      dispatch({ type: 'global/get_site_list_data', payload: { isAll: true } });
    }
  }

  render() {
    const { currentSite, location } = this.props;
    const isApplyPage = location.pathname.includes('/apply');

    if (isApplyPage) {
      // apply 页直接加载 BasicLayout
      return (
        <Media query="(max-width: 599px)">
          {isMobile => <BasicLayout {...this.props} isMobile={isMobile} />}
        </Media>
      );
    }

    if (!currentSite) {
      // 非 apply 页且未初始化完成 → Loading
      return (
        <div style={{ height: '100vh', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
          <PageLoading />
        </div>
      );
    }

    // 非 apply 页 & currentSite 已有值 → 渲染 BasicLayout（key 确保切换站点强制刷新）
    return (
      <Media query="(max-width: 599px)">
        {isMobile => (
          <BasicLayout
            key={currentSite}
            {...this.props}
            isMobile={isMobile}
          />
        )}
      </Media>
    );
  }
}

export default connect(({ global, setting, menu }) => ({
  collapsed: global.collapsed,
  currentSite: global.currentSite,
  layout: setting.layout,
  menuData: menu.menuData,
  breadcrumbNameMap: menu.breadcrumbNameMap,
  ...setting,
}))(LayoutWrapper);