/*** 用户列表页*/
import React,{ PureComponent } from 'react'
import {connect} from 'react-redux'
import {history} from '../../store'
import styles from './index.less'
import { Row, Col, Card, Form, Input, Select, Button } from 'antd';const FormItem = Form.Item;
const { Option } = Select;
const statusMap = ['success', 'error'];
const status = ['启用', '禁用',];/***  用户列表*/
@Form.create()
class UserList extends PureComponent{state = {//};renderAdvancedForm() {const { getFieldDecorator } = this.props.form;return (<Form onSubmit={this.handleSearch.bind(this)} layout="inline">{/*搜索条件*/}<Row gutter={{ md: 8, lg: 24, xl: 48 }}><Col md={8} sm={24}><FormItem label="账号">{getFieldDecorator('username')(<Input placeholder="请输入" />)}</FormItem></Col><Col md={8} sm={24}><FormItem label="姓名">{getFieldDecorator('name')(<Input placeholder="请输入" />)}</FormItem></Col><Col md={8} sm={24}><FormItem label="状态">{getFieldDecorator('status')(<Select placeholder="请选择"><Option value="0">启用</Option><Option value="1">禁用</Option></Select>)}</FormItem></Col></Row>{/*按钮*/}<div style={{ marginBottom: 10 }}><span><Button icon="plus"type="primary"onClick={()=>(history.push("/syster/user/add"))}>新建</Button></span><span style={{ float: 'right' }}><Buttonicon="search"type="primary"htmlType="submit">查询</Button><Buttonicon="sync"style={{ marginLeft: 8 }}onClick={this.handleFormReset.bind(this)}>重置</Button></span></div></Form>);}// 查询handleSearch(e){// 禁止默认行为e.preventDefault();// 获取 form 表单的值console.log(this.props.form.getFieldsValue());}// 重置handleFormReset(){this.props.form.resetFields();}render(){return(<Card bordered={false}><div className={styles.tableList}><div className={styles.tableListForm}>{this.renderAdvancedForm()}</div></div></Card>)}
}export default connect (({ user })=>(user
))(UserList)

@import "~antd/lib/style/themes/default.less";
@import "../../utils/utils.less";.tableList {.tableListOperator {margin-bottom: 16px;button {margin-right: 8px;}}
}.tableListForm {:global {.ant-form-item {margin-bottom: 24px !important;margin-right: 0;display: flex;> .ant-form-item-label {width: auto;line-height: 32px;padding-right: 8px;}.ant-form-item-control {line-height: 32px;}}.ant-form-item-control-wrapper {flex: 1;}}.submitButtons {white-space: nowrap;margin-bottom: 24px;}
}@media screen and (max-width: @screen-lg) {.tableListForm :global(.ant-form-item) {margin-right: 24px;}
}@media screen and (max-width: @screen-md) {.tableListForm :global(.ant-form-item) {margin-right: 8px;}
}