init commit

.editorconfig

+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[Makefile]
+indent_style = tab

.eslintrc

+{
+  "parser": "babel-eslint",
+  "extends": "airbnb",
+  "rules": {
+    "generator-star-spacing": [0],
+    "consistent-return": [0],
+    "react/forbid-prop-types": [0],
+    "react/jsx-filename-extension": [1, { "extensions": [".js"] }],
+    "global-require": [1],
+    "import/prefer-default-export": [0],
+    "react/jsx-no-bind": [0],
+    "react/prop-types": [0],
+    "react/prefer-stateless-function": [0],
+    "no-else-return": [0],
+    "no-restricted-syntax": [0],
+    "import/no-extraneous-dependencies": [0],
+    "no-use-before-define": [0],
+    "jsx-a11y/no-static-element-interactions": [0],
+    "no-nested-ternary": [0],
+    "arrow-body-style": [0],
+    "import/extensions": [0],
+    "no-bitwise": [0],
+    "no-cond-assign": [0],
+    "import/no-unresolved": [0],
+    "require-yield": [1],
+    "no-plusplus": "off",
+    "no-mixed-operators": "off",
+    "max-len": [0, 120]
+  },
+  "parserOptions": {
+    "ecmaFeatures": {
+      "experimentalObjectRestSpread": true
+    }
+  }
+}

.gitignore

+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# production
+/dist
+
+# misc
+.DS_Store
+npm-debug.log*

.roadhogrc.js

+export default {
+  "entry": "src/index.js",
+  "theme": {
+    "layout-header-height": "48px",
+    "layout-header-background": "#fff",
+    "layout-footer-background": "#fff",
+    "layout-sider-background": '#404040',
+    'menu-dark-bg': '#404040',
+    "layout-header-padding": "0",
+  },
+  "env": {
+    "development": {
+      "extraBabelPlugins": [
+        "dva-hmr",
+        "transform-runtime",
+        ["import", { "libraryName": "antd", "style": true }]
+      ],
+      "no-proxy": {
+        "/api": {
+          "target": "http://192.168.1.121:1180",
+          "changeOrigin": true,
+          "pathRewrite": {
+            "^/api": "/houseServer/restful-services"
+          }
+        }
+      }
+    },
+    "production": {
+      "extraBabelPlugins": [
+        "transform-runtime",
+        ["import", { "libraryName": "antd", "style": true }]
+      ]
+    }
+  }
+}

.roadhogrc.mock.js

+import moment from 'moment';
+import { genModules } from './src/mock/modules';
+import { getTasks } from './src/mock/tasks';
+import toFilters from './mock/filter';
+
+const modules = genModules();
+const tasks = getTasks();
+
+const users = [
+  {
+    userId: 1,
+    userName: 'cxj',
+    tokenId: '12345-65432-abcdef',
+    expire: -1,
+  },
+];
+
+let currentUser = users[0];
+
+const domains = [
+  {
+    id: 1,
+    name: '虚拟基地01',
+  },
+  {
+    id: 2,
+    name: '虚拟基地02',
+  },
+  {
+    id: 3,
+    name: '虚拟基地03',
+  },
+  {
+    id: 4,
+    name: '虚拟基地04',
+  },
+  {
+    id: 5,
+    name: '虚拟基地05',
+  },
+];
+
+const getDomain = (id) => {
+  const domain = domains.filter(domain => domain.id === id);
+  return domain ? domain[0] : null;
+};
+
+const dealWithData = (req) => {
+  const sort = req.query.sort;
+  const order = req.query.order;
+  const filters = [];
+  for (const queryKey in req.query) {
+    if (queryKey.indexOf('f-') === 0) {
+      filters.push(toFilters(queryKey, req.query[queryKey]));
+    }
+  }
+  let data = tasks.filter((value) => {
+    return filters.map(filter => filter(value)).reduce((ret, cur) => ret && cur, true);
+  });
+  if (sort) {
+    data = data.sort((a, b) => {
+      const va = a[sort];
+      const vb = b[sort];
+      if (order === 'desc') {
+        if (moment.isMoment(va) || moment.isDate(va) || moment.isMoment(vb) || moment.isDate(vb)) {
+          if (moment(va).isAfter(moment(vb))) {
+            return 1;
+          } else if (moment(va).isSame(moment(vb))) {
+            return 0;
+          } else {
+            return -1;
+          }
+        } else {
+          if (va > vb) {
+            return 1;
+          } else if (va === vb) {
+            return 0;
+          } else {
+            return -1;
+          }
+        }
+      } else {
+        if (moment.isMoment(va) || moment.isDate(va) || moment.isMoment(vb) || moment.isDate(vb)) {
+          if (moment(va).isBefore(moment(vb))) {
+            return 1;
+          } else if (moment(va).isSame(moment(vb))) {
+            return 0;
+          } else {
+            return -1;
+          }
+        } else {
+          if (va < vb) {
+            return 1;
+          } else if (va === vb) {
+            return 0;
+          } else {
+            return -1;
+          }
+        }
+      }
+    })
+  }
+  return data;
+};
+
+let currentDomainId = null;
+
+export default {
+
+  '/api/user/login2': (req, res) => {
+    currentUser = users[0];
+    res.send(currentUser);
+  },
+  '/api/user/logout': (req, res) => {
+    res.status(204).end();
+  },
+  '/api/domain/all': domains,
+  '/api/domain/switch': (req, res) => {
+    const domainId = req.query.domainId;
+    const intDomainId = parseInt(domainId);
+    const domainIds = domains.map(domain => domain.id);
+    if (domainIds.indexOf(intDomainId) !== -1) {
+      if (currentDomainId) {
+        res.send(getDomain(currentDomainId));
+      } else {
+        res.status(204).end();
+      }
+      currentDomainId = intDomainId;
+    } else {
+      res.status(500).send({
+        errorCode: 0x00010010,
+        message: '无效的项目ID。',
+      });
+    }
+  },
+  '/api/domain/current': (req, res) => {
+    res.send(getDomain(currentDomainId));
+  },
+  '/api/module/all/info': (req, res) => {
+    const all = modules.all;
+    const publics = modules.public;
+    const findModule = (id) => all.filter(m => m.id === id).pop();
+    const fetchParent = (module) => {
+      if (module.parent) {
+        const parent = findModule(module.parent);
+        return parent ? [parent, ...fetchParent(parent)] : [];
+      } else {
+        return [];
+      }
+    };
+    const parents = new Set();
+    publics.map(m => {
+      const _p = fetchParent(m);
+      _p.map(p => {
+        parents.add(p);
+      });
+    });
+    res.send([
+      ...publics,
+      ...parents,
+    ]);
+  },
+  '/api/bpm/task/all/count': (req, res) => {
+    res.send(`${dealWithData(req).length}`);
+  },
+  '/api/bpm/task/all/info': (req, res) => {
+    const pst = Number.parseInt(req.query.pst);
+    const psz = Number.parseInt(req.query.psz);
+    res.send(dealWithData(req).slice(pst, pst + psz));
+  },
+};

mock/filter.js

