Merge pull request #3 from umijs/feat/analysis

remove GridContent dep

-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 { stringify } from 'qs';
-import request from '@/utils/request';
-
-export async function queryProjectNotice() {
-  return request('/api/project/notice');
-}
-
-export async function queryActivities() {
-  return request('/api/activities');
-}
-
-export async function queryRule(params) {
-  return request(`/api/rule?${stringify(params)}`);
-}
-
-export async function removeRule(params) {
-  return request('/api/rule', {
-    method: 'POST',
-    body: {
-      ...params,
-      method: 'delete',
-    },
-  });
-}
-
-export async function addRule(params) {
-  return request('/api/rule', {
-    method: 'POST',
-    body: {
-      ...params,
-      method: 'post',
-    },
-  });
-}
-
-export async function updateRule(params) {
-  return request('/api/rule', {
-    method: 'POST',
-    body: {
-      ...params,
-      method: 'update',
-    },
-  });
-}
-
-export async function fakeSubmitForm(params) {
-  return request('/api/forms', {
-    method: 'POST',
-    body: params,
-  });
-}
-
-export async function fakeChartData() {
-  return request('/api/fake_chart_data');
-}
-
-export async function queryTags() {
-  return request('/api/tags');
-}
-
-export async function queryBasicProfile() {
-  return request('/api/profile/basic');
-}
-
-export async function queryAdvancedProfile() {
-  return request('/api/profile/advanced');
-}
-
-export async function queryFakeList(params) {
-  return request(`/api/fake_list?${stringify(params)}`);
-}
-
-export async function removeFakeList(params) {
-  const { count = 5, ...restParams } = params;
-  return request(`/api/fake_list?count=${count}`, {
-    method: 'POST',
-    body: {
-      ...restParams,
-      method: 'delete',
-    },
-  });
-}
-
-export async function addFakeList(params) {
-  const { count = 5, ...restParams } = params;
-  return request(`/api/fake_list?count=${count}`, {
-    method: 'POST',
-    body: {
-      ...restParams,
-      method: 'post',
-    },
-  });
-}
-
-export async function updateFakeList(params) {
-  const { count = 5, ...restParams } = params;
-  return request(`/api/fake_list?count=${count}`, {
-    method: 'POST',
-    body: {
-      ...restParams,
-      method: 'update',
-    },
-  });
-}
-
-export async function fakeAccountLogin(params) {
-  return request('/api/login/account', {
-    method: 'POST',
-    body: params,
-  });
-}
-
-export async function fakeRegister(params) {
-  return request('/api/register', {
-    method: 'POST',
-    body: params,
-  });
-}
-
-export async function queryNotices() {
-  return request('/api/notices');
-}
-
-export async function getFakeCaptcha(mobile) {
-  return request(`/api/captcha?mobile=${mobile}`);
-}

-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');
-      }
-    });
-}

@@ -16,7 +16,7 @@
     "antd": "^3.10.9",
     "moment": "^2.22.2",
     "nzh": "^1.0.3",
-    "qs": "^6.6.0",
+    "umi-request": "^1.0.0-beta.1",
     "ant-design-pro": "^2.1.1",
     "numeral": "^2.0.6",
     "hash.js": "^1.1.5"

@@ -2,11 +2,13 @@ import React, { memo } from 'react';
 import { Row, Col, Icon, Tooltip } from 'antd';
 import { FormattedMessage } from 'umi/locale';
 import styles from './Analysis.less';
-import { ChartCard, MiniArea, MiniBar, MiniProgress, Field } from 'ant-design-pro/lib/Charts';
-import Trend from 'ant-design-pro/lib/Trend';
+import { Charts } from 'ant-design-pro';
+import { Trend } from 'ant-design-pro';
 import numeral from 'numeral';
 import Yuan from '@/utils/Yuan';
 
