import React from 'react';
import { Modal, Form, Input, Button,Select } from 'antd';

const RoleForm = (props) => {
    return (
        <Modal
            title={'角色授权'}
            width={640}
            visible={props.roleVisible}
            maskClosable={false}
            bodyStyle={{ padding: '32px 40px 1px 48px' }}
            footer={null}
            onCancel={() => {
                props.onCancel();
            }}
            destroyOnClose
        >
            <Form
                layout="vertical"
                preserve={false}
                labelCol={{
                    span: 4,
                }}
                initialValues={props.values}
                onFinish={props.onFinish}
            >
                <Form.Item name="id" hidden={true}>
                    <Input />
                </Form.Item>
                <Form.Item name="sysUserId" hidden={true}>
                     <Input />
                </Form.Item>
                <Form.Item name="sysRoleId" rules={[{ required: true}]} label='角色授权'>
                    <Select
                      mode="multiple"
                      style={{ width: '100%' }}
                       placeholder="请选择角色">
                         {props.selectData}
                   </Select>
                </Form.Item>
                <Form.Item>
                <Button  htmlType="button" style={{float:'right',left:10}} onClick={props.onCancel} >
                        取消
                    </Button>
        <Button type="primary" htmlType="submit" style={{float:'right'}} >
                        保存
                    </Button>
                </Form.Item>
            </Form>
        </Modal>
    );
};

export default RoleForm;