+import moment from 'moment';
+
+const findSep = (value, offset = 0) => {
+  const find = value.indexOf('|', offset);
+  if (find !== -1) {
+    let count = 0;
+    let from = find;
+    while (value[--from] === '#') ++count;
+    if (count % 2 === 1) {
+      return findSep(value, find + 1);
+    } else {
+      return find;
+    }
+  } else {
+    return -1;
+  }
+};
+
+const transform = (value) => {
+  const find = value.indexOf('#');
+  if (find !== -1) {
+    const left = value.slice(0, find);
+    const me = value[find + 1] ? value[find + 1] : '';
+    const right = value.slice(find + 2);
+    return `${left}${me}${transform(right)}`;
+  } else {
+    return value;
+  }
+};
+
+const split = (value) => {
+  const ret = [];
+  let offset = 0;
+  let posSep = -1;
+  do {
+    posSep = findSep(value, offset);
+    if (posSep !== -1) {
+      ret.push(transform(value.slice(offset, posSep)));
+      offset = posSep + 1;
+    }
+  } while (posSep !== -1);
+  ret.push(transform(value.slice(offset)));
+  return ret;
+};
+
+const is = (obj, type) => {
+  return (type === 'Null' && obj === null) ||
+    (type === 'Undefined' && obj === void 0) || // eslint-disable-line no-void
+    (type === 'Number' && isFinite(obj)) ||
+    Object.prototype.toString.call(obj).slice(8, -1) === type;
+};
+
+const parseExpr = (valueExpr) => {
+  let valueExpr0 = valueExpr.replace(/\s+/, '');
+  let operator;
+  if (valueExpr0.indexOf('=') === 0) {
+    return {
+      operator: 'exact',
+      exact: valueExpr0.slice(1),
+    };
+  } else if (valueExpr0.indexOf('~') === 0) {
+    operator = 'range';
+    const ret = {
+      operator,
+    };
+    valueExpr0 = valueExpr0.slice(1).replace(/\s+/, '');
+    ret.downClose = valueExpr0[0] === '[';
+    valueExpr0 = valueExpr0.slice(1).replace(/\s+/, '');
+    let pos = valueExpr0.indexOf(',');
+    if (pos === -1) {
+      throw new Error('Invalid input.');
+    }
+    ret.down = Number.parseFloat(valueExpr0.slice(0, pos));
+    valueExpr0 = valueExpr0.slice(pos + 1);
+    pos = valueExpr0.indexOf(']');
+    if (pos !== -1) {
+      ret.upClose = true;
+      ret.up = Number.parseFloat(valueExpr0.slice(0, pos));
+      return ret;
+    }
+    pos = valueExpr0.indexOf(')');
+    if (pos !== -1) {
+      ret.upClose = false;
+      ret.up = Number.parseFloat(valueExpr0.slice(0, pos));
+      return ret;
+    }
+    throw new Error('Invalid input.');
+  } else if (valueExpr0.indexOf('@') === 0) {
+    operator = 'like';
+    return {
+      operator,
+      like: valueExpr0.slice(1),
+    };
+  } else if (valueExpr0.indexOf('^') === 0) {
+    operator = 'list';
+    return {
+      operator,
+      list: valueExpr0.slice(1).split(','),
+    };
+  } else {
+    throw new Error('Invalid input.');
+  }
+};
+
+const toFunction = (keysExpr, valueExpr) => {
+  const parsedExpr = parseExpr(valueExpr);
+  return (obj) => {
+    const value = obj[keysExpr.slice(2)]; // 略过'f-'
+    if (value === undefined) {
+      return true;
+    }
+    if (value === null) {
+      return parsedExpr.operator === 'exact' && parsedExpr.exact === '' || parsedExpr.exact === null;
+    }
+    if (parsedExpr.operator === 'exact') {
+      if (Number.isFinite(value)) {
+        return value === Number.parseFloat(parsedExpr.exact);
+      }
+      if (moment.isMoment(value)) {
+        return value.isSame(Number.parseFloat(parsedExpr.exact));
+      }
+      if (moment.isDate(value)) {
+        return value.isSame(Number.parseFloat(parsedExpr.exact));
+      }
+      if (is(value, 'String')) {
+        return value === parsedExpr.exact;
+      }
+    } else if (parsedExpr.operator === 'range') {
+      if (Number.isFinite(value)) {
+        let ret = true;
+        if (!(/^\s*$/).test(parsedExpr.down)) {
+          if (parsedExpr.downClose) {
+            ret = ret && value >= Number.parseFloat(parsedExpr.down);
+          } else {
+            ret = ret && value > Number.parseFloat(parsedExpr.down);
+          }
+        }
+        if (!(/^\s*$/).test(parsedExpr.up)) {
+          if (parsedExpr.upClose) {
+            ret = ret && value <= Number.parseFloat(parsedExpr.up);
+          } else {
+            ret = ret && value < Number.parseFloat(parsedExpr.up);
+          }
+        }
+        return ret;
+      } else if (moment.isDate(value) || moment.isMoment(value)) {
+        let ret = true;
+        if (!(/^\s*$/).test(parsedExpr.down)) {
+          const a = moment(value);
+          const b = moment(Number.parseFloat(parsedExpr.down));
+          if (parsedExpr.downClose) {
+            ret = ret && (a.isBefore(b) || a.isSame(b));
+          } else {
+            ret = ret && a.isBefore(b);
+          }
+        }
+        if (!(/^\s*$/).test(parsedExpr.up)) {
+          const a = moment(value);
+          const b = moment(Number.parseFloat(parsedExpr.up));
+          if (parsedExpr.upClose) {
+            ret = ret && (a.isAfter(b) || a.isSame(b));
+          } else {
+            ret = ret && a.isAfter(b);
+          }
+        }
+        return ret;
+      }
+    } else if (parsedExpr.operator === 'like') {
+      if (is(value, 'String')) {
+        return new RegExp(`^${parsedExpr.like
+          .replace(/%/g, '[\\s\\S]*')
+          .replace(/_/g, '[\\s\\S]')
+          .replace(/\[!([\s\S]+)]/, '[^$1]')}$`)
+          .test(value);
+      }
+    } else if (parsedExpr.operator === 'list') {
+      for (const test of parsedExpr.list) {
+        // noinspection EqualityComparisonWithCoercionJS
+        if (test != value) { // eslint-disable-line eqeqeq
+          return false;
+        }
+      }
+      return true;
+    }
+    throw new Error(`Invalid input.${keysExpr}|${valueExpr}.`);
+  };
+};
+
+const toFunctions = (keysExpr, valueExpr) => {
+  const keys = split(keysExpr);
+  const values = split(valueExpr);
+  if (keys.length !== values.length) {
+    throw new Error('Invalid input.');
+  }
+  return (obj) => {
+    const len = keys.length;
+    const fucs = [];
+    for (let i = 0; i < len; ++i) {
+      const key = keys[i];
+      const value = values[i];
+      fucs.push(toFunction(key, value));
+    }
+    for (let i = 0; i < len; ++i) {
+      if (fucs[i](obj)) {
+        return true;
+      }
+    }
+    return false;
+  };
+};
+
+export default toFunctions;

package.json

+{
+  "private": true,
+  "scripts": {
+    "start": "roadhog server",
+    "build": "roadhog build",
+    "lint": "eslint --ext .js src test",
+    "precommit": "npm run lint"
+  },
+  "engines": {
+    "install-node": "6.9.2"
+  },
+  "dependencies": {
+    "antd": "^2.10.4",
+    "babel-plugin-import": "^1.2.1",
+    "babel-runtime": "^6.9.2",
+    "bundle-loader": "^0.5.5",
+    "co": "^4.6.0",
+    "dva": "^1.2.1",
+    "dva-loading": "^0.2.1",
+    "jsencrypt": "^2.3.1",
+    "lodash": "^4.17.4",
+    "lodash-deep": "^2.0.0",
+    "moment": "^2.18.1",
+    "path-to-regexp": "^1.7.0",
+    "prop-types": "^15.5.10",
+    "react": "^15.4.0",
+    "react-dom": "^15.4.0",
+    "react-sizeme": "^2.3.4",
+    "word-wrap": "^1.2.3",
+    "xml2js": "^0.4.17"
+  },
+  "devDependencies": {
+    "babel-eslint": "^7.1.1",
+    "babel-plugin-dva-hmr": "^0.3.2",
+    "babel-plugin-transform-runtime": "^6.9.0",
+    "eslint": "^3.12.2",
+    "eslint-config-airbnb": "^13.0.0",
+    "eslint-plugin-import": "^2.2.0",
+    "eslint-plugin-jsx-a11y": "^2.2.3",
+    "eslint-plugin-react": "^6.8.0",
+    "expect": "^1.20.2",
+    "husky": "^0.12.0",
+    "mockjs": "^1.0.1-beta3",
+    "redbox-react": "^1.3.2",
+    "roadhog": "^0.6.0"
+  }
+}

public/index.html

+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Dva Demo</title>
+  <script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
+  <link rel="stylesheet" href="/index.css" />
+</head>
+<body>
+
+<div id="root"></div>
+
+<script src="/index.js"></script>
+
+</body>
+</html>

src/components/Table/index.js

+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
+import { Table } from 'antd'
+
+class MyTable extends Component {
+  render() {
+    return (
+      <Table />
+    );
+  }
+}
+
+Table.propTypes = {};
+Table.defaultProps = {};
+
+export default MyTable;
+

src/components/layout/RootPanel.js

+import React from 'react';
+import { addEvent, removeEvent } from '../../utils/dom';
+
+class RootPanel extends React.Component {
+
+  constructor(props, context) {
+    super(props, context);
+    this.attachNode = this::this.attachNode;
+    this.updateHeight = this::this.updateHeight;
+    this.state = {
+      height: 0,
+    };
+  }
+
+  componentDidMount() {
+    addEvent(window, 'resize', this.updateHeight); // eslint-disable-line no-undef
+    this.updateHeight();
+  }
+
+  componentWillUnmount() {
+    removeEvent(window, 'resize', this.updateHeight); // eslint-disable-line no-undef
+  }
+
+
+  updateHeight() {
+    const parentNode = this.node.parentNode;
+    this.setState({
+      height: parentNode.offsetHeight,
+    });
+  }
+
+  attachNode(node) {
+    this.node = node;
+  }
+
+  render() {
+    const { children, style, ...rest } = this.props;
+    return (
+      <div style={{ ...style, height: this.state.height }} {...rest} ref={this.attachNode}>{ children }</div>
+    );
+  }
+}
+
+export default RootPanel;

src/components/layout/sider/SiderLogo.js

+import React from 'react';
+import config from '../../../utils/config';
+import styles from './SiderLogo.less';
+
+const SiderLogo = () => {
+  return (
+    <div className={styles.logo}>
+      <img alt="logo" src={config.logo} />
+      <span>{config.name}</span>
+    </div>
+  );
+};
+
+export default SiderLogo;

src/components/layout/sider/SiderLogo.less

+.logo {
+  text-align: center;
+  height: 30px;
+  line-height: 30px;
+  cursor: pointer;
+  margin-top: 24px;
+  margin-bottom: 24px;
+  overflow: hidden;
+
+  img {
+    width: 30px;
+    margin-right: 8px;
+  }
+
+  span {
+    vertical-align: top;
+    font-size: 16px;
+    color: #eeeeee;
+    text-transform: uppercase;
+    display: inline-block;
+  }
+}
+
+:global .ant-layout-sider-collapsed {
+  :local .logo {
+    height: 24px;
+    line-height: 24px;
+
+    img {
+      width: 24px;
+      margin-left: 8px;
+    }
+
+    span {
+      display: none;
+    }
+  }
+}

src/components/layout/sider/SiderMenu.js

+import React from 'react';
+import PropTypes from 'prop-types';
+import { Menu, Icon } from 'antd';
+import styles from './SiderMenu.less';
+
+const SubMenu = Menu.SubMenu;
+const MenuItem = Menu.Item;
+
+class SiderMenu extends React.Component {
+
+  constructor(props, context) {
+    super(props, context);
+    this.createMenus = this::this.createMenus;
+  }
+  createMenus() {
+    const menus = this.props.menus;
+    const mode = this.props.mode;
+    const toTitle = (menu, root = true) => {
+      const text = (mode !== 'inline' && root) ? '' : menu.text;
+      if (menu.icon) {
+        return (
+          <span>
+            <Icon type={menu.icon} />
+            { text }
+          </span>
+        );
+      } else {
+        return text;
+      }
+    };
+    const toMenuGroup = (menu, toMenuItemFunc, root = false) => {
+      if (!menu.children || menu.children.length === 0) {
+        return toMenuItemFunc(menu, toMenuGroup, root);
+      }
+      return (
+        <SubMenu title={toTitle(menu, root)} key={menu.name}>
+          { menu.children.map(child => toMenuItemFunc(child, toMenuGroup)) }
+        </SubMenu>
+      );
+    };
+    const toMenuItem = (menu, toMenuGroupFunc, root = false) => {
+      if (menu.children && menu.children.length !== 0) {
+        return toMenuGroupFunc(menu, toMenuItem, root);
+      }
+      return (
+        <MenuItem key={menu.name}>
+          { toTitle(menu, root) }
+        </MenuItem>
+      );
+    };
+    return menus.map(menu => toMenuGroup(menu, toMenuItem, true));
+  }
+  render() {
+    const menuProps = {
+      className: styles.menu,
+      theme: this.props.theme,
+      mode: this.props.mode,
+      onClick: this.props.onClick,
+    };
+    return (
+      <Menu {...menuProps}>
+        { this.createMenus() }
+      </Menu>
+    );
+  }
+
+}
+
+SiderMenu.propTypes = {
+  theme: PropTypes.string,
+  mode: PropTypes.string,
+  menus: PropTypes.arrayOf(PropTypes.shape({
+    name: PropTypes.string,
+    icon: PropTypes.string,
+    text: PropTypes.string,
+    hint: PropTypes.string,
+    path: PropTypes.string,
+    children: PropTypes.array,
+  })),
+};
+
+SiderMenu.defaultProps = {
+  theme: 'dark',
+  mode: 'inline',
+  menus: [],
+};
+
+export default SiderMenu;

