初始化 antd-pro

admin-web/src/utils/Authorized.js

@@ -0,0 +1,12 @@
+import RenderAuthorized from '@/components/Authorized';
+import { getAuthority } from './authority';
+
+let Authorized = RenderAuthorized(getAuthority()); // eslint-disable-line
+
+// Reload the rights component
+const reloadAuthorized = () => {
+  Authorized = RenderAuthorized(getAuthority());
+};
+
+export { reloadAuthorized };
+export default Authorized;

admin-web/src/utils/Yuan.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import { yuan } from '@/components/Charts';
+/**
+ * 减少使用 dangerouslySetInnerHTML
+ */
+export default class Yuan extends React.PureComponent {
+  componentDidMount() {
+    this.rendertoHtml();
+  }
+
+  componentDidUpdate() {
+    this.rendertoHtml();
+  }
+
+  rendertoHtml = () => {
+    const { children } = this.props;
+    if (this.main) {
+      this.main.innerHTML = yuan(children);
+    }
+  };
+
+  render() {
+    return (
+      <span
+        ref={ref => {
+          this.main = ref;
+        }}
+      />
+    );
+  }
+}

admin-web/src/utils/authority.js

@@ -0,0 +1,22 @@
+// use localStorage to store the authority info, which might be sent from server in actual project.
+export function getAuthority(str) {
+  // return localStorage.getItem('antd-pro-authority') || ['admin', 'user'];
+  const authorityString =
+    typeof str === 'undefined' ? localStorage.getItem('antd-pro-authority') : str;
+  // authorityString could be admin, "admin", ["admin"]
+  let authority;
+  try {
+    authority = JSON.parse(authorityString);
+  } catch (e) {
+    authority = authorityString;
+  }
+  if (typeof authority === 'string') {
+    return [authority];
+  }
+  return authority || ['admin'];
+}
+
+export function setAuthority(authority) {
+  const proAuthority = typeof authority === 'string' ? [authority] : authority;
+  return localStorage.setItem('antd-pro-authority', JSON.stringify(proAuthority));
+}

admin-web/src/utils/authority.test.js

@@ -0,0 +1,19 @@
+import { getAuthority } from './authority';
+
+describe('getAuthority should be strong', () => {
+  it('empty', () => {
+    expect(getAuthority(null)).toEqual(['admin']); // default value
+  });
+  it('string', () => {
+    expect(getAuthority('admin')).toEqual(['admin']);
+  });
+  it('array with double quotes', () => {
+    expect(getAuthority('"admin"')).toEqual(['admin']);
+  });
+  it('array with single item', () => {
+    expect(getAuthority('["admin"]')).toEqual(['admin']);
+  });
+  it('array with multiple items', () => {
+    expect(getAuthority('["admin", "guest"]')).toEqual(['admin', 'guest']);
+  });
+});

admin-web/src/utils/getPageTitle.js

@@ -0,0 +1,27 @@
+import { formatMessage } from 'umi/locale';
+import pathToRegexp from 'path-to-regexp';
+import isEqual from 'lodash/isEqual';
+import memoizeOne from 'memoize-one';
+import { menu, title } from '../defaultSettings';
+
+export const matchParamsPath = (pathname, breadcrumbNameMap) => {
+  const pathKey = Object.keys(breadcrumbNameMap).find(key => pathToRegexp(key).test(pathname));
+  return breadcrumbNameMap[pathKey];
+};
+
+const getPageTitle = (pathname, breadcrumbNameMap) => {
+  const currRouterData = matchParamsPath(pathname, breadcrumbNameMap);
+  if (!currRouterData) {
+    return title;
+  }
+  const pageName = menu.disableLocal
+    ? currRouterData.name
+    : formatMessage({
+        id: currRouterData.locale || currRouterData.name,
+        defaultMessage: currRouterData.name,
+      });
+
+  return `${pageName} - ${title}`;
+};
+
+export default memoizeOne(getPageTitle, isEqual);

admin-web/src/utils/request.js

@@ -0,0 +1,155 @@
+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');
+      }
+    });
+}

admin-web/src/utils/utils.js

@@ -0,0 +1,194 @@
+import moment from 'moment';
+import React from 'react';
+import nzh from 'nzh/cn';
+import { parse, stringify } from 'qs';
+
+export function fixedZero(val) {
+  return val * 1 < 10 ? `0${val}` : val;
+}
+
+export function getTimeDistance(type) {
+  const now = new Date();
+  const oneDay = 1000 * 60 * 60 * 24;
+
+  if (type === 'today') {
+    now.setHours(0);
+    now.setMinutes(0);
+    now.setSeconds(0);
+    return [moment(now), moment(now.getTime() + (oneDay - 1000))];
+  }
+
+  if (type === 'week') {
+    let day = now.getDay();
+    now.setHours(0);
+    now.setMinutes(0);
+    now.setSeconds(0);
+
+    if (day === 0) {
+      day = 6;
+    } else {
+      day -= 1;
+    }
+
+    const beginTime = now.getTime() - day * oneDay;
+
+    return [moment(beginTime), moment(beginTime + (7 * oneDay - 1000))];
+  }
+
+  if (type === 'month') {
+    const year = now.getFullYear();
+    const month = now.getMonth();
+    const nextDate = moment(now).add(1, 'months');
+    const nextYear = nextDate.year();
+    const nextMonth = nextDate.month();
+
+    return [
+      moment(`${year}-${fixedZero(month + 1)}-01 00:00:00`),
+      moment(moment(`${nextYear}-${fixedZero(nextMonth + 1)}-01 00:00:00`).valueOf() - 1000),
+    ];
+  }
+
+  const year = now.getFullYear();
+  return [moment(`${year}-01-01 00:00:00`), moment(`${year}-12-31 23:59:59`)];
+}
+
+export function getPlainNode(nodeList, parentPath = '') {
+  const arr = [];
+  nodeList.forEach(node => {
+    const item = node;
+    item.path = `${parentPath}/${item.path || ''}`.replace(/\/+/g, '/');
+    item.exact = true;
+    if (item.children && !item.component) {
+      arr.push(...getPlainNode(item.children, item.path));
+    } else {
+      if (item.children && item.component) {
+        item.exact = false;
+      }
+      arr.push(item);
+    }
+  });
+  return arr;
+}
+
+export function digitUppercase(n) {
+  return nzh.toMoney(n);
+}
+
+function getRelation(str1, str2) {
+  if (str1 === str2) {
+    console.warn('Two path are equal!'); // eslint-disable-line
+  }
+  const arr1 = str1.split('/');
+  const arr2 = str2.split('/');
+  if (arr2.every((item, index) => item === arr1[index])) {
+    return 1;
+  }
+  if (arr1.every((item, index) => item === arr2[index])) {
+    return 2;
+  }
+  return 3;
+}
+
+function getRenderArr(routes) {
+  let renderArr = [];
+  renderArr.push(routes[0]);
+  for (let i = 1; i < routes.length; i += 1) {
+    // 去重
+    renderArr = renderArr.filter(item => getRelation(item, routes[i]) !== 1);
+    // 是否包含
+    const isAdd = renderArr.every(item => getRelation(item, routes[i]) === 3);
+    if (isAdd) {
+      renderArr.push(routes[i]);
+    }
+  }
+  return renderArr;
+}
+
+/**
+ * Get router routing configuration
+ * { path:{name,...param}}=>Array<{name,path ...param}>
+ * @param {string} path
+ * @param {routerData} routerData
+ */
+export function getRoutes(path, routerData) {
+  let routes = Object.keys(routerData).filter(
+    routePath => routePath.indexOf(path) === 0 && routePath !== path
+  );
+  // Replace path to '' eg. path='user' /user/name => name
+  routes = routes.map(item => item.replace(path, ''));
+  // Get the route to be rendered to remove the deep rendering
+  const renderArr = getRenderArr(routes);
+  // Conversion and stitching parameters
+  const renderRoutes = renderArr.map(item => {
+    const exact = !routes.some(route => route !== item && getRelation(route, item) === 1);
+    return {
+      exact,
+      ...routerData[`${path}${item}`],
+      key: `${path}${item}`,
+      path: `${path}${item}`,
+    };
+  });
+  return renderRoutes;
+}
+
+export function getPageQuery() {
+  return parse(window.location.href.split('?')[1]);
+}
+
+export function getQueryPath(path = '', query = {}) {
+  const search = stringify(query);
+  if (search.length) {
+    return `${path}?${search}`;
+  }
+  return path;
+}
+
+/* eslint no-useless-escape:0 */
+const reg = /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/;
+
+export function isUrl(path) {
+  return reg.test(path);
+}
+
+export function formatWan(val) {
+  const v = val * 1;
+  if (!v || Number.isNaN(v)) return '';
+
+  let result = val;
+  if (val > 10000) {
+    result = Math.floor(val / 10000);
+    result = (
+      <span>
+        {result}
+        <span
+          style={{
+            position: 'relative',
+            top: -2,
+            fontSize: 14,
+            fontStyle: 'normal',
+            marginLeft: 2,
+          }}
+        >
+          万
+        </span>
+      </span>
+    );
+  }
+  return result;
+}
+
+// 给官方演示站点用，用于关闭真实开发环境不需要使用的特性
+export function isAntdPro() {
+  return window.location.hostname === 'preview.pro.ant.design';
+}
+
+export const importCDN = (url, name) =>
+  new Promise(resolve => {
+    const dom = document.createElement('script');
+    dom.src = url;
+    dom.type = 'text/javascript';
+    dom.onload = () => {
+      resolve(window[name]);
+    };
+    document.head.appendChild(dom);
+  });