+const { ChartCard, MiniArea, MiniBar, MiniProgress, Field } = Charts;
+
 const topColResponsiveProps = {
   xs: 24,
   sm: 12,

 import React, { memo } from 'react';
 import { Card, Tabs, Row, Col } from 'antd';
 import { formatMessage, FormattedMessage } from 'umi/locale';
-import { TimelineChart, Pie } from 'ant-design-pro/lib/Charts';
-import NumberInfo from 'ant-design-pro/lib/NumberInfo';
+import { Charts } from 'ant-design-pro';
+import { NumberInfo } from 'ant-design-pro';
 import styles from './Analysis.less';
 
+const { TimelineChart, Pie } = Charts;
+
 const CustomTab = ({ data, currentTabKey: currentKey }) => (
   <Row gutter={8} style={{ width: 138, margin: '8px 0' }}>
     <Col span={12}>

@@ -2,9 +2,11 @@ import React, { memo } from 'react';
 import { Card, Radio } from 'antd';
 import { FormattedMessage } from 'umi/locale';
 import styles from './Analysis.less';
-import { Pie } from 'ant-design-pro/lib/Charts';
+import { Charts } from 'ant-design-pro';
 import Yuan from '@/utils/Yuan';
 
+const { Pie } = Charts;
+
 const ProportionSales = memo(
   ({ dropdownGroup, salesType, loading, salesPieData, handleChangeSalesType }) => (
     <Card

@@ -2,9 +2,11 @@ import React, { memo } from 'react';
 import { Row, Col, Card, Tabs, DatePicker } from 'antd';
 import { FormattedMessage, formatMessage } from 'umi/locale';
 import numeral from 'numeral';
-import { Bar } from 'ant-design-pro/lib/Charts';
+import { Charts } from 'ant-design-pro';
 import styles from './Analysis.less';
 
+const { Bar } = Charts;
+
 const { RangePicker } = DatePicker;
 const { TabPane } = Tabs;
 

 import React, { memo } from 'react';
 import { Row, Col, Table, Tooltip, Card, Icon } from 'antd';
 import { FormattedMessage } from 'umi/locale';
-import Trend from 'ant-design-pro/lib/Trend';
+import { Trend, NumberInfo, Charts } from 'ant-design-pro';
 import numeral from 'numeral';
-import NumberInfo from 'ant-design-pro/lib/NumberInfo';
-import { MiniArea } from 'ant-design-pro/lib/Charts';
 import styles from './Analysis.less';
 
+const { MiniArea } = Charts;
+
 const columns = [
   {
     title: <FormattedMessage id="app.analysis.table.rank" defaultMessage="Rank" />,

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

@@ -2,7 +2,6 @@ import React, { Component, Suspense } from 'react';
 import { connect } from 'dva';
 import { Row, Col, Icon, Menu, Dropdown } from 'antd';
 
-import GridContent from '@/components/PageHeaderWrapper/GridContent';
 import { getTimeDistance } from '@/utils/utils';
 
 import styles from './Analysis.less';
@@ -130,7 +129,7 @@ class Analysis extends Component {
     const activeKey = currentTabKey || (offlineData[0] && offlineData[0].name);
 
     return (
-      <GridContent>
+      <React.Fragment>
         <Suspense fallback={<PageLoading />}>
           <IntroduceRow loading={loading} visitData={visitData} />
         </Suspense>
@@ -177,7 +176,7 @@ class Analysis extends Component {
             handleTabChange={this.handleTabChange}
           />
         </Suspense>
-      </GridContent>
+      </React.Fragment>
     );
   }
 }

+export default {
+  'app.analysis.test': 'Gongzhuan No.{no} shop',
+  'app.analysis.introduce': 'Introduce',
+  'app.analysis.total-sales': 'Total Sales',
+  'app.analysis.day-sales': 'Daily Sales',
+  'app.analysis.visits': 'Visits',
+  'app.analysis.visits-trend': 'Visits Trend',
+  'app.analysis.visits-ranking': 'Visits Ranking',
+  'app.analysis.day-visits': 'Daily Visits',
+  'app.analysis.week': 'WoW Change',
+  'app.analysis.day': 'DoD Change',
+  'app.analysis.payments': 'Payments',
+  'app.analysis.conversion-rate': 'Conversion Rate',
+  'app.analysis.operational-effect': 'Operational Effect',
+  'app.analysis.sales-trend': 'Stores Sales Trend',
+  'app.analysis.sales-ranking': 'Sales Ranking',
+  'app.analysis.all-year': 'All Year',
+  'app.analysis.all-month': 'All Month',
+  'app.analysis.all-week': 'All Week',
+  'app.analysis.all-day': 'All day',
+  'app.analysis.search-users': 'Search Users',
+  'app.analysis.per-capita-search': 'Per Capita Search',
+  'app.analysis.online-top-search': 'Online Top Search',
+  'app.analysis.the-proportion-of-sales': 'The Proportion Of Sales',
+  'app.analysis.channel.all': 'ALL',
+  'app.analysis.channel.online': 'Online',
+  'app.analysis.channel.stores': 'Stores',
+  'app.analysis.sales': 'Sales',
+  'app.analysis.traffic': 'Traffic',
+  'app.analysis.table.rank': 'Rank',
+  'app.analysis.table.search-keyword': 'Keyword',
+  'app.analysis.table.users': 'Users',
+  'app.analysis.table.weekly-range': 'Weekly Range',
+};

+export default {
+  'app.analysis.test': 'Gongzhuan No.{no} shop',
+  'app.analysis.introduce': 'Introduzir',
+  'app.analysis.total-sales': 'Vendas Totais',
+  'app.analysis.day-sales': 'Vendas do Dia',
+  'app.analysis.visits': 'Visitas',
+  'app.analysis.visits-trend': 'Tendência de Visitas',
+  'app.analysis.visits-ranking': 'Ranking de Visitas',
+  'app.analysis.day-visits': 'Visitas do Dia',
+  'app.analysis.week': 'Taxa Semanal',
+  'app.analysis.day': 'Taxa Diária',
+  'app.analysis.payments': 'Pagamentos',
+  'app.analysis.conversion-rate': 'Taxa de Conversão',
+  'app.analysis.operational-effect': 'Efeito Operacional',
+  'app.analysis.sales-trend': 'Tendência de Vendas das Lojas',
+  'app.analysis.sales-ranking': 'Ranking de Vendas',
+  'app.analysis.all-year': 'Todo ano',
+  'app.analysis.all-month': 'Todo mês',
+  'app.analysis.all-week': 'Toda semana',
+  'app.analysis.all-day': 'Todo dia',
+  'app.analysis.search-users': 'Pesquisa de Usuários',
+  'app.analysis.per-capita-search': 'Busca Per Capta',
+  'app.analysis.online-top-search': 'Mais Buscadas Online',
+  'app.analysis.the-proportion-of-sales': 'The Proportion Of Sales',
+  'app.analysis.channel.all': 'Tudo',
+  'app.analysis.channel.online': 'Online',
+  'app.analysis.channel.stores': 'Lojas',
+  'app.analysis.sales': 'Vendas',
+  'app.analysis.traffic': 'Tráfego',
+  'app.analysis.table.rank': 'Rank',
+  'app.analysis.table.search-keyword': 'Palavra chave',
+  'app.analysis.table.users': 'Usuários',
+  'app.analysis.table.weekly-range': 'Faixa Semanal',
+};

+export default {
+  'app.analysis.test': '工专路 {no} 号店',
+  'app.analysis.introduce': '指标说明',
+  'app.analysis.total-sales': '总销售额',
+  'app.analysis.day-sales': '日销售额',
+  'app.analysis.visits': '访问量',
+  'app.analysis.visits-trend': '访问量趋势',
+  'app.analysis.visits-ranking': '门店访问量排名',
+  'app.analysis.day-visits': '日访问量',
+  'app.analysis.week': '周同比',
+  'app.analysis.day': '日同比',
+  'app.analysis.payments': '支付笔数',
+  'app.analysis.conversion-rate': '转化率',
+  'app.analysis.operational-effect': '运营活动效果',
+  'app.analysis.sales-trend': '销售趋势',
+  'app.analysis.sales-ranking': '门店销售额排名',
+  'app.analysis.all-year': '全年',
+  'app.analysis.all-month': '本月',
+  'app.analysis.all-week': '本周',
+  'app.analysis.all-day': '今日',
+  'app.analysis.search-users': '搜索用户数',
+  'app.analysis.per-capita-search': '人均搜索次数',
+  'app.analysis.online-top-search': '线上热门搜索',
+  'app.analysis.the-proportion-of-sales': '销售额类别占比',
+  'app.analysis.channel.all': '全部渠道',
+  'app.analysis.channel.online': '线上',
+  'app.analysis.channel.stores': '门店',
+  'app.analysis.sales': '销售额',
+  'app.analysis.traffic': '客流量',
+  'app.analysis.table.rank': '排名',
+  'app.analysis.table.search-keyword': '搜索关键词',
+  'app.analysis.table.users': '用户数',
+  'app.analysis.table.weekly-range': '周涨幅',
+};

+export default {
+  'app.analysis.test': '工專路 {no} 號店',
+  'app.analysis.introduce': '指標說明',
+  'app.analysis.total-sales': '總銷售額',
+  'app.analysis.day-sales': '日銷售額',
+  'app.analysis.visits': '訪問量',
+  'app.analysis.visits-trend': '訪問量趨勢',
+  'app.analysis.visits-ranking': '門店訪問量排名',
+  'app.analysis.day-visits': '日訪問量',
+  'app.analysis.week': '周同比',
+  'app.analysis.day': '日同比',
+  'app.analysis.payments': '支付筆數',
+  'app.analysis.conversion-rate': '轉化率',
+  'app.analysis.operational-effect': '運營活動效果',
+  'app.analysis.sales-trend': '銷售趨勢',
+  'app.analysis.sales-ranking': '門店銷售額排名',
+  'app.analysis.all-year': '全年',
+  'app.analysis.all-month': '本月',
+  'app.analysis.all-week': '本周',
+  'app.analysis.all-day': '今日',
+  'app.analysis.search-users': '搜索用戶數',
+  'app.analysis.per-capita-search': '人均搜索次數',
+  'app.analysis.online-top-search': '線上熱門搜索',
+  'app.analysis.the-proportion-of-sales': '銷售額類別占比',
+  'app.analysis.channel.all': '全部渠道',
+  'app.analysis.channel.online': '線上',
+  'app.analysis.channel.stores': '門店',
+  'app.analysis.sales': '銷售額',
+  'app.analysis.traffic': '客流量',
+  'app.analysis.table.rank': '排名',
+  'app.analysis.table.search-keyword': '搜索關鍵詞',
+  'app.analysis.table.users': '用戶數',
+  'app.analysis.table.weekly-range': '周漲幅',
+};

-import { fakeChartData } from '@/services/api';
+import { fakeChartData } from '../service';
 
 export default {
   namespace: 'chart',

-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 request from 'umi-request';
+
+export async function fakeChartData() {
+  return request('/api/fake_chart_data');
+}