50 lines
1.9 KiB
JavaScript
50 lines
1.9 KiB
JavaScript
import React from 'react';
|
|
import {Modal, Form, Input, Grid, Button, Checkbox} from 'semantic-ui-react';
|
|
|
|
|
|
const UModal = ({i18n, open, type, data, closeModal, onSubmit}) => {
|
|
return (
|
|
<Modal closeOnDimmerClick={false} open={open}>
|
|
<Modal.Content>
|
|
<Form onSubmit={(e, data) => {
|
|
e.preventDefault();
|
|
onSubmit(data.formData);
|
|
}}
|
|
serializer={e=>{
|
|
let json = {
|
|
type,
|
|
account: e.querySelector('input[name="account"]').value,
|
|
password: e.querySelector('input[name="password"]').value,
|
|
read_privilege: e.querySelector('input[name="read_privilege"]').checked ? 1 : 0,
|
|
write_privilege: e.querySelector('input[name="write_privilege"]').checked ? 1 : 0
|
|
};
|
|
|
|
return json;
|
|
}}>
|
|
<Form.Field>
|
|
<Input label={i18n && i18n.t ? i18n.t('page.userlist.form.label.account') : ''} name="account" disabled={type == 1} defaultValue={type == 1 ? data.account : ''} />
|
|
</Form.Field>
|
|
<Form.Field>
|
|
<Input type="password" label={i18n && i18n.t ? i18n.t('page.userlist.form.label.password') : ''} name="password" />
|
|
</Form.Field>
|
|
<Form.Field>
|
|
<Checkbox label={i18n && i18n.t ? i18n.t('page.userlist.form.label.read_privilege') : ''} defaultChecked={data.read_privilege == 1} name="read_privilege" />
|
|
</Form.Field>
|
|
<Form.Field>
|
|
<Checkbox label={i18n && i18n.t ? i18n.t('page.userlist.form.label.write_privilege') : ''} defaultChecked={data.write_privilege == 1} name="write_privilege" />
|
|
</Form.Field>
|
|
<Grid>
|
|
<Grid.Column width={8}>
|
|
<Button type="submit" fluid content={i18n && i18n.t ? i18n.t('page.userlist.form.button.submit') : ''} />
|
|
</Grid.Column>
|
|
<Grid.Column width={8}>
|
|
<Button type="button" fluid content={i18n && i18n.t ? i18n.t('page.userlist.form.button.cancel') : ''} onClick={() => closeModal()} />
|
|
</Grid.Column>
|
|
</Grid>
|
|
</Form>
|
|
</Modal.Content>
|
|
</Modal>
|
|
)
|
|
}
|
|
|
|
export default UModal; |