Compare commits
No commits in common. "3313025a5266af017c05df5929d37787e39fd8bf" and "ecd7d05ad211387d231d3727542ebfb344ad8943" have entirely different histories.
3313025a52
...
ecd7d05ad2
76
package.json
76
package.json
|
|
@ -3,45 +3,45 @@
|
||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"private": true,
|
"private": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@craco/craco": "5.8.0",
|
"@craco/craco": "^5.8.0",
|
||||||
"@date-io/moment": "1.3.13",
|
"@date-io/moment": "^1.3.13",
|
||||||
"@fullcalendar/core": "4.2.0",
|
"@fullcalendar/core": "^4.2.0",
|
||||||
"@fullcalendar/daygrid": "4.2.0",
|
"@fullcalendar/daygrid": "^4.2.0",
|
||||||
"@fullcalendar/interaction": "4.2.0",
|
"@fullcalendar/interaction": "^4.2.0",
|
||||||
"@fullcalendar/react": "4.2.0",
|
"@fullcalendar/react": "^4.2.0",
|
||||||
"@material-ui/core": "4.11.0",
|
"@material-ui/core": "^4.11.0",
|
||||||
"@material-ui/icons": "4.9.1",
|
"@material-ui/icons": "^4.9.1",
|
||||||
"@material-ui/lab": "4.0.0-alpha.57",
|
"@material-ui/lab": "^4.0.0-alpha.57",
|
||||||
"@material-ui/pickers": "3.2.10",
|
"@material-ui/pickers": "^3.2.10",
|
||||||
"@rematch/core": "1.4.0",
|
"@rematch/core": "^1.4.0",
|
||||||
"@rematch/persist": "1.1.6",
|
"@rematch/persist": "^1.1.6",
|
||||||
"@turf/turf": "5.1.6",
|
"@turf/turf": "^5.1.6",
|
||||||
"clone": "2.1.2",
|
"clone": "^2.1.2",
|
||||||
"clsx": "1.1.1",
|
"clsx": "^1.1.1",
|
||||||
"craco-less": "1.17.0",
|
"craco-less": "^1.17.0",
|
||||||
"d3-contour": "2.0.0",
|
"d3-contour": "^2.0.0",
|
||||||
"echarts": "4.9.0",
|
"echarts": "^4.9.0",
|
||||||
"echarts-for-react": "2.0.16",
|
"echarts-for-react": "2.0.16",
|
||||||
"http-proxy-middleware": "1.0.6",
|
"http-proxy-middleware": "^1.0.6",
|
||||||
"localforage": "1.9.0",
|
"localforage": "^1.9.0",
|
||||||
"mapbox-gl": "2.2.0",
|
"mapbox-gl": "^2.2.0",
|
||||||
"moment": "2.29.1",
|
"moment": "^2.29.1",
|
||||||
"polylabel": "1.1.0",
|
"polylabel": "^1.1.0",
|
||||||
"rc-tree": "4.1.5",
|
"rc-tree": "^4.1.5",
|
||||||
"rc-trigger": "5.2.5",
|
"rc-trigger": "^5.2.5",
|
||||||
"react": "17.0.1",
|
"react": "^17.0.1",
|
||||||
"react-custom-scrollbars": "4.2.1",
|
"react-custom-scrollbars": "^4.2.1",
|
||||||
"react-dom": "17.0.1",
|
"react-dom": "^17.0.1",
|
||||||
"react-double-marquee": "1.0.6",
|
"react-double-marquee": "^1.0.6",
|
||||||
"react-hook-form": "7.2.1",
|
"react-hook-form": "^7.2.1",
|
||||||
"react-redux": "7.2.2",
|
"react-redux": "^7.2.2",
|
||||||
"react-router": "5.2.0",
|
"react-router": "^5.2.0",
|
||||||
"react-router-config": "5.1.1",
|
"react-router-config": "^5.1.1",
|
||||||
"react-router-dom": "5.2.0",
|
"react-router-dom": "^5.2.0",
|
||||||
"react-scripts": "4.0.0",
|
"react-scripts": "^4.0.0",
|
||||||
"react-transition-group": "4.4.1",
|
"react-transition-group": "^4.4.1",
|
||||||
"redux": "4.0.5",
|
"redux": "^4.0.5",
|
||||||
"reselect": "4.0.0"
|
"reselect": "^4.0.0"
|
||||||
},
|
},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "craco start",
|
"start": "craco start",
|
||||||
|
|
|
||||||
|
|
@ -1,49 +1,19 @@
|
||||||
import React, { useMemo, useState } from 'react';
|
import React from 'react';
|
||||||
import clsx from 'clsx';
|
import clsx from 'clsx';
|
||||||
import './ActionDock.less';
|
import './ActionDock.less';
|
||||||
import { useDispatch, useSelector } from 'react-redux';
|
import { useDispatch, useSelector } from 'react-redux';
|
||||||
import { makeStyles, Tooltip, Typography } from '@material-ui/core';
|
import { makeStyles, Tooltip, Typography } from '@material-ui/core';
|
||||||
|
|
||||||
const VIEWS = [
|
const VIEWS = [
|
||||||
{ id: 100, title: '防汛', img: '/assets/menu/防洪形势.png',children:[
|
{ id: 0, title: '防洪形势', img: '/assets/menu/防洪形势.png' },
|
||||||
{ id: 0, title: '防洪形势', img: '/assets/menu/防洪形势.png' },
|
{ id: 1, title: '实时数据', img: '/assets/menu/实时数据.png' },
|
||||||
{ id: 1, title: '实时数据', img: '/assets/menu/实时数据.png' },
|
{ id: 6, title: '水库调度', img: '/assets/menu/病险水库.png' },
|
||||||
{ id: 6, title: '水库调度', img: '/assets/menu/病险水库.png' },
|
{ id: 2, title: '水利设施', img: '/assets/menu/水利设施.png' },
|
||||||
{ id: 2, title: '水利设施', img: '/assets/menu/水利设施.png' },
|
{ id: 3, title: '辅助决策', img: '/assets/menu/辅助决策.png' },
|
||||||
{ id: 3, title: '辅助决策', img: '/assets/menu/辅助决策.png' },
|
{ id: 4, title: '降雨中心', img: '/assets/menu/预警分析.png' },
|
||||||
{ id: 4, title: '降雨中心', img: '/assets/menu/预警分析.png' },
|
{ id: 5, title: '天气预报', img: '/assets/menu/降雨中心.png' },
|
||||||
{ id: 5, title: '天气预报', img: '/assets/menu/降雨中心.png' },
|
|
||||||
] },
|
|
||||||
{ id: 200, title: '水库', img: '/assets/menu/实时数据.png',children:[
|
|
||||||
// 雨情监测
|
|
||||||
// 水情监测
|
|
||||||
// 安全监测
|
|
||||||
// 视频监控
|
|
||||||
// 防汛调度
|
|
||||||
// 水库管理
|
|
||||||
] },
|
|
||||||
{ id: 300, title: '水厂', img: '/assets/menu/实时数据.png',children:[
|
|
||||||
// 供水态势
|
|
||||||
// 水质安全
|
|
||||||
// 水厂运行
|
|
||||||
// 管网健康诊断
|
|
||||||
// 应急指挥调度
|
|
||||||
// 决策支持与报表
|
|
||||||
] },
|
|
||||||
{ id: 400, title: '灌区', img: '/assets/menu/实时数据.png',children:[
|
|
||||||
// 图层控制
|
|
||||||
// 灌区监测
|
|
||||||
// 预警信息管理
|
|
||||||
// 水旱灾害防御
|
|
||||||
// 水资源调度
|
|
||||||
// 量测水管理
|
|
||||||
// 水政管理
|
|
||||||
// 工程管理
|
|
||||||
] },
|
|
||||||
|
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
const useStylesBootstrap = makeStyles((theme) => ({
|
const useStylesBootstrap = makeStyles((theme) => ({
|
||||||
arrow: {
|
arrow: {
|
||||||
color: '#0004',
|
color: '#0004',
|
||||||
|
|
@ -63,41 +33,15 @@ function BootstrapTooltip(props) {
|
||||||
|
|
||||||
export default function ActionDock({ }) {
|
export default function ActionDock({ }) {
|
||||||
const view = useSelector(s => s.map.view);
|
const view = useSelector(s => s.map.view);
|
||||||
const [viewKey,setViewKey] = useState(null)
|
|
||||||
const viewItem = useMemo(()=>viewKey?VIEWS.filter(o=>o.id===viewKey)[0].children:VIEWS,[viewKey,VIEWS])
|
|
||||||
|
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="dp-actiondock">
|
<div className="dp-actiondock">
|
||||||
{
|
{
|
||||||
viewKey?
|
VIEWS.map(o => (
|
||||||
<BootstrapTooltip key={999} title={<Typography variant="h6">返回</Typography>}>
|
|
||||||
<div className="dock-item" onClick={() => {
|
|
||||||
// dispatch.map.setView(o.id) 这里不知道用哪个，等问好在弄
|
|
||||||
setViewKey(null)
|
|
||||||
}}>
|
|
||||||
<div className={clsx('button', { active: false })}>
|
|
||||||
<img width={40} style={{marginLeft:'5px'}} src={'/assets/pump/退出.png'} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</BootstrapTooltip>
|
|
||||||
:null
|
|
||||||
}
|
|
||||||
{
|
|
||||||
viewItem.map(o => (
|
|
||||||
<BootstrapTooltip key={o.id} title={<Typography variant="h6">{o.title}</Typography>}>
|
<BootstrapTooltip key={o.id} title={<Typography variant="h6">{o.title}</Typography>}>
|
||||||
<div className="dock-item" onClick={() => {
|
<div className="dock-item" onClick={() => dispatch.map.setView(o.id)}>
|
||||||
if(o.children){
|
|
||||||
//一级菜单
|
|
||||||
dispatch.map.setView(o.children[0].id)
|
|
||||||
setViewKey(o.id)
|
|
||||||
}else{
|
|
||||||
//二级菜单
|
|
||||||
dispatch.map.setView(o.id)
|
|
||||||
}
|
|
||||||
}}>
|
|
||||||
<div className={clsx('button', { active: view === o.id })}>
|
<div className={clsx('button', { active: view === o.id })}>
|
||||||
<img src={o.img} />
|
<img src={o.img} />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue