platform-bi-web/app/components/chartDesigner/sections/preparingForm.jsx

import React from 'react';
import { Form, Select } from 'antd';
const FormItem = Form.Item;
const { Option } = Select;
import { connect } from 'dva';
import chartDesigner from '../../../models/chartDesigner';

class PreparingForm extends React.Component {
	render() {
		const props = this.props;
		const columns = props.chartDesigner.columns;
		const { formItemLayout } = props
		
		return (
			<Form layout='horizontal'>
				<FormItem label='分组' {...formItemLayout}>
					<Select 
						mode="multiple"
						labelInValue={true}
						onChange={(value) => {
							props.dispatch({ type: 'chartDesigner/preparing/setGroupBy', groupBy: value});
						}}
						value={props.chartDesigner.preparing.groupBy}
					>
						{columns.map((c, i)=>{
							return (<Option key={i} value={c.name}>{c.label}</Option>)
						})}
					</Select>
				</FormItem>
			</Form>
		);
	}
};

function mapStateToProps({ present: { chartDesigner } }) {
    return { chartDesigner: chartDesigner }
}

export default Form.create()(connect(mapStateToProps)(PreparingForm));