| | |
| | | import { |
| | | DEVICE_TYPE, |
| | | } from '../constants'; |
| | | import JsonShow from '../JsonShow'; |
| | | import ShelfInsight from './shelf'; |
| | | import AgvInsight from './agv'; |
| | | import PointInsight from './point'; |
| | | |
| | | const Insight = (props) => { |
| | | const { open, onCancel, sprite, width = PAGE_DRAWER_WIDTH } = props; |
| | |
| | | {open && ( |
| | | <Box pt={12} width={{ xs: '100vW', sm: width }} height={'calc(100vh - 100px);'} mt={{ xs: 2, sm: 1 }} sx={{ |
| | | }}> |
| | | <Stack direction="row" p={2}> |
| | | <Stack direction="row" p={2} pt={3}> |
| | | <Typography variant="h6" flex="1"> |
| | | {title || translate('page.map.insight.title')} |
| | | {title || ''} |
| | | </Typography> |
| | | <IconButton onClick={handleClose} size="small"> |
| | | <CloseIcon /> |
| | | </IconButton> |
| | | </Stack> |
| | | <Box p={2} pt={1} height='100%'> |
| | | <Box p={2} pt={0} height='100%'> |
| | | <Card sx={{ |
| | | height: '100%', |
| | | transition: '0.3s', |
| | |
| | | borderRadius: '8px', |
| | | }}> |
| | | <CardContent sx={{ height: '100%' }}> |
| | | {deviceType === DEVICE_TYPE.SHELF && ( |
| | | <> |
| | | <ShelfInsight |
| | | sprite={sprite} |
| | | setTitle={setTitle} |
| | | /> |
| | | </> |
| | | )} |
| | | |
| | | {deviceType === DEVICE_TYPE.AGV && ( |
| | | <> |
| | | <AgvInsight |
| | | sprite={sprite} |
| | | setTitle={setTitle} |
| | | /> |
| | | </> |
| | | )} |
| | | <DeviceContent |
| | | deviceType={deviceType} |
| | | sprite={sprite} |
| | | setTitle={setTitle} |
| | | /> |
| | | </CardContent> |
| | | </Card> |
| | | </Box> |
| | |
| | | ) |
| | | } |
| | | |
| | | const DeviceContent = ({ deviceType, sprite, setTitle }) => { |
| | | switch (deviceType) { |
| | | case DEVICE_TYPE.SHELF: |
| | | return ( |
| | | <ShelfInsight |
| | | sprite={sprite} |
| | | setTitle={setTitle} |
| | | /> |
| | | ) |
| | | case DEVICE_TYPE.AGV: |
| | | return ( |
| | | <AgvInsight |
| | | sprite={sprite} |
| | | setTitle={setTitle} |
| | | /> |
| | | ) |
| | | case DEVICE_TYPE.POINT: |
| | | return ( |
| | | <PointInsight |
| | | sprite={sprite} |
| | | setTitle={setTitle} |
| | | /> |
| | | ) |
| | | default: |
| | | return ( |
| | | <JsonShow |
| | | data={sprite?.data} |
| | | height={550} |
| | | /> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | export default Insight; |