src/components/layout/sider/SiderMenu.less

+:global .ant-layout-sider-collapsed {
+  :local .menu {
+    :global .anticon {
+      font-size: 16px;
+      margin-left: 8px;
+    }
+
+    :global .ant-menu-submenu-vertical > .ant-menu-submenu-title:after {
+      display: none;
+    }
+  }
+}

src/data/modules.js

+const data = {
+  modules: [],
+};
+export default data;
+
+export const setModule = (modules) => {
+  data.modules = modules;
+};
+
+// noinspection EqualityComparisonWithCoercionJS
+export const getModule = id => data.modules.filter(m => m.id == id).pop(); // eslint-disable-line eqeqeq, max-len
+
+export const getPath = (id) => {
+  const module = getModule(id);
+  if (module.parent) {
+    const parent = getModule(module.parent);
+    return [...getPath(parent.id), id];
+  } else {
+    return [id];
+  }
+};
+
+export const getChildren = (id) => {
+  const children = [];
+  for (const module of data.modules) {
+    // noinspection EqualityComparisonWithCoercionJS
+    if (module.parent == id) { // eslint-disable-line eqeqeq
+      children.push(module);
+    }
+  }
+  return children;
+};
+
+export function foreachModule(callback) {
+  for (const module of data.modules) {
+    callback(module);
+  }
+}
+
+export const setModuleConfigure = (id, configure) => {
+  const module = getModule(id);
+  if (module) {
+    module.configure = configure;
+  }
+};
+
+export const getModuleConfigure = (id) => {
+  const module = getModule(id);
+  return module ? module.configure : null;
+};
+

src/index.css

