init pro block success result

+/yarn.lock
+/package-lock.json
+/dist
+/node_modules
+
+.umi
+.umi-production

+export default {
+  plugins: [
+    ['umi-plugin-block-dev', {}],
+    ['umi-plugin-react', {
+      dva: true,
+      locale: true,
+      antd: true,
+    }]
+  ],
+}

+import React, { PureComponent } from 'react';
+import { connect } from 'dva';
+import styles from './GridContent.less';
+
+class GridContent extends PureComponent {
+  render() {
+    const { contentWidth, children } = this.props;
+    let className = `${styles.main}`;
+    if (contentWidth === 'Fixed') {
+      className = `${styles.main} ${styles.wide}`;
+    }
+    return <div className={className}>{children}</div>;
+  }
+}
+
+export default connect(({ setting }) => ({
+  contentWidth: setting.contentWidth,
+}))(GridContent);

+.main {
+  width: 100%;
+  height: 100%;
+  min-height: 100%;
+  transition: 0.3s;
+  &.wide {
+    max-width: 1200px;
+    margin: 0 auto;
+  }
+}

+import React from 'react';
+import { FormattedMessage } from 'umi/locale';
+import Link from 'umi/link';
+import PageHeader from 'ant-design-pro/lib/PageHeader';
+import { connect } from 'dva';
+import GridContent from './GridContent';
+import styles from './index.less';
+import MenuContext from '@/layouts/MenuContext';
+
+const PageHeaderWrapper = ({ children, contentWidth, wrapperClassName, top, ...restProps }) => (
+  <div style={{ margin: '-24px -24px 0' }} className={wrapperClassName}>
+    {top}
+    <MenuContext.Consumer>
+      {value => (
+        <PageHeader
+          wide={contentWidth === 'Fixed'}
+          home={<FormattedMessage id="menu.home" defaultMessage="Home" />}
+          {...value}
+          key="pageheader"
+          {...restProps}
+          linkElement={Link}
+          itemRender={item => {
+            if (item.locale) {
+              return <FormattedMessage id={item.locale} defaultMessage={item.title} />;
+            }
+            return item.title;
+          }}
+        />
+      )}
+    </MenuContext.Consumer>
+    {children ? (
+      <div className={styles.content}>
+        <GridContent>{children}</GridContent>
+      </div>
+    ) : null}
+  </div>
+);
+
+export default connect(({ setting }) => ({
+  contentWidth: setting.contentWidth,
+}))(PageHeaderWrapper);

+@import '~antd/lib/style/themes/default.less';
+
+.content {
+  margin: 24px 24px 0;
+}
+
+@media screen and (max-width: @screen-sm) {
+  .content {
+    margin: 24px 0 0;
+  }
+}

+import { createContext } from 'react';
+
+export default createContext();

+# @umi-material/resultsuccess
+
+ResultSuccess
+
+## Usage
+
+```sh
+umi block https://github.com/umijs/umi-blocks/tree/master/resultsuccess
+```
+
+## LICENSE
+
+MIT

+{
+  "name": "@umi-block/resultsuccess",
+  "version": "0.0.1",
+  "description": "ResultSuccess",
+  "main": "src/index.js",
+  "scripts": {
+    "dev": "umi dev"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/umijs/umi-blocks/resultsuccess"
+  },
+  "dependencies": {
+    "react": "^16.6.3",
+    "antd": "^3.10.9",
+    "ant-design-pro": "^2.1.1",
+    "dva": "^2.4.0"
+  },
+  "devDependencies": {
+    "umi": "^2.3.0-beta.1",
+    "umi-plugin-react": "^1.3.0-beta.1",
+    "umi-plugin-block-dev": "^1.0.0"
+  },
+  "license": "ISC"
+}

+module.exports = {
+  navTheme: 'dark', // theme for nav menu
+  primaryColor: '#1890FF', // primary color of ant design
+  layout: 'sidemenu', // nav menu position: sidemenu or topmenu
+  contentWidth: 'Fluid', // layout of content: Fluid or Fixed, only works when layout is topmenu
+  fixedHeader: false, // sticky header
+  autoHideHeader: false, // auto hide header
+  fixSiderbar: false, // sticky siderbar
+};

