webio-node/src/components/AdminPage/Modbus/AIOForm.js

40 lines
1.6 KiB
JavaScript

import React from 'react';
import {Table, Input, Form, Button} from 'semantic-ui-react';
const AIOForm = ({i18n, open, type, data, onSubmit, onClose}) => {
if(!open) return null;
let input = {
name: data.name || '',
portnum: data.portnum || '',
scale_min: data.scale_min || 0,
scale_max: data.scale_max || 0,
range_min: data.range_min || 0,
range_max: data.range_max || 0
}
return (
<Table.Row>
<Table.Cell><Input name="name" onChange={(e,d)=>{input.name = d.value}} defaultValue={data.name || ''}/></Table.Cell>
<Table.Cell><Input name="portnum" onChange={(e,d)=>{input.portnum = d.value}} defaultValue={data.portnum || ''}/></Table.Cell>
<Table.Cell>
<Input name="range_min" size="small" label="Min" onChange={(e,d)=>{input.range_min = d.value}} defaultValue={data.range_min || '0'}/>
<Input name="range_max" size="small" label="Max" onChange={(e,d)=>{input.range_max = d.value}} defaultValue={data.range_max || '0'}/>
</Table.Cell>
<Table.Cell>
<Input name="scale_min" size="small" label="Min" onChange={(e,d)=>{input.scale_min = d.value}} defaultValue={data.scale_min || '0'}/>
<Input name="scale_max" size="small" label="Max" onChange={(e,d)=>{input.scale_max = d.value}} defaultValue={data.scale_max || '0'}/>
</Table.Cell>
<Table.Cell>
<Button basic size="tiny" content="Submit" type="button" onClick={()=>{
let json = {
...input,
id: data.uid || ''
}
onSubmit(type, json);
}} />
<Button basic size="tiny" content="Cancel" type="button" onClick={()=>{onClose()}} />
</Table.Cell>
</Table.Row>
)
}
export default AIOForm;