From 022b2aa0384cefbed58939998659a1ee15adfdf0 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期四, 17 十月 2024 17:01:33 +0800
Subject: [PATCH] #
---
zy-acs-flow/package.json | 5
zy-acs-flow/src/map/insight/agv/useCoolHook.js | 48 ++++++++++++
zy-acs-flow/package-lock.json | 1
zy-acs-flow/src/map/insight/agv/AgvControl.jsx | 132 ++++++++++++++++++++++++++------
4 files changed, 157 insertions(+), 29 deletions(-)
diff --git a/zy-acs-flow/package-lock.json b/zy-acs-flow/package-lock.json
index 4c03f3e..e6cdf6a 100644
--- a/zy-acs-flow/package-lock.json
+++ b/zy-acs-flow/package-lock.json
@@ -14,6 +14,7 @@
"@tweenjs/tween.js": "^21.0.0",
"axios": "^1.7.4",
"date-fns": "^3.6.0",
+ "lodash": "^4.17.21",
"papaparse": "^5.4.1",
"pixi.js": "^7.4.0",
"react": "^18.3.0",
diff --git a/zy-acs-flow/package.json b/zy-acs-flow/package.json
index a65f9a4..4340f1b 100644
--- a/zy-acs-flow/package.json
+++ b/zy-acs-flow/package.json
@@ -15,8 +15,10 @@
"@mui/icons-material": "^5.16.7",
"@mui/material": "^5.16.7",
"@mui/x-tree-view": "^7.16.0",
+ "@tweenjs/tween.js": "^21.0.0",
"axios": "^1.7.4",
"date-fns": "^3.6.0",
+ "lodash": "^4.17.21",
"papaparse": "^5.4.1",
"pixi.js": "^7.4.0",
"react": "^18.3.0",
@@ -26,7 +28,6 @@
"react-router-dom": "^6.26.1",
"react-syntax-highlighter": "^15.5.0",
"three": "^0.155.0",
- "@tweenjs/tween.js": "^21.0.0",
"tweedle.js": "^2.1.0"
},
"devDependencies": {
@@ -45,4 +46,4 @@
"vite": "^5.3.5"
},
"name": "cool-admin-flow"
-}
\ No newline at end of file
+}
diff --git a/zy-acs-flow/src/map/insight/agv/AgvControl.jsx b/zy-acs-flow/src/map/insight/agv/AgvControl.jsx
index 39f3ced..c6225ef 100644
--- a/zy-acs-flow/src/map/insight/agv/AgvControl.jsx
+++ b/zy-acs-flow/src/map/insight/agv/AgvControl.jsx
@@ -1,4 +1,5 @@
import React from 'react';
+import { useTranslate } from "react-admin";
import { useForm, Controller } from 'react-hook-form';
import {
Button,
@@ -8,12 +9,29 @@
ToggleButton,
ToggleButtonGroup,
Typography,
+ Divider,
+ Toolbar,
+ useTheme,
+ Autocomplete,
+ CircularProgress,
} from '@mui/material';
+import CheckOutlinedIcon from '@mui/icons-material/CheckOutlined';
+import RestartAltIcon from '@mui/icons-material/RestartAlt';
+import useCoolHook from './useCoolHook';
function AgvControl({ open, onClose }) {
+ const theme = useTheme();
+ const translate = useTranslate();
+
const { control, handleSubmit, reset, watch } = useForm({
defaultValues: {
taskMode: 'MOVE',
+ startCode: '',
+ endCode: '',
+ startLocNo: '',
+ endLocNo: '',
+ startStaNo: '',
+ endStaNo: '',
},
});
@@ -53,12 +71,21 @@
}
};
+ const {
+ options: codeOptions,
+ setInputValue: setCodeInputValue,
+ } = useCoolHook('/code/page', 'data');
+
return (
- <Box display="flex" height="100%" p={2}>
+ <>
<form onSubmit={handleSubmit(onSubmit)}>
- <Grid container spacing={2}>
+ <Box display="flex" flexDirection="row" height="100%" justifyContent="space-around" p={2}>
{/* left */}
- <Grid item xs={4}>
+ <Box
+ position="relative"
+ width="35%"
+ height="100%"
+ >
<Controller
name="taskMode"
control={control}
@@ -83,10 +110,14 @@
</ToggleButtonGroup>
)}
/>
- </Grid>
+ </Box>
{/* right */}
- <Grid item xs={8}>
+ <Box
+ position="relative"
+ width="55%"
+ height="100%"
+ >
<Grid container spacing={2}>
{showField('startCode') && (
<Grid item xs={12}>
@@ -112,16 +143,27 @@
<Controller
name="endCode"
control={control}
- rules={{ required: '鐩爣鍦伴潰鐮佷笉鑳戒负绌�' }}
- render={({ field, fieldState }) => (
- <TextField
- {...field}
- fullWidth
- label="鐩爣鍦伴潰鐮�"
- error={!!fieldState.error}
- helperText={fieldState.error?.message}
- />
- )}
+ render={({ field, fieldState }) => {
+ return (
+ <Autocomplete
+ options={codeOptions}
+ onInputChange={(event, value) => {
+ setCodeInputValue(value);
+ }}
+ onChange={(event, value) => {
+ field.onChange(value?.id);
+ }}
+ renderInput={(params) => (
+ <TextField
+ {...params}
+ label="鐩爣鍦伴潰鐮�"
+ error={!!fieldState.error}
+ helperText={fieldState.error?.message}
+ />
+ )}
+ />
+ );
+ }}
/>
</Grid>
)}
@@ -202,20 +244,56 @@
</Grid>
)}
- {/* button group */}
- <Grid item xs={12} sx={{ display: 'flex', justifyContent: 'flex-end', mt: 2 }}>
- <Button variant="contained" color="primary" type="submit" sx={{ mr: 2 }}>
- 纭
- </Button>
- <Button variant="outlined" color="secondary" onClick={() => reset()}>
- 閲嶇疆
- </Button>
- </Grid>
</Grid>
- </Grid>
- </Grid>
+ </Box>
+ </Box>
+ <Box pl={5} pr={5}>
+ <Divider sx={{
+ marginBottom: '16px'
+ }} />
+ <Toolbar sx={{
+ display: 'flex',
+ justifyContent: 'space-between',
+ minHeight: { sm: 0 },
+ }}>
+ <Button
+ variant="outlined"
+ color="primary"
+ type="submit"
+ onClick={() => {
+
+ }}
+ sx={{
+ borderColor: theme => theme.palette.primary.main,
+ color: theme => theme.palette.primary.main,
+ }}
+ startIcon={
+ <CheckOutlinedIcon sx={{ color: theme => theme.palette.primary.main }} />
+ }
+ >
+ {translate('ra.action.confirm')}
+ </Button>
+
+ <Button
+ variant="outlined"
+ color="primary"
+ onClick={() => {
+ reset();
+ }}
+ sx={{
+ borderColor: theme => theme.palette.warning.main,
+ color: theme => theme.palette.warning.main,
+ }}
+ startIcon={
+ <RestartAltIcon sx={{ color: theme => theme.palette.warning.main }} />
+ }
+ >
+ {translate('common.action.reset')}
+ </Button>
+ </Toolbar>
+ </Box>
</form>
- </Box>
+ </>
);
}
diff --git a/zy-acs-flow/src/map/insight/agv/useCoolHook.js b/zy-acs-flow/src/map/insight/agv/useCoolHook.js
new file mode 100644
index 0000000..f741bd7
--- /dev/null
+++ b/zy-acs-flow/src/map/insight/agv/useCoolHook.js
@@ -0,0 +1,48 @@
+import { useState, useEffect, useCallback } from 'react';
+import { debounce } from 'lodash';
+import request from '@/utils/request';
+
+const useCoolHook = (url, label) => {
+ const [options, setOptions] = useState([]);
+ const [inputValue, setInputValue] = useState('');
+
+ const fetchData = async (condition) => {
+ try {
+ const res = await request.post(url, {
+ condition: condition,
+ pageSize: 20
+ }).catch(error => {
+ console.error(error.message);
+ });
+ const { code, msg, data: { records } } = res.data;
+ if (code === 200) {
+ setOptions(records.map(item => ({
+ label: item[label],
+ id: item.id
+ })))
+ } else {
+ console.error(msg);
+ }
+ } catch (error) {
+ console.error(error.message);
+ setOptions([]);
+ }
+ }
+
+ const debouncedFetch = useCallback(debounce(fetchData, 300), [url]);
+
+ useEffect(() => {
+ if (inputValue) {
+ debouncedFetch(inputValue);
+ } else {
+ setOptions([]);
+ }
+ }, [inputValue, debouncedFetch]);
+
+ return {
+ options,
+ setInputValue,
+ };
+}
+
+export default useCoolHook;
\ No newline at end of file
--
Gitblit v1.9.1