+import React, { Fragment } from 'react';
+import { formatMessage, FormattedMessage } from 'umi/locale';
+import { Button, Row, Col, Icon, Steps, Card } from 'antd';
+import Result from 'ant-design-pro/lib/Result';
+import PageHeaderWrapper from '@/components/PageHeaderWrapper';
+
+const { Step } = Steps;
+
+const desc1 = (
+  <div
+    style={{
+      fontSize: 12,
+      color: 'rgba(0, 0, 0, 0.45)',
+      position: 'relative',
+      left: 42,
+      textAlign: 'left',
+    }}
+  >
+    <div style={{ margin: '8px 0 4px' }}>
+      <FormattedMessage id="app.result.success.step1-operator" defaultMessage="Qu Lili" />
+      <Icon style={{ marginLeft: 8 }} type="dingding-o" />
+    </div>
+    <div>2016-12-12 12:32</div>
+  </div>
+);
+
+const desc2 = (
+  <div style={{ fontSize: 12, position: 'relative', left: 42, textAlign: 'left' }}>
+    <div style={{ margin: '8px 0 4px' }}>
+      <FormattedMessage id="app.result.success.step2-operator" defaultMessage="Zhou Maomao" />
+      <Icon type="dingding-o" style={{ color: '#00A0E9', marginLeft: 8 }} />
+    </div>
+    <div>
+      <a href="">
+        <FormattedMessage id="app.result.success.step2-extra" defaultMessage="Urge" />
+      </a>
+    </div>
+  </div>
+);
+
+const extra = (
+  <Fragment>
+    <div
+      style={{
+        fontSize: 16,
+        color: 'rgba(0, 0, 0, 0.85)',
+        fontWeight: '500',
+        marginBottom: 20,
+      }}
+    >
+      <FormattedMessage id="app.result.success.operate-title" defaultMessage="Project Name" />
+    </div>
+    <Row style={{ marginBottom: 16 }}>
+      <Col xs={24} sm={12} md={12} lg={12} xl={6}>
+        <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>
+          <FormattedMessage id="app.result.success.operate-id" defaultMessage="Project ID：" />
+        </span>
+        23421
+      </Col>
+      <Col xs={24} sm={12} md={12} lg={12} xl={6}>
+        <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>
+          <FormattedMessage id="app.result.success.principal" defaultMessage="Principal：" />
+        </span>
+        <FormattedMessage id="app.result.success.step1-operator" defaultMessage="Qu Lili" />
+      </Col>
+      <Col xs={24} sm={24} md={24} lg={24} xl={12}>
+        <span style={{ color: 'rgba(0, 0, 0, 0.85)' }}>
+          <FormattedMessage
+            id="app.result.success.operate-time"
+            defaultMessage="Effective time："
+          />
+        </span>
+        2016-12-12 ~ 2017-12-12
+      </Col>
+    </Row>
+    <Steps style={{ marginLeft: -42, width: 'calc(100% + 84px)' }} progressDot current={1}>
+      <Step
+        title={
+          <span style={{ fontSize: 14 }}>
+            <FormattedMessage id="app.result.success.step1-title" defaultMessage="Create project" />
+          </span>
+        }
+        description={desc1}
+      />
+      <Step
+        title={
+          <span style={{ fontSize: 14 }}>
+            <FormattedMessage
+              id="app.result.success.step2-title"
+              defaultMessage="Departmental preliminary review"
+            />
+          </span>
+        }
+        description={desc2}
+      />
+      <Step
+        title={
+          <span style={{ fontSize: 14 }}>
+            <FormattedMessage
+              id="app.result.success.step3-title"
+              defaultMessage="Financial review"
+            />
+          </span>
+        }
+      />
+      <Step
+        title={
+          <span style={{ fontSize: 14 }}>
+            <FormattedMessage id="app.result.success.step4-title" defaultMessage="Finish" />
+          </span>
+        }
+      />
+    </Steps>
+  </Fragment>
+);
+
+const actions = (
+  <Fragment>
+    <Button type="primary">
+      <FormattedMessage id="app.result.success.btn-return" defaultMessage="Back to list" />
+    </Button>
+    <Button>
+      <FormattedMessage id="app.result.success.btn-project" defaultMessage="View project" />
+    </Button>
+    <Button>
+      <FormattedMessage id="app.result.success.btn-print" defaultMessage="Print" />
+    </Button>
+  </Fragment>
+);
+
+export default () => (
+  <PageHeaderWrapper>
+    <Card bordered={false}>
+      <Result
+        type="success"
+        title={formatMessage({ id: 'app.result.success.title' })}
+        description={formatMessage({ id: 'app.result.success.description' })}
+        extra={extra}
+        actions={actions}
+        style={{ marginTop: 48, marginBottom: 16 }}
+      />
+    </Card>
+  </PageHeaderWrapper>
+);

