Merge pull request #5 from umijs/feat-BasicList

feat: BasicList umi-blocks

@@ -64,3 +64,6 @@ typings/
 pages
 .umi
 .umi-production
+
+# MacOS
+.DS_Store

 export default {
   plugins: [
-    ['umi-plugin-block-dev', {}],
+    ['umi-plugin-block-dev', {
+      layout: 'ant-design-pro',
+    }],
     ['umi-plugin-react', {
       dva: true,
       locale: 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();

-import fetch from 'dva/fetch';
-import { notification } from 'antd';
-import router from 'umi/router';
-import hash from 'hash.js';
-import { isAntdPro } from './utils';
-
-const codeMessage = {
-  200: '服务器成功返回请求的数据。',
-  201: '新建或修改数据成功。',
-  202: '一个请求已经进入后台排队（异步任务）。',
-  204: '删除数据成功。',
-  400: '发出的请求有错误，服务器没有进行新建或修改数据的操作。',
-  401: '用户没有权限（令牌、用户名、密码错误）。',
-  403: '用户得到授权，但是访问是被禁止的。',
-  404: '发出的请求针对的是不存在的记录，服务器没有进行操作。',
-  406: '请求的格式不可得。',
-  410: '请求的资源被永久删除，且不会再得到的。',
-  422: '当创建一个对象时，发生一个验证错误。',
-  500: '服务器发生错误，请检查服务器。',
-  502: '网关错误。',
-  503: '服务不可用，服务器暂时过载或维护。',
-  504: '网关超时。',
-};
-
-const checkStatus = response => {
-  if (response.status >= 200 && response.status < 300) {
-    return response;
-  }
-  const errortext = codeMessage[response.status] || response.statusText;
-  notification.error({
-    message: `请求错误 ${response.status}: ${response.url}`,
-    description: errortext,
-  });
-  const error = new Error(errortext);
-  error.name = response.status;
-  error.response = response;
-  throw error;
-};
-
-const cachedSave = (response, hashcode) => {
-  /**
-   * Clone a response data and store it in sessionStorage
-   * Does not support data other than json, Cache only json
-   */
-  const contentType = response.headers.get('Content-Type');
-  if (contentType && contentType.match(/application\/json/i)) {
-    // All data is saved as text
-    response
-      .clone()
-      .text()
-      .then(content => {
-        sessionStorage.setItem(hashcode, content);
-        sessionStorage.setItem(`${hashcode}:timestamp`, Date.now());
-      });
-  }
-  return response;
-};
-
-/**
- * Requests a URL, returning a promise.
- *
- * @param  {string} url       The URL we want to request
- * @param  {object} [option] The options we want to pass to "fetch"
- * @return {object}           An object containing either "data" or "err"
- */
-export default function request(url, option) {
-  const options = {
-    expirys: isAntdPro(),
-    ...option,
-  };
-  /**
-   * Produce fingerprints based on url and parameters
-   * Maybe url has the same parameters
-   */
-  const fingerprint = url + (options.body ? JSON.stringify(options.body) : '');
-  const hashcode = hash
-    .sha256()
-    .update(fingerprint)
-    .digest('hex');
-
-  const defaultOptions = {
-    credentials: 'include',
-  };
-  const newOptions = { ...defaultOptions, ...options };
-  if (
-    newOptions.method === 'POST' ||
-    newOptions.method === 'PUT' ||
-    newOptions.method === 'DELETE'
-  ) {
-    if (!(newOptions.body instanceof FormData)) {
-      newOptions.headers = {
-        Accept: 'application/json',
-        'Content-Type': 'application/json; charset=utf-8',
-        ...newOptions.headers,
-      };
-      newOptions.body = JSON.stringify(newOptions.body);
-    } else {
-      // newOptions.body is FormData
-      newOptions.headers = {
-        Accept: 'application/json',
-        ...newOptions.headers,
-      };
-    }
-  }
-
-  const expirys = options.expirys && 60;
-  // options.expirys !== false, return the cache,
-  if (options.expirys !== false) {
-    const cached = sessionStorage.getItem(hashcode);
-    const whenCached = sessionStorage.getItem(`${hashcode}:timestamp`);
-    if (cached !== null && whenCached !== null) {
-      const age = (Date.now() - whenCached) / 1000;
-      if (age < expirys) {
-        const response = new Response(new Blob([cached]));
-        return response.json();
-      }
-      sessionStorage.removeItem(hashcode);
-      sessionStorage.removeItem(`${hashcode}:timestamp`);
-    }
-  }
-  return fetch(url, newOptions)
-    .then(checkStatus)
-    .then(response => cachedSave(response, hashcode))
-    .then(response => {
-      // DELETE and 204 do not return data by default
-      // using .json will report an error.
-      if (newOptions.method === 'DELETE' || response.status === 204) {
-        return response.text();
-      }
-      return response.json();
-    })
-    .catch(e => {
-      const status = e.name;
-      if (status === 401) {
-        // @HACK
-        /* eslint-disable no-underscore-dangle */
-        window.g_app._store.dispatch({
-          type: 'login/logout',
-        });
-        return;
-      }
-      // environment should not be used
-      if (status === 403) {
-        router.push('/exception/403');
-        return;
-      }
-      if (status <= 504 && status >= 500) {
-        router.push('/exception/500');
-        return;
-      }
-      if (status >= 404 && status < 422) {
-        router.push('/exception/404');
-      }
-    });
-}

@@ -11,16 +11,17 @@
     "url": "https://github.com/umijs/umi-blocks/basiclist"
   },
   "dependencies": {
-    "react": "^16.6.3",
-    "react-dom": "^16.6.3",
-    "moment": "^2.22.2",
-    "dva": "^2.4.0",
     "ant-design-pro": "^2.1.1",
     "antd": "^3.10.9",
-    "qs": "^6.6.0",
+    "dva": "^2.4.0",
     "hash.js": "^1.1.5",
+    "mockjs": "*",
+    "moment": "^2.22.2",
     "nzh": "^1.0.3",
-    "mockjs": "*"
+    "qs": "^6.6.0",
+    "react": "^16.6.3",
+    "react-dom": "^16.6.3",
+    "umi-request": "^1.0.0"
   },
   "devDependencies": {
     "umi": "^2.3.0-beta.1",

-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, { PureComponent } from 'react';
+import { FormattedMessage } from 'umi/locale';
 import { findDOMNode } from 'react-dom';
 import moment from 'moment';
 import { connect } from 'dva';
@@ -21,10 +22,9 @@ import {
   Select,
 } from 'antd';
 
-import PageHeaderWrapper from '@/components/PageHeaderWrapper';
-import Result from 'ant-design-pro/lib/Result';
+import { Result } from 'ant-design-pro';
 
-import styles from './BasicList.less';
+import styles from './style.less';
 
 const FormItem = Form.Item;
 const RadioButton = Radio.Button;
@@ -253,7 +253,7 @@ class BasicList extends PureComponent {
       );
     };
     return (
-      <PageHeaderWrapper>
+      <React.Fragment>
         <div className={styles.standardList}>
           <Card bordered={false}>
             <Row>
@@ -272,7 +272,7 @@ class BasicList extends PureComponent {
           <Card
             className={styles.listCard}
             bordered={false}
-            title="标准列表"
+            title={<FormattedMessage id="menu.list.basiclist" defaultMessage="Basic List" />}
             style={{ marginTop: 24 }}
             bodyStyle={{ padding: '0 32px 40px 32px' }}
             extra={extraContent}
@@ -332,7 +332,7 @@ class BasicList extends PureComponent {
         >
           {getModalContent()}
         </Modal>
-      </PageHeaderWrapper>
+      </React.Fragment>
     );
   }
 }

+export default {
+  'menu.list.basiclist': 'Basic List',
+};

+export default {
+  'menu.list.basiclist': 'Lista Básica',
+};

+export default {
+  'menu.list.basiclist': '标准列表',
+};

+export default {
+  'menu.list.basiclist': '標淮列表',
+};

-import { queryFakeList, removeFakeList, addFakeList, updateFakeList } from '@/services/api';
+import { queryFakeList, removeFakeList, addFakeList, updateFakeList } from './service';
 
 export default {
   namespace: 'list',

-import { queryRule, removeRule, addRule, updateRule } from '@/services/api';
-
-export default {
-  namespace: 'rule',
-
-  state: {
-    data: {
-      list: [],
-      pagination: {},
-    },
-  },
-
-  effects: {
-    *fetch({ payload }, { call, put }) {
-      const response = yield call(queryRule, payload);
-      yield put({
-        type: 'save',
-        payload: response,
-      });
-    },
-    *add({ payload, callback }, { call, put }) {
-      const response = yield call(addRule, payload);
-      yield put({
-        type: 'save',
-        payload: response,
-      });
-      if (callback) callback();
-    },
-    *remove({ payload, callback }, { call, put }) {
-      const response = yield call(removeRule, payload);
-      yield put({
-        type: 'save',
-        payload: response,
-      });
-      if (callback) callback();
-    },
-    *update({ payload, callback }, { call, put }) {
-      const response = yield call(updateRule, payload);
-      yield put({
-        type: 'save',
-        payload: response,
-      });
-      if (callback) callback();
-    },
-  },
-
-  reducers: {
-    save(state, action) {
-      return {
-        ...state,
-        data: action.payload,
-      };
-    },
-  },
-};

-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,
-      };
-    },
-  },
-};

 import { stringify } from 'qs';
-import request from '@/utils/request';
+import request from 'umi-request';
 
 export async function queryProjectNotice() {
   return request('/api/project/notice');