kede-client/js/component/manageCenter/project/content.jsx

import React, { Component } from 'react';
import '../content.less';
import LeftTab from '../leftTab';
import { getMenu } from '../publicMenu.js'

class Content extends Component {
  constructor() {
    super();
    this.state = {
      loading: false,
      component: <div></div>,
    };
  }
  componentWillMount() {
    var ids = window.location.href.indexOf('rid=');
    var idk = window.location.href.substr(ids + 4);
    var rid = idk.split('#');
    let menu = getMenu(rid);
    let curry;
    if (menu[0].subMenus.length > 0) {
      curry = menu[0].subMenus[0].url.split('#');
    } else {
      curry = menu[0].url.split('#');
    };
    if (window.location.hash) {
      this.getKey(window.location.hash.substr(1));
    } else {
      this.getKey(curry[1]);
    };
  }
  getKey(key) {
    switch (key) {
      //项目派单
      case "projectAssignment":
        require.ensure([], () => {
          const ProjectAssignment = require("./project/projectAssignment")
            .default;
          this.setState({
            component: <ProjectAssignment ApiUrl={""} />
          });
        });
        break;
      //项目查询
      case "projectQuery":
        require.ensure([], () => {
          const ProjectQuery = require("./project/projectQuery")
            .default;
          this.setState({
            component: <ProjectQuery ApiUrl={""} />
          });
        });
        break;
      //项目汇总表
      case "highTech":
        require.ensure([], () => {
          const ProjectQuery = require("./summary/highTech")
            .default;
          this.setState({
            component: <ProjectQuery ApiUrl={""} />
          });
        });
        break;
      //项目统计
      case "projecCount":
        require.ensure([], () => {
          const ProjectQuery = require("./summary/projecCount")
            .default;
          this.setState({
            component: <ProjectQuery ApiUrl={""} />
          });
        });
        break;
      //项目数据
      case "projecData":
        require.ensure([], () => {
          const ProjecData = require("./summary/projecData")
            .default;
          this.setState({
            component: <ProjecData ApiUrl={""} />
          });
        });
        break;
      //外包派单
      case "zxsglyOutSourcingPaiDan":
        require.ensure([], () => {
          const ZxsglyOutSourcingPaiDan = require("./project/zxsglyOutSourcingPaiDan")
            .default;
          this.setState({
            component: <ZxsglyOutSourcingPaiDan ApiUrl={""} />
          });
        });
        break;
      //外包任务派单
      case "outsourceTaskAssignment":
        require.ensure([], () => {
          const OutsourceTaskAssignment = require("./project/outsourceTaskAssignment")
            .default;
          this.setState({
            component: <OutsourceTaskAssignment ApiUrl={""} />
          });
        });
        break;
      //企业项目查询
      case "enterpriseProjectQuery":
        require.ensure([], () => {
          const EnterpriseProjectQuery = require("./project/enterpriseProjectQuery")
            .default;
          this.setState({
            component: <EnterpriseProjectQuery ApiUrl={""} />
          });
        });
        break;
      case "businessManagement":
        require.ensure([], () => {
          const BusinessManagement = require("./task/businessManagement/index")
            .default;
          this.setState({
            component: <BusinessManagement ApiUrl={""} />
          });
        });
        break;
      //任务查询
      case "taskQuery":
        require.ensure([], () => {
          const TaskQuery = require("./task/taskQuery").default;
          this.setState({
            component: <TaskQuery ApiUrl={""} />
          });
        });
        break;
      case "taskQueryZxs":
        require.ensure([], () => {
          const TaskQuery = require("./task/taskQueryZxs").default;
          this.setState({
            component: <TaskQuery ApiUrl={""} />
          });
        });
        break;
      //任务派单
      case "taskAssignment":
        require.ensure([], () => {
          const TaskAssignment = require("./task/taskAssignment")
            .default;
          this.setState({
            component: <TaskAssignment ApiUrl={""} />
          });
        });
        break;
      //专利列表
      case "patentList":
        require.ensure([], () => {
          const PatentList = require("./patent/list")
            .default;
          this.setState({
            component: <PatentList />
          });
        });
        break;
      //7天内提醒缴费专利列表
      case "patentSevenList":
        require.ensure([], () => {
          const PatentList = require("./patent/list")
            .default;
          this.setState({
            component: <PatentList status={5} />
          });
        });
        break;
      //15天内提醒缴费专利列表
      case "patentFifteenList":
        require.ensure([], () => {
          const PatentList = require("./patent/list")
            .default;
          this.setState({
            component: <PatentList status={4} />
          });
        });
        break;
      //30天内提醒缴费专利列表
      case "patentThirtyList":
        require.ensure([], () => {
          const PatentList = require("./patent/list")
            .default;
          this.setState({
            component: <PatentList status={3} />
          });
        });
        break;
      //60天内提醒缴费专利列表
      case "patentSixtyList":
        require.ensure([], () => {
          const PatentList = require("./patent/list")
            .default;
          this.setState({
            component: <PatentList status={2} />
          });
        });
        break;
      //90天内提醒缴费专利列表
      case "patentNinetyList":
        require.ensure([], () => {
          const PatentList = require("./patent/list")
            .default;
          this.setState({
            component: <PatentList status={1} />
          });
        });
        break;
      //专利成本审核列表(专利管理员查看)
      case "patentCostList":
        require.ensure([], () => {
          const CostAuditList = require("../order/orderNew/costAuditList").default;
          this.setState({
            component: <CostAuditList isPatentManager />,
          });
        });
        break;
      //我的任务
      case "myTask":
        require.ensure([], () => {
          const MyTask = require("./task/myTask").default;
          this.setState({
            component: <MyTask ApiUrl={""} />
          });
        });
        break;
      //我的任务
      case "myTaskZxs":
        require.ensure([], () => {
          const MyTask = require("./task/myTaskZxs").default;
          this.setState({
            component: <MyTask ApiUrl={""} />
          });
        });
        break;
      //我的外包任务
      case "myTaskOutsource":
        require.ensure([], () => {
          const MyTaskOutsource = require("./task/myTaskOutsource")
            .default;
          this.setState({
            component: <MyTaskOutsource ApiUrl={""} />
          });
        });
        break;
      //我的外包任务
      case "myTaskOutsourceZxs":
        require.ensure([], () => {
          const MyTaskOutsource = require("./task/myTaskOutsourceZxs")
            .default;
          this.setState({
            component: <MyTaskOutsource ApiUrl={""} />
          });
        });
        break;
      //合同变更审核列表
      case "contractChangeJsy":
        require.ensure([], () => {
          const ContractChangeJsy = require("./task/contractChangeJsy")
            .default;
          this.setState({
            component: <ContractChangeJsy ApiUrl={""} />
          });
        });
        break;
      //合同变更审核列表
      case "contractChangeJsjl":
        require.ensure([], () => {
          const ContractChangeJsjl = require("./task/contractChangeJsjl")
            .default;
          this.setState({
            component: <ContractChangeJsjl ApiUrl={""} />
          });
        });
        break;
      //合同变更审核列表
      case "contractChangeJszj":
        require.ensure([], () => {
          const ContractChangeJszj = require("./task/contractChangeJszj")
            .default;
          this.setState({
            component: <ContractChangeJszj ApiUrl={""} />
          });
        });
        break;
      //付款申请驳回列表
      case "payApplyReject":
        require.ensure([], () => {
          const PayApplyReject = require("./task/payApplyReject/index")
            .default;
          this.setState({
            component: <PayApplyReject ApiUrl={""} />
          });
        });
        break;
      //任务统计
      case "taskCount":
        require.ensure([], () => {
          const TaskCount = require("./task/taskCount").default;
          this.setState({
            component: <TaskCount ApiUrl={""} />
          });
        });
        break;
      //我的任务统计
      case "myTaskCount":
        require.ensure([], () => {
          const MyTaskCount = require("./task/myTaskCount").default;
          this.setState({
            component: <MyTaskCount ApiUrl={""} />
          });
        });
        break;
      default:
        require.ensure([], () => {
          const Module = require("../module").default;
          this.setState({
            component: <Module ApiUrl={""} />
          });
        });
    };
    window.location.hash = key;
  }
  render() {
    return (
      <div className="manage-content">
        <LeftTab handlekey={this.getKey.bind(this)} />
        <div className="content-right">
          {this.state.component}
        </div>
      </div>
    )
  }
}

export default Content;