+@charset "utf-8";
+* {
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  color: #000;
+  background: #FFF;
+  height: 100%;
+}
+
+body {
+  height: 100%;
+}
+
+body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form,
+fieldset, input, textarea, p, blockquote, th, td {
+  margin: 0;
+  padding: 0;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+fieldset, img {
+  border: 0;
+}
+
+address, caption, cite, code, dfn, em, strong, th, var {
+  font-style: normal;
+  font-weight: normal;
+}
+
+ol, ul {
+  list-style: none;
+}
+
+caption, th {
+  text-align: left;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-size: 100%;
+  font-weight: normal;
+}
+
+q:before, q:after {
+  content: '';
+}
+
+abbr, acronym {
+  border: 0;
+}
+
+a {
+  text-decoration: none;
+  color: #000000;
+  font-size: 15px;
+  /*字体*/
+}
+
+li {
+  list-style: none;
+}
+
+input, img {
+  border: none;
+}
+
+:global(#root) {
+  margin: 0;
+  padding: 0;
+  height: 100%;
+}
+

src/index.js

+import dva from 'dva';
+import createLoading from 'dva-loading';
+import { browserHistory } from 'dva/router';
+import moment from 'moment';
+import appModel from './models/app';
+import routerConfig from './router';
+import { showError } from './utils/error';
+import './index.css';
+
+moment.locale('zh-cn');
+
+// 1. Initialize
+const app = dva({
+  history: browserHistory,
+  onError(error) {
+// eslint-disable-next-line no-console
+    console.log(error);
+    showError(error);
+  },
+});
+
+app.model(appModel);
+
+// 2. Plugins
+app.use(createLoading({
+  effects: true,
+}));
+
+// 3. Model
+// app.model(require('./models/example'));
+
+// 4. Router
+app.router(routerConfig);
+
+// 5. Start
+app.start('#root');

src/mock/modules.js

+import Mock from 'mockjs';
+
+const Random = Mock.Random;
+
+const padDigits = (number, digits) => {
+  return new Array(Math.max(digits - String(number).length + 1, 0)).join('0') + number;
+};
+
+let baseId = 10000;
+let groupIdx = 1;
+let moduleIdx = 1;
+const groupPool = [];
+
+const groupIdGenerator = () => {
+  const id = baseId++;
+  groupPool.push({
+    id,
+    children: [],
+  });
+  return id;
+};
+
+const groupNameGenerator = () => `模块组${padDigits(groupIdx++, 2)}`;
+
+const moduleIdGenerator = () => baseId++;
+
+const moduleNameGenerator = () => `模块${padDigits(moduleIdx++, 2)}`;
+
+// eslint-disable-next-line func-names
+const parentPicker = isRoot => function () {
+  if (!isRoot) {
+    const parent = Random.pick(groupPool);
+    parent.children.push(this.id);
+    return Number.parseInt(parent.id, 10);
+  } else {
+    return null;
+  }
+};
+
+const moduleCreator = () => {
+  const leafGroupPool = groupPool.filter(group => group.children.length === 0);
+  const modules0 = Mock.mock({
+    [`modules|${leafGroupPool.length}-${leafGroupPool.length}`]: [{
+      id: moduleIdGenerator,
+      name: moduleNameGenerator,
+      'parent|+1': leafGroupPool.map(group => group.id),
+    }],
+  }).modules;
+  const modules1 = Mock.mock({
+    [`modules|0-${3 * groupPool.length}`]: [{
+      id: moduleIdGenerator,
+      name: moduleNameGenerator,
+      'parent|1': groupPool.map(group => group.id),
+    }],
+  }).modules;
+  return [
+    ...modules0,
+    ...modules1,
+  ];
+};
+
+const defaultGroups = [{
+  id: 1,
+  name: '业务流程',
+  parent: null,
+  group: true,
+}];
+
+const defaultModules = [{
+  id: 1000,
+  name: '当前任务',
+  parent: 1,
+  route: 'task',
+}];
+
+export function genModules() {
+  const mock = Mock.mock({
+    'groups|3-5': [{
+      name: groupNameGenerator,
+      parent: parentPicker(true),
+      id: groupIdGenerator,
+      group: true,
+    }],
+    'subGroups|0-15': [{
+      name: groupNameGenerator,
+      parent: parentPicker(false),
+      id: groupIdGenerator,
+      group: true,
+    }],
+    modules: moduleCreator,
+  });
+  const mNum = mock.modules.length;
+  return {
+    all: [
+      ...defaultGroups,
+      ...mock.groups,
+      ...mock.subGroups,
+      ...mock.modules,
+      ...defaultModules,
+    ],
+    public: [...defaultModules, ...Random.pick(mock.modules, (mNum / 3) | 0, (2 * mNum / 3) | 0)],
+  };
+}

src/mock/tasks.js

+import Mock from 'mockjs';
+import moment from 'moment';
+import _ from 'lodash';
+
+const defaultDateFormat = 'YYYY-MM-DD';
+const defaultTimeFormat = 'HH:mm:ss';
+const defaultDateTimeFormat = `${defaultDateFormat} ${defaultTimeFormat}`;
+
+const Random = Mock.Random;
+
+export function getTasks() {
+  const states = ['状态1', '状态2', '状态3', '状态4', '状态5', '状态5'];
+  const start = Random.natural(0, 100);
+  const end = Random.natural(start + 5, start + 20);
+  const progresses = Random.range(start, end).map(idx => ({
+    id: idx,
+    name: `流程${idx}`,
+  }));
+  const tasks = _.flatMap(progresses, (progress) => {
+    const s = Random.natural(0, 100);
+    const e = Random.natural(start + 5, start + 20);
+    return Random.range(s, e).map((idx) => {
+      const dateOffset = {
+        days: Random.natural(0, 60),
+        hours: Random.natural(0, 23),
+        minutes: Random.natural(0, 59),
+        seconds: Random.natural(0, 59),
+        milliseconds: Random.natural(0, 999),
+      };
+      const deadLineOffset = {
+        days: Random.natural(0, 180),
+        hours: Random.natural(0, 23),
+        minutes: Random.natural(0, 59),
+        seconds: Random.natural(0, 59),
+        milliseconds: Random.natural(0, 999),
+      };
+      const date = moment().subtract(dateOffset);
+      const deadline = date.add(deadLineOffset);
+      return {
+        pId: progress.id,
+        pName: progress.name,
+        nId: idx,
+        nName: `任务${idx}`,
+        state: Random.pick(states),
+        date: date.format(defaultDateTimeFormat),
+        deadline: deadline.format(defaultDateTimeFormat),
+      };
+    });
+  });
+  return Random.shuffle(tasks);
+}

src/models/app.js

+export default {
+
+  namespace: 'app',
+
+  state: {},
+
+  subscriptions: {
+    setup({ dispatch, history }) {  // eslint-disable-line
+    },
+  },
+
+  effects: {
+  },
+
+  reducers: {
+  },
+
+};

src/models/domain.js

+import { routerRedux } from 'dva/router';
+import { fetchDomains, switchDomain, currentDomain } from '../services/domain';
+import { setCookie, setLocalStorge, fullPath } from '../utils/helper';
+import { cookie, storage } from '../utils/config';
+
+export default {
+
+  namespace: 'domain',
+
+  state: {
+    list: [],
+  },
+
+  subscriptions: {
+    setup({ dispatch }) {  // eslint-disable-line
+    },
+  },
+
+  effects: {
+    *fetch(action, { put, call }) {
+      const list = yield call(fetchDomains);
+      yield put({ type: 'querySuccess', payload: list });
+    },
+    *switch({ payload: domainId }, { put, call }) {
+      yield call(switchDomain, domainId);
+      const { id, name } = yield call(currentDomain);
+      setCookie(cookie.domain, id);
+      setLocalStorge(storage.domainName, name);
+      yield put(routerRedux.push(fullPath('/main')));
+    },
+  },
+
+  reducers: {
+    querySuccess(state, { payload: list }) {
+      return {
+        ...state,
+        list,
+      };
+    },
+  },
+
+};

src/models/login.js

+import { routerRedux } from 'dva/router';
+import { login } from '../services/login';
+import { setCookie, setLocalStorge, fullPath } from '../utils/helper';
+import { cookie, storage } from '../utils/config';
+
+export default {
+  namespace: 'login',
+  state: {},
+  reducers: {},
+  effects: {
+    *login({ payload }, { call, put }) {
+      const result = yield call(login, payload);
+      const { tokenId, userId, userName } = result;
+      setCookie(cookie.token, tokenId);
+      setCookie(cookie.user, userId);
+      setLocalStorge(storage.userName, userName);
+      yield put(routerRedux.push(fullPath('/domain')));
+    },
+  },
+  subscriptions: {},
+};

src/models/main/index.js

+import { routerRedux } from 'dva/router';
+import { logout, fetchModuleInfos } from '../../services/main';
+import { fetchDomains, switchDomain, currentDomain } from '../../services/domain';
+import { cookie, storage } from '../../utils/config';
+import { setModule, getModule, getPath, foreachModule } from '../../data/modules';
+import { setCookie, delCookie, getLocalStorge, setLocalStorge, delLocalStorge, fullPath } from '../../utils/helper';
+
+const createMenus = () => {
+  const menus = [];
+  const makePath = (_menus, path) => {
+    if (path.length === 0) {
+      return null;
+    }
+    const [cur, ...rest] = path;
+    const find = _menus.filter(menu => menu.name === cur).pop();
+    if (find) {
+      if (rest.length === 0) {
+        return find;
+      } else {
+        return makePath(find.children, rest);
+      }
+    } else {
+      let container = _menus;
+      for (const id of path) {
+        const m = getModule(id);
+        const menu = {
+          name: m.id,
+          text: m.name,
+          children: [],
+        };
+        container.push(menu);
+        container = menu.children;
+      }
+    }
+  };
+  const makeIcon = (menu) => {
+    const children = menu.children;
+    if (children.length === 0) {
+      menu.icon = 'file'; // eslint-disable-line no-param-reassign
+    } else {
+      menu.icon = 'folder'; // eslint-disable-line no-param-reassign
+      for (const child of children) {
+        makeIcon(child);
+      }
+    }
+  };
+  foreachModule((module) => {
+    const path = getPath(module.id);
+    makePath(menus, path);
+  });
+  for (const menu of menus) {
+    makeIcon(menu);
+  }
+  return menus;
+};
+
+export default {
+
+  namespace: 'main',
+
+  state: {
+    user: '',
+    domain: '',
+    domainList: [],
+    menus: [],
+  },
+
+  subscriptions: {
+    setup({ dispatch, history }) {  // eslint-disable-line
+    },
+  },
+
+  effects: {
+    *fetchDomain(action, { put, call }) {
+      let domain = getLocalStorge(storage.domainName);
+      if (!domain) {
+        const { id, name } = yield call(currentDomain);
+        setCookie(cookie.domain, id);
+        setLocalStorge(storage.domainName, name);
+        domain = name;
+      }
+      yield put({ type: 'switchDomainSuccess', payload: domain });
+    },
+    *fetchDomains(action, { put, call }) {
+      const list = yield call(fetchDomains);
+      yield put({ type: 'queryDomainsSuccess', payload: list });
+    },
+    *switchDomain({ payload: domainId }, { put, call }) {
+      yield call(switchDomain, domainId);
+      const { id, name } = yield call(currentDomain);
+      setCookie(cookie.domain, id);
+      setLocalStorge(storage.domainName, name);
+      yield put({ type: 'switchDomainSuccess', payload: name });
+      yield put(routerRedux.push(fullPath('/main')));
+    },
+    *fetchUser(action, { put }) {
+      const user = getLocalStorge(storage.userName);
+      if (!user) {
+        yield put(routerRedux.push(fullPath('/login')));
+      }
+      yield put({ type: 'queryUserSuccess', payload: user });
+    },
+    *fetchModules(action, { put, call }) {
+      const modules = yield call(fetchModuleInfos);
+      setModule(modules);
+      yield put({ type: 'queryMenusSuccess', payload: createMenus(modules) });
+    },
+    *logout(action, { put, call }) {
+      yield call(logout);
+      delLocalStorge(storage.domainName);
+      delLocalStorge(storage.userName);
+      delCookie(cookie.domain);
+      delCookie(cookie.user);
+      delCookie(cookie.token);
+      yield put(routerRedux.push(fullPath('/login')));
+    },
+  },
+
+  reducers: {
+    queryUserSuccess(state, { payload: user }) {
+      return {
+        ...state,
+        user,
+      };
+    },
+    queryDomainsSuccess(state, { payload: list }) {
+      return {
+        ...state,
+        domainList: list,
+      };
+    },
+    switchDomainSuccess(state, { payload: domain }) {
+      return {
+        ...state,
+        domain,
+      };
+    },
+    queryMenusSuccess(state, { payload: menus }) {
+      return {
+        ...state,
+        menus,
+      };
+    },
+  },
+
+};

src/models/main/modules/task/index.js

+import moment from 'moment';
+import config from '../../../../utils/config';
+import { countTasks, fetchTasks } from '../../../../services/bpm';
+
+export default {
+  namespace: 'task',
+  state: {
+    num: 0,
+    pageStart: 0,
+    pageSize: 0,
+    list: [],
+  },
+  reducers: {
+    queryCountSuccess(state, { payload: num }) {
+      return {
+        ...state,
+        num,
+      };
+    },
+    queryTasksSuccess(state, { payload: { pageStart, pageSize, list } }) {
+      return {
+        ...state,
+        pageStart,
+        pageSize,
+        list,
+      };
+    },
+  },
+  effects: {
+    *fetchTasks({ payload: { pst, psz } }, { put, call }) {
+      const num = Number.parseInt(yield call(countTasks), 10);
+      yield put({ type: 'queryCountSuccess', payload: num });
+      const tasks = yield call(fetchTasks, { pst, psz });
+      yield put({
+        type: 'queryTasksSuccess',
+        payload: {
+          pageStart: pst,
+          pageSize: psz,
+          list: tasks.map((task) => {
+            return {
+              key: `${task.pId}-${task.nId}`,
+              pName: task.pName,
+              nName: task.nName,
+              state: task.state,
+              date: moment(task.date, config.defaultDateTimeFormat),
+              deadline: moment(task.deadline, config.defaultDateTimeFormat),
+            };
+          }),
+        },
+      });
+    },
+  },
+  subscriptions: {},
+};

src/router.js

+import React from 'react';
+import PropTypes from 'prop-types';
+import { Router } from 'dva/router';
+import config from './utils/config';
+import { isAuthed, hasDomain } from './utils/auth';
+import { fullPath, makePromise0 } from './utils/helper';
+import App from './routes/app';
+import { foreachModule, getChildren } from './data/modules';
+import Monk from './routes/main/monk';
+
+const { contextPath } = config;
+
+const registerModel = (app, model) => {
+// eslint-disable-next-line no-underscore-dangle
+  if (!(app._models.filter(m => m.namespace === model.namespace).length === 1)) {
+    app.model(model);
+  }
+};
+
+const maybeLogin = (nextState, replace) => {
+  if (!isAuthed()) {
+    return replace(fullPath('/login'));
+  }
+};
+
+const maybeSwitch = (nextState, replace) => {
+  if (!hasDomain()) {
+    return replace(fullPath('/domain'));
+  }
+};
+
+const authenticated = (nextState, replace) => {
+  maybeLogin(nextState, replace);
+  maybeSwitch(nextState, replace);
+};
+
+const createRoute = async (app, module) => {
+  const route = {
+    path: module.id,
+    name: module.name,
+  };
+  if (!module.group) {
+    if (module.route) {
+      const modelBundle = await makePromise0(require('bundle!./models/main/modules/' + module.route + '/index.js')); // eslint-disable-line import/no-dynamic-require, prefer-template, global-require
+      registerModel(app, modelBundle);
+      const routeBundle = await makePromise0(require('bundle!./routes/main/modules/' + module.route + '/index.js')); // eslint-disable-line import/no-dynamic-require, prefer-template, global-require
+      route.component = routeBundle;
+      if (routeBundle.route) {
+        for (const key in routeBundle.route) {
+          if ({}.hasOwnProperty.call(routeBundle.route, key)) {
+            route[key] = routeBundle.route[key];
+          }
+        }
+      }
+    } else {
+      route.component = Monk;
+    }
+  } else {
+    route.component = Monk;
+    route.getChildRoutes = (nextState, cb) => {
+      createModuleRoutes(app, getChildren(module.id))
+        .then((result) => {
+          cb(null, result);
+        })
+        .catch((err) => {
+          cb(err, null);
+        });
+    };
+  }
+  return route;
+};
+
+const createModuleRoutes = async (app, modules) => {
+  const routes = [];
+  for (const module of modules) {
+    routes.push(await createRoute(app, module));
+  }
+  routes.push({
+    path: '*',
+    onEnter(nextState, replace) {
+      replace(fullPath('/main'));
+    },
+  });
+  return routes;
+};
+
+function RouterConfig({ history, app }) {
+  const routes = [
+    {
+      path: `${contextPath}/`,
+      component: App,
+      indexRoute: {
+        onEnter: (nextState, replace) => replace(`${contextPath}/main`),
+      },
+      childRoutes: [
+        {
+          path: 'login',
+          getComponent(nextState, cb) {
+            require.ensure([], (require) => {
+              registerModel(app, require('./models/login'));
+              cb(null, require('./routes/login'));
+            }, 'login');
+          },
+        },
+        {
+          path: 'domain',
+          onEnter: maybeLogin,
+          getComponent(nextState, cb) {
+            require.ensure([], (require) => {
+              registerModel(app, require('./models/domain'));
+              cb(null, require('./routes/domain'));
+            }, 'domain');
+          },
+        },
+        {
+          path: 'main',
+          onEnter: authenticated,
+          getComponent(nextState, cb) {
+            require.ensure([], (require) => {
+              registerModel(app, require('./models/main'));
+              cb(null, require('./routes/main'));
+            }, 'main');
+          },
+          getChildRoutes: (nextState, cb) => {
+            const lvl0 = [];
+            foreachModule((module) => {
+              if (!module.parent) {
+                lvl0.push(module);
+              }
+            });
+            createModuleRoutes(app, lvl0)
+              .then((result) => {
+                cb(null, result);
+              })
+              .catch((err) => {
+                cb(err, null);
+              });
+          },
+        },
+      ],
+    },
+  ];
+  return (
+    <Router history={history} routes={routes} />
+  );
+}
+
+RouterConfig.propTypes = {
+  history: PropTypes.object,
+  app: PropTypes.object,
+};
+
+export default RouterConfig;

src/routes/app.js

+import React from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'dva';
+import styles from './app.less';
+
+const App = ({ children }) => {
+  return (
+    <div className={styles.app}>{children}</div>
+  );
+};
+
+App.propTypes = {
+  children: PropTypes.element.isRequired,
+};
+
+export default connect()(App);

src/routes/app.less

+.app {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  border: 0;
+  margin: 0;
+  padding: 0;
+}

src/routes/domain/index.js

+import React from 'react';
+import PropTypes from 'prop-types';
+import { Form, Select, Button } from 'antd';
+import { connect } from 'dva';
+import { cookie } from '../../utils/config';
+import { getCookie } from '../../utils/helper';
+import styles from './index.less';
+
+const FormItem = Form.Item;
+const Option = Select.Option;
+
+class Domain extends React.Component {
+
+  constructor(props, context) {
+    super(props, context);
+    this.handleSubmit = this::this.handleSubmit;
+  }
+
+  componentDidMount() {
+    this.props.dispatch({ type: 'domain/fetch' });
+  }
+
+  handleSubmit(e) {
+    e.preventDefault();
+    this.props.form.validateFields((err, values) => {
+      if (!err) {
+        this.props.dispatch({
+          type: 'domain/switch',
+          payload: values.domain,
+        });
+      }
+    });
+  }
+
+  render() {
+    const { form, domain, loading } = this.props;
+    const currentDomain = getCookie(cookie.domain);
+    const selectOptions = {};
+    const decoratorOptions = {};
+    if (!currentDomain) {
+      selectOptions.placeholder = '请选择项目...';
+    } else {
+      decoratorOptions.initialValue = currentDomain;
+    }
+    return (
+      <div className={styles.canvas}>
+        <div className={styles.container}>
+          <Form onSubmit={this.handleSubmit}>
+            <FormItem>
+              {
+                form.getFieldDecorator('domain', decoratorOptions)(
+                  <Select {...selectOptions}>
+                    {domain.list.map(({ id, name }) => {
+                      return <Option value={id} key={id}>{name}</Option>;
+                    })}
+                  </Select>,
+                )
+              }
+            </FormItem>
+            <FormItem>
+              <Button type="primary" htmlType="submit" className={styles.submit} loading={loading}>
+                确定
+              </Button>
+            </FormItem>
+          </Form>
+        </div>
+      </div>
+    );
+  }
+}
+
+Domain.propTypes = {
+  domain: PropTypes.object,
+  loading: PropTypes.bool,
+  form: PropTypes.object,
+};
+
+const mapStateToProps = ({ domain, loading }) => {
+  return {
+    domain,
+    loading: loading.effects['domain/switch'],
+  };
+};
+
+export default connect(mapStateToProps)(Form.create()(Domain));
+

src/routes/domain/index.less

+.canvas {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background-color: #555555;
+}
+
+.container {
+  width: 320px;
+  height: 160px;
+  position: absolute;
+  background-color: white;
+  top: 50%;
+  left: 50%;
+  padding: 36px;
+  margin: -80px 0 0 -160px;
+  box-shadow: 0 0 100px rgba(0,0,0,.08);
+}
+
+.submit {
+  width: 100%;
+}

src/routes/login/index.js

+/**
+ * Created by yaohx_169 on 2017/6/5.
+ */
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Form, Icon, Input, Checkbox, Button } from 'antd';
+import { connect } from 'dva';
+import config from '../../utils/config';
+import styles from './index.less';
+
+const FormItem = Form.Item;
+
+class LoginForm extends React.Component {
+
+  constructor(props, context) {
+    super(props, context);
+    this.handleSubmit = this::this.handleSubmit;
+  }
+
+
+  handleSubmit(e) {
+    e.preventDefault();
+    this.props.form.validateFields((err, values) => {
+      if (!err) {
+        this.props.dispatch({
+          type: 'login/login',
+          payload: values,
+        });
+      }
+    });
+  }
+
+  render() {
+    const { getFieldDecorator } = this.props.form;
+    const loading = this.props.loading;
+    return (
+      <div className={styles.canvas}>
+        <div className={styles.container}>
+          <div className={styles.logo}>
+            <img alt="logo" src={config.logo} />
+            <span>{config.name}</span>
+          </div>
+          <Form onSubmit={this.handleSubmit}>
+            <FormItem>
+              {
+                getFieldDecorator('userName', {
+                  rules: [{
+                    required: true,
+                    message: '请输入用户名。',
+                  }],
+                })(
+                  <Input prefix={<Icon type="user" />} placeholder="用户名" />,
+                )
+              }
+            </FormItem>
+            <FormItem>
+              {
+                getFieldDecorator('password', {
+                  rules: [{
+                    required: true,
+                    message: '请输入密码。',
+                  }],
+                })(
+                  <Input prefix={<Icon type="lock" />} type="password" placeholder="密码" />,
+                )
+              }
+            </FormItem>
+            <FormItem>
+              {
+                getFieldDecorator('remember', {
+                  valuePropName: 'checked',
+                  initialValue: true,
+                })(
+                  <Checkbox>记住我</Checkbox>,
+                )
+              }
+              <a className={styles.forgot} href="">忘记密码</a>
+              <Button type="primary" htmlType="submit" className={styles.submit} loading={loading}>
+                登录
+              </Button>
+              或者<a>现在注册！</a>
+            </FormItem>
+          </Form>
+        </div>
+      </div>
+    );
+  }
+
+}
+
+LoginForm.propTypes = {
+  form: PropTypes.object,
+  loading: PropTypes.bool,
+  dispatch: PropTypes.func,
+};
+
+const mapStateToProps = ({ login, loading }) => {
+  return {
+    login,
+    loading: loading.effects['login/login'],
+  };
+};
+
+export default connect(mapStateToProps)(Form.create()(LoginForm));

