kede-client/js/component/manageCenter/financialManage/orderDetail/orderDescTab.jsx

import React from 'react';
import { Modal, Tabs} from 'antd';
import OrderDetaiel from './orderDetail';

class DemandDesc extends React.Component {
	constructor(props) {
		super(props);
		this.state = {
			loading: false,
			showState:false
		};
	}
	getInitialState() {
	    return {
	        modKey:'1',
	        loading: false,
	        pagination: {
	            defaultCurrent: 1,
	            defaultPageSize: 10,
	            showQuickJumper: true,
	            pageSize: 10,
	            onChange: function (page) {
	                this.loadData(page);
	            }.bind(this),
	            showTotal: function (total) {
	                return '共' + total + '条数据';
	            }
	        },
	        columns: [
	            {
	                title: '订单编号',
	                dataIndex: 'orderNo',
	                key: 'orderNo',
					fixed: 'left'
	            }, {
	                title: '合同编号',
	                dataIndex: 'contractNo',
	                key: 'contractNo',
	            }, {
	                title: '下单时间',
	                dataIndex: 'createTime',
	                key: 'createTime',
	            },  {
	                title: '签单时间',
	                dataIndex: 'signTime',
	                key: 'signTime',
	            },
	            {
	                title: '签单客户',
	                dataIndex: 'buyerName',
	                key: 'buyerName',
					render:(text)=>{
						return (text&&text.length>8?text.substr(0,8)+'...':text)
					}
	            },
				{
				    title: '外包公司',
				    dataIndex: 'outsourceName',
				    key: 'outsourceName',
					render:(text)=>{
						return (text&&text.length>8?text.substr(0,8)+'...':text)
					}
				},
	            {
	                title: '流程状态',
	                dataIndex: 'processStatus',
	                key: 'processStatus',
	                render: text => { return getProcessStatus(text)}
	            },
				{
				    title: '订单部门',
				    dataIndex: 'departmentName',
				    key: 'departmentName',
					render:(text)=>{
						return (text&&text.length>8?text.substr(0,8)+'...':text)
					}
				},
	            {
	                title: '订单总金额(万)',
	                dataIndex: 'signTotalAmount',
	                key: 'signTotalAmount'
	            },
	            {
	                title: '是否特批',
	                dataIndex: 'approval',
	                key: 'approval',
	                render: text => { return getApproval(text)}
	            },
	            {
	                title: '订单负责人',
	                dataIndex: 'sellerName',
	                key: 'sellerName'
	            },
	            {
	                title:'操作',
	                dataIndex: 'caozuo',
	                key: 'caouzo',
	                render:(text,recard)=>{
	                    return <div>
	                        {this.judgeFenpai(recard)}
	                    </div>
	                }
	            }
	        ],
	        dataSource: [],
	        searchTime: [,]
	    }
	}
	callBack(){
		this.setState({
			modKey:'2'
		})
	}
	handleCancel() {
		this.setState({
			visible: false,
		});
		this.props.closeDesc(false, false);
	}
	handOk() {
		this.setState({
			visible: false,
		});
		this.props.closeDesc(false, true);
	}
	componentWillReceiveProps(nextProps) {
		this.state.visible = nextProps.showDesc;
	}
	render() {
		let data = this.props.data || {releaseStatus:0};
		const { TabPane } = Tabs
		return (
			<div className="patent-desc">
				<Modal
					maskClosable={false}
					visible={this.state.visible}
					onOk={this.handOk.bind(this)}
					onCancel={this.handleCancel.bind(this)}
					width="800px"
					title=''
					footer=""
					className="admin-desc-content"
				>
				<Tabs onChange={this.callBack} type='card' activeKey={this.state.modKey}>
					<TabPane tab="项目概况" key="1">
					<div>
						<div>
							<OrderDetaiel
								closeDesc={this.handleCancel.bind(this)}
								data={this.props.data}
								visible={this.state.visible}
								handOk={this.handOk.bind(this)}
							/>
						</div>
					</div>
					</TabPane>
					<TabPane tab="外包详情" key="2">
						
					</TabPane>
				</Tabs>	
				</Modal>
			</div>
		);
	}
}

export default DemandDesc;