From c9e8eab9835c6f72f84552f694582d9a27f6328c Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期五, 11 十月 2024 16:50:31 +0800
Subject: [PATCH] #

---
 zy-acs-flow/src/map/settings/CopyDrawer.jsx |  166 ++++++++++++++++++++++++++++++++++++------------------
 1 files changed, 110 insertions(+), 56 deletions(-)

diff --git a/zy-acs-flow/src/map/settings/CopyDrawer.jsx b/zy-acs-flow/src/map/settings/CopyDrawer.jsx
index 8f6b767..2229124 100644
--- a/zy-acs-flow/src/map/settings/CopyDrawer.jsx
+++ b/zy-acs-flow/src/map/settings/CopyDrawer.jsx
@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import { useForm, Controller } from 'react-hook-form';
+import { useForm, useWatch, Controller } from 'react-hook-form';
 import {
     Box,
     Grid,
@@ -15,7 +15,6 @@
     Divider,
     Drawer,
     IconButton,
-    LinearProgress,
     Switch,
     FormControlLabel,
     FormLabel,
@@ -31,41 +30,88 @@
 } from '../constants';
 import { useNotification } from '../Notification';
 
+const incrementOptionsMap = {
+    [DEVICE_TYPE.SHELF]: [
+        { value: 'row', label: 'page.map.settings.config.shelf.row' },
+        { value: 'bay', label: 'page.map.settings.config.shelf.bay' },
+    ],
+    [DEVICE_TYPE.CHARGE]: [
+        { value: 'no', label: 'page.map.settings.config.base.no' },
+    ],
+    [DEVICE_TYPE.STATION]: [
+        { value: 'no', label: 'page.map.settings.config.base.no' },
+    ],
+    [DEVICE_TYPE.POINT]: [
+        { value: 'no', label: 'page.map.settings.config.base.no' },
+    ],
+};
+
+
+const validateIncrement = (value, deviceType, sprite, translate) => {
+    if (!value) {
+        return true;
+    }
+    switch (deviceType) {
+        case DEVICE_TYPE.SHELF:
+            if (!sprite?.data?.row || !sprite?.data?.bay) {
+                return translate('page.map.settings.map.copy.valid.shelf');
+            }
+            break;
+        default:
+            if (!sprite?.data?.no) {
+                return translate('page.map.settings.map.copy.valid.common');
+            }
+            break;
+    }
+    return true;
+};
+
+const getDefaultFormValues = (value = {}) => ({
+    copyDirect: value.copyDirect || '',
+    copyCount: value.copyCount || '',
+    gap: 0.0,
+    autoIncrement: false,
+    incrementMode: 'ascending',
+    incrementValue: undefined,
+});
+
 const CopyDrawer = (props) => {
     const { open, onCancel, sprite, value, width = PAGE_DRAWER_WIDTH, handleOnCopy } = props;
     const notify = useNotification();
     const translate = useTranslate();
     const deviceType = sprite?.data?.type;
+    const incrementOptions = incrementOptionsMap[deviceType]
 
     const { control, handleSubmit, reset, watch, setValue, formState: { errors } } = useForm({
-        defaultValues: {
-            copyDirect: value?.copyDirect || '',
-            copyCount: value?.copyCount || '',
-            gap: 0.0,
-            autoIncrement: false,
-            incrementMode: 'ascending',
-        },
+        defaultValues: getDefaultFormValues(value),
     });
 
+    const autoIncrement = useWatch({ control, name: 'autoIncrement' });
+    const incrementValue = useWatch({ control, name: 'incrementValue' });
+
     useEffect(() => {
-        if (value && Object.keys(value).length > 0) {
-            // setValue('copyDirect', value.copyDirect);
-            // setValue('copyCount', value.copyCount);
+        if (sprite && value && Object.keys(value).length > 0) {
+            reset(getDefaultFormValues(value));
         }
-    }, [value, setValue])
+    }, [sprite, value, reset, incrementOptions, setValue]);
+
+    useEffect(() => {
+        if (autoIncrement && incrementOptions && incrementOptions.length > 0) {
+            if (!incrementValue) {
+                setValue('incrementValue', incrementOptions[0].value);
+            }
+        } else {
+            setValue('incrementValue', undefined);
+        }
+    }, [autoIncrement, incrementOptions, setValue]);
 
     const handleClose = () => {
         onCancel();
     }
 
     const onFormSubmit = (data) => {
-        if (data) {
-            console.log(data);
-
-        }
-        if (handleOnCopy) {
-            handleOnCopy(data);
-        }
+        console.log(data);
+        handleOnCopy?.(data);
         notify.info(translate('common.response.success'));
     };
 