src/routes/login/index.less

+.canvas {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background-color: #555555;
+}
+
+.container {
+  width: 320px;
+  height: 320px;
+  position: absolute;
+  background-color: white;
+  top: 50%;
+  left: 50%;
+  padding: 36px;
+  margin: -160px 0 0 -160px;
+  box-shadow: 0 0 100px rgba(0,0,0,.08);
+}
+
+.logo {
+  text-align: center;
+  height: 40px;
+  line-height: 40px;
+  cursor: pointer;
+  margin-bottom: 24px;
+
+  img {
+    width: 40px;
+    margin-right: 8px;
+  }
+
+  span {
+    vertical-align: text-bottom;
+    font-size: 16px;
+    text-transform: uppercase;
+    display: inline-block;
+  }
+}
+
+.forgot {
+  float: right;
+}
+
+.submit {
+  width: 100%;
+}

src/routes/main/header.js

+import React from 'react';
+import PropTypes from 'prop-types';
+import { Menu, Breadcrumb, Icon } from 'antd';
+import { connect } from 'dva';
+import { Link } from 'dva/router';
+import { fullPath } from '../../utils/helper';
+import { getMenuItems } from '../../utils/navigate';
+import styles from './header.less';
+
+const MenuItem = Menu.Item;
+const SubMenu = Menu.SubMenu;
+
+class HeaderPane extends React.Component {
+
+  componentDidMount() {
+    const { dispatch } = this.props;
+    dispatch({ type: 'main/fetchUser' });
+    dispatch({ type: 'main/fetchDomain' });
+    dispatch({ type: 'main/fetchDomains' });
+  }
+  render() {
+    const { dispatch, user, domain, domainList, routes, params, menus } = this.props;
+    const userTitle = (
+      <span>
+        <Icon type="user" />
+        { user }
+      </span>
+    );
+    const domainTitle = (
+      <span>
+        <Icon type="home" />
+        { domain }
+      </span>
+    );
+    const onClick = ({ keyPath }) => {
+      if (keyPath[1] === 'user' && keyPath[0] === 'logout') {
+        dispatch({ type: 'main/logout' });
+      } else if (keyPath[1] === 'domain') {
+        dispatch({ type: 'main/switchDomain', payload: keyPath[0] });
+      }
+    };
+    const breadsProps = {
+      className: styles.breads,
+      routes,
+      params,
+      itemRender(route, _params, _routes, paths) {
+        if (!paths || !paths.length) {
+          return null;
+        }
+        if (paths.length === 1) {
+          return <Icon type="home" />;
+        }
+        const bread = route.name ? route.name : route.path;
+        return <Link to={fullPath(`/${paths.join('/')}`)}>{ bread }</Link>;
+      },
+    };
+    const menuProps = {
+      className: styles.menu,
+      mode: 'horizontal',
+      theme: 'light',
+      selectable: false,
+      onClick,
+    };
+    return (
+      <div className={styles.board}>
+        <Breadcrumb {...breadsProps} />
+        <Menu {...menuProps}>
+          <SubMenu title={userTitle} key="user" >
+            <MenuItem key="logout">
+              <span>
+                <Icon type="logout" />
+                登出
+              </span>
+            </MenuItem>
+          </SubMenu>
+          <SubMenu title={domainTitle} key="domain">
+            {
+              domainList.map(dm => (
+                <MenuItem key={dm.id}>
+                  { dm.name }
+                </MenuItem>
+              ))
+            }
+          </SubMenu>
+        </Menu>
+      </div>
+    );
+  }
+}
+
+HeaderPane.propTypes = {
+  dispatch: PropTypes.func,
+  user: PropTypes.string,
+  domain: PropTypes.string,
+  domainList: PropTypes.arrayOf(PropTypes.shape({
+    id: PropTypes.string,
+    name: PropTypes.string,
+  })),
+};
+
+const mapStateToProps = ({ main }) => {
+  return {
+    user: main.user,
+    domain: main.domain,
+    domainList: main.domainList,
+  };
+};
+
+export default connect(mapStateToProps)(HeaderPane);
+

