From cc24d53704db8fdf4cd43dfc3b005af73d79d290 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期五, 20 九月 2024 13:36:49 +0800 Subject: [PATCH] # --- zy-acs-flow/src/page/components/PulseSignal.jsx | 39 +++++++++++++++++++ zy-acs-flow/src/page/agv/AgvCard.jsx | 24 ++++++++++- 2 files changed, 60 insertions(+), 3 deletions(-) diff --git a/zy-acs-flow/src/page/agv/AgvCard.jsx b/zy-acs-flow/src/page/agv/AgvCard.jsx index 58d9299..e86aae0 100644 --- a/zy-acs-flow/src/page/agv/AgvCard.jsx +++ b/zy-acs-flow/src/page/agv/AgvCard.jsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { useState } from 'react'; -import { Paper, Typography, Box } from '@mui/material'; +import { Paper, Typography, Box, Chip, Stack } from '@mui/material'; import ContactsIcon from '@mui/icons-material/AccountCircle'; import DealIcon from '@mui/icons-material/MonetizationOn'; import { @@ -10,8 +10,9 @@ Link, useResourceContext, } from 'react-admin'; - +import PulseSignal from '../components/PulseSignal'; import { AgvAvatar } from './AgvAvatar'; +import BatteryCharging90Icon from '@mui/icons-material/BatteryCharging90'; export const AgvCard = (props) => { const resource = useResourceContext(); @@ -44,6 +45,23 @@ }} elevation={elevation} > + <Box display="flex" flexDirection="row" alignItems="center" justifyContent='space-between'> + <PulseSignal + flag={true} + /> + <Box display="flex" alignItems="center"> + <BatteryCharging90Icon + sx={{ + width: 12, + height: 12, + color: record.vol > 50 ? 'green' : record.vol > 20 ? 'orange' : 'red', + }} + /> + <Typography variant="body2"> + {record.vol} + </Typography> + </Box> + </Box> <Box display="flex" flexDirection="column" alignItems="center"> <AgvAvatar /> <Box textAlign="center" marginTop={1}> @@ -51,7 +69,7 @@ {record.agvStatus} </Typography> <Typography variant="overline" sx={{ opacity: .7 }}> - {record.code} + code: {record.code} </Typography> </Box> </Box> diff --git a/zy-acs-flow/src/page/components/PulseSignal.jsx b/zy-acs-flow/src/page/components/PulseSignal.jsx new file mode 100644 index 0000000..b4a0750 --- /dev/null +++ b/zy-acs-flow/src/page/components/PulseSignal.jsx @@ -0,0 +1,39 @@ +import * as React from 'react'; +import { Paper, Typography, Box, Chip, Avatar } from '@mui/material'; + +const PulseSignal = (props) => { + const { flag = true, width = 8, ...rest } = props; + + return ( + <> + <Box + {...rest} + sx={{ + width: width, + height: width, + borderRadius: '50%', + backgroundColor: flag ? '#3f51b5' : '#f44336', + display: 'inline-block', + animation: 'pulse 1.5s infinite', + '@keyframes pulse': { + '0%': { + transform: 'scale(1)', + opacity: 1, + }, + '50%': { + transform: 'scale(1.2)', + opacity: 0.7, + }, + '100%': { + transform: 'scale(1)', + opacity: 1, + }, + }, + }} + /> + </> + ) + +} + +export default PulseSignal; \ No newline at end of file -- Gitblit v1.9.1