解决路由复制出去后顶部选择框和右侧布局数据未更新

master
鲁誉程 10 months ago
parent 2ddfc163a8
commit fee0d01707

@ -137,7 +137,7 @@ const routes = [
// 建设中页面
{
path: '/construction',
path: '/construction/:fileType',
component: '@/pages/construction'
},

@ -105,6 +105,31 @@ const LeftMenuCom: FC<PageProps> = ({ data }) => {
}
];
const treeData1 = [
{
title: '所有单位位置',
key: 'root',
selectable: true,
isFolder: true,
children: [
{
title: 'aadw',
key: 'user',
},
],
}
];
const nameType = {
"设备注册": treeData,
'单位位置管理': treeData1
}
const urlType = {
"设备注册": '/registerManage/deviceRegister',
'单位位置管理': '/registerManage/unitLocation'
}
return (
<div>
{list.map((item: any, index: number) => {
@ -131,13 +156,13 @@ const LeftMenuCom: FC<PageProps> = ({ data }) => {
onRightClick={({ event, node }) => handleRightClick(event, node)}
onSelect={(e, {node}) => {
if (node.key === 'root') {
history.push(`/registerManage/deviceRegister/${urlStr}`)
history.push(`${urlType[item.name]}/${urlStr}`)
}
handleSelect(e, item.name)
}}
selectedKeys={selectedKeys}
treeData={treeData}
treeData={nameType[item.name]}
blockNode={true}
defaultExpandAll={true}
/>

@ -1,5 +1,5 @@
import { Outlet, history, useLocation, useParams } from 'umi';
import { Outlet, history, useLocation, useParams, useRoutes } from 'umi';
import styles from './index.less';
import { useEffect, useState } from 'react';
import { MenuType, tabsType } from '@/utils/menu';
@ -15,6 +15,7 @@ import theme from '@/styles/antd.theme';
dayjs.locale('zh-cn');
import moment from 'moment'
import {getMenuType, getTabKey } from '@/utils';
moment.locale('ZH-cn')
@ -77,20 +78,49 @@ export default function Layout() {
setSelectVal(info?.layoutInfo.selectVal);
setTabList([...tabsType[info?.layoutInfo.selectVal]]);
} else {
setTabList([...tabsType[selectVal]]);
let obj: any = {
selectVal: selectVal,
active: active,
activeName: activeName,
}
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify({ ...info, layoutInfo: obj }))
upDateLayout()
}
}, [])
useEffect(() => {
upDateLayout()
setRouteName(getCurrentPageName(location.pathname))
}, [location]);
// 更新布局数据
const upDateLayout = () => {
const index = location.pathname.lastIndexOf('/');
let pathname = location.pathname.substring(0, index);
let menType, tabKey;
if (!['/registerManage/deviceRegister', '/registerManage/unitLocation'].includes(pathname)) {
menType = getMenuType(pathname);
tabKey = getTabKey(menType);
if(!menType || !tabKey) return
if (
info?.layoutInfo?.selectVal != tabKey ||
info?.layoutInfo?.activeName != menType
) {
setActiveName(menType);
setSelectVal(Number(tabKey));
setTabList([...tabsType[Number(tabKey)]]);
}
}else if (pathname == '/registerManage/unitLocation') {
setActive(2)
setActiveName('位置管理');
setSelectVal(6);
setTabList([...tabsType[6]]);
}else if ('/registerManage/deviceRegister') {
setActive(1)
setActiveName('注册管理');
setSelectVal(6);
setTabList([...tabsType[6]]);
}
}
// 页面销毁前记录下当前布局信息
window.addEventListener('beforeunload', function (event) {
let obj: any = {
@ -106,9 +136,9 @@ export default function Layout() {
if (tabList.length > 0 && !info?.layoutInfo) {
setActiveName(tabList[0].name)
let info = MenuType[tabList[0].name];
if (isTreeType(info)) return
if (info[0].data) {
history.push(`${info[0].data[0].url}/${urlStr}`)
} else {
@ -124,17 +154,15 @@ export default function Layout() {
if (info[0]?.name === '设备注册') {
isReturn = true;
history.push(`/registerManage/deviceRegister/${urlStr}`);
// return navigateToPath(info, '/registerManage/deviceRegister');
}
if (info[0]?.name === '单位位置管理') {
isReturn = true;
history.push(`/registerManage/unitLocation/${urlStr}`);
//return navigateToPath(info, '/registerManage/unitLocation');
}
}
return isReturn;
};
// 获取路由名称
const getCurrentPageName = (pathname: string) => {
@ -202,7 +230,7 @@ export default function Layout() {
if (isTreeType(info)) return
if (info.length == 0 || info[0].data && info[0].data.length == 0) {
history.push('/construction');
history.push(`/construction/${urlStr}`);
return
}

@ -79,7 +79,7 @@ const CoreSystemEntrance: FC<PageProps> = ({ }) => {
} else if (key == '二' && pin == 'test') {
initData()
// 记录登陆成功状态
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify({ ...info, pingLoginStatus: true }))
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify({ ...info, pingLoginStatus: true, layoutInfo: null }))
// 登录成功进入系统
history.push(`/registerManage/deviceRegister/${urlParams?.fileType}${location?.search}`)

@ -4,7 +4,7 @@ import { Input, Upload, UploadProps, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { college_table_query, deviceInit_init, deviceInstall_deviceInstall } from '@/services/api';
import { useParams } from 'umi';
import { fileStr, sysType, sysTypeStr } from '@/utils';
import { fileStr, sysType, sysTypeStr } from '@/utils/sysType';
interface PageProps {
}

@ -5,7 +5,7 @@ import ButtonComp from '@/components/ButtonComp';
import { college_table_query } from '@/services/api';
import { useParams } from 'umi';
import DEV from '@/utils/env/dev';
import { countType } from '@/utils';
import { countType } from '@/utils/sysType';
interface PageProps {
}

@ -1,7 +1,7 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
import { countType } from '@/utils';
import { countType } from '@/utils/sysType';
import { useParams } from 'umi';
import DEV from '@/utils/env/dev';

@ -1,7 +1,7 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
import { countType, sysType } from '@/utils';
import { countType, sysType } from '@/utils/sysType';
import { useParams } from 'umi';
import DEV from '@/utils/env/dev';

@ -1,7 +1,7 @@
import React, { FC, useEffect, useState } from 'react';
import styles from './index.less';
import { Input, Progress, message } from 'antd';
import { countType, sysType } from '@/utils';
import { countType, sysType } from '@/utils/sysType';
import { useParams } from 'umi';
import DEV from '@/utils/env/dev';

@ -5,10 +5,14 @@ import { rowClassName } from '@/utils';
import { Form, Input, Pagination, Radio, Select, Table, message } from 'antd';
import { useEffect, useState } from 'react';
import styles from './index.less'
import { useLocation, useParams, history } from 'umi';
const { TextArea } = Input;
export default function Page() {
const urlParams = useParams();
const location = useLocation()
const [tableData, setTableData] = useState([]);
const [pageNumber, setPageNumber] = useState(1);
const [pageSize, setpageSize] = useState(10);
@ -19,6 +23,9 @@ export default function Page() {
const [form] = Form.useForm();
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
let sysData = localStorage.getItem(`${urlParams?.fileType}`);
let info = sysData ? JSON.parse(sysData) : null;
const columns: any = [
{ title: '单位名称', dataIndex: 'seatName', key: 'seatName', align: 'center' },
{ title: '系统名称', dataIndex: 'sysName', key: 'sysName', align: 'center' },
@ -144,7 +151,15 @@ export default function Page() {
]}>
</Select>
</Form.Item>
<ButtonComp text={'定位'} style={{ margin: '20px 0 0px 20px' }} onClick={() => { }} />
<ButtonComp text={'定位'} style={{ margin: '20px 0 0px 20px' }} onClick={() => {
let obj: any = {
selectVal: 6,
active: 2,
activeName: '位置管理',
}
localStorage.setItem(`${urlParams?.fileType}`, JSON.stringify({ ...info, layoutInfo: obj }))
history.push(`/registerManage/unitLocation/${urlParams?.fileType}${location?.search}`)
}} />
</div>
<div className='flex_aiC'>
<Form.Item name="sysName" label="系统名称" rules={[{ required: true, message: '请输入系统名称' },]}>

@ -1,31 +1,29 @@
export const countType = {
'hx1': '核心区一',
'hx2': '核心区二',
'zq1': '执勤区一',
'zq2': '执勤区二'
}
export const fileStr = {
'hx1': 'hx',
'hx2': 'hx',
'zq1': 'zq',
'zq2': 'zq'
}
import { MenuType, tabsType } from "./menu";
export const sysType = {
'hx1': 'up_',
'hx2': 'down_',
'zq1': 'up_',
'zq2': 'down_'
// 通过url获取菜单类型
export const getMenuType = (url: string) => {
for (const key in MenuType) {
const menuItems = MenuType[key];
for (const item of menuItems) {
if (item.url === url || (item.data && item.data.some(dataItem => dataItem.url === url))) {
return key;
}
}
}
return null;
}
export const sysTypeStr = {
'up_hx': '上级核心区',
'up_zq': '上级执勤区',
'down_hx': '下级核心区',
'down_zq': '下级执勤区'
// 通过菜单名称获取到下拉框的key值
export const getTabKey = (name: string) => {
for (const [key, items] of Object.entries(tabsType)) {
if (items.some((item: { name: string; }) => item.name === name)) {
return key;
}
}
return null;
}
export const rowClassName = (record:any, index: any) => {
// 设置表格行样式颜色
export const rowClassName = (record: any, index: any) => {
return index % 2 === 0 ? 'even-row' : 'odd-row';
};

@ -0,0 +1,27 @@
export const countType = {
'hx1': '核心区一',
'hx2': '核心区二',
'zq1': '执勤区一',
'zq2': '执勤区二'
}
export const fileStr = {
'hx1': 'hx',
'hx2': 'hx',
'zq1': 'zq',
'zq2': 'zq'
}
export const sysType = {
'hx1': 'up_',
'hx2': 'down_',
'zq1': 'up_',
'zq2': 'down_'
}
export const sysTypeStr = {
'up_hx': '上级核心区',
'up_zq': '上级执勤区',
'down_hx': '下级核心区',
'down_zq': '下级执勤区'
}
Loading…
Cancel
Save