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 | 93 ++++++++++++++++++++++++++++------------------ 1 files changed, 56 insertions(+), 37 deletions(-) diff --git a/zy-acs-flow/src/page/mission/MissionCard.jsx b/zy-acs-flow/src/page/mission/MissionCard.jsx index 961aac4..2a7bdae 100644 --- a/zy-acs-flow/src/page/mission/MissionCard.jsx +++ b/zy-acs-flow/src/page/mission/MissionCard.jsx @@ -1,33 +1,31 @@ import { Draggable } from '@hello-pangea/dnd'; -import { Box, Card, Typography } from '@mui/material'; -import { ReferenceField, useRedirect } from 'react-admin'; -import { CompanyAvatar } from '../companies/CompanyAvatar'; -import { Deal } from '../types'; +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 = ({ deal, index }) => { - if (!deal) return null; +export const MissionCard = ({ mission, index }) => { + if (!mission) return null; return ( - <Draggable draggableId={String(deal.id)} index={index}> + <Draggable draggableId={String(mission.id)} index={index}> {(provided, snapshot) => ( - <DealCardContent + <MissionCardContent provided={provided} snapshot={snapshot} - deal={deal} + mission={mission} /> )} </Draggable> ); }; -export const DealCardContent = ({ - provided, - snapshot, - deal, -}) => { +export const MissionCardContent = ({ provided, snapshot, mission, }) => { + const theme = useTheme(); + const translate = useTranslate(); const redirect = useRedirect(); const handleClick = () => { - redirect(`/deals/${deal.id}/show`, undefined, undefined, undefined, { + redirect(`/mission/${mission.id}/show`, undefined, undefined, undefined, { _scrollToTop: false, }); }; @@ -44,32 +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={deal} - reference="companies" - link={false} - > - <CompanyAvatar width={20} height={20} /> - </ReferenceField> - <Box sx={{ marginLeft: 1 }}> - <Typography variant="body2" gutterBottom> - {deal.name} + <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"> - {deal.amount.toLocaleString('en-US', { - notation: 'compact', - style: 'currency', - currency: 'USD', - currencyDisplay: 'narrowSymbol', - minimumSignificantDigits: 3, - })} - {deal.category ? `, ${deal.category}` : ''} - </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