You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
94 lines
2.7 KiB
TypeScript
94 lines
2.7 KiB
TypeScript
3 years ago
|
import * as React from "react";
|
||
|
|
import { useEffect } from "react";
|
||
|
|
import _ from "lodash";
|
||
|
|
import BaseLayout from "./BaseLayout";
|
||
|
|
import BlankLayout from "./BlankLayout";
|
||
|
|
import UserLayout from "./UserLayout";
|
||
|
|
import { IRouterProps, RouterContext } from "./RouterContext";
|
||
|
|
import { ConfigProvider } from "antd";
|
||
|
|
import { DndProvider } from "react-dnd";
|
||
|
|
import { HTML5Backend } from "react-dnd-html5-backend";
|
||
|
|
import { layoutConfig } from "@/layouts/config";
|
||
|
|
import { connect, IRouteComponentProps, useModel } from "umi";
|
||
|
|
import { Provider } from "mobx-react";
|
||
|
|
import stores, { baseLayoutStore as store } from "@/store";
|
||
|
|
import zhCN from "antd/lib/locale/zh_CN";
|
||
|
|
import moment from "moment";
|
||
|
|
import API from "@/api";
|
||
|
|
import "moment/locale/zh-cn";
|
||
|
|
import "antd/dist/antd.variable.min.css";
|
||
|
|
|
||
|
|
|
||
|
|
moment.locale("zh-cn");
|
||
|
|
|
||
|
|
const Layout = ({
|
||
|
|
children,
|
||
|
|
location,
|
||
|
|
route,
|
||
|
|
history,
|
||
|
|
match
|
||
|
|
}: IRouteComponentProps) => {
|
||
|
|
const props = { children, location, route, history, match };
|
||
|
|
const { query } = location;
|
||
|
|
const embed = {
|
||
|
|
hideHead: !!(query.hideHead && query.hideHead === "true"),
|
||
|
|
hideSide: !!(query.hideSide && query.hideSide === "true"),
|
||
|
|
hideFoot: !!(query.hideFoot && query.hideFoot === "true"),
|
||
|
|
hideAll: !!(query.hideAll && query.hideAll === "true")
|
||
|
|
};
|
||
|
|
|
||
|
|
const masterProps = useModel("@@qiankunStateFromMaster");
|
||
|
|
let containerStyle: React.CSSProperties = {};
|
||
|
|
if (masterProps?.hideAll) {
|
||
|
|
embed.hideAll = true;
|
||
|
|
containerStyle = masterProps?.containerStyle || {};
|
||
|
|
}
|
||
|
|
|
||
|
|
const routerProps: IRouterProps = { ...embed };
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
// API.SettingService.initSystemParam();
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
|
||
|
|
let layout;
|
||
|
|
if (embed.hideAll) {
|
||
|
|
layout = <BlankLayout {...props} style={containerStyle}/>;
|
||
|
|
} else {
|
||
|
|
let { pathname } = location;
|
||
|
|
pathname = pathname.startsWith("/") ? pathname : `/${pathname}`;
|
||
|
|
let type = layoutConfig[pathname];
|
||
|
|
if (!type) {
|
||
|
|
type = _.find(layoutConfig, (v: any, k: any) => new RegExp(k).test(pathname));
|
||
|
|
}
|
||
|
|
|
||
|
|
if (type) {
|
||
|
|
switch (type) {
|
||
|
|
case "user":
|
||
|
|
layout = <UserLayout {...props} />;
|
||
|
|
break;
|
||
|
|
case "blank":
|
||
|
|
layout = <BlankLayout {...props} />;
|
||
|
|
break;
|
||
|
|
default:
|
||
|
|
layout = <BaseLayout {...props} />;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
layout = <BaseLayout {...props} />;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Provider {...stores}>
|
||
|
|
<DndProvider backend={HTML5Backend}>
|
||
|
|
<RouterContext.Provider value={routerProps}>
|
||
|
|
<ConfigProvider locale={zhCN}>{layout}</ConfigProvider>
|
||
|
|
</RouterContext.Provider>
|
||
|
|
</DndProvider>
|
||
|
|
</Provider>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default connect()(Layout);
|