import React, { useState, useRef, useEffect } from 'react';
|
import { message, Form, Input, Row, Checkbox, Slider, Select, Drawer, Space, Button, InputNumber, Card } from 'antd';
|
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
|
import { createStyles } from 'antd-style';
|
import * as Utils from '../utils'
|
|
const useStyles = createStyles(({ token, css }) => {
|
|
})
|
|
const ConfigSettings = (props) => {
|
const intl = useIntl();
|
const { styles } = useStyles();
|
const { curSprite, configForm: form } = props;
|
|
const [showLiftNoItem, setShowLiftNoItem] = React.useState(false);
|
|
useEffect(() => {
|
form.resetFields();
|
if (curSprite) {
|
form.setFieldsValue({
|
shelfType: Utils.SHELF_TYPE.STORE,
|
...curSprite.data
|
})
|
setShowLiftNoItem(form.getFieldValue('shelfType') === Utils.SHELF_TYPE.LIFT);
|
}
|
}, [props, form]);
|
|
const formValuesChange = (changeList) => {
|
if (curSprite && changeList && changeList.length > 0) {
|
changeList.forEach(change => {
|
const { name: nameList, value } = change;
|
nameList.forEach(name => {
|
switch (name) {
|
case 'row':
|
const bay = form.getFieldValue('bay')
|
if (value && bay) {
|
form.setFieldsValue({
|
no: Utils.pureNumStr(value) + '-' + Utils.pureNumStr(bay)
|
});
|
} else {
|
form.setFieldsValue({
|
no: ''
|
});
|
}
|
break;
|
case 'bay':
|
const row = form.getFieldValue('row')
|
if (value && row) {
|
form.setFieldsValue({
|
no: Utils.pureNumStr(row) + '-' + Utils.pureNumStr(value)
|
});
|
} else {
|
form.setFieldsValue({
|
no: ''
|
});
|
}
|
break;
|
case 'vertical':
|
const horizontal = form.getFieldValue('horizontal')
|
if (value && horizontal) {
|
form.setFieldsValue({
|
no: Utils.pureNumStr(value) + '-' + Utils.pureNumStr(horizontal)
|
});
|
} else {
|
form.setFieldsValue({
|
no: ''
|
});
|
}
|
break;
|
case 'horizontal':
|
const vertical = form.getFieldValue('vertical')
|
if (value && vertical) {
|
form.setFieldsValue({
|
no: Utils.pureNumStr(vertical) + '-' + Utils.pureNumStr(value)
|
});
|
} else {
|
form.setFieldsValue({
|
no: ''
|
});
|
}
|
break;
|
case 'shelfType':
|
const shelfType = form.getFieldValue('shelfType');
|
setShowLiftNoItem(shelfType === Utils.SHELF_TYPE.LIFT);
|
break;
|
default:
|
break;
|
}
|
Utils.removeSelectedEffect();
|
Utils.showSelectedEffect(curSprite);
|
})
|
})
|
}
|
}
|
|
const onFinishFailed = (errorInfo) => {
|
};
|
|
const handleFinish = (values) => {
|
// execute where the form was finished
|
const confirmSettings = () => {
|
if (curSprite && curSprite?.data?.type) {
|
curSprite.data = { ...curSprite.data, ...values };
|
Utils.showSheflType(curSprite);
|
}
|
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '操作成功' }));
|
}
|
|
props.onSubmit({ ...values }, confirmSettings);
|
}
|
|
return (
|
<>
|
<Form
|
form={form}
|
onFieldsChange={formValuesChange}
|
initialValues={{
|
}}
|
onFinish={handleFinish}
|
onFinishFailed={onFinishFailed}
|
autoComplete="off"
|
style={{
|
maxWidth: 600,
|
}}
|
size='defalargeult'
|
variant='filled'
|
labelWrap
|
disabled={false}
|
layout='horizontal'
|
labelCol={{
|
span: 5,
|
}}
|
wrapperCol={{
|
span: 19,
|
}}
|
>
|
<br />
|
|
<Form.Item
|
label={intl.formatMessage({ id: 'map.settings.type', defaultMessage: '类型' })}
|
>
|
<span>{curSprite?.data?.type}</span>
|
</Form.Item>
|
<Form.Item
|
label={intl.formatMessage({ id: 'map.settings.uuid', defaultMessage: '图号' })}
|
>
|
<span>{curSprite?.data?.uuid}</span>
|
</Form.Item>
|
|
{curSprite?.data?.type === Utils.SENSOR_TYPE.AGV && (
|
<>
|
|
</>
|
)}
|
|
{curSprite?.data?.type === Utils.SENSOR_TYPE.SHUTTLE && (
|
<>
|
|
</>
|
)}
|
|
{curSprite?.data?.type === Utils.SENSOR_TYPE.SHELF && (
|
<>
|
<Form.Item
|
label={intl.formatMessage({ id: 'map.settings.shelf.location', defaultMessage: '库位' })}
|
>
|
<Space.Compact>
|
<Form.Item
|
name='row'
|
noStyle
|
rules={[
|
{
|
required: false,
|
},
|
]}
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.row' defaultMessage='排' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
<Form.Item
|
name='bay'
|
noStyle
|
rules={[
|
{
|
required: false,
|
},
|
]}
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.bay' defaultMessage='列' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</Space.Compact>
|
</Form.Item>
|
<Form.Item
|
name='shelfType'
|
label={intl.formatMessage({ id: 'map.settings.shelf.type', defaultMessage: '类型' })}
|
rules={[
|
{
|
required: true,
|
},
|
]}
|
>
|
<Select
|
style={{ width: 120 }}
|
options={[
|
{
|
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.lift', defaultMessage: '提升机' }),
|
value: Utils.SHELF_TYPE.LIFT
|
},
|
{
|
label: intl.formatMessage({ id: 'map.settings.shelf.charge', defaultMessage: '充电站' }),
|
value: Utils.SHELF_TYPE.CHARGE
|
},
|
{
|
label: intl.formatMessage({ id: 'map.settings.shelf.diable', defaultMessage: '禁用' }),
|
value: Utils.SHELF_TYPE.DISABLE
|
},
|
]}
|
/>
|
</Form.Item>
|
|
{showLiftNoItem && (
|
<>
|
<Form.Item
|
name='liftNo'
|
label={intl.formatMessage({ id: 'map.settings.lift.no', defaultMessage: '提升机编号' })}
|
rules={[
|
{
|
required: true,
|
},
|
]}
|
>
|
<InputNumber
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</>
|
)}
|
|
<Form.Item
|
label={intl.formatMessage({ id: 'map.settings.shelf.space', defaultMessage: '间距' })}
|
>
|
<Space.Compact>
|
<Form.Item
|
name='top'
|
noStyle
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.top' defaultMessage='上' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
<Form.Item
|
name='bottom'
|
noStyle
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.bottom' defaultMessage='下' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</Space.Compact>
|
</Form.Item>
|
<Form.Item
|
label={' '}
|
>
|
<Space.Compact>
|
<Form.Item
|
name='left'
|
noStyle
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.left' defaultMessage='左' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
<Form.Item
|
name='right'
|
noStyle
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.settings.shelf.right' defaultMessage='右' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</Space.Compact>
|
</Form.Item>
|
<Form.Item
|
label={intl.formatMessage({ id: 'map.settings.shelf.reference', defaultMessage: '基准值' })}
|
>
|
<Space.Compact>
|
<Form.Item
|
name='refx'
|
noStyle
|
rules={[
|
{
|
required: false,
|
},
|
]}
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.x' defaultMessage='x' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
<Form.Item
|
name='refy'
|
noStyle
|
rules={[
|
{
|
required: false,
|
},
|
]}
|
>
|
<InputNumber
|
addonBefore={<Space.Compact><FormattedMessage id='map.y' defaultMessage='y' /></Space.Compact>}
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</Space.Compact>
|
</Form.Item>
|
<Form.Item
|
name='value'
|
label={intl.formatMessage({ id: 'map.settings.shelf.value', defaultMessage: '地图值' })}
|
>
|
<Input
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</>
|
)}
|
|
{curSprite?.data?.type === Utils.SENSOR_TYPE.CONVEYOR && (
|
<>
|
<Form.Item
|
name='plcNo'
|
label={intl.formatMessage({ id: 'map.settings.conveyor.plc.no', defaultMessage: 'PLC编号' })}
|
rules={[
|
{
|
required: true,
|
},
|
]}
|
>
|
<InputNumber
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</>
|
)}
|
|
{curSprite?.data?.type === Utils.SENSOR_TYPE.POINT && (
|
<>
|
<Form.Item
|
name='vertical'
|
label={intl.formatMessage({ id: 'map.settings.point.vertical', defaultMessage: '纵向' })}
|
rules={[
|
{
|
required: false,
|
},
|
]}
|
>
|
<InputNumber
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
<Form.Item
|
name='horizontal'
|
label={intl.formatMessage({ id: 'map.settings.point.horizontal', defaultMessage: '横向' })}
|
rules={[
|
{
|
required: false,
|
},
|
]}
|
>
|
<InputNumber
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
</>
|
)}
|
|
<Form.Item
|
name='no'
|
label={intl.formatMessage({ id: 'map.settings.no', defaultMessage: '编号' })}
|
rules={[
|
{
|
required: false,
|
},
|
]}
|
>
|
<Input
|
style={{
|
width: '50%',
|
}}
|
/>
|
</Form.Item>
|
|
<Form.Item
|
wrapperCol={{
|
offset: 4,
|
span: 16,
|
}}>
|
<Button type="primary" htmlType="submit">
|
<FormattedMessage id='common.submit' defaultMessage='保存' />
|
</Button>
|
</Form.Item>
|
</Form >
|
</>
|
)
|
}
|
|
export default ConfigSettings;
|
