webio-node/src/components/Login/Form.js

29 lines
1.1 KiB
JavaScript

import React from 'react';
import {Form, Segment, Input, Button} from 'semantic-ui-react';
const loginForm = ({i18n, page, onSubmit}) => {
let account;
let password;
return (
<Form size="large" onSubmit={(e, data) => {
e.preventDefault();
onSubmit(data.formData);
}} serializer={e => {
let acc = e.querySelector('input[name="acc"]').value;
let pass = e.querySelector('input[name="pass"]').value;
return {account: acc, password: pass};
}}>
<Segment stacked={true} >
<Form.Field>
<Input icon="user" iconPosition="left" name="acc" placeholder={typeof i18n.t == 'function' ? i18n.t(`${page}.input.placeholder.account`) : ''} />
</Form.Field>
<Form.Field>
<Input icon="lock" iconPosition="left" name="pass" type="password" placeholder={typeof i18n.t == 'function' ? i18n.t(`${page}.input.placeholder.password`) : ''} />
</Form.Field>
<Button type="submit" color="teal" size="large" fluid={true} content={typeof i18n.t == 'function' ? i18n.t(`${page}.button.login`) : ''} />
</Segment>
</Form>
);
}
export default loginForm;