src/routes/main/header.less

+.board {
+  position: absolute;
+  width: 100%;
+  bottom: 0;
+  background-color: #fff;
+
+  .breads {
+    float: left;
+    margin-left: 16px;
+  }
+
+  .menu {
+    float: right;
+  }
+}

src/routes/main/index.js

+import React from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'dva';
+import { routerRedux } from 'dva/router';
+import { Layout } from 'antd';
+import SiderLogo from '../../components/layout/sider/SiderLogo';
+import SiderMenu from '../../components/layout/sider/SiderMenu';
+import HeaderPane from './header';
+import { fullPath } from '../../utils/helper';
+import styles from './index.less';
+
+const { Sider, Header, Content, Footer } = Layout;
+
+class Main extends React.Component {
+
+  constructor(props, context) {
+    super(props, context);
+    this.onClick = this::this.onClick;
+    this.onCollapse = this::this.onCollapse;
+    this.state = {
+      collapsed: false,
+      mode: 'inline',
+    };
+  }
+  onClick({ keyPath }) {
+    const paths = keyPath.reverse().join('/');
+    this.props.dispatch(routerRedux.push(fullPath(`/main/${paths}`)));
+  }
+  onCollapse(collapsed) {
+    this.setState({
+      collapsed,
+      mode: collapsed ? 'vertical' : 'inline',
+    });
+  }
+
+  componentDidMount() {
+    this.props.dispatch({ type: 'main/fetchModules' });
+  }
+
+
+  render() {
+    const children = this.props.children;
+    const { menus } = this.props.main;
+    const mode = this.state.mode;
+    const menuProps = {
+      mode,
+      menus,
+      onClick: this.onClick,
+    };
+    const { routes, params } = this.props;
+    const headerProps = {
+      routes,
+      params,
+      menus,
+    };
+    return (
+      <Layout className={styles.layout}>
+        <Sider collapsible collapsed={this.state.collapsed} onCollapse={this.onCollapse}>
+          <SiderLogo />
+          <SiderMenu {...menuProps} />
+        </Sider>
+        <Layout>
+          <Header>
+            <HeaderPane {...headerProps} />
+          </Header>
+          <Content>
+            { children }
+          </Content>
+          <Footer>
+            <span className={styles.company}>®上海铂蓝信息科技有限公司</span>
+          </Footer>
+        </Layout>
+      </Layout>
+    );
+  }
+
+}
+
+Main.propTypes = {
+  children: PropTypes.element.isRequired,
+  main: PropTypes.object.isRequired,
+};
+
+export default connect(({ main }) => ({ main }))(Main);

src/routes/main/index.less

+.layout {
+  height: 100%;
+  :global .ant-layout-header {
+    position: relative;
+  }
+  :global .ant-layout-content {
+    position: relative;
+    overflow: auto;
+  }
+  :global .ant-layout-footer {
+    background-color: #fff;
+
+    :local .company {
+      float: right;
+      margin-bottom: -12px;
+      margin-right: -24px;
+    }
+  }
+}

src/routes/main/modules/task/detail.js

+import React from 'react';
+import PropTypes from 'prop-types';
+
+class Detail extends React.Component {
+
+  render() {
+    return (
+      <div>List</div>
+    );
+  }
+
+}
+
+Detail.propTypes = {
+  task: PropTypes.object.isRequired,
+};
+
+export default Detail;

src/routes/main/modules/task/index.js

+import { connect } from 'dva';
+import List from './list';
+import Detail from './detail';
+import route from '../../../../utils/hoc/routes';
+
+export default connect(({ task }) => ({ task }))(route({
+  childRoutes: [
+    {
+      path: 'list',
+      name: '列表',
+      component: List,
+    },
+    {
+      path: 'detail',
+      name: '详细',
+      component: Detail,
+    },
+  ],
+}));

src/routes/main/modules/task/list.js

+import React from 'react';
+import PropTypes from 'prop-types';
+import moment from 'moment';
+import { Table, Input, Icon } from 'antd';
+import { connect } from 'dva';
+import config from '../../../../utils/config';
+import styles from './list.less';
+
+const columns = [{
+  title: '流程',
+  dataIndex: 'pName',
+  key: 'pName',
+}, {
+  title: '任务',
+  dataIndex: 'nName',
+  key: 'nName',
+}, {
+  title: '状态',
+  dataIndex: 'state',
+  key: 'state',
+}, {
+  title: '日期',
+  dataIndex: 'date',
+  key: 'date',
+  render(date) {
+    return date.format(config.defaultDateTimeFormat);
+  },
+}, {
+  title: '期限',
+  dataIndex: 'deadline',
+  key: 'deadline',
+  render(deadline) {
+    const now = moment();
+    const late = deadline.diff(now, 'days', true);
+    if (late < 0) {
+      const style = {
+        color: '#f04134',
+      };
+      return <span style={style}>{ `超时 ${deadline.from(now, true)}` }</span>;
+    } else if (late < 1) {
+      const style = {
+        color: '#ffbf00',
+      };
+      return <span style={style}>{ `仅剩 ${deadline.to(now, true)}` }</span>;
+    } else {
+      const style = {
+        color: '#00a854',
+      };
+      return <span style={style}>{ `还剩 ${deadline.to(now, true)}` }</span>;
+    }
+  },
+}];
+
+const psz = 10;
+
+class List extends React.Component {
+
+  constructor(props, context) {
+    super(props, context);
+    this.onSearch = this::this.onSearch;
+  }
+  componentDidMount() {
+    this.props.dispatch({ type: 'task/fetchTasks', payload: { pst: 0, psz } });
+  }
+  onSearch(value) {
+    console.log(value);
+  }
+  render() {
+    const { list, pageStart, pageSize, num } = this.props.task;
+    const dispatch = this.props.dispatch;
+    const tableProps = {
+      dataSource: list,
+      columns,
+      loading: this.props.loading.effects['task/fetchTasks'],
+      pagination: {
+        current: (pageStart / pageSize) | 0,
+        total: num,
+        pageSize,
+      },
+      onChange(pagination) {
+        const psz = pagination.pageSize; // eslint-disable-line no-shadow
+        const pst = pagination.current * psz;
+        dispatch({ type: 'task/fetchTasks', payload: { pst, psz } });
+      },
+    };
+    return (
+      <div className={styles.wrapper}>
+        <div className={styles.container}>
+          <div className={styles.search}>
+            <Input.Search onSearch={this.onSearch} />
+          </div>
+          <Table {...tableProps} />
+        </div>
+      </div>
+    );
+  }
+
+}
+
+List.propTypes = {
+  task: PropTypes.object.isRequired,
+};
+
+export default connect(({ task, loading }) => ({ task, loading }))(List);

src/routes/main/modules/task/list.less

+.wrapper {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  padding: 12px;
+}
+.container {
+  height: 100%;
+  padding: 24px;
+  background-color: #fff;
+  overflow: auto;
+
+  .search {
+    width: 300px;
+    margin-bottom: 24px;
+  }
+}

src/routes/main/monk.js

+const Monk = ({ children }) => {
+  return children;
+};
+
+export default Monk;

src/services/bpm.js

+import request from '../utils/request';
+
+export async function countTasks() {
+  return request('/api/bpm/task/all/count');
+}
+
+export async function fetchTasks({ pst, psz }) {
+  return request('/api/bpm/task/all/info', { pst, psz });
+}

src/services/domain.js

+import request from '../utils/request';
+
+export async function fetchDomains() {
+  return request('/api/domain/all');
+}
+
+export async function switchDomain(domainId) {
+  return request('/api/domain/switch', { domainId });
+}
+
+export async function currentDomain() {
+  return request('/api/domain/current');
+}

src/services/login.js

+import request from '../utils/request';
+import { encrypt } from '../utils/helper';
+
+export async function login(payload) {
+  const sign = encrypt(JSON.stringify({
+    un: payload.userName,
+    ps: payload.password,
+    type: 1,
+    productId: 1,
+  }));
+  return request(`/api/user/login2?sign=${sign}&method=password`, {}, {}, false);
+}

src/services/main.js

+import request from '../utils/request';
+
+export async function logout() {
+  return request('/api/user/logout');
+}
+
+export async function fetchModuleInfos() {
+  return request('/api/module/all/info');
+}

src/utils/auth.js

+/**
+ * Created by yaohx_169 on 2017/6/8.
+ */
+import { cookie } from './config';
+import { getCookie, locationOrigin, currentPath } from './helper';
+
+export function isAuthed() {
+  return !!getCookie(cookie.token);
+}
+
+export function hasDomain() {
+  return !!getCookie(cookie.domain);
+}
+
+export function redirectLogin() {
+  localStorage.clear(); // eslint-disable-line
+  if (currentPath() !== '/login') {
+    location.href = `${locationOrigin(true)}/login?from=${currentPath()}`; // eslint-disable-line
+  }
+}
+
+export function authenticated() {
+  const token = getCookie(cookie.token);
+  if (!token) {
+    redirectLogin();
+  }
+}

src/utils/config.js

+/**
+ * Created by yaohx_169 on 2017/6/6.
+ */
+import { createError } from './error';
+
+export const cookie = {
+  token: 'token',
+  user: 'user',
+  domain: 'domain',
+};
+
+export const storage = {
+  userName: 'userName',
+  domainName: 'domainName',
+};
+
+export const errors = {
+  unLogin: createError({
+    code: 1,
+    msg: '未登录',
+  }),
+};
+
+export const api = {
+  userLogin: '/user/login',
+  userLogout: '/user/logout',
+  userInfo: '/userInfo',
+  users: '/users',
+  user: '/user/:id',
+  dashboard: '/dashboard',
+};
+
+const defaultDateFormat = 'YYYY-MM-DD';
+const defaultTimeFormat = 'HH:mm:ss';
+const defaultDateTimeFormat = `${defaultDateFormat} ${defaultTimeFormat}`;
+
+const config = {
+  name: 'Jbpm Demo',
+  footerText: '上海铂蓝信息科技有限公司',
+  logo: '/logo.png',
+  contextPath: '',
+  defaultDateFormat,
+  defaultTimeFormat,
+  defaultDateTimeFormat,
+  pubKey: '-----BEGIN PUBLIC KEY-----MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC+/Rs6dYmdtETjHCZq4LF3QjLM/DocRAXrqtMULZf+579dAn+CiM8noLplZT/DRwvfK822eq8sypH+a4NqP7942pPVjOudVvKfiJvmm2TOQHvQ7vi3iyZVdlsxX72JNFo1Ocqwj48aIC/OJ4bMf/VyCKrmKrU2iXND+I4BN8cfhwIDAQAB-----END PUBLIC KEY-----',
+};
+
+export default config;

