From a2cd787d41975c35d3ddaaa78271e04dbd15087f Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期四, 17 十月 2024 15:42:43 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/insight/agv/AgvControl.jsx | 224 ++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 218 insertions(+), 6 deletions(-) diff --git a/zy-acs-flow/src/map/insight/agv/AgvControl.jsx b/zy-acs-flow/src/map/insight/agv/AgvControl.jsx index 53a9c1d..5f0d918 100644 --- a/zy-acs-flow/src/map/insight/agv/AgvControl.jsx +++ b/zy-acs-flow/src/map/insight/agv/AgvControl.jsx @@ -1,11 +1,223 @@ +import React from 'react'; +import { useForm, Controller, useWatch } from 'react-hook-form'; +import { + Drawer, + Button, + TextField, + Grid, + Box, + ToggleButton, + ToggleButtonGroup, + Typography, +} from '@mui/material'; -const AgvControl = () => { +function AgvControl({ open, onClose }) { + const { control, handleSubmit, reset, watch } = useForm({ + defaultValues: { + taskMode: 'MOVE', + }, + }); + + const taskModes = [ + { value: 'MOVE', label: '绉诲姩' }, + { value: 'TO_CHARGE', label: '鍘诲厖鐢�' }, + { value: 'TO_STANDBY', label: '鍘诲緟鏈轰綅' }, + { value: 'LOC_TO_LOC', label: '搴撲綅鍒板簱浣�' }, + { value: 'LOC_TO_STA', label: '搴撲綅鍒扮珯鐐�' }, + { value: 'STA_TO_LOC', label: '绔欑偣鍒板簱浣�' }, + { value: 'STA_TO_STA', label: '绔欑偣鍒扮珯鐐�' }, + ]; + + const onSubmit = (data) => { + console.log(data); + // 鎻愪氦琛ㄥ崟鏁版嵁鐨勯�昏緫 + }; + + const taskMode = watch('taskMode'); + + // 鏍规嵁浠诲姟鏂瑰紡纭畾闇�瑕佹樉绀虹殑瀛楁 + const showField = (field) => { + const mode = taskMode; + switch (field) { + case 'startCode': + return ['MOVE', 'LOC_TO_LOC', 'LOC_TO_STA', 'STA_TO_LOC', 'STA_TO_STA'].includes(mode); + case 'endCode': + return ['MOVE', 'LOC_TO_LOC', 'LOC_TO_STA', 'STA_TO_LOC', 'STA_TO_STA'].includes(mode); + case 'startLocNo': + return ['LOC_TO_LOC', 'LOC_TO_STA'].includes(mode); + case 'endLocNo': + return ['LOC_TO_LOC', 'STA_TO_LOC'].includes(mode); + case 'startStaNo': + return ['STA_TO_LOC', 'STA_TO_STA'].includes(mode); + case 'endStaNo': + return ['LOC_TO_STA', 'STA_TO_STA'].includes(mode); + default: + return false; + } + }; return ( - <> - <h1>Control</h1> - </> - ) + <Box sx={{ width: 578, p: 3 }}> + <Typography variant="h6" gutterBottom> + 浠诲姟涓嬪彂 + </Typography> + <form onSubmit={handleSubmit(onSubmit)}> + <Grid container spacing={2}> + {/* 浠诲姟鏂瑰紡閫夋嫨 */} + <Grid item xs={12}> + <Controller + name="taskMode" + control={control} + render={({ field }) => ( + <ToggleButtonGroup + {...field} + exclusive + fullWidth + color="primary" + onChange={(e, value) => { + if (value !== null) { + field.onChange(value); + } + }} + > + {taskModes.map((mode) => ( + <ToggleButton key={mode.value} value={mode.value}> + {mode.label} + </ToggleButton> + ))} + </ToggleButtonGroup> + )} + /> + </Grid> + + {/* 鍔ㄦ�佹覆鏌撹〃鍗曞瓧娈� */} + {showField('startCode') && ( + <Grid item xs={12}> + <Controller + name="startCode" + control={control} + rules={{ required: '璧峰鍦伴潰鐮佷笉鑳戒负绌�' }} + render={({ field, fieldState }) => ( + <TextField + {...field} + fullWidth + label="璧峰鍦伴潰鐮�" + error={!!fieldState.error} + helperText={fieldState.error?.message} + /> + )} + /> + </Grid> + )} + + {showField('endCode') && ( + <Grid item xs={12}> + <Controller + name="endCode" + control={control} + rules={{ required: '鐩爣鍦伴潰鐮佷笉鑳戒负绌�' }} + render={({ field, fieldState }) => ( + <TextField + {...field} + fullWidth + label="鐩爣鍦伴潰鐮�" + error={!!fieldState.error} + helperText={fieldState.error?.message} + /> + )} + /> + </Grid> + )} + + {showField('startLocNo') && ( + <Grid item xs={12}> + <Controller + name="startLocNo" + control={control} + rules={{ required: '璧峰搴撲綅涓嶈兘涓虹┖' }} + render={({ field, fieldState }) => ( + <TextField + {...field} + fullWidth + label="璧峰搴撲綅" + error={!!fieldState.error} + helperText={fieldState.error?.message} + /> + )} + /> + </Grid> + )} + + {showField('endLocNo') && ( + <Grid item xs={12}> + <Controller + name="endLocNo" + control={control} + rules={{ required: '鐩爣搴撲綅涓嶈兘涓虹┖' }} + render={({ field, fieldState }) => ( + <TextField + {...field} + fullWidth + label="鐩爣搴撲綅" + error={!!fieldState.error} + helperText={fieldState.error?.message} + /> + )} + /> + </Grid> + )} + + {showField('startStaNo') && ( + <Grid item xs={12}> + <Controller + name="startStaNo" + control={control} + rules={{ required: '璧峰绔欑偣涓嶈兘涓虹┖' }} + render={({ field, fieldState }) => ( + <TextField + {...field} + fullWidth + label="璧峰绔欑偣" + error={!!fieldState.error} + helperText={fieldState.error?.message} + /> + )} + /> + </Grid> + )} + + {showField('endStaNo') && ( + <Grid item xs={12}> + <Controller + name="endStaNo" + control={control} + rules={{ required: '鐩爣绔欑偣涓嶈兘涓虹┖' }} + render={({ field, fieldState }) => ( + <TextField + {...field} + fullWidth + label="鐩爣绔欑偣" + error={!!fieldState.error} + helperText={fieldState.error?.message} + /> + )} + /> + </Grid> + )} + + {/* 鎸夐挳 */} + <Grid item xs={12} sx={{ display: 'flex', justifyContent: 'space-between', mt: 2 }}> + <Button variant="contained" color="primary" type="submit"> + 纭 + </Button> + <Button variant="outlined" color="secondary" onClick={() => reset()}> + 閲嶇疆 + </Button> + </Grid> + </Grid> + </form> + </Box> + ); } -export default AgvControl; \ No newline at end of file +export default AgvControl; -- Gitblit v1.9.1