From c9a09d85af38cf5b0dd5c52332265d3a7e748d3f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Sun, 17 Jun 2018 16:09:21 +0800 Subject: [PATCH] add analysis locale --- mock/chart.js | 36 ++-- src/components/GlobalHeader/RightContent.js | 10 +- src/components/PageHeader/index.d.ts | 1 + src/components/PageHeader/index.js | 2 +- src/components/PageHeader/index.md | 1 + src/locale/en-US.js | 63 +++++- src/locale/zh-CN.js | 43 +++- src/pages/Dashboard/Analysis.js | 222 ++++++++++++++++---- src/pages/layouts/PageHeaderLayout.js | 11 +- src/router.js | 3 + 10 files changed, 319 insertions(+), 73 deletions(-) diff --git a/mock/chart.js b/mock/chart.js index 55c8a412..fc094282 100644 --- a/mock/chart.js +++ b/mock/chart.js @@ -40,77 +40,77 @@ for (let i = 0; i < 50; i += 1) { } const salesTypeData = [ { - x: '家用电器', + x: 'House appliances', y: 4544, }, { - x: '食用酒水', + x: 'Drink & wine', y: 3321, }, { - x: '个护健康', + x: 'Health & care', y: 3113, }, { - x: '服饰箱包', + x: 'Clothing & bags', y: 2341, }, { - x: '母婴产品', + x: 'Mother-baby', y: 1231, }, { - x: '其他', + x: 'Other', y: 1231, }, ]; const salesTypeDataOnline = [ { - x: '家用电器', + x: 'House appliances', y: 244, }, { - x: '食用酒水', + x: 'Drink & wine', y: 321, }, { - x: '个护健康', + x: 'Health & care', y: 311, }, { - x: '服饰箱包', + x: 'Clothing & bags', y: 41, }, { - x: '母婴产品', + x: 'Mother-baby', y: 121, }, { - x: '其他', + x: 'Other', y: 111, }, ]; const salesTypeDataOffline = [ { - x: '家用电器', + x: 'House appliances', y: 99, }, { - x: '个护健康', + x: 'Drink & wine', y: 188, }, { - x: '服饰箱包', + x: 'Health & care', y: 344, }, { - x: '母婴产品', + x: 'Clothing & bags', y: 255, }, { - x: '其他', + x: 'Other', y: 65, }, ]; @@ -118,7 +118,7 @@ const salesTypeDataOffline = [ const offlineData = []; for (let i = 0; i < 10; i += 1) { offlineData.push({ - name: `门店${i}`, + name: `Stores ${i}`, cvr: Math.ceil(Math.random() * 9) / 10, }); } diff --git a/src/components/GlobalHeader/RightContent.js b/src/components/GlobalHeader/RightContent.js index 7b4f98c6..596bd3ea 100644 --- a/src/components/GlobalHeader/RightContent.js +++ b/src/components/GlobalHeader/RightContent.js @@ -1,4 +1,5 @@ import React, { PureComponent } from 'react'; +import { FormattedMessage } from 'react-intl'; import { Spin, Tag, Menu, Icon, Dropdown, Avatar, Tooltip } from 'antd'; import moment from 'moment'; import groupBy from 'lodash/groupBy'; @@ -51,13 +52,16 @@ export default class GlobalHeaderRight extends PureComponent { const menu = ( - 个人中心 + + - 设置 + + - 触发报错 + + diff --git a/src/components/PageHeader/index.d.ts b/src/components/PageHeader/index.d.ts index a1c356e7..22423ef9 100644 --- a/src/components/PageHeader/index.d.ts +++ b/src/components/PageHeader/index.d.ts @@ -15,6 +15,7 @@ export interface IPageHeaderProps { tabBarExtraContent?: React.ReactNode; linkElement?: React.ReactNode; style?: React.CSSProperties; + home?: React.ReactNode; } export default class PageHeader extends React.Component {} diff --git a/src/components/PageHeader/index.js b/src/components/PageHeader/index.js index a3a86143..29b0280a 100644 --- a/src/components/PageHeader/index.js +++ b/src/components/PageHeader/index.js @@ -105,7 +105,7 @@ export default class PageHeader extends PureComponent { { [linkElement === 'a' ? 'href' : 'to']: '/', }, - '首页' + this.props.home || 'Home' )} ); diff --git a/src/components/PageHeader/index.md b/src/components/PageHeader/index.md index 288f8b6c..4227e674 100644 --- a/src/components/PageHeader/index.md +++ b/src/components/PageHeader/index.md @@ -16,6 +16,7 @@ order: 11 | title | title 区域 | ReactNode | - | | logo | logo区域 | ReactNode | - | | action | 操作区，位于 title 行的行尾 | ReactNode | - | +| home | 默认的主页说明文字 | ReactNode | - | | content | 内容区 | ReactNode | - | | extraContent | 额外内容区，位于content的右侧 | ReactNode | - | | breadcrumbList | 面包屑数据，配置了此属性时 `routes` `params` `location` `breadcrumbNameMap` 无效 | array<{title: ReactNode, href?: string}> | - | diff --git a/src/locale/en-US.js b/src/locale/en-US.js index 38af6eab..aecec5c9 100644 --- a/src/locale/en-US.js +++ b/src/locale/en-US.js @@ -7,9 +7,70 @@ export default { data: appLocaleData, antd: antdEn, messages: { + 'menu.home': 'home', + 'menu.dashboard': 'Dashboard', + 'menu.dashboard.analysis': 'Analysis', + 'menu.dashboard.monitor': 'Monitor', + 'menu.dashboard.workplace': 'Workplace', + 'menu.form': 'Form', + 'menu.form.basicform': 'Basic Form', + 'menu.form.stepform': 'Step Form', + 'menu.form.advancedform': 'Advanced Form', + 'menu.list': 'List', + 'menu.list.searchlist': 'Search List', + 'menu.list.basiclist': 'Basic List', + 'menu.list.cardlist': 'Card List', + 'menu.list.searchlist.articles': 'Search List(articles)', + 'menu.list.searchlist.projects': 'Search List（projects）', + 'menu.list.searchlist.applications': 'Search List（applications）', + 'menu.profile': 'Profile', + 'menu.profile.basic': 'Basic', + 'menu.profile.advanced': 'Advanced', + 'menu.result': 'Result', + 'menu.result.success': 'Success', + 'menu.result.fail': 'Fail', + 'menu.exception': 'Exception', + 'menu.exception.not-permission': '403', + 'menu.exception.not-find': '404', + 'menu.exception.server-error': '500', + 'menu.exception.trigger': 'Trigger', + 'menu.account': 'Account', + 'menu.account.center': 'Account Center', + 'menu.account.settings': 'Account Settings', + 'menu.account.trigger': 'Trigger Error', 'app.home.introduce': 'introduce', 'app.analysis.test': 'Gongzhuan road No.{no} shop', - + 'app.analysis.introduce': 'Introduce', + 'app.analysis.total-sales': 'total sales', + 'app.analysis.day-sales': 'Day Sales', + 'app.analysis.visits': 'Visits', + 'app.analysis.visits-trend': 'Visits Trend', + 'app.analysis.visits-ranking': 'Visits Ranking', + 'app.analysis.day-visits': 'Day Visits', + 'app.analysis.week': 'week ratio', + 'app.analysis.day': 'day ratio', + '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', // ...enMessages, }, }; diff --git a/src/locale/zh-CN.js b/src/locale/zh-CN.js index b3eb7138..fcbbfaec 100644 --- a/src/locale/zh-CN.js +++ b/src/locale/zh-CN.js @@ -7,9 +7,8 @@ export default { data: appLocaleData, antd: antdZh, messages: { - 'app.home.introduce': '介绍', - 'app.analysis.test': '工专路 {no} 号店', - 'menu.dashboard': '仪表盘', + 'menu.home': '首页', + 'menu.dashboard': 'Dashboard', 'menu.dashboard.analysis': '分析页', 'menu.dashboard.monitor': '监控页', 'menu.dashboard.workplace': '工作台', @@ -23,13 +22,13 @@ export default { 'menu.list.cardlist': '卡片列表', 'menu.list.searchlist.articles': '搜索列表（文章）', 'menu.list.searchlist.projects': '搜索列表（项目）', - 'menu.list.searchlist.applications': '搜索列表（列表）', + 'menu.list.searchlist.applications': '搜索列表（应用）', 'menu.profile': '详情页', 'menu.profile.basic': '详情页', 'menu.profile.advanced': '详情页', 'menu.result': '结果页', 'menu.result.success': '成功页', - 'menu.result.fail': '成功页', + 'menu.result.fail': '失败页', 'menu.exception': '异常页', 'menu.exception.not-permission': '403', 'menu.exception.not-find': '404', @@ -38,6 +37,40 @@ export default { 'menu.account': '个人页', 'menu.account.center': '个人中心', 'menu.account.settings': '个人设置', + 'menu.account.trigger': '触发报错', + 'app.home.introduce': '介绍', + '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': '周涨幅', // ...zhMessages, }, }; diff --git a/src/pages/Dashboard/Analysis.js b/src/pages/Dashboard/Analysis.js index 42206e22..6e065692 100644 --- a/src/pages/Dashboard/Analysis.js +++ b/src/pages/Dashboard/Analysis.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import { connect } from 'dva'; -import { injectIntl } from 'react-intl'; +import { injectIntl, FormattedMessage } from 'react-intl'; import { Row, Col, @@ -65,6 +65,7 @@ class Analysis extends Component { rangePickerValue: getTimeDistance('year'), }; } + state = { salesType: 'all', currentTabKey: '', @@ -174,16 +175,16 @@ class Analysis extends Component {
, dataIndex: 'index', key: 'index', }, { - title: '搜索关键词', + title: ( + + ), dataIndex: 'keyword', key: 'keyword', render: text => {text}, }, { - title: '用户数', + title: , dataIndex: 'count', key: 'count', sorter: (a, b) => a.count - b.count, className: styles.alignRight, }, { - title: '周涨幅', + title: ( + + ), dataIndex: 'range', key: 'range', sorter: (a, b) => a.range - b.range, @@ -237,7 +245,12 @@ class Analysis extends Component { + } gap={2} total={`${data.cvr * 100}%`} theme={currentKey !== data.name && 'light'} @@ -272,23 +285,36 @@ class Analysis extends Component { + } action={ - + + } + > } loading={loading} total={() => 126560} - footer={} + footer={ + + } + value={`￥${numeral(12423).format('0,0')}`} + /> + } contentHeight={46} > - 周同比 + 12% - 日环比 + 11% @@ -296,15 +322,25 @@ class Analysis extends Component { } action={ - + + } + > } total={numeral(8846).format('0,0')} - footer={} + footer={ + + } + value={numeral(1234).format('0,0')} + /> + } contentHeight={46} > @@ -313,15 +349,28 @@ class Analysis extends Component { } action={ - + + } + > } total={numeral(6560).format('0,0')} - footer={} + footer={ + + } + value="60%" + /> + } contentHeight={46} > @@ -331,9 +380,18 @@ class Analysis extends Component { + } action={ - + + } + > } @@ -341,11 +399,11 @@ class Analysis extends Component { footer={
- 周同比 + 12% - 日环比 + 11%
@@ -360,16 +418,33 @@ class Analysis extends Component {
- + } + key="sales" + >
- + + } + data={salesData} + />
-

门店销售额排名

+

+ +

    {this.rankingListData.map((item, i) => (
  • @@ -383,16 +458,33 @@ class Analysis extends Component { - + } + key="views" + >
    - + + } + data={salesData} + />
    -

    门店访问量排名

    +

    + +

      {this.rankingListData.map((item, i) => (
    • @@ -415,7 +507,12 @@ class Analysis extends Component { + } extra={iconGroup} style={{ marginTop: 24 }} > @@ -424,8 +521,18 @@ class Analysis extends Component { - 搜索用户数 - + + + } + > @@ -439,7 +546,12 @@ class Analysis extends Component { + } total={2.7} status="down" subTotal={26.2} @@ -465,26 +577,45 @@ class Analysis extends Component { loading={loading} className={styles.salesCard} bordered={false} - title="销售额类别占比" + title={ + + } bodyStyle={{ padding: 24 }} extra={
      {iconGroup}
      - 全部渠道 - 线上 - 门店 + + + + + + + + +
      } style={{ marginTop: 24, minHeight: 509 }} > -

      销售额

      +

      + +

      } total={() => {salesPieData.reduce((pre, now) => now.y + pre, 0)}} data={salesPieData} valueFormat={value => {value}} @@ -509,7 +640,10 @@ class Analysis extends Component { , + y2: , + }} />
    diff --git a/src/pages/layouts/PageHeaderLayout.js b/src/pages/layouts/PageHeaderLayout.js index ebd24fa8..80ccade6 100644 --- a/src/pages/layouts/PageHeaderLayout.js +++ b/src/pages/layouts/PageHeaderLayout.js @@ -1,4 +1,5 @@ import React from 'react'; +import { FormattedMessage } from 'react-intl'; import { Link } from 'dva/router'; import PageHeader from '../../components/PageHeader'; import GridContent from './GridContent'; @@ -10,7 +11,15 @@ const PageHeaderLayout = ({ children, wrapperClassName, top, ...restProps }) => {top} {value => { - return ; + return ( + } + {...value} + key="pageheader" + {...restProps} + linkElement={Link} + /> + ); }} {children ? ( diff --git a/src/router.js b/src/router.js index 8c296afc..29896c04 100644 --- a/src/router.js +++ b/src/router.js @@ -18,6 +18,9 @@ dynamic.setDefaultLoadingComponent(() => { }); function getLang() { + if (window) { + return 'en-US'; + } return (window.localStorage && localStorage.getItem('locale')) || (navigator.language || navigator.browserLanguage).toLowerCase() === 'en-us' ? 'en-US' -- GitLab