src/utils/dom.js

+/* eslint-disable no-param-reassign,prefer-rest-params */
+/**
+ * Created by yaohx_169 on 2017/5/10.
+ */
+
+/*
+ * 添加事件处理程序
+ * @param object object 要添加事件处理程序的元素
+ * @param string type 事件名称，如click
+ * @param function handler 事件处理程序，可以直接以匿名函数的形式给定，或者给一个已经定义的函数名。匿名函数方式给定的事件处理程序在IE6 IE7 IE8中可以移除，在标准浏览器中无法移除。
+ * @param boolean remove 是否是移除的事件，本参数是为简化下面的removeEvent函数而写的，对添加事件处理程序不起任何作用
+ */
+export function addEvent(object, type, handler, remove) {
+  if (typeof object !== 'object' || typeof handler !== 'function') return;
+  try {
+    object[remove ? 'removeEventListener' : 'addEventListener'](type, handler, false);
+  } catch (e) {
+    const xc = `_${type}`;
+    object[xc] = object[xc] || [];
+    if (remove) {
+      const l = object[xc].length;
+      for (let i = 0; i < l; i++) {
+        if (object[xc][i].toString() === handler.toString()) object[xc].splice(i, 1);
+      }
+    } else {
+      const l = object[xc].length;
+      let exists = false;
+      for (let i = 0; i < l; i++) {
+        if (object[xc][i].toString() === handler.toString()) exists = true;
+      }
+      if (!exists) object[xc].push(handler);
+    }
+    object[`on${type}`] = function () {
+      const l = object[xc].length;
+      for (let i = 0; i < l; i++) {
+        object[xc][i].apply(object, arguments);
+      }
+    };
+  }
+}
+/*
+ * 移除事件处理程序
+ */
+export function removeEvent(object, type, handler) {
+  addEvent(object, type, handler, true);
+}

src/utils/error.js

+import React from 'react';
+import { message, Modal } from 'antd';
+
+const errStyle = {
+  overflow: 'auto',
+  wordWrap: 'break-word',
+  width: '360px',
+  height: '360px',
+  marginLeft: '-24px',
+  marginTop: '24px',
+};
+
+export function showError(err) {
+  if (err) {
+    let msg;
+    if (err.data) {
+      const data = err.data;
+      msg = data ? data.message : err.message;
+    } else {
+      msg = err.message;
+    }
+    if (msg && msg.length < 256) {
+      message.error(msg);
+    } else {
+      Modal.error({
+        title: '服务器内部错误',
+        content: <div style={errStyle}>{msg}</div>,
+        width: 460,
+      });
+    }
+  }
+}
+
+export function createError({ code, msg }) {
+  const error = new Error(msg);
+  error.data = {
+    errorCode: code,
+    message: msg,
+  };
+  return error;
+}

src/utils/helper.js