@@ -93,18 +139,6 @@
                         <Box p={3}>
                             <Box component="form" onSubmit={handleSubmit(onFormSubmit)} noValidate sx={{ mt: 0 }}>
                                 <Grid container spacing={1.4}>
-
-                                    {/* <Grid item xs={6}>
-                                        <Typography variant="body1">
-                                            {translate('page.map.settings.map.copy.direction')}: {value?.copyDirect}
-                                        </Typography>
-                                    </Grid>
-                                    <Grid item xs={6}>
-                                        <Typography variant="body1">
-                                            {translate('page.map.settings.map.copy.count')}: {value?.copyCount}
-                                        </Typography>
-                                    </Grid> */}
-
                                     <Grid item xs={6}>
                                         <Controller
                                             name="copyDirect"
@@ -166,6 +200,7 @@
                                         <Controller
                                             name="autoIncrement"
                                             control={control}
+                                            rules={{ validate: (value) => validateIncrement(value, deviceType, sprite, translate) }}
                                             render={({ field }) => (
                                                 <FormControlLabel
                                                     control={
@@ -179,9 +214,47 @@
                                                 />
                                             )}
                                         />
+                                        {errors.autoIncrement && (
+                                            <Typography color="error">
+                                                {errors.autoIncrement.message}
+                                            </Typography>
+                                        )}
                                     </Grid>
 
-                                    {watch('autoIncrement') && (
+                                    {(!!incrementOptions?.length && autoIncrement) && (
+                                        <Grid item xs={12}>
+                                            <FormControl fullWidth>
+                                                <FormLabel sx={{ mb: 1 }}>
+                                                    {translate('page.map.settings.map.copy.field.incrementValue')}
+                                                </FormLabel>
+                                                <Controller
+                                                    name='incrementValue'
+                                                    control={control}
+                                                    render={({ field }) => (
+                                                        <ToggleButtonGroup
+                                                            {...field}
+                                                            value={field.value}
+                                                            exclusive
+                                                            onChange={(event, value) => {
+                                                                if (value !== null) {
+                                                                    field.onChange(value);
+                                                                }
+                                                            }}
+                                                            fullWidth
+                                                        >
+                                                            {incrementOptions.map((option, idx) => (
+                                                                <ToggleButton key={idx} value={option.value}>
+                                                                    {translate(option.label)}
+                                                                </ToggleButton>
+                                                            ))}
+                                                        </ToggleButtonGroup>
+                                                    )}
+                                                />
+                                            </FormControl>
+                                        </Grid>
+                                    )}
+
+                                    {autoIncrement && (
                                         <Grid item xs={12}>
                                             <FormControl fullWidth>
                                                 <FormLabel sx={{
@@ -198,7 +271,9 @@
                                                             value={field.value}
                                                             exclusive
                                                             onChange={(event, value) => {
-                                                                field.onChange(value);
+                                                                if (value !== null) {
+                                                                    field.onChange(value);
+                                                                }
                                                             }}
                                                             fullWidth
                                                         >
@@ -215,28 +290,7 @@
                                         </Grid>
                                     )}
 
-                                    {deviceType === DEVICE_TYPE.SHELF && (
-                                        <>
-                                        </>
-                                    )}
-
-                                    {deviceType === DEVICE_TYPE.CHARGE && (
-                                        <>
-                                        </>
-                                    )}
-
-                                    {deviceType === DEVICE_TYPE.STATION && (
-                                        <>
-                                        </>
-                                    )}
-
-                                    {deviceType === DEVICE_TYPE.POINT && (
-                                        <>
-                                        </>
-                                    )}
-
-
-                                    <Grid item xs={12}>
+                                    <Grid item xs={12} mt={2}>
                                         <Divider />
                                     </Grid>
 

--
Gitblit v1.9.1