|  |  | 
 |  |  | } from '@mui/material'; | 
 |  |  | import { useNotification } from '../../Notification'; | 
 |  |  | import AgvThree from './AgvThree'; | 
 |  |  | import { handleRestoreAgvAll } from '../../http'; | 
 |  |  | import { handleRestoreAgvAll, handleAgvPatrol } from '../../http'; | 
 |  |  | import BoolValueIcon from '../BoolValueIcon'; | 
 |  |  | import ConfirmButton from '../../../page/components/ConfirmButton'; | 
 |  |  | import { grey } from '@mui/material/colors'; | 
 |  |  | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     useEffect(() => { | 
 |  |  |         if (info) { | 
 |  |  |         if (curAgvNo) { | 
 |  |  |             setLoading(true); | 
 |  |  |             setTimeout(() => { | 
 |  |  |                 startThree(containerRef.current); | 
 |  |  | 
 |  |  |             }, 200); | 
 |  |  |         } | 
 |  |  |         return endThree; | 
 |  |  |     }, [info]); | 
 |  |  |     }, [curAgvNo]); | 
 |  |  |  | 
 |  |  |     const handleRestoreAll = () => { | 
 |  |  |         handleRestoreAgvAll({ agvNo: info.agvNo }); | 
 |  |  | 
 |  |  |             notify.success(translate('common.response.fail')); | 
 |  |  |             console.error(`Error: ${error.message}`); | 
 |  |  |         }); | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     const patrolControl = async () => { | 
 |  |  |         const res = await handleAgvPatrol({ agvNo: info.agvNo }) | 
 |  |  |         if (res) { | 
 |  |  |             fetchAgvInfo(curAgvNo); | 
 |  |  |         } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.pos')} value={info?.pos} bool /> | 
 |  |  |                             </Grid> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.code')} value={info?.code} /> | 
 |  |  |                             </Grid> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('common.field.status')} value={info?.agvStatus} /> | 
 |  |  |                             </Grid> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.vol')} value={info?.vol} /> | 
 |  |  |                             </Grid> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                             {/* <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.soc')} value={info?.soc} /> | 
 |  |  |                             </Grid> | 
 |  |  |                             </Grid> */} | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.agvAngle')} value={info?.direction} /> | 
 |  |  |                             </Grid> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.backpack')} value={info?.backpack.filter(item => item.loaded === true).length} /> | 
 |  |  |                             </Grid> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.error')} value={info?.error} /> | 
 |  |  |                             </Grid> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <KeyValuePair label={translate('table.field.agvDetail.task')} value={info?.taskIds?.join(',')} /> | 
 |  |  | 
 |  |  |                     }}> | 
 |  |  |                         <Grid container spacing={2} style={{ marginTop: '0px' }}> | 
 |  |  |                             <Grid item xs={12}> | 
 |  |  |                                 <Stack spacing={2} mt={2}> | 
 |  |  |                                 <Stack spacing={1} mt={2}> | 
 |  |  |                                     {/* more */} | 
 |  |  |                                     <Button | 
 |  |  |                                         color="primary" | 
 |  |  |                                         variant="contained" | 
 |  |  | 
 |  |  |                                     > | 
 |  |  |                                         {translate('page.map.settings.map.more.title')} | 
 |  |  |                                     </Button> | 
 |  |  |                                     {/* patrol */} | 
 |  |  |                                     {info && ( | 
 |  |  |                                         info.status === 1 | 
 |  |  |                                         info.patrol | 
 |  |  |                                             ? | 
 |  |  |                                             <Button variant="contained" color="error" fullWidth onClick={() => { | 
 |  |  |                                                 patrolControl(); | 
 |  |  |                                             }}> | 
 |  |  |                                                 {translate('page.map.action.stopPatrol')} | 
 |  |  |                                             </Button> | 
 |  |  |                                             : | 
 |  |  |                                             // <Button variant="contained" fullWidth onClick={() => { | 
 |  |  |                                             //     patrolControl(); | 
 |  |  |                                             // }}> | 
 |  |  |                                             //     {translate('page.map.action.startPatrol')} | 
 |  |  |                                             // </Button> | 
 |  |  |                                             <ConfirmButton | 
 |  |  |                                                 label="page.map.action.startPatrol" | 
 |  |  |                                                 color="primary" | 
 |  |  |                                                 variant="contained" | 
 |  |  |                                                 onConfirm={() => { | 
 |  |  |                                                     patrolControl(); | 
 |  |  |                                                 }} | 
 |  |  |                                             /> | 
 |  |  |                                     )} | 
 |  |  |                                     {/* status */} | 
 |  |  |                                     {info && ( | 
 |  |  |                                         info.status === 0 | 
 |  |  |                                             ? <Button variant="contained" color="error" fullWidth onClick={() => { | 
 |  |  |                                                 updateStatus(); | 
 |  |  |                                             }}> | 
 |  |  | 
 |  |  |                                                 {translate('page.map.action.enable')} | 
 |  |  |                                             </Button> | 
 |  |  |                                     )} | 
 |  |  |                                     {/* restore all */} | 
 |  |  |                                     <ConfirmButton | 
 |  |  |                                         label="page.map.action.restoreALl" | 
 |  |  |                                         color="inherit" |