From 3a542f1aad01e3f98e44fbcdd354fc86f189a9e3 Mon Sep 17 00:00:00 2001
From: mmc <1556375442@qq.com>
Date: Mon, 15 Jun 2026 09:20:01 +0800
Subject: [PATCH] =?UTF-8?q?=E5=85=A8=E6=99=AF=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/devices/mowerAllView.jsx | 101 ++++++++++++++++++++++++
 1 file changed, 101 insertions(+)
 create mode 100644 src/components/devices/mowerAllView.jsx

diff --git a/src/components/devices/mowerAllView.jsx b/src/components/devices/mowerAllView.jsx
new file mode 100644
index 0000000..e56a5ff
--- /dev/null
+++ b/src/components/devices/mowerAllView.jsx
@@ -0,0 +1,101 @@
+
+import VideoPlayer from '../VideoPlayer.tsx';
+
+export function MowerAllView({ serialNumber, robotVideo, error, ready }) {
+	return (
+		<div style={{
+			display: 'flex',
+			flexDirection: 'column',
+			width: '100%',
+			height: '100%',
+			gap: 8, // 窗口之间间距
+			padding: 8,
+			boxSizing: 'border-box',
+			overflow: 'auto' // 固定宽高后超出滚动
+		}}>
+			{/* 第一行：左视 + 前视 + 右视 三等分 */}
+			<div style={{ display: 'flex', gap: 8, justifyContent: 'center' }}>
+				{/* 左视 */}
+				<div style={{
+					flex: 1,
+					position: 'relative',
+					border: '1px solid #eae4e4',
+					flexShrink: 0,// 禁止压缩
+					borderRadius: 8,
+				}}>
+					<VideoPlayer
+						deviceId={serialNumber}
+						idx={3}
+						className="w-full h-full object-contain"
+						video={robotVideo}
+						error={error}
+						ready={ready}
+					/>
+					<div style={{ position: 'absolute', top: 4, left: 8, color: '#fff', fontSize: 12, background: '#0006', padding: '2px 6px', borderRadius: 4 }}>左视</div>
+				</div>
+
+				{/* 前视 */}
+				<div style={{
+					flex: 1,
+					position: 'relative',
+					border: '1px solid #eae4e4',
+					flexShrink: 0,// 禁止压缩
+					borderRadius: 8,
+				}}>
+					<VideoPlayer
+						deviceId={serialNumber}
+						idx={1}
+						className="w-full h-full object-contain"
+						video={robotVideo}
+						error={error}
+						ready={ready}
+					/>
+					<div style={{ position: 'absolute', top: 4, left: 8, color: '#fff', fontSize: 12, background: '#0006', padding: '2px 6px', borderRadius: 4 }}>前视</div>
+				</div>
+
+				{/* 右视 */}
+				<div style={{
+					flex: 1,
+					//width: 360,
+					//height: 240,
+					position: 'relative',
+					border: '1px solid #eae4e4',
+					//flexShrink: 0,// 禁止压缩
+					borderRadius: 8,
+				}}>
+					<VideoPlayer
+						deviceId={serialNumber}
+						idx={4}
+						className="w-full h-full object-contain"
+						video={robotVideo}
+						error={error}
+						ready={ready}
+					/>
+					<div style={{ position: 'absolute', top: 4, left: 8, color: '#fff', fontSize: 12, background: '#0006', padding: '2px 6px', borderRadius: 4 }}>右视</div>
+				</div>
+			</div>
+
+			{/* 第二行：后视 单独一行居中 */}
+			<div style={{ display: 'flex', justifyContent: 'center' }}>
+				<div style={{
+					width: 360,
+					height: 240,
+					position: 'relative',
+					border: '1px solid #eae4e4',
+					flexShrink: 0,// 禁止压缩
+					borderRadius: 8,
+				}}>
+					<VideoPlayer
+						deviceId={serialNumber}
+						idx={2}
+						className="w-full h-full object-contain"
+						video={robotVideo}
+						error={error}
+						ready={ready}
+					/>
+					<div style={{ position: 'absolute', top: 4, left: 8, color: '#fff', fontSize: 12, background: '#0006', padding: '2px 6px', borderRadius: 4 }}>后视</div>
+				</div>
+			</div>
+		</div>
+	)
+}