setup

src/components/Modules/QualityCheck/LeftSide/index.jsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import Spec from '../../../Common/CurrentLineSpec';
+import GoodRate from '../../../Common/TodayGood/GoodProduction';
+
+import { motion } from 'framer-motion';
+
+import cls from './index.module.scss';
+
+export default function index() {
+	return (
+		<motion.div
+			className={cls.leftBar}
+			initial={{ opacity: 0, position: 'absolute' }}
+			animate={{ opacity: 1, position: 'relative' }}
+			exit={{ opacity: 0, position: 'relative' }}
+			transition={{ type: 'tween' }}
+		>
+			<Spec style={{ width: '100%' }} />
+			<GoodRate style={{ flex: 1, marginTop: '24px', width: '100%' }} />
+		</motion.div>
+	);
+}

src/components/Modules/QualityCheck/LeftSide/index.module.scss

@@ -0,0 +1,9 @@
+.leftBar {
+	width: 625px;
+	height: 966px;
+	// margin-left: 40px;
+
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+}

src/components/Modules/QualityCheck/RightSide/index.jsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import FanInfo from '../../../Common/FanInfo';
+import WindFrequence from '../../../Common/FanRunFrequence';
+import FaultType from '../../../Common/TodayFaultType';
+import FaultTotal from '../../../Common/TodayFaultTotal';
+import { motion } from 'framer-motion';
+
+import cls from './index.module.scss';
+
+export default function index() {
+	return (
+		<motion.div
+			style={{
+				width: '625px',
+				height: '966px',
+				// background: '#fff3',
+				display: 'flex',
+				flexDirection: 'column',
+			}}
+			initial={{ opacity: 0, position: 'absolute' }}
+			animate={{ opacity: 1, position: 'relative' }}
+			exit={{ opacity: 0, position: 'absolute' }}
+			transition={{ type: 'tween' }}
+		>
+			<div style={{ height: '357px' }}>
+				<FaultType page="fault-total" />
+			</div>
+			<div style={{ flex: 1, marginTop: '24px' }}>
+				<FaultTotal page="fault-total" />
+			</div>
+		</motion.div>
+	);
+}