From 7f70cb15d035f0c233b9e62b9e43aa985317c908 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期一, 04 十一月 2024 10:22:45 +0800 Subject: [PATCH] # --- zy-acs-flow/src/page/mission/MissionCard.jsx | 69 ++++++++++++++++++++++++---------- 1 files changed, 49 insertions(+), 20 deletions(-) diff --git a/zy-acs-flow/src/page/mission/MissionCard.jsx b/zy-acs-flow/src/page/mission/MissionCard.jsx index 4fe4b4e..2a7bdae 100644 --- a/zy-acs-flow/src/page/mission/MissionCard.jsx +++ b/zy-acs-flow/src/page/mission/MissionCard.jsx @@ -1,6 +1,8 @@ import { Draggable } from '@hello-pangea/dnd'; -import { Box, Card, Typography } from '@mui/material'; -import { ReferenceField, useRedirect } from 'react-admin'; +import { Box, Card, Typography, Avatar, Divider, Stack, Slider, useTheme } from '@mui/material'; +import { ReferenceField, useRedirect, useTranslate } from 'react-admin'; +import { blueGrey } from '@mui/material/colors'; +import { styled } from '@mui/material/styles'; export const MissionCard = ({ mission, index }) => { if (!mission) return null; @@ -18,11 +20,9 @@ ); }; -export const MissionCardContent = ({ - provided, - snapshot, - mission, -}) => { +export const MissionCardContent = ({ provided, snapshot, mission, }) => { + const theme = useTheme(); + const translate = useTranslate(); const redirect = useRedirect(); const handleClick = () => { redirect(`/mission/${mission.id}/show`, undefined, undefined, undefined, { @@ -42,24 +42,53 @@ style={{ opacity: snapshot?.isDragging ? 0.9 : 1, transform: snapshot?.isDragging ? 'rotate(-2deg)' : '', + transition: '0.3s', }} elevation={snapshot?.isDragging ? 3 : 1} > - <Box padding={1} display="flex"> - <ReferenceField - source="company_id" - record={mission} - reference="companies" - link={false} - > - </ReferenceField> - <Box sx={{ marginLeft: 1 }}> - <Typography variant="body2" gutterBottom> + <Box padding={2} pb={1} display="flex" flexDirection="column"> + <Box display="flex" alignItems="center" mb={1.5}> + <Avatar + sx={{ + width: 30, + height: 30, + bgcolor: theme.palette.primary.main, + }} + > + {mission.agv} + </Avatar> + <Divider orientation="vertical" flexItem sx={{ margin: '0 8px' }} /> + <Typography variant="body1" noWrap> {mission.groupNo} </Typography> - <Typography variant="caption" color="textSecondary"> - 1 - </Typography> + </Box> + <Box> + <Stack direction="row" justifyContent="space-between" mb={1}> + <Typography variant="caption" color="textSecondary"> + {translate('table.field.mission.backpack')} : {mission.backpack} + </Typography> + <Typography variant="caption" color="textPrimary"> + {translate('table.field.mission.code')}: {mission.currCode} + </Typography> + </Stack> + <Divider orientation="horizontal" flexItem /> + <Stack direction="row" justifyContent="space-between" > + <Typography variant="overline"> + {translate('table.field.mission.task')}: [{mission.taskNos.join(',')}] + </Typography> + </Stack> + <Stack pl={0.5} pr={0.5} direction="row" spacing={1} alignItems="center" mb={.6}> + <Slider + aria-label="Progress" + defaultValue={mission.progress} + getAriaValueText={(value) => { + return `${value}%`; + }} + color="secondary" + size="small" + marks + /> + </Stack> </Box> </Box> </Card> -- Gitblit v1.9.1