kede-client/js/component/account/services/content.jsx

import React from 'react';
import '../content.less';
import { Spin } from 'antd';
import LeftTab from './leftTab.jsx';

const Content = React.createClass({
    getInitialState() {
        return {
            loading: false,
            leftKey: (window.userData.type == 1) ? 'contract' : 'evaluate',
            component: null,
            userType: '0',
            params: {}
        };
    },
    handlekey(key) {
        let paramsStr = key.split('?');
        if (paramsStr[1]) {
            let params = {};
            paramsStr[1].split('&').forEach((it) => {
                let arr = it.split('=');
                if (arr[0]) {
                    params[arr[0]] = arr[1] || '';
                }
            });
            this.state.params = params;
        } else {
            this.state.params = {};
        }
        switch (paramsStr[0]) {
            case 'contract':
                require.ensure([], () => {
                    const Contract = require('./contract/contract').default;
                    this.setState({
                        component: Contract,
                        leftKey: 'contract'
                    });
                });
                break;
            case 'patent':
                require.ensure([], () => {
                    const Patent = require('./patent').default;
                    this.setState({
                        component: Patent,
                        leftKey: 'patent'
                    });
                });
                break;
            case 'cognizance':
                require.ensure([], () => {
                    const Cognizance = require('./cognizance').default;
                    this.setState({
                        component: Cognizance,
                        leftKey: 'cognizance'
                    });
                });
                break;
            case 'copyright':
                require.ensure([], () => {
                    const Copyright = require('./copyright/copyright').default;
                    this.setState({
                        component: Copyright,
                        leftKey: 'copyright'
                    });
                });
                break;
            case 'technology':
                require.ensure([], () => {
                    const Technology = require('./technology').default;
                    this.setState({
                        component: Technology,
                        leftKey: 'technology'
                    });
                });
                break;
            case 'companyDetail':
                require.ensure([], () => {
                    const CompanyDetail = require('./companyDetail').default;
                    this.setState({
                        component: CompanyDetail,
                        leftKey: 'companyDetail'
                    });
                });
                break;
            case 'orgTechCenter':
                require.ensure([], () => {
                    const OrgTechCenter = require('./orgTechCenter').default;
                    this.setState({
                        component: OrgTechCenter,
                        leftKey: 'orgTechCenter'
                    });
                });
                break;
            case 'activity':
                require.ensure([], () => {
                    const Activity = require('./activity').default;
                    this.setState({
                        component: Activity,
                        leftKey: 'activity'
                    });
                });
                break;
            case 'activityCostList':
                require.ensure([], () => {
                    const ActivityCostList = require('./activityCostList').default;
                    this.setState({
                        component: ActivityCostList,
                        leftKey: 'activityCostList'
                    });
                });
                break;
            case 'techProduct':
                require.ensure([], () => {
                    const TechProduct = require('./techProduct').default;
                    this.setState({
                        component: TechProduct,
                        leftKey: 'techProduct'
                    });
                });
                break;
            case 'intellectual':
                require.ensure([], () => {
                    const Intellectual = require('./intellectual').default;
                    this.setState({
                        component: Intellectual,
                        leftKey: 'intellectual'
                    });
                });
                break;
            case 'achievement':
                require.ensure([], () => {
                    const Achievement = require('./achievement').default;
                    this.setState({
                        component: Achievement,
                        leftKey: 'achievement'
                    });
                });
                break;
            case 'ratepay':
                require.ensure([], () => {
                    const Ratepay = require('./ratepay').default;
                    this.setState({
                        component: Ratepay,
                        leftKey: 'ratepay'
                    });
                });
                break;
            case 'finance':
                require.ensure([], () => {
                    const Finance = require('./finance').default;
                    this.setState({
                        component: Finance,
                        leftKey: 'finance'
                    });
                });
                break;

            case 'honorList':
                require.ensure([], () => {
                    const HonorList = require('./honorList').default;
                    this.setState({
                        component: HonorList,
                        leftKey: 'honorList'
                    });
                });
                break;
            case 'standard':
                require.ensure([], () => {
                    const Standard = require('./standard').default;
                    this.setState({
                        component: Standard,
                        leftKey: 'standard'
                    });
                });
                break;
            case 'annualReport':
                require.ensure([], () => {
                    const AnnualReport = require('./annualReport').default;
                    this.setState({
                        component: AnnualReport,
                        leftKey: 'annualReport'
                    });
                });
                break;
            case 'evaluate':
                require.ensure([], () => {
                    const Evaluate = require('./evaluate').default;
                    this.setState({
                        component: Evaluate,
                        leftKey: 'evaluate'
                    });
                });
                break;
            case 'createEvaluate':
                require.ensure([], () => {
                    const CreateEvaluate = require('./evaluate/create').default;
                    this.setState({
                        component: CreateEvaluate,
                        leftKey: 'evaluate'
                    });
                });
                break;
        };
        window.location.hash = key;
    },
    componentWillMount() {
        if (window.location.hash) {
            this.handlekey(window.location.hash.substr(1));
        } else {
            this.handlekey(this.state.leftKey);
        }
    },
    render() {
        let component;
        if (this.state.component) {
            component = <this.state.component handlekey={this.handlekey} {...this.state.params} />;
        } else {
            component = <div className="loading-container">
                <Spin />
            </div>
        }
        return (
            <div className="acc-content">
                <LeftTab handlekey={this.handlekey} />
                <div className="content-right">
                    {component}
                </div>
            </div>
        )
    }
});

export default Content;