qt
/
salary-management-oneself
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

init

This commit is contained in:
liyongshun 2022-08-12 16:32:47 +08:00
parent 8394cf8872
commit 4a516afdf2
16 changed files with 328 additions and 277 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
config/config.ts
View File

@ -67,7 +67,7 @@ export default defineConfig({
.split('/')
.map((a: string) => a.replace(/([A-Z])/g, '-$1'))
.map((a: string) => a.toLowerCase());
return `sz-${arr.join('-')}-${localName}`.replace(/--/g, '-');
return `lys-${arr.join('-')}-${localName}`.replace(/--/g, '-');
}
return localName;
},

272
mock/Menu.ts
View File

@ -1,107 +1,231 @@
import _ from 'lodash';
const menus = [
export const menus = [
{
id: '1',
path: '/app',
name: '应用开发',
title: '应用开发',
icon: 'icon-appstore',
type: 'native',
"id": "8a8eaa657d27414e017d2861fe7a0038",
"pid": "0",
"name": "首页",
"url": "/portal",
"order": 0,
"level": 1,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-home1"
},
{
id: '2',
path: '/email',
name: '邮箱',
title: '邮箱',
icon: 'icon-check-square',
type: 'native',
"id": "ff8081817dbc0fd3017dbcc8d3140006",
"pid": "0",
"name": "业务建模",
"url": "/business",
"order": 1,
"level": 1,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-ziyingyewu"
},
{
id: '3',
path: '/workbench',
name: '工作台',
title: '工作台',
icon: 'icon-laptop',
type: 'native',
"id": "8a8ea9d37f90992d017f91de2d14006a",
"pid": "ff8081817edc7938017edc9f149c0005",
"name": "组织管理",
"url": "/idm/orgManagement",
"order": 1,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-zuzhiqunzu"
},
{
id: '4',
path: '/idm/tenantManagement',
name: '租户管理',
title: '租户管理',
icon: 'icon-laptop',
type: 'native',
"id": "ff8081817dbc0fd3017dbcc976a70008",
"pid": "ff8081817dbc0fd3017dbcc8d3140006",
"name": "业务建模",
"url": "/businessModeling",
"order": 1,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-xinwaizongyewu"
},
{
id: '5',
path: '/idm/orgManagement',
name: '组织管理',
title: '组织管理',
icon: 'icon-laptop',
type: 'native',
"id": "8a8eaa5f7e0ac819017e23fde976005f",
"pid": "8a8eaa5f7e0ac819017e23fbfba6005d",
"name": "实例管理",
"url": "/operation/instanceManage",
"order": 1,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-changjingguanli"
},
{
id: '6',
path: '/idm/posiManagement',
name: '岗位管理',
title: '岗位管理',
icon: 'icon-laptop',
type: 'native',
"id": "8a8eaaad7e437e41017e700e746d012a",
"pid": "8a8eaaad7e437e41017e700d47960128",
"name": "报告导出",
"url": "/library/palReport",
"order": 1,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-export"
},
{
id: '7',
path: '/idm/groupManagement',
name: '群组管理',
title: '群组管理',
icon: 'icon-laptop',
type: 'native',
"id": "ff8081817edc7938017edc9f149c0005",
"pid": "0",
"name": "基础数据",
"url": "/",
"order": 2,
"level": 1,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-changyongtubiao-mianxing-21"
},
{
id: '8',
path: '/idm/posiGroupManagement',
name: '岗位组管理',
title: '岗位组管理',
icon: 'icon-laptop',
type: 'native',
"id": "ff8081817edc7938017edca3ec300013",
"pid": "8a8eaa5f7e0ac819017e23fbfba6005d",
"name": "审计日志",
"url": "/idm/logManagement?appNo=Bpmn",
"order": 2,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-toggle-right"
},
{
id: '9',
path: '/idm/roleManagement',
name: '角色管理',
title: '角色管理',
icon: 'icon-laptop',
type: 'native',
"id": "ff8081817edc7938017edca20e04000b",
"pid": "ff8081817edc7938017edc9f149c0005",
"name": "岗位管理",
"url": "/idm/posiManagement",
"order": 2,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-changyongtubiao-mianxing-32"
},
{
id: '10',
path: '/idm/appManagement',
name: '应用管理',
title: '应用管理',
icon: 'icon-laptop',
type: 'native',
"id": "ff8081817edc7938017edca4ef130016",
"pid": "ff8081817dbc0fd3017dbcc8d3140006",
"name": "字典管理",
"url": "/idm/dictionaryManagement",
"order": 2,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-zitibiaoti"
},
{
id: '11',
path: '/idm/resourceManagement',
name: '资源管理',
title: '资源管理',
icon: 'icon-laptop',
type: 'native',
"id": "8a8eaaad7e437e41017e700fea1c012c",
"pid": "8a8eaaad7e437e41017e700d47960128",
"name": "模板设置",
"url": "/library/reportSetting",
"order": 2,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-radius-setting"
},
{
id: '12',
path: '/idm/resGroupManagement',
name: '资源组管理',
title: '资源组管理',
icon: 'icon-laptop',
type: 'native',
"id": "8a8eaaad7e437e41017e700d47960128",
"pid": "0",
"name": "资产库",
"url": "/library",
"order": 3,
"level": 1,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-codelibrary"
},
{
"id": "ff8081817edc7938017edca27471000d",
"pid": "ff8081817edc7938017edc9f149c0005",
"name": "岗位组管理",
"url": "/idm/posiGroupManagement",
"order": 3,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-changyongtubiao-mianxing-32"
},
{
"id": "8a8eaaad7e437e41017e8b1c5cff01b7",
"pid": "ff8081817dbc0fd3017dbcc8d3140006",
"name": "模型运维",
"url": "/business/modelManage",
"order": 3,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-yuanquyunwei"
},
{
"id": "8a8eaa5f7e0ac819017e23fbfba6005d",
"pid": "0",
"name": "运维管理",
"url": "/operation",
"order": 4,
"level": 1,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-yuanquyunwei"
},
{
"id": "8a8eaa5f7e958a35017e95b142d00012",
"pid": "ff8081817dbc0fd3017dbcc8d3140006",
"name": "一键部署",
"url": "/business/deploy",
"order": 4,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-deploymentunit"
},
{
"id": "ff8081817edc7938017edca37d560011",
"pid": "ff8081817edc7938017edc9f149c0005",
"name": "角色管理",
"url": "/idm/roleManagement?appNo=Bpmn",
"order": 4,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-changyongtubiao-mianxing-32"
},
{
"id": "ff8081817edc7938017edca2de7d000f",
"pid": "ff8081817edc7938017edc9f149c0005",
"name": "群组管理",
"url": "/idm/groupManagement",
"order": 5,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-changyongtubiao-mianxing-32"
},
{
"id": "8a8ea9097ffce95d017ffdaa1bfe0048",
"pid": "ff8081817dbc0fd3017dbcc8d3140006",
"name": "消息模板",
"url": "/msgTemplate",
"order": 5,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-message"
},
{
"id": "8a8ea8688016bfd701801800bf6700b3",
"pid": "ff8081817dbc0fd3017dbcc8d3140006",
"name": "连接配置",
"url": "/connectConfig",
"order": 99999,
"level": 2,
"iconType": "FONT",
"iconStyle": "{}",
"iconContent": "icon-fencengpeizhi"
}
];
export default {
// 支持值为 Object 和 Array
'GET /gateway/idm/api/menus': {
success:true,
code: 0,
message: '成功',
data: menus,

10
src/api/menu.service.ts
View File

@ -10,9 +10,13 @@ class MenuService extends BasicService {
}
getAccountMenu = async () => {
return this.get(
`/gateway/idm/api/account/menus/${config.get('/app/code')}`,
);
return this.get(`/gateway/idm/api/menus`)
// return new Promise((resolve, reject)=>{
//
// })
// return this.get(
// `/gateway/idm/api/account/menus/${config.get('/app/code')}`,
// );
};
/**

2
src/config/application.js
View File

@ -1,6 +1,6 @@
export default {
$meta: 'This file configures the plot device.',
projectName: 'Casic-portal',
projectName: 'Demo-Portal',
domains: {},
app: {
code: 'slave',

4
src/layouts/BaseLayout/Header/UserInfo/index.less
View File

@ -34,10 +34,6 @@
border-radius: 4px;
flex: 0 0 auto;
margin-right: 5px;
img {
width: 36px;
height: 36px;
}
}
.content {

1
src/layouts/BaseLayout/index.less
View File

@ -289,7 +289,6 @@
height: calc(100% - 20px);
overflow: auto;
background: white;
border-radius: 5px;
box-shadow: @shadow-1-down;
}
}

201
src/layouts/BaseLayout/index.tsx
View File

@ -1,78 +1,59 @@
import * as React from 'react';
import _ from 'lodash';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { history } from 'umi';
import ProLayout, { MenuDataItem, WaterMark } from '@ant-design/pro-layout';
import styles from './index.less';
import { IAction } from '@/api/Types';
import { urlToList } from '@/utils/pathTools';
import { AppStore } from '@/store/AppStore';
import { useMenu } from './useMenu';
import { observer } from 'mobx-react';
import { Text, Util, Storage, Session } from '@/utils';
import { buildIcon, SearchBar } from '@/lib';
import defaultLogo from '@/assets/logo.svg';
import {
UnorderedListOutlined,
CaretDownOutlined,
CaretRightOutlined,
} from '@ant-design/icons';
import {
MenuFooter,
MenuExpander,
} from '@/layouts/BaseLayout/Sider';
import Header from '@/layouts/BaseLayout/Header';
import { getOpenKeysFromSelectedMenu } from '@/layouts/BaseLayout/utils/utils';
import { Breadcrumb, Button, ConfigProvider, Tooltip, Space } from 'antd';
import API from '@/api';
import classNames from 'classnames';
import { baseLayoutStore as store } from './Store';
import { Base64 } from 'js-base64';
import { HTML_ID_LAYOUT_CONTENT } from '@/constant/ID';
import * as React from "react";
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { history } from "umi";
import { observer } from "mobx-react";
import ProLayout, { MenuDataItem, WaterMark } from "@ant-design/pro-layout";
import { IAction } from "@/api/Types";
import { urlToList } from "@/utils/pathTools";
import { AppStore } from "@/store/AppStore";
import { useMenu } from "./useMenu";
import { Session, Storage, Text, Util } from "@/utils";
import { buildIcon, SearchBar } from "@/lib";
import defaultLogo from "@/assets/logo.svg";
import { CaretDownOutlined, CaretRightOutlined, UnorderedListOutlined } from "@ant-design/icons";
import { MenuExpander, MenuFooter } from "@/layouts/BaseLayout/Sider";
import Header from "@/layouts/BaseLayout/Header";
import { getOpenKeysFromSelectedMenu } from "@/layouts/BaseLayout/utils/utils";
import { Breadcrumb, Button, ConfigProvider, Space, Tooltip } from "antd";
import classNames from "classnames";
import { baseLayoutStore as store } from "./Store";
import { Base64 } from "js-base64";
import { HTML_ID_LAYOUT_CONTENT } from "@/constant/ID";
import styles from "./index.less";
const BaseLayout = observer(({ children, location }: any) => {
const { pathname, query } = location;
const session: any = Session.get();
const [collapsed, setCollapse] = useState(false);
const [selectMenuKey, setSelectMenuKey] = useState([] as Array<string>);
const [openMenuKey, setOpenMenuKey] = useState([] as Array<string>);
const [filterMenuData, setFilterMenuData] = useState<any[]>([])
const session: any = Session.get();
const [
menuData,
breadCrumbMap,
defaultCollapseMenus,
defaultSelectMenus,
originalMenu,
filterMenu,
] = useMenu();
const [filterMenuData, setFilterMenuData] = useState<any[]>([]);
const [breadCrumbs, setBreadCrumbs] = useState<any[]>([]);
const expandMenuRef = useRef<any>();
const [menuData, breadCrumbMap, defaultCollapseMenus, defaultSelectMenus, originalMenu, filterMenu] = useMenu();
useEffect(() => {
ConfigProvider.config({
theme: {
primaryColor: store.primaryColor,
},
primaryColor: store.primaryColor
}
});
}, [store.primaryColor]);
useEffect(() => {
setCollapse(false)
}, [store.layout])
setCollapse(false);
}, [store.layout]);
useEffect(() => {
if (_.isEmpty(menuData) || _.isEmpty(breadCrumbMap)) {
return;
}
setOpenMenuKey(store.layout === 'side' ? defaultCollapseMenus : []);
if (_.isEmpty(menuData) || _.isEmpty(breadCrumbMap)) return;
setOpenMenuKey(store.layout === "side" ? defaultCollapseMenus : []);
setSelectMenuKey(defaultSelectMenus);
setFilterMenuData(menuData)
setFilterMenuData(menuData);
}, [menuData, breadCrumbMap, defaultCollapseMenus, defaultSelectMenus, store.layout]);
useEffect(() => {
if (!collapsed) {
//菜单数据中父子级关系必须有pid/id
const openKeys = getOpenKeysFromSelectedMenu(originalMenu, selectMenuKey);
if (!_.isEmpty(openKeys)) {
setOpenMenuKey(openKeys);
@ -81,46 +62,39 @@ const BaseLayout = observer(({ children, location }: any) => {
}, [collapsed]);
useEffect(() => {
if (_.isEmpty(breadCrumbMap)) {
return;
}
if (_.isEmpty(breadCrumbMap)) return;
const paths = urlToList(pathname);
let extraBreadcrumbs = _.reduce(
paths,
(ret: any[], path: string) => {
let extraBreadcrumbs = _.reduce(paths, (ret: any[], path: string) => {
const menu = breadCrumbMap[path];
if (!_.isEmpty(menu)) {
ret.push({ ...menu });
}
return ret;
},
[],
[]
);
const home = breadCrumbMap['/'] || breadCrumbMap['/home'];
const home = breadCrumbMap["/"] || breadCrumbMap["/home"];
const breadcrumbs = _.isEmpty(home)
? extraBreadcrumbs
: [home].concat(
_.filter(extraBreadcrumbs, (data: any) => data.key !== home.key),
_.filter(extraBreadcrumbs, (data: any) => data.key !== home.key)
);
setBreadCrumbs(breadcrumbs);
}, [pathname, breadCrumbMap]);
const onMenuOpen = useCallback((openKeys: string[]) => {
setOpenMenuKey(openKeys);
Storage.session.set('OPEN_MENU_KEY', openKeys)
Storage.session.set("OPEN_MENU_KEY", openKeys);
}, []);
const onMenuSelect = useCallback((menu: any) => {
if (_.isEmpty(menu)) {
return;
}
if (_.isEmpty(menu)) return;
if (Array.isArray(menu)) {
setSelectMenuKey(menu);
} else {
setSelectMenuKey([menu.key]);
//@ts-ignore
setOpenMenuKey((openMenuKey) => [].concat(openMenuKey).concat(menu.keyPath),
setOpenMenuKey((openMenuKey) => [].concat(openMenuKey).concat(menu.keyPath)
);
}
}, []);
@ -134,37 +108,35 @@ const BaseLayout = observer(({ children, location }: any) => {
onClick={() => {
onMenuSelect({
key: item.id,
keyPath: [item.id, item.pid],
keyPath: [item.id, item.pid]
});
history.push(item.path);
}}
>
<a>
{buildIcon('', item.icon)} {item.name}
</a>
<a>{buildIcon("", item.icon)} {item.name}</a>
</Breadcrumb.Item>
))}
</Breadcrumb>
)
}, [breadCrumbs])
);
}, [breadCrumbs]);
const classes = useMemo(() => {
return classNames({
[styles.root]: true,
[styles[store.navTheme]]: true,
})
}, [store.navTheme])
[styles[store.navTheme]]: true
});
}, [store.navTheme]);
const onMenuSearch = useCallback((key: any) => {
if (_.isEmpty(key)) {
setFilterMenuData(menuData);
} else {
setFilterMenuData(filterMenu(originalMenu, key))
setFilterMenuData(filterMenu(originalMenu, key));
}
}, [menuData])
}, [menuData]);
// 内嵌模式直接渲染子路由
if (query?.embeded && query?.embeded == 'T') {
if (query?.embeded && query?.embeded == "T") {
return <>{children}</>;
}
@ -172,35 +144,28 @@ const BaseLayout = observer(({ children, location }: any) => {
// const appName = API.SettingService.getSystemParam('appName') || '管理系统';
// const globalWaterMark = API.SettingService.getSystemParam('globalWaterMark') || 'F';
const logo = defaultLogo;
const appName = '管理系统';
const globalWaterMark = 'F';
const appName = "管理系统";
const globalWaterMark = "F";
let layout = (
<div
className={classes}
style={{
width: '100vw',
height: '100vh',
overflow: 'hidden',
}}
>
<div className={classes}>
<ProLayout
className='__layout_main__'
className="__layout_main__"
disableMobile
fixedHeader
fixSiderbar
location={location}
layout={store.layout}
splitMenus={store.layout === 'mix' && store.splitMenus}
navTheme={store.layout === 'top' ? 'dark' : 'light'}
splitMenus={store.layout === "mix" && store.splitMenus}
navTheme={store.layout === "top" ? "dark" : "light"}
// @ts-ignore
iconfontUrl={`${Util.getPublicPath()}css/iconfont/iconfont.js`}
title={Text.toShortText(appName, store.layout === 'side' ? 7 : 11)}
logo={<span onClick={() => history.push('/')}><img src={logo} /></span>}
title={Text.toShortText(appName, store.layout === "side" ? 7 : 11)}
logo={<span onClick={() => history.push("/")}><img src={logo} alt=""/></span>}
collapsed={collapsed}
style={{ transition: 'all 0.5s ease 0s' }}
style={{ transition: "all 0.5s ease 0s" }}
headerContentRender={() =>
(store.layout === 'side' || (store.layout === 'mix' && !store.splitMenus)) ? (
(store.layout === "side" || (store.layout === "mix" && !store.splitMenus)) ? (
<div className={styles.headContent}>
{breadCrumbComp}
</div>
@ -211,51 +176,51 @@ const BaseLayout = observer(({ children, location }: any) => {
return (
<a
onClick={() => {
const external = /^https?:\/\//.test(item.path || '');
Storage.session.set('ACTIVE_MENU_KEY', item.key)
const external = /^https?:\/\//.test(item.path || "");
Storage.session.set("ACTIVE_MENU_KEY", item.key);
if (external) {
const embedUrl = Base64.encode(item.path || '', true);
const embedUrl = Base64.encode(item.path || "", true);
history.push(`/external?_q=${embedUrl}`);
} else {
history.push(item.path || '/');
history.push(item.path || "/");
}
}}
>
{typeof item.icon === 'string'
? buildIcon('FONT', item.icon)
: item.icon}{' '}
{typeof item.icon === "string"
? buildIcon("FONT", item.icon)
: item.icon}{" "}
<label>{item.name}</label>
</a>
);
}}
menuProps={{
theme: 'light',
theme: "light",
selectedKeys: selectMenuKey,
openKeys: openMenuKey,
onOpenChange: onMenuOpen,
onSelect: onMenuSelect,
expandIcon: (props) => {
return props.isOpen ? (
<CaretDownOutlined style={{ color: '#999' }} />
<CaretDownOutlined style={{ color: "#999" }}/>
) : (
<CaretRightOutlined style={{ color: '#999' }} />
<CaretRightOutlined style={{ color: "#999" }}/>
);
},
}
}}
menuExtraRender={() =>
store.layout === 'mix' && store.splitMenus ? null : (
store.layout === "mix" && store.splitMenus ? null : (
<div className={styles.expandButton}>
<Space>
{collapsed ? null : <SearchBar fillOnSearch onSearch={onMenuSearch} size='small' placeholder='搜索功能' />}
<Button size='small' onClick={() => expandMenuRef.current.toggle()}>
<Tooltip title='查看全部'><UnorderedListOutlined /></Tooltip>
{collapsed ? null : <SearchBar fillOnSearch onSearch={onMenuSearch} size="small" placeholder="搜索功能"/>}
<Button size="small" onClick={() => expandMenuRef.current.toggle()}>
<Tooltip title="查看全部"><UnorderedListOutlined/></Tooltip>
</Button>
</Space>
</div>
)}
rightContentRender={() => (
<>
<Header originalMenu={originalMenu} onMenuSelect={onMenuSelect} />
<Header originalMenu={originalMenu} onMenuSelect={onMenuSelect}/>
</>
)}
collapsedButtonRender={() => (
@ -264,11 +229,15 @@ const BaseLayout = observer(({ children, location }: any) => {
onCollapse={() => setCollapse((collapsed) => !collapsed)}
/>
)}
contentStyle={{ padding: 0, margin: 0, height: 'calc(100vh - 48px)' }}
contentStyle={{ padding: 0, margin: 0, height: "calc(100vh - 48px)" }}
>
<div className={styles.content} id={HTML_ID_LAYOUT_CONTENT}>
<div className={styles.main}>
{globalWaterMark === 'T' ? <WaterMark content={`${session?.name}${session?.userNo || ''}`}>{children}</WaterMark> : children}
{
//@ts-ignore
globalWaterMark === "T" ?
<WaterMark content={`${session?.name}${session?.userNo || ""}`}>{children}</WaterMark> : children
}
</div>
</div>
</ProLayout>
@ -289,7 +258,7 @@ export default (props: any) => <BaseLayout {...props} />;
export const resetManageLayoutBreadcrumbs = (
store: AppStore,
breadcrumbs: [],
breadcrumbs: []
) => {
if (_.isEmpty(store.breadcrumbs)) {
store.setBreadcrumbs(breadcrumbs);
@ -298,7 +267,7 @@ export const resetManageLayoutBreadcrumbs = (
export const resetManageLayoutTopActions = (
store: AppStore,
actions: Array<IAction>,
actions: Array<IAction>
) => {
if (_.isEmpty(store.topActions)) {
store.setTopActions(actions);

1
src/layouts/BaseLayout/typings.ts
View File

@ -1,3 +1,4 @@
// @ts-ignore
import type * as H from 'history';
import type {

3
src/layouts/BaseLayout/useMenu.tsx
View File

@ -196,7 +196,7 @@ export function useMenu<S extends AnyObject>() {
useEffect(() => {
API.MenuService.getAccountMenu().then(({ success, data }) => {
if (success) {
let menus = _.map(data || [], (menu: any) => ({
let menus = _.map(data.data || [], (menu: any) => ({
key: menu.id,
id: menu.id,
pid: menu.pid,
@ -212,7 +212,6 @@ export function useMenu<S extends AnyObject>() {
),
order: menu.order,
}));
setOriginalMenu(menus);
const buildMenus = buildMenuData(menus);
setMenuData(buildMenus);

30
src/layouts/BlankLayout/index.tsx
View File

@ -1,17 +1,17 @@
import * as React from 'react';
import styles from './index.less';
import * as React from "react";
import styles from "../index.less";
export default ({children, style = {}}: any) => {
return (
<div
className={styles.root}
style={{
width: '100%',
height: '100%',
...style
}}
>
{children}
</div>
);
export default ({ children, style = {} }: any) => {
return (
<div
className={styles.root}
style={{
width: "100%",
height: "100%",
...style
}}
>
{children}
</div>
);
};

30
src/layouts/UserLayout/index.less
View File

@ -1,30 +0,0 @@
.root {
:global {
.ant-pro-sider-logo {
white-space: nowrap;
}
.ant-layout-sider {
transition: all 0.3s ease;
}
}
}
.header {
display: flex;
.left {
flex: 0 0 auto;
}
.center {
flex: 1 1 auto;
}
}
.trigger {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
span {
color: whitesmoke;
}
}

14
src/layouts/UserLayout/index.tsx
View File

@ -1,15 +1,15 @@
import * as React from 'react';
import * as React from "react";
import { useEffect } from "react";
import { ConfigProvider } from "antd";
import { baseLayoutStore as store } from "@/layouts/BaseLayout/Store";
import styles from './index.less';
import styles from "../index.less";
export default ({ children }: any) => {
useEffect(() => {
ConfigProvider.config({
theme: {
primaryColor: store.primaryColor,
},
primaryColor: store.primaryColor
}
});
}, [store.primaryColor]);
@ -17,9 +17,9 @@ export default ({ children }: any) => {
<div
className={styles.root}
style={{
width: '100vw',
height: '100vh',
overflow: 'hidden',
width: "100%",
height: "100%",
overflow: "hidden"
}}
>
{children}

0
src/layouts/BlankLayout/index.less → src/layouts/index.less
View File

29
src/layouts/index.tsx
View File

@ -1,33 +1,24 @@
import * as React from "react";
import { useEffect } from "react";
import _ from "lodash";
import { ConfigProvider } from "antd";
import { DndProvider } from "react-dnd";
import moment from "moment";
import { Provider } from "mobx-react";
import zhCN from "antd/lib/locale/zh_CN";
import { HTML5Backend } from "react-dnd-html5-backend";
import { connect, IRouteComponentProps, useModel } from "umi";
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 stores from "@/store";
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 Layout = ({ children, location, route, history, match }: IRouteComponentProps) => {
const props = { children, location, route, history, match };
const { query } = location;
const embed = {
@ -36,7 +27,6 @@ const Layout = ({
hideFoot: !!(query.hideFoot && query.hideFoot === "true"),
hideAll: !!(query.hideAll && query.hideAll === "true")
};
const masterProps = useModel("@@qiankunStateFromMaster");
let containerStyle: React.CSSProperties = {};
if (masterProps?.hideAll) {
@ -50,7 +40,6 @@ const Layout = ({
// API.SettingService.initSystemParam();
}, []);
let layout;
if (embed.hideAll) {
layout = <BlankLayout {...props} style={containerStyle}/>;

2
src/pages/index.tsx
View File

@ -4,5 +4,5 @@ import { Redirect, useModel } from 'umi';
export default () => {
const masterProps = useModel('@@qiankunStateFromMaster');
// @ts-ignore
return <Redirect to={`${masterProps?.route || '/sample'}`} />;
return <Redirect to={`${masterProps?.route || '/'}`} />;
}

2
src/store/AppStore.tsx
View File

@ -8,7 +8,7 @@ export class AppStore {
}
@observable
menu: IMenuData = {} as IMenuData;
menu: Partial<IMenuData> = {} ;
@observable
menus: IMenuData[] = [];