// 使用route加载子应用
import defaultSettings from '../config/defaultSettings';
import {
  RunTimeLayoutConfig,
  RuntimeAntdConfig,
  history,
  useIntl,
  useModel,
} from '@umijs/max';
import { errorConfig } from '../config/requestErrorConfig';
import RightContent from '@/components/RightContent';
import NoAccessPage from '@/pages/403';
import NoFoundPage from '@/pages/404';
import CustomBoundary from '@/pages/503';
import { iconFront } from '@/pages/system/menu/components/iconfont';
import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons';
import { type Settings as LayoutSettings } from '@ant-design/pro-components';
import { Button } from 'antd';
import layoutTokenDark from '../config/layoutTokenDark';
import layoutToken from '../config/layoutTokenK8S';
import { getAccessInfo } from './services/common/login';
import { getUserMenus } from './services/common/menus';
import { menuDataFormat } from './utils/format';
const loginPath = '/login';

window.addEventListener('error', function onError(e) {
  // Ignore ResizeObserver error
  if (e.message === 'ResizeObserver loop limit exceeded') {
    e.stopPropagation();
    e.stopImmediatePropagation();
  }
});

window.addEventListener('beforeunload', function handlePageRefresh() {
  localStorage.removeItem('menuData');
});

// 样式配置 是否开启暗黑模式
export const antd: RuntimeAntdConfig = (memo) => {
  const newMemo = {
    ...memo,
    theme: {
      ...memo.theme,
      //  algorithm: theme.useToken,
    },
    appConfig: {
      message: {
        // 配置 message 最大显示数，超过限制时，最早的消息会被自动关闭
        maxCount: 3,
      },
    },
  };

  return newMemo;
};

// 初始化操作
export async function getInitialState(): Promise<{
  settings?: Partial<LayoutSettings> | any;
  currentUser?: API.CurrentUser;
  accessInfo?: any;
  loading?: boolean;
  theme?: 'dark' | 'blue';
  menuData?: API.MenuData[];
}> {
  const menuData = JSON.parse(localStorage.getItem('menuData') || '[]');

  const currentUser = JSON.parse(localStorage.getItem('currentUser') || '{}');

  if (!currentUser && window.location.pathname !== loginPath) {
    history.push(loginPath);
    return {
      // fetchUserInfo,
      settings: defaultSettings,
      theme: 'blue',
    };
  }
  let accessInfo = {};
  // 是否开发环境
  // const isDev = process.env.NODE_ENV === 'development';
  if (window.location.pathname !== loginPath) {
    const userInfoRes = await getAccessInfo();
    const data: any = {};
    if (userInfoRes.data) {
      for (const item of userInfoRes.data) {
        data[item] = true;
      }
    }
    accessInfo = data;
  }

  return {
    menuData,
    currentUser,
    accessInfo,
    theme: 'blue',
    settings: defaultSettings,
  };
}

export const layout: RunTimeLayoutConfig = () => {
  // eslint-disable-next-line react-hooks/rules-of-hooks
  const intl: any = useIntl();
  // eslint-disable-next-line react-hooks/rules-of-hooks
  const { initialState, setInitialState } = useModel('@@initialState');

  //菜单筛选
  const filterMenuData = (menuData: any, accessInfo: any) => {
    return menuData.filter((menu: any) => {
      if (accessInfo[menu.access]) {
        if (menu.routes) {
          menu.routes = filterMenuData(menu.routes, accessInfo);
        }
        return true;
      }
      return false;
    });
  };

  return {
    menu: {
      locale: false,
      params: () => ({
        menuUpdate: initialState?.currentUser?.menuUpdate,
      }),
      request: async () => {
        const accessInfo = initialState?.accessInfo;
        const initData = {
          path: '/home',
          name: intl.formatMessage({ id: 'menu.welcome' }),
          icon: iconFront['homeOutlined'],
        };
        let menuData = JSON.parse(localStorage.getItem('menuData') || '[]');

        if (menuData.length < 1) {
          const res = await getUserMenus();
          menuData = menuDataFormat(res.data || []);
          setInitialState((initialState) => ({
            ...initialState,
            menuData,
          }));
          localStorage.setItem('menuData', JSON.stringify(menuData));
        }

        menuData = filterMenuData(menuData, accessInfo);

        return [
          initData,
          ...menuData.map((item: any) => {
            return {
              ...item,
              icon: iconFront[item.icon],
            };
          }),
        ];
      },
     
    },
    /* token 配置
     * @doc https://procomponents.ant.design/components/layout#token
     * */
    token: initialState?.theme === 'dark' ? layoutTokenDark : layoutToken,
    collapsed: initialState?.settings?.collapsed,
    collapsedButtonRender: (collapsed) => (
      <Button
        type="link"
        size="large"
        className="text-right text-white"
        onClick={() => {
          setInitialState((initialState) => ({
            ...initialState,
            settings: {
              ...initialState?.settings,
              collapsed: !collapsed,
            },
          }));
        }}
      >
        {collapsed ? <MenuFoldOutlined /> : <MenuUnfoldOutlined />}
      </Button>
    ),
    pageTitleRender: () =>
      intl.formatMessage({ id: 'component.globalHeader.name' }),
    title: intl.formatMessage({ id: 'component.globalHeader.name' }),
    // pure: true,
    // 默认布局调整
    rightContentRender: () => <RightContent />,
    // 自定义 403 页面
    unAccessible: <NoAccessPage />,
    // 自定义 404 页面
    notFound: <NoFoundPage />,
    // 自定义错误边界
    ErrorBoundary: CustomBoundary,

    ...initialState?.settings,

    // 其他属性见：https://procomponents.ant.design/components/layout#prolayout
  };
};

/**
 * @name request 配置，可以配置错误处理
 * 它基于 axios 和 ahooks 的 useRequest 提供了一套统一的网络请求和错误处理方案。
 * @doc https://umijs.org/docs/max/request#配置
 */

export const request = {
  ...errorConfig,
};