import React, { useState, useRef, useEffect } from 'react'; 
 | 
import { message, Space, Button, Card, Select, InputNumber, Input, Result, Form } from 'antd'; 
 | 
import { 
 | 
    ProForm, 
 | 
    StepsForm, 
 | 
} from '@ant-design/pro-components'; 
 | 
import { FormattedMessage, useIntl, useModel } from '@umijs/max'; 
 | 
import * as Utils from '../utils' 
 | 
import ShowJson from '../drawer/showJson'; 
 | 
  
 | 
const BatchModify = (props) => { 
 | 
    const intl = useIntl(); 
 | 
    const { batchSprites } = props; 
 | 
  
 | 
    const [form] = Form.useForm(); 
 | 
    const [currentStep, setCurrentStep] = useState(0); 
 | 
  
 | 
    useEffect(() => { 
 | 
        form.resetFields(); 
 | 
        form.setFieldsValue({ 
 | 
            shelfType: null 
 | 
        }) 
 | 
        setCurrentStep(0); 
 | 
    }, [batchSprites]); 
 | 
  
 | 
    const handleOk = (values) => { 
 | 
        if (batchSprites?.length > 0) { 
 | 
            const closeLoading = message.loading(intl.formatMessage({ id: 'common.loading.api.message', defaultMessage: '等待服务器......' })); 
 | 
            batchSprites.forEach(sprite => { 
 | 
                if (sprite.data?.type === Utils.SENSOR_TYPE.SHELF) { 
 | 
                    if (!Utils.isNullOfUndefined(values.shelfType)) { 
 | 
                        sprite.data.shelfType = values.shelfType; 
 | 
                        Utils.showSheflType(sprite); 
 | 
                    } 
 | 
                    if (!Utils.isNullOfUndefined(values.top)) { 
 | 
                        sprite.data.top = values.top; 
 | 
                    } 
 | 
                    if (!Utils.isNullOfUndefined(values.right)) { 
 | 
                        sprite.data.right = values.right; 
 | 
                    } 
 | 
                    if (!Utils.isNullOfUndefined(values.bottom)) { 
 | 
                        sprite.data.bottom = values.bottom; 
 | 
                    } 
 | 
                    if (!Utils.isNullOfUndefined(values.left)) { 
 | 
                        sprite.data.left = values.left; 
 | 
                    } 
 | 
                    if (!Utils.isNullOfUndefined(values.value)) { 
 | 
                        sprite.data.value = values.value; 
 | 
                    } 
 | 
                } 
 | 
            }); 
 | 
            closeLoading(); 
 | 
            return true; 
 | 
        } else { 
 | 
            return false; 
 | 
        } 
 | 
    } 
 | 
  
 | 
    return ( 
 | 
        <> 
 | 
            <StepsForm 
 | 
                current={currentStep} 
 | 
                onCurrentChange={setCurrentStep} 
 | 
                formProps={{ 
 | 
                    variant: 'filled', 
 | 
                    layout: 'horizontal', 
 | 
                    labelCol: { 
 | 
                        span: 4, 
 | 
                    }, 
 | 
                    wrapperCol: { 
 | 
                        span: 20, 
 | 
                    }, 
 | 
                    labelWrap: true 
 | 
                }} 
 | 
                submitter={{ 
 | 
                    render: (props, dom) => { 
 | 
                        return props.step === 2 ? [] : dom; 
 | 
                    }, 
 | 
                }} 
 | 
            > 
 | 
                {/************************* first ****************************/} 
 | 
                <StepsForm.StepForm 
 | 
                    name="base" 
 | 
                    title={intl.formatMessage({ id: 'map.settings.batch.select.shelf', defaultMessage: '选择货架' })} 
 | 
                    onFinish={() => { 
 | 
                        return true; 
 | 
                    }} 
 | 
                > 
 | 
                    <ProForm.Item> 
 | 
                        <ShowJson 
 | 
                            data={batchSprites?.filter(item => { 
 | 
                                return item.data?.type === Utils.SENSOR_TYPE.SHELF 
 | 
                            }).map(item => { 
 | 
                                return item.data?.no; 
 | 
                            })} 
 | 
                            height='500px' 
 | 
                            jsonType={0} 
 | 
                        /> 
 | 
                    </ProForm.Item> 
 | 
                </StepsForm.StepForm> 
 | 
                {/************************* second ****************************/} 
 | 
                <StepsForm.StepForm 
 | 
                    name="checkbox" 
 | 
                    form={form} 
 | 
                    title={intl.formatMessage({ id: 'map.settings.batch.set.params', defaultMessage: '设置参数' })} 
 | 
                    onFinish={handleOk} 
 | 
                > 
 | 
                    <ProForm.Item 
 | 
                        name='shelfType' 
 | 
                        label={intl.formatMessage({ id: 'map.settings.shelf.type', defaultMessage: '类型' })} 
 | 
                        rules={[ 
 | 
                            { 
 | 
                                required: false, 
 | 
                            }, 
 | 
                        ]} 
 | 
                    > 
 | 
                        <Select 
 | 
                            style={{ width: 160 }} 
 | 
                            options={[ 
 | 
                                { 
 | 
                                    label: intl.formatMessage({ id: 'common.select.cancel', defaultMessage: '取消选择' }), 
 | 
                                    value: null 
 | 
                                }, 
 | 
                                { 
 | 
                                    label: intl.formatMessage({ id: 'map.settings.shelf.store', defaultMessage: '库位' }), 
 | 
                                    value: Utils.SHELF_TYPE.STORE 
 | 
                                }, 
 | 
                                { 
 | 
                                    label: intl.formatMessage({ id: 'map.settings.shelf.track', defaultMessage: '轨道' }), 
 | 
                                    value: Utils.SHELF_TYPE.TRACK 
 | 
                                }, 
 | 
                                { 
 | 
                                    label: intl.formatMessage({ id: 'map.settings.shelf.diable', defaultMessage: '禁用' }), 
 | 
                                    value: Utils.SHELF_TYPE.DISABLE 
 | 
                                }, 
 | 
                            ]} 
 | 
                        /> 
 | 
                    </ProForm.Item> 
 | 
                    <ProForm.Item 
 | 
                        label={intl.formatMessage({ id: 'map.settings.shelf.space', defaultMessage: '间距' })} 
 | 
                    > 
 | 
                        <Space.Compact> 
 | 
                            <ProForm.Item 
 | 
                                name='top' 
 | 
                                noStyle 
 | 
                            > 
 | 
                                <InputNumber 
 | 
                                    addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.top' defaultMessage='上' /></Space.Compact>} 
 | 
                                    style={{ 
 | 
                                        width: '50%', 
 | 
                                    }} 
 | 
                                /> 
 | 
                            </ProForm.Item> 
 | 
                            <ProForm.Item 
 | 
                                name='bottom' 
 | 
                                noStyle 
 | 
                            > 
 | 
                                <InputNumber 
 | 
                                    addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.bottom' defaultMessage='下' /></Space.Compact>} 
 | 
                                    style={{ 
 | 
                                        width: '50%', 
 | 
                                    }} 
 | 
                                /> 
 | 
                            </ProForm.Item> 
 | 
                        </Space.Compact> 
 | 
                    </ProForm.Item> 
 | 
                    <ProForm.Item 
 | 
                        label={' '} 
 | 
                    > 
 | 
                        <Space.Compact> 
 | 
                            <ProForm.Item 
 | 
                                name='left' 
 | 
                                noStyle 
 | 
                            > 
 | 
                                <InputNumber 
 | 
                                    addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.left' defaultMessage='左' /></Space.Compact>} 
 | 
                                    style={{ 
 | 
                                        width: '50%', 
 | 
                                    }} 
 | 
                                /> 
 | 
                            </ProForm.Item> 
 | 
                            <ProForm.Item 
 | 
                                name='right' 
 | 
                                noStyle 
 | 
                            > 
 | 
                                <InputNumber 
 | 
                                    addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.right' defaultMessage='右' /></Space.Compact>} 
 | 
                                    style={{ 
 | 
                                        width: '50%', 
 | 
                                    }} 
 | 
                                /> 
 | 
                            </ProForm.Item> 
 | 
                        </Space.Compact> 
 | 
                    </ProForm.Item> 
 | 
                    <ProForm.Item 
 | 
                        name='value' 
 | 
                        label={intl.formatMessage({ id: 'map.settings.shelf.value', defaultMessage: '地图值' })} 
 | 
                    > 
 | 
                        <Input 
 | 
                            style={{ 
 | 
                                width: '50%', 
 | 
                            }} 
 | 
                        /> 
 | 
                    </ProForm.Item> 
 | 
                </StepsForm.StepForm> 
 | 
                {/************************* third ****************************/} 
 | 
                <StepsForm.StepForm 
 | 
                    name="time" 
 | 
                    title={intl.formatMessage({ id: 'map.settings.batch.result', defaultMessage: '结果' })} 
 | 
                    submitter={false} 
 | 
                > 
 | 
                    <Result 
 | 
                        status="success" 
 | 
                        title={intl.formatMessage({ id: 'map.settings.batch.result.title', defaultMessage: '批量设置成功' })} 
 | 
                        subTitle="" 
 | 
                        extra={[ 
 | 
                            <Button type="primary" key="console" onClick={props.handleCancel}> 
 | 
                                <FormattedMessage id='common.confirm' defaultMessage='确定' /> 
 | 
                            </Button>, 
 | 
                        ]} 
 | 
                    /> 
 | 
                </StepsForm.StepForm> 
 | 
            </StepsForm > 
 | 
        </> 
 | 
    ) 
 | 
} 
 | 
  
 | 
export default BatchModify; 
 |