admin-web/src/utils/utils.less

@@ -0,0 +1,50 @@
+.textOverflow() {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  word-break: break-all;
+}
+
+.textOverflowMulti(@line: 3, @bg: #fff) {
+  position: relative;
+  max-height: @line * 1.5em;
+  margin-right: -1em;
+  padding-right: 1em;
+  overflow: hidden;
+  line-height: 1.5em;
+  text-align: justify;
+  &::before {
+    position: absolute;
+    right: 14px;
+    bottom: 0;
+    padding: 0 1px;
+    background: @bg;
+    content: '...';
+  }
+  &::after {
+    position: absolute;
+    right: 14px;
+    width: 1em;
+    height: 1em;
+    margin-top: 0.2em;
+    background: white;
+    content: '';
+  }
+}
+
+// mixins for clearfix
+// ------------------------
+.clearfix() {
+  zoom: 1;
+  &::before,
+  &::after {
+    content: ' ';
+    display: table;
+  }
+  &::after {
+    clear: both;
+    height: 0;
+    font-size: 0;
+    visibility: hidden;
+  }
+}

admin-web/src/utils/utils.test.js

@@ -0,0 +1,62 @@
+import { fixedZero, isUrl } from './utils';
+
+describe('fixedZero tests', () => {
+  it('should not pad large numbers', () => {
+    expect(fixedZero(10)).toEqual(10);
+    expect(fixedZero(11)).toEqual(11);
+    expect(fixedZero(15)).toEqual(15);
+    expect(fixedZero(20)).toEqual(20);
+    expect(fixedZero(100)).toEqual(100);
+    expect(fixedZero(1000)).toEqual(1000);
+  });
+
+  it('should pad single digit numbers and return them as string', () => {
+    expect(fixedZero(0)).toEqual('00');
+    expect(fixedZero(1)).toEqual('01');
+    expect(fixedZero(2)).toEqual('02');
+    expect(fixedZero(3)).toEqual('03');
+    expect(fixedZero(4)).toEqual('04');
+    expect(fixedZero(5)).toEqual('05');
+    expect(fixedZero(6)).toEqual('06');
+    expect(fixedZero(7)).toEqual('07');
+    expect(fixedZero(8)).toEqual('08');
+    expect(fixedZero(9)).toEqual('09');
+  });
+});
+
+describe('isUrl tests', () => {
+  it('should return false for invalid and corner case inputs', () => {
+    expect(isUrl([])).toBeFalsy();
+    expect(isUrl({})).toBeFalsy();
+    expect(isUrl(false)).toBeFalsy();
+    expect(isUrl(true)).toBeFalsy();
+    expect(isUrl(NaN)).toBeFalsy();
+    expect(isUrl(null)).toBeFalsy();
+    expect(isUrl(undefined)).toBeFalsy();
+    expect(isUrl()).toBeFalsy();
+    expect(isUrl('')).toBeFalsy();
+  });
+
+  it('should return false for invalid URLs', () => {
+    expect(isUrl('foo')).toBeFalsy();
+    expect(isUrl('bar')).toBeFalsy();
+    expect(isUrl('bar/test')).toBeFalsy();
+    expect(isUrl('http:/example.com/')).toBeFalsy();
+    expect(isUrl('ttp://example.com/')).toBeFalsy();
+  });
+
+  it('should return true for valid URLs', () => {
+    expect(isUrl('http://example.com/')).toBeTruthy();
+    expect(isUrl('https://example.com/')).toBeTruthy();
+    expect(isUrl('http://example.com/test/123')).toBeTruthy();
+    expect(isUrl('https://example.com/test/123')).toBeTruthy();
+    expect(isUrl('http://example.com/test/123?foo=bar')).toBeTruthy();
+    expect(isUrl('https://example.com/test/123?foo=bar')).toBeTruthy();
+    expect(isUrl('http://www.example.com/')).toBeTruthy();
+    expect(isUrl('https://www.example.com/')).toBeTruthy();
+    expect(isUrl('http://www.example.com/test/123')).toBeTruthy();
+    expect(isUrl('https://www.example.com/test/123')).toBeTruthy();
+    expect(isUrl('http://www.example.com/test/123?foo=bar')).toBeTruthy();
+    expect(isUrl('https://www.example.com/test/123?foo=bar')).toBeTruthy();
+  });
+});