import { SettingDrawer } from "@ant-design/pro-layout";
import { PageLoading } from "@ant-design/pro-layout";
import { history, Link } from "umi";
import RightContent from "@/components/RightContent";
import TagView from "@/components/TagView";
import SiderMenu from "@/components/SiderMenu";
import { queryCurrentUser, getMenu } from "./services/login";
import defaultSettings from "../config/defaultSettings";
import { message } from "antd";
const loginPath = "/user/login";
/** 获取用户信息比较慢的时候会展示一个 loading */

export const initialStateConfig = {
  loading: <PageLoading />,
};
/**
 * @see  https://umijs.org/zh-CN/plugins/plugin-initial-state
 * */

export async function getInitialState() {
  let token = localStorage.getItem("TOKEN_MES");
  const fetchUserInfo = async () => {
    try {
      const msg = await queryCurrentUser();
      return msg.data;
    } catch (error) {
      history.push(loginPath);
    }
    return undefined;
  }; // 如果是登录页面，不执行

  const getmenuData = async () => {
    try {
      const res = await getMenu();
      return res.data;
    } catch (error) {
      message.error(res.msg);
    }
    return undefined;
  }; // 如果是登录页面，不执行

  if (history.location.pathname !== loginPath && token) {
    const currentUserData = await fetchUserInfo();
    let menuData;
    if (currentUserData?.data?.userName) {
      menuData = await getmenuData();
    }
    return {
      fetchUserInfo,
      currentUser: currentUserData?.data,
      settings: defaultSettings,
      newMenu: menuData,
      getmenuData,
      collapsed: false
    };
  }
  return {
    fetchUserInfo,
    settings: defaultSettings,
    getmenuData,
    collapsed: false

  };
} // ProLayout 支持的api https://procomponents.ant.design/components/layout
export const layout = async (props) => {
  let { initialState, setInitialState } = props;
  let token = localStorage.getItem("TOKEN_MES");
  return {
    headerContentRender: () => <RightContent />,
    rightContentRender:()=>null,
    disableContentMargin: false,
    waterMarkProps: {
      content: initialState?.currentUser?.name,
    },
    collapsed: initialState.collapsed,
    onCollapse: (cols) => {
      setInitialState(s => ({ ...s, collapsed: cols }))
    },
    onPageChange: () => {
      const { location } = history; // 如果没有登录，重定向到 login
      if (location.pathname != "/user/logon") {
        if (
          (!initialState?.currentUser && location.pathname !== loginPath) ||
          !token
        ) {
          setInitialState((s) => {
            return { ...s, currentUser: undefined, newMenu: [] };
          });
          history.replace(loginPath);
        }
      }
      if (location.pathname == loginPath) {
        setInitialState((s) => {
          return { ...s, currentUser: undefined, newMenu: [] };
        });
      }
    },
    contentStyle: {
      padding: "42px 0px 0px 6px",
      margin: 0,
    },
    //接口获取菜单数据
    menu: {
      // 每当 initialState?.currentUser?.userid 发生修改时重新执行 request
      params: {
        userId: initialState?.currentUser?.id,
      },
      request: (params, defaultMenuData) => {
        let lastArr = initialState?.newMenu?.userHavePermList
          ? JSON.parse(
            JSON.stringify(initialState?.newMenu?.userHavePermList)
          )
          : [],
          newArr = [
            {
              path: "/welcome",
              name: "首页",
              icon: "smile",
              component: "./Welcome",
              haveChildren: false,
              key: "000000",
              parentKey: "0",
              routes: [],
              children: null,
              title: null,
            },
          ].concat(lastArr);
        return newArr;
      },
      locale: false,
    },
    menuRender: (props, defaultDom) => {
      if (props.isMobile) {
        return defaultDom;
      } else {
        return <SiderMenu {...props}></SiderMenu>;
      }
    },
    // 自定义 403 页面
    // unAccessible: <div>unAccessible</div>,
    // 增加一个 loading 的状态
    childrenRender: (children, props) => {
      // if (initialState?.loading) return <PageLoading />;
      return (
        <>
          {initialState?.currentUser && location.pathname !== loginPath ? (
            <TagView home="/welcome">{children}</TagView>
          ) : (
            children
          )}
          {!props.location?.pathname?.includes("/login") && (
            <SettingDrawer
              enableDarkTheme
              settings={initialState?.settings}
              onSettingChange={(settings) => {
                setInitialState((preInitialState) => ({
                  ...preInitialState,
                  settings,
                }));
              }}
            />
          )}
        </>
      );
    },
    ...initialState?.settings,
  };
};