+import { message } from 'antd';
+import defaultSettings from '../defaultSettings';
+
+let lessNodesAppended;
+const updateTheme = primaryColor => {
+  // Don't compile less in production!
+  if (APP_TYPE !== 'site') {
+    return;
+  }
+  // Determine if the component is remounted
+  if (!primaryColor) {
+    return;
+  }
+  const hideMessage = message.loading('正在编译主题！', 0);
+  function buildIt() {
+    if (!window.less) {
+      return;
+    }
+    setTimeout(() => {
+      window.less
+        .modifyVars({
+          '@primary-color': primaryColor,
+        })
+        .then(() => {
+          hideMessage();
+        })
+        .catch(() => {
+          message.error('Failed to update theme');
+          hideMessage();
+        });
+    }, 200);
+  }
+  if (!lessNodesAppended) {
+    // insert less.js and color.less
+    const lessStyleNode = document.createElement('link');
+    const lessConfigNode = document.createElement('script');
+    const lessScriptNode = document.createElement('script');
+    lessStyleNode.setAttribute('rel', 'stylesheet/less');
+    lessStyleNode.setAttribute('href', '/color.less');
+    lessConfigNode.innerHTML = `
+      window.less = {
+        async: true,
+        env: 'production',
+        javascriptEnabled: true
+      };
+    `;
+    lessScriptNode.src = 'https://gw.alipayobjects.com/os/lib/less.js/3.8.1/less.min.js';
+    lessScriptNode.async = true;
+    lessScriptNode.onload = () => {
+      buildIt();
+      lessScriptNode.onload = null;
+    };
+    document.body.appendChild(lessStyleNode);
+    document.body.appendChild(lessConfigNode);
+    document.body.appendChild(lessScriptNode);
+    lessNodesAppended = true;
+  } else {
+    buildIt();
+  }
+};
+
+const updateColorWeak = colorWeak => {
+  document.body.className = colorWeak ? 'colorWeak' : '';
+};
+
+export default {
+  namespace: 'setting',
+  state: defaultSettings,
+  reducers: {
+    getSetting(state) {
+      const setting = {};
+      const urlParams = new URL(window.location.href);
+      Object.keys(state).forEach(key => {
+        if (urlParams.searchParams.has(key)) {
+          const value = urlParams.searchParams.get(key);
+          setting[key] = value === '1' ? true : value;
+        }
+      });
+      const { primaryColor, colorWeak } = setting;
+      if (state.primaryColor !== primaryColor) {
+        updateTheme(primaryColor);
+      }
+      updateColorWeak(colorWeak);
+      return {
+        ...state,
+        ...setting,
+      };
+    },
+    changeSetting(state, { payload }) {
+      const urlParams = new URL(window.location.href);
+      Object.keys(defaultSettings).forEach(key => {
+        if (urlParams.searchParams.has(key)) {
+          urlParams.searchParams.delete(key);
+        }
+      });
+      Object.keys(payload).forEach(key => {
+        if (key === 'collapse') {
+          return;
+        }
+        let value = payload[key];
+        if (value === true) {
+          value = 1;
+        }
+        if (defaultSettings[key] !== value) {
+          urlParams.searchParams.set(key, value);
+        }
+      });
+      const { primaryColor, colorWeak, contentWidth } = payload;
+      if (state.primaryColor !== primaryColor) {
+        updateTheme(primaryColor);
+      }
+      if (state.contentWidth !== contentWidth && window.dispatchEvent) {
+        window.dispatchEvent(new Event('resize'));
+      }
+      updateColorWeak(colorWeak);
+      window.history.replaceState(null, 'setting', urlParams.href);
+      return {
+        ...state,
+        ...payload,
+      };
+    },
+  },
+};