+import moment from 'moment';
+import { createJSEncrypt } from './jsencrypt';
+import config from './config';
+
+const { contextPath, pubKey } = config;
+
+export function setCookie(name, value, options = {}) {
+  const { path, domain, expires } = options;
+  if (name) {
+    const expireSet = expires ? ` expires=${moment().add(expires).toDate().toUTCString()};` : '';
+    const domainSet = domain ? ` domain=${domain};` : '';
+    const pathSet = path ? ` path=${path};` : '';
+    const valueSet = value ? `${name}=${encodeURIComponent(value)};` : '';
+    document.cookie = `${valueSet}${expireSet}${domainSet};${pathSet}`; // eslint-disable-line
+  }
+}
+
+export function getCookie(name) {
+  const reg = new RegExp(`(^|)${name}=([^;]*)(;|$)`);
+  const arr = document.cookie.match(reg); // eslint-disable-line
+  if (arr) {
+    return decodeURIComponent(arr[2]);
+  } else {
+    return null;
+  }
+}
+
+export function delCookie(name, { domain, path } = {}) {
+  if (getCookie(name)) {
+    const domainSet = domain ? ` domain=${domain};` : '';
+    const pathSet = path ? ` path=${path};` : '';
+    document.cookie = `${name}=; expires=Thu, 01-Jan-70 00:00:01 GMT;${pathSet}${domainSet}`; // eslint-disable-line
+  }
+}
+
+export function setLocalStorge(key, value) {
+  return localStorage.setItem(key, JSON.stringify(value)); // eslint-disable-line
+}
+
+export function getLocalStorge(key) {
+  return JSON.parse(localStorage.getItem(key)); // eslint-disable-line
+}
+
+export function delLocalStorge(key) {
+  return localStorage.removeItem(key); // eslint-disable-line
+}
+
+export function locationOrigin(withContext = true) {
+  return `${location.protocol}//${location.hostname}${location.port ? ':' + location.port : ''}${withContext ? contextPath : ''}`; // eslint-disable-line
+}
+
+export function currentPath() {
+  let path = location.pathname; // eslint-disable-line
+  if (!path) {
+    path = '/';
+  }
+  if (path[0] !== '/') {
+    path = `/${path}`;
+  }
+  if (path.slice(0, contextPath.length) === contextPath) {
+    return path.slice(contextPath.length);
+  } else {
+    return '/';
+  }
+}
+
+export function fullPath(path) {
+  return `${contextPath}${path}`;
+}
+
+export function encrypt(text) {
+  const jsEncrypt = createJSEncrypt();
+  jsEncrypt.setPublicKey(pubKey);
+  let out = jsEncrypt.encryptLong(text);
+  out = out.split('=')[0];
+  out = out.replace(/\+/g, '-');
+  return out.replace(/\//g, '_');
+}
+
+/**
+ * @param name {String}
+ * @return  {String}
+ */
+export function queryURL(name) {
+  const reg = new RegExp(`(^|&)${name}=([^&]*)(&|$)`, 'i');
+// eslint-disable-next-line no-undef
+  const r = window ? window.location.search.substr(1).match(reg) : null;
+  if (r !== null) return decodeURI(r[2]);
+  return null;
+}
+
+export function padDigits(number, digits) {
+  return new Array(Math.max(digits - String(number).length + 1, 0)).join('0') + number;
+}
+
+export function is(obj, type) {
+  return (type === 'Null' && obj === null) ||
+    (type === 'Undefined' && obj === void 0) || // eslint-disable-line no-void
+    (type === 'Number' && isFinite(obj)) ||
+    Object.prototype.toString.call(obj).slice(8, -1) === type;
+}
+
+export function makePromise0(thunk) {
+  return new Promise((resolve) => {
+    thunk(data => resolve(data));
+  });
+}
+
+export function makePromise1(thunk) {
+  return new Promise((resolve, reject) => {
+    thunk(err => reject(err), data => resolve(data));
+  });
+}
+

src/utils/hoc/routes.js

+const route = (routes) => {
+
+  const Wrapper = ({ children }) => {
+    return children;
+  };
+  Wrapper.route = {
+    ...routes,
+    indexRoute: {
+      onEnter(nextState, replace) {
+        if (routes && routes.childRoutes && routes.childRoutes.length > 0) {
+          const index = routes.childRoutes[0];
+          replace(`${nextState.location.pathname}/${index.path}`);
+        }
+      },
+    },
+  };
+  return Wrapper;
+};
+
+export default route;

src/utils/jsbn/base64.js

+/* eslint-disable */
+
+var b64map="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
+var b64padchar="=";
+
+function hex2b64(h) {
+  var i;
+  var c;
+  var ret = "";
+  for(i = 0; i+3 <= h.length; i+=3) {
+    c = parseInt(h.substring(i,i+3),16);
+    ret += b64map.charAt(c >> 6) + b64map.charAt(c & 63);
+  }
+  if(i+1 == h.length) {
+    c = parseInt(h.substring(i,i+1),16);
+    ret += b64map.charAt(c << 2);
+  }
+  else if(i+2 == h.length) {
+    c = parseInt(h.substring(i,i+2),16);
+    ret += b64map.charAt(c >> 2) + b64map.charAt((c & 3) << 4);
+  }
+  while((ret.length & 3) > 0) ret += b64padchar;
+  return ret;
+}
+
+// convert a base64 string to hex
+function b64tohex(s) {
+  var ret = ""
+  var i;
+  var k = 0; // b64 state, 0-3
+  var slop;
+  for(i = 0; i < s.length; ++i) {
+    if(s.charAt(i) == b64padchar) break;
+    v = b64map.indexOf(s.charAt(i));
+    if(v < 0) continue;
+    if(k == 0) {
+      ret += int2char(v >> 2);
+      slop = v & 3;
+      k = 1;
+    }
+    else if(k == 1) {
+      ret += int2char((slop << 2) | (v >> 4));
+      slop = v & 0xf;
+      k = 2;
+    }
+    else if(k == 2) {
+      ret += int2char(slop);
+      ret += int2char(v >> 2);
+      slop = v & 3;
+      k = 3;
+    }
+    else {
+      ret += int2char((slop << 2) | (v >> 4));
+      ret += int2char(v & 0xf);
+      k = 0;
+    }
+  }
+  if(k == 1)
+    ret += int2char(slop << 2);
+  return ret;
+}
+
+// convert a base64 string to a byte/number array
+function b64toBA(s) {
+  //piggyback on b64tohex for now, optimize later
+  var h = b64tohex(s);
+  var i;
+  var a = new Array();
+  for(i = 0; 2*i < h.length; ++i) {
+    a[i] = parseInt(h.substring(2*i,2*i+2),16);
+  }
+  return a;
+}

src/utils/jsbn/prng4.js

+// prng4.js - uses Arcfour as a PRNG
+
+function Arcfour() {
+  this.i = 0;
+  this.j = 0;
+  this.S = new Array();
+}
+
+// Initialize arcfour context from key, an array of ints, each from [0..255]
+function ARC4init(key) {
+  var i, j, t;
+  for(i = 0; i < 256; ++i)
+    this.S[i] = i;
+  j = 0;
+  for(i = 0; i < 256; ++i) {
+    j = (j + this.S[i] + key[i % key.length]) & 255;
+    t = this.S[i];
+    this.S[i] = this.S[j];
+    this.S[j] = t;
+  }
+  this.i = 0;
+  this.j = 0;
+}
+
+function ARC4next() {
+  var t;
+  this.i = (this.i + 1) & 255;
+  this.j = (this.j + this.S[this.i]) & 255;
+  t = this.S[this.i];
+  this.S[this.i] = this.S[this.j];
+  this.S[this.j] = t;
+  return this.S[(t + this.S[this.i]) & 255];
+}
+
+Arcfour.prototype.init = ARC4init;
+Arcfour.prototype.next = ARC4next;
+
+// Plug in your RNG constructor here
+function prng_newstate() {
+  return new Arcfour();
+}
+
+// Pool size must be a multiple of 4 and greater than 32.
+// An array of bytes the size of the pool will be passed to init()
+var rng_psize = 256;

src/utils/jsbn/rng.js

+/* eslint-disable */
+
+// Random number generator - requires a PRNG backend, e.g. prng4.js
+
+// For best results, put code like
+// <body onClick='rng_seed_time();' onKeyPress='rng_seed_time();'>
+// in your main HTML document.
+
+import './prng4';
+
+var rng_state;
+var rng_pool;
+var rng_pptr;
+
+// Mix in a 32-bit integer into the pool
+function rng_seed_int(x) {
+  rng_pool[rng_pptr++] ^= x & 255;
+  rng_pool[rng_pptr++] ^= (x >> 8) & 255;
+  rng_pool[rng_pptr++] ^= (x >> 16) & 255;
+  rng_pool[rng_pptr++] ^= (x >> 24) & 255;
+  if(rng_pptr >= rng_psize) rng_pptr -= rng_psize;
+}
+
+// Mix in the current time (w/milliseconds) into the pool
+function rng_seed_time() {
+  rng_seed_int(new Date().getTime());
+}
+
+// Initialize the pool with junk if needed.
+if(rng_pool == null) {
+  rng_pool = new Array();
+  rng_pptr = 0;
+  var t;
+  if(window.crypto && window.crypto.getRandomValues) {
+    // Use webcrypto if available
+    var ua = new Uint8Array(32);
+    window.crypto.getRandomValues(ua);
+    for(t = 0; t < 32; ++t)
+      rng_pool[rng_pptr++] = ua[t];
+  }
+  if(navigator.appName == "Netscape" && navigator.appVersion < "5" && window.crypto) {
+    // Extract entropy (256 bits) from NS4 RNG if available
+    var z = window.crypto.random(32);
+    for(t = 0; t < z.length; ++t)
+      rng_pool[rng_pptr++] = z.charCodeAt(t) & 255;
+  }
+  while(rng_pptr < rng_psize) {  // extract some randomness from Math.random()
+    t = Math.floor(65536 * Math.random());
+    rng_pool[rng_pptr++] = t >>> 8;
+    rng_pool[rng_pptr++] = t & 255;
+  }
+  rng_pptr = 0;
+  rng_seed_time();
+  //rng_seed_int(window.screenX);
+  //rng_seed_int(window.screenY);
+}
+
+function rng_get_byte() {
+  if(rng_state == null) {
+    rng_seed_time();
+    rng_state = prng_newstate();
+    rng_state.init(rng_pool);
+    for(rng_pptr = 0; rng_pptr < rng_pool.length; ++rng_pptr)
+      rng_pool[rng_pptr] = 0;
+    rng_pptr = 0;
+    //rng_pool = null;
+  }
+  // TODO: allow reseeding after first request
+  return rng_state.next();
+}
+
+function rng_get_bytes(ba) {
+  var i;
+  for(i = 0; i < ba.length; ++i) ba[i] = rng_get_byte();
+}
+
+function SecureRandom() {}
+
+SecureRandom.prototype.nextBytes = rng_get_bytes;

src/utils/jsbn/rsa.js

+/* eslint-disable */
+
+// Depends on jsbn.js and rng.js
+
+// Version 1.1: support utf-8 encoding in pkcs1pad2
+
+import './jsbn';
+import './rng';
+import './base64';
+
+const stringToUtf8ByteArray = (str) => {
+  // TODO(user): Use native implementations if/when available
+  const out = [];
+  let p = 0;
+  for (let i = 0; i < str.length; i++) {
+    let c = str.charCodeAt(i);
+    if (c < 128) {
+      out[p++] = c;
+    } else if (c < 2048) {
+      out[p++] = (c >> 6) | 192;
+      out[p++] = (c & 63) | 128;
+    } else if (
+      ((c & 0xFC00) === 0xD800) && (i + 1) < str.length &&
+      ((str.charCodeAt(i + 1) & 0xFC00) === 0xDC00)) {
+      // Surrogate Pair
+      c = 0x10000 + ((c & 0x03FF) << 10) + (str.charCodeAt(++i) & 0x03FF);
+      out[p++] = (c >> 18) | 240;
+      out[p++] = ((c >> 12) & 63) | 128;
+      out[p++] = ((c >> 6) & 63) | 128;
+      out[p++] = (c & 63) | 128;
+    } else {
+      out[p++] = (c >> 12) | 224;
+      out[p++] = ((c >> 6) & 63) | 128;
+      out[p++] = (c & 63) | 128;
+    }
+  }
+  return out;
+};
+
+// convert a (hex) string to a bignum object
+function parseBigInt(str,r) {
+  return new BigInteger(str,r);
+}
+
+function linebrk(s,n) {
+  var ret = "";
+  var i = 0;
+  while(i + n < s.length) {
+    ret += s.substring(i,i+n) + "\n";
+    i += n;
+  }
+  return ret + s.substring(i,s.length);
+}
+
+function byte2Hex(b) {
+  if(b < 0x10)
+    return "0" + b.toString(16);
+  else
+    return b.toString(16);
+}
+
+function str2blocks(s, n) {
+  const bytes = stringToUtf8ByteArray(s);
+  const blocks = [];
+  const blockSize = n - 11;
+  for (let i = 1; i * blockSize < bytes.length; ++i) {
+    blocks.push(pkcs1pad(bytes.slice((i - 1) * blockSize, i * blockSize), n));
+  }
+  return blocks;
+}
+
+function pkcs1pad(block, n) {
+  const out = block;
+  out.push(0);
+  const rng = new SecureRandom();
+  const x = [];
+  const rSize = n - out.length - 3;
+  for (let i = 0; i < rSize; ++i) {
+    x[0] = 0;
+    while(x[0] === 0) rng.nextBytes(x);
+    out.push(x[0]);
+  }
+  out.push(2);
+  out.push(0);
+  return new BigInteger(out);
+}
+
+// PKCS#1 (type 2, random) pad input string s to n bytes, and return a bigint
+function pkcs1pad2(s,n) {
+  if(n < s.length + 11) { // TODO: fix for utf-8
+    alert("Message too long for RSA");
+    return null;
+  }
+  var ba = new Array();
+  var i = s.length - 1;
+  while(i >= 0 && n > 0) {
+    var c = s.charCodeAt(i--);
+    if(c < 128) { // encode using utf-8
+      ba[--n] = c;
+    }
+    else if((c > 127) && (c < 2048)) {
+      ba[--n] = (c & 63) | 128;
+      ba[--n] = (c >> 6) | 192;
+    }
+    else {
+      ba[--n] = (c & 63) | 128;
+      ba[--n] = ((c >> 6) & 63) | 128;
+      ba[--n] = (c >> 12) | 224;
+    }
+  }
+  ba[--n] = 0;
+  var rng = new SecureRandom();
+  var x = new Array();
+  while(n > 2) { // random non-zero pad
+    x[0] = 0;
+    while(x[0] == 0) rng.nextBytes(x);
+    ba[--n] = x[0];
+  }
+  ba[--n] = 2;
+  ba[--n] = 0;
+  return new BigInteger(ba);
+}
+
+// "empty" RSA key constructor
+function RSAKey() {
+  this.n = null;
+  this.e = 0;
+  this.d = null;
+  this.p = null;
+  this.q = null;
+  this.dmp1 = null;
+  this.dmq1 = null;
+  this.coeff = null;
+}
+
+// Set the public key fields N and e from hex strings
+function RSASetPublic(N,E) {
+  if(N != null && E != null && N.length > 0 && E.length > 0) {
+    this.n = parseBigInt(N,16);
+    this.e = parseInt(E,16);
+  }
+  else
+    alert("Invalid RSA public key");
+}
+
+// Perform raw public operation on "x": return x^e (mod n)
+function RSADoPublic(x) {
+  return x.modPowInt(this.e, this.n);
+}
+
+// Return the PKCS#1 RSA encryption of "text" as an even-length hex string
+function RSAEncrypt(text) {
+  var m = pkcs1pad2(text,(this.n.bitLength()+7)>>3);
+  if(m == null) return null;
+  var c = this.doPublic(m);
+  if(c == null) return null;
+  var h = c.toString(16);
+  if((h.length & 1) == 0) return h; else return "0" + h;
+}
+
+function RSAEncryptLongText(text) {
+  const blocks = str2blocks(text, (this.n.bitLength()+7)>>3);
+  const out = [];
+  for (let i = 0; i < blocks.length; ++ i) {
+    const c = this.doPublic(blocks[i]);
+    if (c == null) return null;
+    const h = c.toString(16);
+    if ((h.length & 1) === 0) {
+      out.push(h);
+    } else {
+      out.push(`0${h}`);
+    }
+  }
+  return out.join('');
+}
+
+// Return the PKCS#1 RSA encryption of "text" as a Base64-encoded string
+//function RSAEncryptB64(text) {
+//  var h = this.encrypt(text);
+//  if(h) return hex2b64(h); else return null;
+//}
+
+// protected
+RSAKey.prototype.doPublic = RSADoPublic;
+
+// public
+RSAKey.prototype.setPublic = RSASetPublic;
+RSAKey.prototype.encrypt = RSAEncrypt;
+RSAKey.prototype.encryptLong = RSAEncryptLongText;
+//RSAKey.prototype.encrypt_b64 = RSAEncryptB64;
+
+export default RSAKey;