/**
 * 用户信息管理
 */
import { Layout, Form, Avatar, Input, Select, Button, Icon } from 'antd'
import { connect } from 'dva'
import './userinfo.less'
const { Header, Content } = Layout
const { Item: FormItem } = Form

const UserInfo = ({ main, dispatch }) => {
    const { name, department, job, role } = main.currentUser;
    const formItemLayout = {
        labelCol: {
            xs: { span: 24 },
            sm: { span: 2 },
        },
        wrapperCol: {
            xs: { span: 24 },
            sm: { span: 22 },
        },
    };
    return (
        <Layout className='layout-userinfo'>
            <Header>
                <Button onClick={() => {
                    dispatch({ type: 'main/goBack', path: '/home' });
                }}><Icon type='left' />返回</Button>
            </Header>
            <Content className='content-userinfo'>
                <Form>
                    <FormItem
                        {...formItemLayout}
                        label="头像"
                    >
                        <Avatar size={64} icon="user" />
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="用户名"
                    >
                        <Input id="userName" disabled defaultValue={name} />
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="部门"
                    >
                        <Input id="department" disabled defaultValue={department} />
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="岗位"
                    >
                        <Input id="job" disabled defaultValue={job} />
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="角色"
                    >
                        <Select disabled defaultValue={role}>
                            <Select.Option value='admin'>管理员</Select.Option>
                            <Select.Option value='superAdmin'>超级管理员</Select.Option>
                            <Select.Option value='normal'>普通用户</Select.Option>
                        </Select>
                    </FormItem>
                </Form>
            </Content>
        </Layout>
    )
}

export default connect(({ present: { main } }) => ({ main }))(UserInfo);