platform-bi-web/app/components/chartDesigner/header.jsx

import React from 'react'
import { Input, Select, Icon, Button } from 'antd'
const Option = Select.Option
import { Link } from 'react-router-dom'
import { connect } from 'dva'
import { ActionCreators } from 'redux-undo'
import { hashHistory } from 'react-router'
import '../../models/chartDesigner'
import './header.less'

const Header = ({ chartDesigner, dispatch }) => {
    return (
        <div className='header'>
            <div className='header-item toolbar-back'>
                <Button onClick={() => {
                    dispatch({ type: 'main/redirect', path: '/chart' });
                }}>
                    返回
                </Button>
            </div>
            <div className='header-item toolbar-title'>
                <Input
                    className='input-title' 
                    addonAfter={<Icon type="edit" 
                        onClick={() => {
                            const input = this.refs.titleInput
                            input.focus()
                        }}
                    />}
                    onChange={(e) => {
                        dispatch({ type: 'chartDesigner/setField', name: 'header', value: { label: e.target.value } });
                    }}
                    value={chartDesigner.header.label}
                />
            </div>
            <div className='header-item toolbar-buttons'>
                <div className=''>
                    <Button className='button-uodo' icon='undo' onClick={() => {
                        dispatch(ActionCreators.undo());
                    }}>撤销</Button>
                    <Button className='button-redo' onClick={() => {
                        dispatch(ActionCreators.redo());
                    }}>重做</Button>
                    <Button className='button-uodo' >预览</Button>
                    <Button className='button-uodo' onClick={() => {
                        if(chartDesigner.code && chartDesigner.code != -1) {
                            dispatch({ type: 'chartDesigner/remoteModify' });
                        }else {
                            dispatch({ type: 'chartDesigner/remoteAdd' });
                        }
                    }}>保存</Button>
                </div>
            </div>
        </div>
    )
}

function mapStateToProps({ present: { chartDesigner } }) {
    return { chartDesigner: chartDesigner }
}
export default connect(mapStateToProps)(Header);