From ec66a8bf5969e98d00b8b027dd65d6b8d1a52bb3 Mon Sep 17 00:00:00 2001 From: lb Date: Wed, 1 Nov 2023 11:08:42 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8F=98=E6=9B=B4=E7=9B=AE=E5=BD=95=E7=BB=93?= =?UTF-8?q?=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../CenterMenu/index.module.less | 7 +- src/components/CenterTopData/index.jsx | 4 +- src/components/Head/index.less | 88 ------------------- src/components/LeftBar/index.jsx | 2 +- .../公共组件/产线当日缺陷分类/1 | 1 + .../公共组件/产线缺陷统计/1 | 1 + src/components/公共组件/助燃风流量/1 | 1 + src/components/公共组件/天然气流量/1 | 1 + .../公共组件/导航菜单/index.jsx | 20 +++++ .../导航菜单/index.module.less | 32 +++++++ .../公共组件/时间火向数据/1 | 1 + .../本日生产良品率}/GoodProduction.jsx | 8 +- .../components}/GoodRateChart/index.jsx | 2 +- .../GoodRateChart/index.module.css | 0 .../GoodRateChart/index.module.less | 0 .../components}/GoodRateChart/overwrite.css | 0 .../components}/TechSplitline/index.jsx | 0 .../TechSplitline/index.module.less | 0 .../components}/TodayTableData/index.jsx | 0 .../TodayTableData/index.module.less | 0 .../本日生产良品率}/good.module.less | 2 +- src/components/公共组件/烟气处理/1 | 1 + src/components/公共组件/能耗/1 | 1 + .../顶部公司名称}/index.jsx | 8 +- .../顶部公司名称/index.less | 88 +++++++++++++++++++ src/components/总览/1 | 1 + src/components/窑炉信息/1 | 1 + src/components/窑炉内部/1 | 1 + src/components/能耗分析/1 | 1 + src/components/质检统计/1 | 1 + src/components/退火监测/1 | 1 + src/pages/index.jsx | 2 +- 32 files changed, 171 insertions(+), 105 deletions(-) delete mode 100644 src/components/Head/index.less create mode 100644 src/components/公共组件/产线当日缺陷分类/1 create mode 100644 src/components/公共组件/产线缺陷统计/1 create mode 100644 src/components/公共组件/助燃风流量/1 create mode 100644 src/components/公共组件/天然气流量/1 create mode 100644 src/components/公共组件/导航菜单/index.jsx create mode 100644 src/components/公共组件/导航菜单/index.module.less create mode 100644 src/components/公共组件/时间火向数据/1 rename src/components/{LeftBar => 公共组件/本日生产良品率}/GoodProduction.jsx (59%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/GoodRateChart/index.jsx (98%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/GoodRateChart/index.module.css (100%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/GoodRateChart/index.module.less (100%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/GoodRateChart/overwrite.css (100%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/TechSplitline/index.jsx (100%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/TechSplitline/index.module.less (100%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/TodayTableData/index.jsx (100%) rename src/components/{LeftBar/substitutionCharts => 公共组件/本日生产良品率/components}/TodayTableData/index.module.less (100%) rename src/components/{LeftBar => 公共组件/本日生产良品率}/good.module.less (77%) create mode 100644 src/components/公共组件/烟气处理/1 create mode 100644 src/components/公共组件/能耗/1 rename src/components/{Head => 公共组件/顶部公司名称}/index.jsx (84%) create mode 100644 src/components/公共组件/顶部公司名称/index.less create mode 100644 src/components/总览/1 create mode 100644 src/components/窑炉信息/1 create mode 100644 src/components/窑炉内部/1 create mode 100644 src/components/能耗分析/1 create mode 100644 src/components/质检统计/1 create mode 100644 src/components/退火监测/1 diff --git a/src/components/CenterTopData/CenterMenu/index.module.less b/src/components/CenterTopData/CenterMenu/index.module.less index 4a6b7e2..1dca211 100644 --- a/src/components/CenterTopData/CenterMenu/index.module.less +++ b/src/components/CenterTopData/CenterMenu/index.module.less @@ -1,8 +1,9 @@ .centerMenu { - position: absolute; - top: 20px; - left: 680px; + position: fixed; + top: 120px; + left: 1340px; color: white; + z-index: 10000; } .menuItem { diff --git a/src/components/CenterTopData/index.jsx b/src/components/CenterTopData/index.jsx index ee99753..5caf33a 100644 --- a/src/components/CenterTopData/index.jsx +++ b/src/components/CenterTopData/index.jsx @@ -1,5 +1,5 @@ import React from 'react'; -import CenterMenu from './CenterMenu'; +import NavMenu from '../公共组件/导航菜单'; import Item2 from './RightTable'; import Item1 from './LeftBoxes'; @@ -8,7 +8,7 @@ import cls from './index.module.less'; export default function index() { return ( <> - +
diff --git a/src/components/Head/index.less b/src/components/Head/index.less deleted file mode 100644 index 3b520cb..0000000 --- a/src/components/Head/index.less +++ /dev/null @@ -1,88 +0,0 @@ -.TopTitleBoder { - width: 3840px; - height: 84px; - display: flex; - flex-direction: row; - justify-content: space-between; - - .TopSideRight { - margin-top: 40px; - margin-right: 40px; - width: 493px; - height: 16px; - } - - .TopSideLeft { - margin-left: 40px; - margin-top: 40px; - width: 493px; - height: 16px; - } - - .TopSideLeftLine { - background: url('../../assets/TopTitleLeft.png'); - width: 899px; - height: 40px; - margin-top: 42px; - display: flex; - flex-direction: row; - justify-content: right; - - .TopSideLeftLineicon { - margin-right: 40px; - margin-top: 25px; - width: 204.32px; - height: 2.79px; - } - - .TopSideLeftTxt { - margin-right: 120px; - margin-top: 15px; - color: rgb(255, 255, 255, 0.8); - font-size: 20px; - font-weight: 300px; - line-height: 22.174976px; - } - } - - .TopSiderightLine { - background: url('../../assets/TopTitleRight.png'); - width: 899px; - height: 40px; - margin-top: 42px; - display: flex; - flex-direction: row; - justify-content: left; - - .TopSideRightLineicon { - margin-left: 40px; - margin-top: 25px; - width: 204.32px; - height: 2.79px; - } - - .TopSideRightTxt { - margin-left: 120px; - margin-top: 15px; - color: rgb(255, 255, 255, 0.8); - font-size: 20px; - font-weight: 600px; - line-height: 22.174976px; - } - } - - .TopButtonLine { - margin-top: -9px; - width: 760px; - height: 14px; - } - - .TopTitleText { - margin-top: 16px; - letter-spacing: 8px; - font-size: 32px; - color: #00fff7; - text-align: center; - letter-spacing: 2px; - } -} diff --git a/src/components/LeftBar/index.jsx b/src/components/LeftBar/index.jsx index 17d3422..1c147ee 100644 --- a/src/components/LeftBar/index.jsx +++ b/src/components/LeftBar/index.jsx @@ -1,6 +1,6 @@ import React from 'react'; import Kiln from './Kiln'; -import GoodProduction from './GoodProduction'; +import GoodProduction from '../公共组件/本日生产良品率/GoodProduction'; import cls from './index.module.less'; diff --git a/src/components/公共组件/产线当日缺陷分类/1 b/src/components/公共组件/产线当日缺陷分类/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/公共组件/产线当日缺陷分类/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/公共组件/产线缺陷统计/1 b/src/components/公共组件/产线缺陷统计/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/公共组件/产线缺陷统计/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/公共组件/助燃风流量/1 b/src/components/公共组件/助燃风流量/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/公共组件/助燃风流量/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/公共组件/天然气流量/1 b/src/components/公共组件/天然气流量/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/公共组件/天然气流量/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/公共组件/导航菜单/index.jsx b/src/components/公共组件/导航菜单/index.jsx new file mode 100644 index 0000000..1325e99 --- /dev/null +++ b/src/components/公共组件/导航菜单/index.jsx @@ -0,0 +1,20 @@ +import cls from './index.module.less'; + +export default function CenterMenu() { + const menuList = [ + ['窑炉总览', '/kilnSummary'], + ['窑炉内部', '/kilnInner'], + ['退火监测', '/stopFire'], + ['质检统计', '/quailtyCheck'], + ['能耗分析', '/energyCost'], + ]; + return ( +
+ {menuList.map((menu) => ( +
+ {menu[0]} +
+ ))} +
+ ); +} diff --git a/src/components/公共组件/导航菜单/index.module.less b/src/components/公共组件/导航菜单/index.module.less new file mode 100644 index 0000000..1dca211 --- /dev/null +++ b/src/components/公共组件/导航菜单/index.module.less @@ -0,0 +1,32 @@ +.centerMenu { + position: fixed; + top: 120px; + left: 1340px; + color: white; + z-index: 10000; +} + +.menuItem { + transition: all 0.3s ease-out; + cursor: pointer; + user-select: none; + padding: 10px 20px; + font-size: 32px; + line-height: 48px; + letter-spacing: 6px; + background: url(../../../assets/bg_center_menu.png) no-repeat; + background-size: 100% 50%; + background-position: bottom; + color: #00fff788; + font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', + 'PingFang SC', 'Microsoft YaHei', '微软雅黑', 'Microsoft YaHei UI', + 'Source Han Sans SC', 'Noto Sans CJK SC', 'WenQuanYi Micro Hei', sans-serif; +} + +.menuItem:hover { + color: #00fff7; +} + +.menuItem:not(:first-child) { + margin-left: 50px; +} diff --git a/src/components/公共组件/时间火向数据/1 b/src/components/公共组件/时间火向数据/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/公共组件/时间火向数据/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/LeftBar/GoodProduction.jsx b/src/components/公共组件/本日生产良品率/GoodProduction.jsx similarity index 59% rename from src/components/LeftBar/GoodProduction.jsx rename to src/components/公共组件/本日生产良品率/GoodProduction.jsx index d69c67e..412f4fa 100644 --- a/src/components/LeftBar/GoodProduction.jsx +++ b/src/components/公共组件/本日生产良品率/GoodProduction.jsx @@ -1,8 +1,8 @@ import cls from './good.module.less'; -import Container from '../Container'; -import TodayTableData from './substitutionCharts/TodayTableData'; -import GoodRateChart from './substitutionCharts/GoodRateChart'; -import TechSplitline from './substitutionCharts/TechSplitline'; +import Container from '../../Container'; +import TodayTableData from './components/TodayTableData'; +import GoodRateChart from './components/GoodRateChart'; +import TechSplitline from './components/TechSplitline'; const GoodProduction = () => { return ( diff --git a/src/components/LeftBar/substitutionCharts/GoodRateChart/index.jsx b/src/components/公共组件/本日生产良品率/components/GoodRateChart/index.jsx similarity index 98% rename from src/components/LeftBar/substitutionCharts/GoodRateChart/index.jsx rename to src/components/公共组件/本日生产良品率/components/GoodRateChart/index.jsx index 4d78ae4..95f0e96 100644 --- a/src/components/LeftBar/substitutionCharts/GoodRateChart/index.jsx +++ b/src/components/公共组件/本日生产良品率/components/GoodRateChart/index.jsx @@ -3,7 +3,7 @@ import './overwrite.css'; // 覆写 antd 默认样式，全局 import ReactECharts from 'echarts-for-react'; import * as echarts from 'echarts'; import { Switch, Radio } from 'antd'; -import { randomInt } from '../../../../utils'; +import { randomInt } from '../../../../../utils'; const GoodRateChart = (props) => { const options = { diff --git a/src/components/LeftBar/substitutionCharts/GoodRateChart/index.module.css b/src/components/公共组件/本日生产良品率/components/GoodRateChart/index.module.css similarity index 100% rename from src/components/LeftBar/substitutionCharts/GoodRateChart/index.module.css rename to src/components/公共组件/本日生产良品率/components/GoodRateChart/index.module.css diff --git a/src/components/LeftBar/substitutionCharts/GoodRateChart/index.module.less b/src/components/公共组件/本日生产良品率/components/GoodRateChart/index.module.less similarity index 100% rename from src/components/LeftBar/substitutionCharts/GoodRateChart/index.module.less rename to src/components/公共组件/本日生产良品率/components/GoodRateChart/index.module.less diff --git a/src/components/LeftBar/substitutionCharts/GoodRateChart/overwrite.css b/src/components/公共组件/本日生产良品率/components/GoodRateChart/overwrite.css similarity index 100% rename from src/components/LeftBar/substitutionCharts/GoodRateChart/overwrite.css rename to src/components/公共组件/本日生产良品率/components/GoodRateChart/overwrite.css diff --git a/src/components/LeftBar/substitutionCharts/TechSplitline/index.jsx b/src/components/公共组件/本日生产良品率/components/TechSplitline/index.jsx similarity index 100% rename from src/components/LeftBar/substitutionCharts/TechSplitline/index.jsx rename to src/components/公共组件/本日生产良品率/components/TechSplitline/index.jsx diff --git a/src/components/LeftBar/substitutionCharts/TechSplitline/index.module.less b/src/components/公共组件/本日生产良品率/components/TechSplitline/index.module.less similarity index 100% rename from src/components/LeftBar/substitutionCharts/TechSplitline/index.module.less rename to src/components/公共组件/本日生产良品率/components/TechSplitline/index.module.less diff --git a/src/components/LeftBar/substitutionCharts/TodayTableData/index.jsx b/src/components/公共组件/本日生产良品率/components/TodayTableData/index.jsx similarity index 100% rename from src/components/LeftBar/substitutionCharts/TodayTableData/index.jsx rename to src/components/公共组件/本日生产良品率/components/TodayTableData/index.jsx diff --git a/src/components/LeftBar/substitutionCharts/TodayTableData/index.module.less b/src/components/公共组件/本日生产良品率/components/TodayTableData/index.module.less similarity index 100% rename from src/components/LeftBar/substitutionCharts/TodayTableData/index.module.less rename to src/components/公共组件/本日生产良品率/components/TodayTableData/index.module.less diff --git a/src/components/LeftBar/good.module.less b/src/components/公共组件/本日生产良品率/good.module.less similarity index 77% rename from src/components/LeftBar/good.module.less rename to src/components/公共组件/本日生产良品率/good.module.less index 3b4237a..28483bc 100644 --- a/src/components/LeftBar/good.module.less +++ b/src/components/公共组件/本日生产良品率/good.module.less @@ -1,5 +1,5 @@ .goodProd { - background: url(../../assets/good.png) no-repeat; + background: url(../../../assets/good.png) no-repeat; background-size: 100% 100%; width: 625px; // height: 626px; diff --git a/src/components/公共组件/烟气处理/1 b/src/components/公共组件/烟气处理/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/公共组件/烟气处理/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/公共组件/能耗/1 b/src/components/公共组件/能耗/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/公共组件/能耗/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/Head/index.jsx b/src/components/公共组件/顶部公司名称/index.jsx similarity index 84% rename from src/components/Head/index.jsx rename to src/components/公共组件/顶部公司名称/index.jsx index 5b656a0..fcf2282 100644 --- a/src/components/Head/index.jsx +++ b/src/components/公共组件/顶部公司名称/index.jsx @@ -1,9 +1,9 @@ import React, { useEffect, useState, useRef } from 'react'; -import TopSide from '../../assets/TopSide.png'; -import LeftLine from '../../assets/TopTitleLeftIcon.png'; -import RightLine from '../../assets/TopTitleRightIcon.png'; -import ButtonLine from '../../assets/TopButtonLine.png'; +import TopSide from '../../../assets/TopSide.png'; +import LeftLine from '../../../assets/TopTitleLeftIcon.png'; +import RightLine from '../../../assets/TopTitleRightIcon.png'; +import ButtonLine from '../../../assets/TopButtonLine.png'; import './index.less'; export default function index() { diff --git a/src/components/公共组件/顶部公司名称/index.less b/src/components/公共组件/顶部公司名称/index.less new file mode 100644 index 0000000..6fc0bb3 --- /dev/null +++ b/src/components/公共组件/顶部公司名称/index.less @@ -0,0 +1,88 @@ +.TopTitleBoder { + width: 3840px; + height: 84px; + display: flex; + flex-direction: row; + justify-content: space-between; + + .TopSideRight { + margin-top: 40px; + margin-right: 40px; + width: 493px; + height: 16px; + } + + .TopSideLeft { + margin-left: 40px; + margin-top: 40px; + width: 493px; + height: 16px; + } + + .TopSideLeftLine { + background: url('../../../assets/TopTitleLeft.png'); + width: 899px; + height: 40px; + margin-top: 42px; + display: flex; + flex-direction: row; + justify-content: right; + + .TopSideLeftLineicon { + margin-right: 40px; + margin-top: 25px; + width: 204.32px; + height: 2.79px; + } + + .TopSideLeftTxt { + margin-right: 120px; + margin-top: 15px; + color: rgb(255, 255, 255, 0.8); + font-size: 20px; + font-weight: 300px; + line-height: 22.174976px; + } + } + + .TopSiderightLine { + background: url('../../../assets/TopTitleRight.png'); + width: 899px; + height: 40px; + margin-top: 42px; + display: flex; + flex-direction: row; + justify-content: left; + + .TopSideRightLineicon { + margin-left: 40px; + margin-top: 25px; + width: 204.32px; + height: 2.79px; + } + + .TopSideRightTxt { + margin-left: 120px; + margin-top: 15px; + color: rgb(255, 255, 255, 0.8); + font-size: 20px; + font-weight: 600px; + line-height: 22.174976px; + } + } + + .TopButtonLine { + margin-top: -9px; + width: 760px; + height: 14px; + } + + .TopTitleText { + margin-top: 16px; + letter-spacing: 8px; + font-size: 32px; + color: #00fff7; + text-align: center; + letter-spacing: 2px; + } +} diff --git a/src/components/总览/1 b/src/components/总览/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/总览/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/窑炉信息/1 b/src/components/窑炉信息/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/窑炉信息/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/窑炉内部/1 b/src/components/窑炉内部/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/窑炉内部/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/能耗分析/1 b/src/components/能耗分析/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/能耗分析/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/质检统计/1 b/src/components/质检统计/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/质检统计/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/components/退火监测/1 b/src/components/退火监测/1 new file mode 100644 index 0000000..56a6051 --- /dev/null +++ b/src/components/退火监测/1 @@ -0,0 +1 @@ +1 \ No newline at end of file diff --git a/src/pages/index.jsx b/src/pages/index.jsx index 080035b..227c04a 100644 --- a/src/pages/index.jsx +++ b/src/pages/index.jsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react'; import './global.less'; import './index.less'; -import Head from '../components/Head'; +import Head from '../components/公共组件/顶部公司名称'; import LeftBar from '../components/LeftBar'; import BottomBar from '../components/BottomBar'; import RightBar from '../components/RightBar';