From a6fee6b72b0e9b6fae15d01068314d52070d94c9 Mon Sep 17 00:00:00 2001 From: JerryYu2014 <648542313@qq.com> Date: Sun, 28 Apr 2019 20:02:39 +0800 Subject: [PATCH 01/10] Update login.js (#4103) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 解决在组件componentDidMount()方法中调用多个接口失败时（如：401情况）返回登录界面的query string 中会递归叠加多个redirect参数的问题；解决代码导致 lint 挂了的问题。 --- src/models/login.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/models/login.js b/src/models/login.js index b5d226aa..5d129e17 100644 --- a/src/models/login.js +++ b/src/models/login.js @@ -53,8 +53,9 @@ export default { }, }); reloadAuthorized(); + const { redirect } = getPageQuery(); // redirect - if (window.location.pathname !== '/user/login') { + if (window.location.pathname !== '/user/login' && !redirect) { yield put( routerRedux.replace({ pathname: '/user/login', From 78c07fc9109d06de8893bcff07a6cc6fedf65da8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Sun, 28 Apr 2019 20:11:36 +0800 Subject: [PATCH 02/10] up bizcharts --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 3dbc8afb..da5c1e9f 100644 --- a/package.json +++ b/package.json @@ -53,7 +53,7 @@ "dependencies": { "@antv/data-set": "^0.10.1", "antd": "^3.16.1", - "bizcharts": "^3.4.3", + "bizcharts": "3.5.2-beta.1", "bizcharts-plugin-slider": "^2.1.1-beta.1", "classnames": "^2.2.6", "dva": "^2.4.1", From 29c23b1f5cafa9f77d3047a618e79d2033b973b8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Sun, 28 Apr 2019 20:52:28 +0800 Subject: [PATCH 03/10] Add Loading (#4055) * add loading in html * add loading * rm console * add ResizeObserver --- docker/docker-compose.yml | 6 +- package.json | 1 + src/components/Charts/Bar/index.js | 29 +++++- src/components/Charts/Pie/index.js | 33 +++++-- src/pages/Dashboard/Analysis.js | 11 ++- src/pages/document.ejs | 153 ++++++++++++++++++++++++++++- 6 files changed, 215 insertions(+), 18 deletions(-) diff --git a/docker/docker-compose.yml b/docker/docker-compose.yml index d0556006..13e12db8 100644 --- a/docker/docker-compose.yml +++ b/docker/docker-compose.yml @@ -1,9 +1,9 @@ -version: "3.5" +version: '3.5' services: ant-design-pro_build: build: ../ - container_name: "ant-design-pro_build" + container_name: 'ant-design-pro_build' volumes: - dist:/usr/src/app/dist @@ -11,7 +11,7 @@ services: image: nginx ports: - 80:80 - container_name: "ant-design-pro_web" + container_name: 'ant-design-pro_web' restart: unless-stopped volumes: - dist:/usr/share/nginx/html:ro diff --git a/package.json b/package.json index da5c1e9f..2032a86a 100644 --- a/package.json +++ b/package.json @@ -79,6 +79,7 @@ "react-dom": "^16.7.0", "react-fittext": "^1.0.0", "react-media": "^1.9.2", + "resize-observer-polyfill": "^1.5.1", "umi": "^2.4.4", "umi-plugin-react": "^1.7.2", "umi-request": "^1.0.5" diff --git a/src/components/Charts/Bar/index.js b/src/components/Charts/Bar/index.js index f0cb65ff..77176df2 100644 --- a/src/components/Charts/Bar/index.js +++ b/src/components/Charts/Bar/index.js @@ -2,12 +2,13 @@ import React, { Component } from 'react'; import { Chart, Axis, Tooltip, Geom } from 'bizcharts'; import Debounce from 'lodash-decorators/debounce'; import Bind from 'lodash-decorators/bind'; -import autoHeight from '../autoHeight'; +import ResizeObserver from 'resize-observer-polyfill'; import styles from '../index.less'; -@autoHeight() class Bar extends Component { state = { + width: 0, + height: 0, autoHideXLabels: false, }; @@ -27,6 +28,24 @@ class Bar extends Component { this.node = n; }; + resizeObserver() { + const ro = new ResizeObserver(entries => { + const { width, height } = entries[0].contentRect; + this.setState((preState, { hasLegend }) => { + if (preState.width !== width || preState.height !== height) { + return { + width: width - (hasLegend ? 240 : 0), + height, + }; + } + return null; + }); + }); + if (this.root) { + ro.observe(this.root); + } + } + @Bind() @Debounce(400) resize() { @@ -56,7 +75,7 @@ class Bar extends Component { render() { const { - height, + height: propsHeight, title, forceFit = true, data, @@ -82,13 +101,15 @@ class Bar extends Component { value: y, }), ]; - + const { height: stateHeight, width } = this.state; + const height = propsHeight || stateHeight; return (
{title &&

{title}

} { + const { width, height } = entries[0].contentRect; + this.setState((preState, { hasLegend }) => { + if (preState.width !== width || preState.height !== height) { + return { + width: width - (hasLegend ? 240 : 0), + height, + }; + } + return null; + }); + }); + if (this.root) { + ro.observe(this.root); + } + } + // for window resize auto responsive legend @Bind() @Debounce(300) @@ -125,7 +144,6 @@ class Pie extends Component { className, style, height, - forceFit = true, percent, color, inner = 0.75, @@ -134,7 +152,7 @@ class Pie extends Component { lineWidth = 1, } = this.props; - const { legendData, legendBlock } = this.state; + const { legendData, height: StateHeight, width, legendBlock } = this.state; const pieClassName = classNames(styles.pie, className, { [styles.hasLegend]: !!hasLegend, [styles.legendBlock]: legendBlock, @@ -211,9 +229,9 @@ class Pie extends Component {
- {hasLegend && (
    {legendData.map((item, i) => ( diff --git a/src/pages/Dashboard/Analysis.js b/src/pages/Dashboard/Analysis.js index 0d222cc3..5673ca37 100644 --- a/src/pages/Dashboard/Analysis.js +++ b/src/pages/Dashboard/Analysis.js @@ -18,6 +18,7 @@ const OfflineData = React.lazy(() => import('./OfflineData')); })) class Analysis extends Component { state = { + loading: true, salesType: 'all', currentTabKey: '', rangePickerValue: getTimeDistance('year'), @@ -30,6 +31,11 @@ class Analysis extends Component { type: 'chart/fetch', }); }); + setTimeout(() => { + this.setState({ + loading: false, + }); + }, 2000); } componentWillUnmount() { @@ -90,8 +96,9 @@ class Analysis extends Component { }; render() { - const { rangePickerValue, salesType, currentTabKey } = this.state; - const { chart, loading } = this.props; + const { rangePickerValue, salesType, currentTabKey, loading: stateLoading } = this.state; + const { chart, loading: propsLoading } = this.props; + const loading = stateLoading || propsLoading; const { visitData, visitData2, diff --git a/src/pages/document.ejs b/src/pages/document.ejs index cf09effa..042c96ab 100644 --- a/src/pages/document.ejs +++ b/src/pages/document.ejs @@ -12,6 +12,157 @@ -
    +
    + +
    +
    + +
    +
    +
    From a2cca354e4cea8d222087e03469ebc8e10c99235 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Sun, 28 Apr 2019 20:58:32 +0800 Subject: [PATCH 04/10] feat: remove auto width --- src/components/Charts/Bar/index.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/src/components/Charts/Bar/index.js b/src/components/Charts/Bar/index.js index 77176df2..f898a122 100644 --- a/src/components/Charts/Bar/index.js +++ b/src/components/Charts/Bar/index.js @@ -7,7 +7,6 @@ import styles from '../index.less'; class Bar extends Component { state = { - width: 0, height: 0, autoHideXLabels: false, }; @@ -31,10 +30,9 @@ class Bar extends Component { resizeObserver() { const ro = new ResizeObserver(entries => { const { width, height } = entries[0].contentRect; - this.setState((preState, { hasLegend }) => { + this.setState(preState => { if (preState.width !== width || preState.height !== height) { return { - width: width - (hasLegend ? 240 : 0), height, }; } @@ -101,7 +99,7 @@ class Bar extends Component { value: y, }), ]; - const { height: stateHeight, width } = this.state; + const { height: stateHeight } = this.state; const height = propsHeight || stateHeight; return (
    @@ -109,7 +107,6 @@ class Bar extends Component { {title &&

    {title}

    } Date: Sun, 28 Apr 2019 21:03:29 +0800 Subject: [PATCH 05/10] remove auto width --- src/components/Charts/Pie/index.js | 85 ++++++++++++++++-------------- 1 file changed, 44 insertions(+), 41 deletions(-) diff --git a/src/components/Charts/Pie/index.js b/src/components/Charts/Pie/index.js index acd34231..5f80d747 100644 --- a/src/components/Charts/Pie/index.js +++ b/src/components/Charts/Pie/index.js @@ -12,7 +12,6 @@ import styles from './index.less'; /* eslint react/no-danger:0 */ class Pie extends Component { state = { - width: 0, height: 0, legendData: [], legendBlock: false, @@ -96,19 +95,18 @@ class Pie extends Component { resizeObserver() { const ro = new ResizeObserver(entries => { - const { width, height } = entries[0].contentRect; - this.setState((preState, { hasLegend }) => { - if (preState.width !== width || preState.height !== height) { + const { height } = entries[0].contentRect; + this.setState(preState => { + if (preState.height !== height) { return { - width: width - (hasLegend ? 240 : 0), height, }; } return null; }); }); - if (this.root) { - ro.observe(this.root); + if (this.chartDom) { + ro.observe(this.chartDom); } } @@ -152,7 +150,7 @@ class Pie extends Component { lineWidth = 1, } = this.props; - const { legendData, height: StateHeight, width, legendBlock } = this.state; + const { legendData, height: stateHeight, legendBlock } = this.state; const pieClassName = classNames(styles.pie, className, { [styles.hasLegend]: !!hasLegend, [styles.legendBlock]: legendBlock, @@ -225,40 +223,45 @@ class Pie extends Component { return (
    - -
    - - {!!tooltip && } - - - +
    { + this.chartDom = ref; + }} + > + +
    + + {!!tooltip && } + + + - {(subTitle || total) && ( -
    - {subTitle &&

    {subTitle}

    } - {/* eslint-disable-next-line */} - {total && ( -
    {typeof total === 'function' ? total() : total}
    - )} -
    - )} -
    -     + {(subTitle || total) && ( +
    + {subTitle &&

    {subTitle}

    } + {/* eslint-disable-next-line */} + {total && ( +
    {typeof total === 'function' ? total() : total}
    + )} +
    + )} +
    + +
    {hasLegend && (
      {legendData.map((item, i) => ( From 257f0979526be5ea84a57e5154f5e4e801469f55 Mon Sep 17 00:00:00 2001 From: Hilmi Erdem KEREN Date: Tue, 30 Apr 2019 10:34:42 +0300 Subject: [PATCH 06/10] Replaces this.main.offsetWidth as 'offsetWidth' --- src/pages/Account/Settings/Info.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Account/Settings/Info.js b/src/pages/Account/Settings/Info.js index c5d4ef76..799b7b87 100644 --- a/src/pages/Account/Settings/Info.js +++ b/src/pages/Account/Settings/Info.js @@ -81,7 +81,7 @@ class Info extends Component { requestAnimationFrame(() => { let mode = 'inline'; const { offsetWidth } = this.main; - if (this.main.offsetWidth < 641 && offsetWidth > 400) { + if (offsetWidth < 641 && offsetWidth > 400) { mode = 'horizontal'; } if (window.innerWidth < 768 && offsetWidth > 400) { From 03db6495c8cae8dda5d1084ef68d48602b4d5d18 Mon Sep 17 00:00:00 2001 From: Hilmi Erdem KEREN Date: Thu, 2 May 2019 16:26:58 +0300 Subject: [PATCH 07/10] requestAnimationFrame optimization (#4115) * requestAnimationFrame optimization Optimizes animation by doing the following changes: - Moves offsetWidth, innerWidth like expensive calculations out of requestAnimationFrame - Adds menu mode change control before requesting the animation frame * fix: Uses object destructuring to read state property --- src/pages/Account/Settings/Info.js | 30 +++++++++++++++++------------- 1 file changed, 17 insertions(+), 13 deletions(-) diff --git a/src/pages/Account/Settings/Info.js b/src/pages/Account/Settings/Info.js index 799b7b87..2415de38 100644 --- a/src/pages/Account/Settings/Info.js +++ b/src/pages/Account/Settings/Info.js @@ -78,19 +78,23 @@ class Info extends Component { if (!this.main) { return; } - requestAnimationFrame(() => { - let mode = 'inline'; - const { offsetWidth } = this.main; - if (offsetWidth < 641 && offsetWidth > 400) { - mode = 'horizontal'; - } - if (window.innerWidth < 768 && offsetWidth > 400) { - mode = 'horizontal'; - } - this.setState({ - mode, - }); - }); + + const { mode: currentMode } = this.state; + + let mode = 'inline'; + const { offsetWidth } = this.main; + + if (offsetWidth > 400 && offsetWidth < 641) { + mode = 'horizontal'; + } + + if (window.innerWidth < 768 && offsetWidth > 400) { + mode = 'horizontal'; + } + + if (mode !== currentMode) { + requestAnimationFrame(() => this.setState({ mode })); + } }; render() { From a731ca8b38ddf6218f52cf688298a94198b83a6a Mon Sep 17 00:00:00 2001 From: billfeller Date: Sun, 5 May 2019 15:55:27 +0800 Subject: [PATCH 08/10] fix: set engines>=10.0.0 to use Promise.finally() method --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 2032a86a..f13666dd 100644 --- a/package.json +++ b/package.json @@ -132,7 +132,7 @@ "puppeteer": "^1.12.1" }, "engines": { - "node": ">=8.0.0" + "node": ">=10.0.0" }, "checkFiles": [ "src/**/*.js*", From 0d35ae24f4bcbd7acee8819095a035bf4d1f5354 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Mon, 6 May 2019 15:32:06 +0800 Subject: [PATCH 09/10] fix #4119 ,use row flex --- src/pages/Dashboard/Analysis.js | 2 +- src/pages/Dashboard/Analysis.less | 7 +------ 2 files changed, 2 insertions(+), 7 deletions(-) diff --git a/src/pages/Dashboard/Analysis.js b/src/pages/Dashboard/Analysis.js index 5673ca37..609bf199 100644 --- a/src/pages/Dashboard/Analysis.js +++ b/src/pages/Dashboard/Analysis.js @@ -149,7 +149,7 @@ class Analysis extends Component { />
      - + Date: Mon, 6 May 2019 16:15:07 +0800 Subject: [PATCH 10/10] Update husky to version 2.2.0 (#4117) --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index f13666dd..75882a8b 100644 --- a/package.json +++ b/package.json @@ -106,7 +106,7 @@ "eslint-plugin-markdown": "^1.0.0", "eslint-plugin-react": "^7.12.4", "gh-pages": "^2.0.1", - "husky": "^1.3.1", + "husky": "^2.2.0", "jest-puppeteer": "^4.1.0", "jsdom-global": "^3.0.2", "less": "^3.9.0",