diff --git a/config/router.config.js b/config/router.config.js
index dece939..a530029 100644
--- a/config/router.config.js
+++ b/config/router.config.js
@@ -42,6 +42,22 @@ export default [
},
],
},
+ {
+ path: '/command',
+ component: '../layouts/CommandPlatformLayout',
+ routes: [
+ {
+ name: '平台1',
+ path: '/command/one',
+ component: './CommandPlatform/One',
+ },
+ {
+ name: '平台2',
+ path: '/command/two',
+ component: './CommandPlatform/Two',
+ },
+ ],
+ },
{
path: '/',
component: '../layouts/SingalLayout',
diff --git a/src/assets/CommandPlatform/background.png b/src/assets/CommandPlatform/background.png
new file mode 100644
index 0000000..57a7855
Binary files /dev/null and b/src/assets/CommandPlatform/background.png differ
diff --git a/src/assets/CommandPlatform/tit.png b/src/assets/CommandPlatform/tit.png
new file mode 100644
index 0000000..3ed6f13
Binary files /dev/null and b/src/assets/CommandPlatform/tit.png differ
diff --git a/src/layouts/CommandPlatformLayout.js b/src/layouts/CommandPlatformLayout.js
new file mode 100644
index 0000000..212e077
--- /dev/null
+++ b/src/layouts/CommandPlatformLayout.js
@@ -0,0 +1,178 @@
+/**
+ * Created by sciisc on 2018/12/6.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Layout } from 'antd';
+import classNames from 'classnames';
+import isEqual from 'lodash/isEqual';
+import pathToRegexp from 'path-to-regexp';
+import { ContainerQuery } from 'react-container-query';
+import DocumentTitle from 'react-document-title';
+import memoizeOne from 'memoize-one';
+import styles from './CommandPlatformLayout.less';
+import Context from './MenuContext';
+// Conversion router to menu.
+function formatter(data, parentPath = '', parentAuthority, parentName) {
+ return data.map(item => {
+ let locale = 'menu';
+ if (parentName && item.name) {
+ locale = `${parentName}.${item.name}`;
+ } else if (item.name) {
+ locale = `menu.${item.name}`;
+ } else if (parentName) {
+ locale = parentName;
+ }
+ const result = {
+ ...item,
+ locale,
+ authority: item.authority || parentAuthority,
+ };
+ if (item.routes) {
+ const children = formatter(item.routes, `${parentPath}${item.path}/`, item.authority, locale);
+ // Reduce memory usage
+ result.children = children;
+ }
+ delete result.routes;
+ return result;
+ });
+}
+
+const query = {
+ 'm_screen-xs': {
+ maxWidth: 575,
+ },
+ 'm_screen-sm': {
+ minWidth: 576,
+ maxWidth: 767,
+ },
+ 'm_screen-md': {
+ minWidth: 768,
+ maxWidth: 991,
+ },
+ 'm_screen-lg': {
+ minWidth: 992,
+ maxWidth: 1199,
+ },
+ 'm_screen-xl': {
+ minWidth: 1200,
+ maxWidth: 1599,
+ },
+ 'm_screen-xxl': {
+ minWidth: 1600,
+ maxWidth: 1920,
+ },
+ 'm_screen-2k': {
+ minWidth: 1920 * 2 * 1.2,
+ },
+ 'm_screen-8k': {
+ minWidth: 1920 * 4 * 1.2,
+ },
+};
+
+class CommandPlatformLayout extends React.PureComponent {
+ constructor(props) {
+ super(props);
+ this.getPageTitle = memoizeOne(this.getPageTitle);
+ this.getBreadcrumbNameMap = memoizeOne(this.getBreadcrumbNameMap, isEqual);
+ this.breadcrumbNameMap = this.getBreadcrumbNameMap();
+ }
+
+ getContext() {
+ const { location } = this.props;
+ return {
+ location,
+ breadcrumbNameMap: this.breadcrumbNameMap,
+ };
+ }
+
+ getMenuData() {
+ const {
+ route: { routes },
+ } = this.props;
+ return formatter(routes);
+ }
+
+ /**
+ * 获取面包屑映射
+ * @param {Object} menuData 菜单配置
+ */
+ getBreadcrumbNameMap() {
+ const routerMap = {};
+ const mergeMenuAndRouter = data => {
+ data.forEach(menuItem => {
+ if (menuItem.children) {
+ mergeMenuAndRouter(menuItem.children);
+ }
+ // Reduce memory usage
+ routerMap[menuItem.path] = menuItem;
+ });
+ };
+ mergeMenuAndRouter(this.getMenuData());
+ return routerMap;
+ }
+
+ getPageTitle = pathname => {
+ let currRouterData = null;
+ // match params path
+ Object.keys(this.breadcrumbNameMap).forEach(key => {
+ if (pathToRegexp(key).test(pathname)) {
+ currRouterData = this.breadcrumbNameMap[key];
+ }
+ });
+ if (!currRouterData) {
+ return 'Hiatmp';
+ }
+ /* const message = formatMessage({
+ id: currRouterData.locale || currRouterData.name,
+ defaultMessage: currRouterData.name,
+ }); */
+ return `${currRouterData.name}`;
+ };
+ setRemPc = () => {
+ var docEl = document.documentElement,
+ resizeEvt = "orientationchange" in window ? "orientationchange" : "resize",
+ recalc = function () {
+ var clientWidth = docEl.clientWidth;
+ if (!clientWidth) return;
+ if (location.href.indexOf("express") > -1) {
+ docEl.style.fontSize = "";
+ } else if (clientWidth >= 7680) {
+ docEl.style.fontSize = "100px"; //1rem = 100px
+ } else {
+ docEl.style.fontSize = 100 * (clientWidth / 7680) + "px";
+ }
+ };
+ if (!document.addEventListener) return;
+ window.addEventListener(resizeEvt, recalc, false);
+ document.addEventListener("DOMContentLoaded", recalc, false);
+ // var whdef = 100 / 7680;
+ // var bodyWidth = document.body.clientWidth;
+ // var rem = bodyWidth * whdef;
+ // document.getElementsByTagName('html')[0].style.fontSize = rem + 'px';
+ }
+
+ componentDidMount(){
+ this.setRemPc()
+ }
+ render() {
+ const {
+ children,
+ location: { pathname },
+ } = this.props;
+
+ return (
+
+
+ {params => (
+
+ {children}
+
+ )}
+
+
+ );
+ }
+}
+
+export default CommandPlatformLayout;
diff --git a/src/layouts/CommandPlatformLayout.less b/src/layouts/CommandPlatformLayout.less
new file mode 100644
index 0000000..6c7658e
--- /dev/null
+++ b/src/layouts/CommandPlatformLayout.less
@@ -0,0 +1,9 @@
+html, body{
+ min-height: 2160px;
+ min-width: 7680px;
+ // width: 100%;
+ // height: 100%;
+}
+.defaulthiew{
+ height: auto;
+}
\ No newline at end of file
diff --git a/src/pages/CommandPlatform/One.js b/src/pages/CommandPlatform/One.js
new file mode 100644
index 0000000..2669699
--- /dev/null
+++ b/src/pages/CommandPlatform/One.js
@@ -0,0 +1,55 @@
+
+import styles from './One.less'
+import Congestion from '../../components/CommandPlatform/left/Congestion'
+import Rank from '../../components/CommandPlatform/left/Rank'
+import CongestionTrend from '../../components/CommandPlatform/left/CongestionTrend'
+import SpeedTrend from '../../components/CommandPlatform/left/SpeedTrend'
+
+import SituationNum from '../../components/CommandPlatform/left/SituationNum'
+import SituationDispose from '../../components/CommandPlatform/left/SituationDispose'
+
+import Controls from '../../components/CommandPlatform/right/Controls'
+import Cars from '../../components/CommandPlatform/right/Cars'
+import Construction from '../../components/CommandPlatform/right/Construction'
+import Baseline from '../../components/CommandPlatform/right/Baseline'
+import Opinion from '../../components/CommandPlatform/right/Opinion'
+
+class One extends React.PureComponent {
+ constructor(props) {
+ super(props);
+ }
+
+
+ render() {
+ return (
+
+
+
+
+ {/*
+
+ */}
+
+
+ {/*
+ */}
+
+
+ {/*
+
*/}
+