From 645f7daf496cc29e6bf16b09825b2f11dbf05c5b Mon Sep 17 00:00:00 2001 From: jim Date: Fri, 23 Mar 2018 13:35:11 +0800 Subject: [PATCH] support perttier --- .eslintrc | 44 +-- .gitignore | 1 - .prettierignore | 2 + .prettierrc | 11 + .roadhogrc.mock.js | 96 ++++--- .stylelintrc | 3 +- .vscode/settings.json | 3 + .webpackrc.js | 2 +- mock/api.js | 15 +- mock/chart.js | 10 +- mock/rule.js | 14 +- package.json | 13 +- src/common/menu.js | 272 ++++++++++-------- src/common/router.js | 43 +-- src/components/ActiveChart/index.js | 2 +- src/components/Authorized/AuthorizedRoute.js | 22 +- .../Authorized/CheckPermissions.test.js | 16 +- src/components/Authorized/PromiseRender.js | 2 +- src/components/Authorized/Secured.js | 6 +- src/components/Authorized/index.d.ts | 11 +- src/components/Authorized/index.js | 2 +- src/components/AvatarList/index.d.ts | 4 +- src/components/AvatarList/index.js | 18 +- src/components/AvatarList/index.less | 2 +- src/components/Charts/Bar/index.d.ts | 2 +- src/components/Charts/Bar/index.js | 4 +- src/components/Charts/ChartCard/index.d.ts | 2 +- src/components/Charts/ChartCard/index.js | 12 +- src/components/Charts/ChartCard/index.less | 2 +- src/components/Charts/Field/index.d.ts | 2 +- src/components/Charts/Field/index.less | 2 +- src/components/Charts/Gauge/index.d.ts | 2 +- src/components/Charts/Gauge/index.js | 2 +- src/components/Charts/MiniProgress/index.d.ts | 7 +- src/components/Charts/MiniProgress/index.js | 15 +- src/components/Charts/MiniProgress/index.less | 4 +- src/components/Charts/Pie/index.js | 12 +- src/components/Charts/Pie/index.less | 4 +- src/components/Charts/Radar/index.d.ts | 2 +- src/components/Charts/Radar/index.js | 19 +- src/components/Charts/Radar/index.less | 2 +- src/components/Charts/TagCloud/index.d.ts | 2 +- src/components/Charts/TagCloud/index.js | 4 +- .../Charts/TimelineChart/index.d.ts | 7 +- src/components/Charts/TimelineChart/index.js | 2 +- src/components/Charts/WaterWave/index.less | 4 +- src/components/Charts/autoHeight.js | 4 +- src/components/CountDown/index.d.ts | 2 +- src/components/CountDown/index.js | 61 ++-- .../DescriptionList/DescriptionList.js | 12 +- src/components/DescriptionList/index.d.ts | 5 +- src/components/DescriptionList/index.less | 9 +- src/components/EditableItem/index.js | 44 +-- src/components/EditableItem/index.less | 2 +- src/components/EditableLinkGroup/index.js | 14 +- src/components/EditableLinkGroup/index.less | 2 +- src/components/Ellipsis/index.js | 10 +- src/components/Exception/index.d.ts | 4 +- src/components/Exception/index.js | 12 +- src/components/Exception/index.less | 4 +- src/components/FooterToolbar/index.d.ts | 5 +- src/components/FooterToolbar/index.js | 5 +- src/components/FooterToolbar/index.less | 6 +- src/components/GlobalFooter/index.d.ts | 7 +- src/components/GlobalFooter/index.js | 24 +- src/components/GlobalFooter/index.less | 4 +- src/components/GlobalHeader/index.js | 70 +++-- src/components/GlobalHeader/index.less | 10 +- src/components/HeaderSearch/index.d.ts | 5 +- src/components/HeaderSearch/index.js | 21 +- src/components/HeaderSearch/index.less | 4 +- src/components/Login/LoginItem.js | 6 +- src/components/Login/index.d.ts | 4 +- src/components/Login/index.js | 56 ++-- src/components/Login/index.less | 3 +- src/components/Login/map.js | 42 ++- src/components/NoticeIcon/NoticeIconTab.d.ts | 5 +- src/components/NoticeIcon/NoticeList.js | 15 +- src/components/NoticeIcon/NoticeList.less | 8 +- src/components/NoticeIcon/index.js | 14 +- src/components/NoticeIcon/index.less | 4 +- src/components/NumberInfo/index.d.ts | 5 +- src/components/NumberInfo/index.js | 26 +- src/components/NumberInfo/index.less | 4 +- src/components/PageHeader/index.js | 37 +-- src/components/PageHeader/index.less | 24 +- src/components/PageHeader/index.test.js | 18 +- src/components/Result/index.js | 8 +- src/components/Result/index.less | 2 +- src/components/SiderMenu/SiderMenu.js | 45 ++- src/components/SiderMenu/SilderMenu.test.js | 20 +- src/components/SiderMenu/index.js | 11 +- src/components/SiderMenu/index.less | 9 +- src/components/StandardFormRow/index.js | 16 +- src/components/StandardFormRow/index.less | 2 +- src/components/StandardTable/index.js | 34 +-- src/components/StandardTable/index.less | 2 +- src/components/TagSelect/TagSelectOption.d.ts | 5 +- src/components/TagSelect/index.js | 53 ++-- src/components/TagSelect/index.less | 6 +- src/components/Trend/index.js | 22 +- src/components/Trend/index.less | 2 +- src/components/_utils/pathTools.test.js | 5 +- src/index.ejs | 2 +- src/index.js | 2 +- src/layouts/BasicLayout.js | 107 +++---- src/layouts/PageHeaderLayout.less | 2 +- src/layouts/UserLayout.js | 54 ++-- src/layouts/UserLayout.less | 2 +- src/models/index.js | 5 +- src/router.js | 5 +- src/routes/Dashboard/Analysis.js | 8 +- src/routes/Dashboard/Analysis.less | 4 +- src/routes/Dashboard/Monitor.js | 8 +- src/routes/Dashboard/Monitor.less | 6 +- src/routes/Dashboard/Workplace.js | 110 ++++--- src/routes/Dashboard/Workplace.less | 8 +- src/routes/Exception/style.less | 2 +- src/routes/Exception/triggerException.js | 2 +- src/routes/Forms/AdvancedForm.js | 68 +++-- src/routes/Forms/BasicForm.js | 122 ++++---- src/routes/Forms/StepForm/Step1.js | 50 ++-- src/routes/Forms/StepForm/Step2.js | 50 ++-- src/routes/Forms/StepForm/Step3.js | 24 +- src/routes/Forms/StepForm/index.js | 35 ++- src/routes/Forms/StepForm/style.less | 4 +- src/routes/Forms/TableForm.js | 169 +++++------ src/routes/Forms/style.less | 4 +- src/routes/List/Applications.js | 62 ++-- src/routes/List/Applications.less | 4 +- src/routes/List/Articles.js | 71 +++-- src/routes/List/Articles.less | 4 +- src/routes/List/BasicList.js | 25 +- src/routes/List/BasicList.less | 4 +- src/routes/List/CardList.js | 49 ++-- src/routes/List/CardList.less | 4 +- src/routes/List/List.js | 43 ++- src/routes/List/Projects.js | 2 +- src/routes/List/Projects.less | 4 +- src/routes/List/TableList.js | 121 ++++---- src/routes/List/TableList.less | 4 +- src/routes/Profile/AdvancedProfile.js | 226 +++++++++------ src/routes/Profile/AdvancedProfile.less | 2 +- src/routes/Profile/BasicProfile.js | 6 +- src/routes/Profile/BasicProfile.less | 2 +- src/routes/Result/Error.js | 17 +- src/routes/Result/Success.js | 22 +- src/routes/User/Login.js | 50 ++-- src/routes/User/Login.less | 4 +- src/routes/User/Register.js | 36 +-- src/routes/User/Register.less | 2 +- src/routes/User/RegisterResult.js | 10 +- src/utils/request.js | 4 +- src/utils/utils.js | 34 +-- src/utils/utils.less | 2 +- tests/run-tests.js | 10 +- 156 files changed, 1696 insertions(+), 1568 deletions(-) create mode 100644 .prettierignore create mode 100644 .prettierrc create mode 100644 .vscode/settings.json diff --git a/.eslintrc b/.eslintrc index db4c05c4..c5dda4d7 100755 --- a/.eslintrc +++ b/.eslintrc @@ -1,7 +1,6 @@ { "parser": "babel-eslint", - "extends": "airbnb", - "plugins": ["compat"], + "extends": ["airbnb", "prettier"], "env": { "browser": true, "node": true, @@ -20,15 +19,18 @@ "react/jsx-no-bind": [0], "react/prop-types": [0], "react/prefer-stateless-function": [0], - "react/jsx-wrap-multilines": ["error", { - "declaration": "parens-new-line", - "assignment": "parens-new-line", - "return": "parens-new-line", - "arrow": "parens-new-line", - "condition": "parens-new-line", - "logical": "parens-new-line", - "prop": "ignore" - }], + "react/jsx-wrap-multilines": [ + "error", + { + "declaration": "parens-new-line", + "assignment": "parens-new-line", + "return": "parens-new-line", + "arrow": "parens-new-line", + "condition": "parens-new-line", + "logical": "parens-new-line", + "prop": "ignore" + } + ], "no-else-return": [0], "no-restricted-syntax": [0], "import/no-extraneous-dependencies": [0], @@ -43,18 +45,20 @@ "no-bitwise": [0], "no-cond-assign": [0], "import/no-unresolved": [0], - "comma-dangle": ["error", { - "arrays": "always-multiline", - "objects": "always-multiline", - "imports": "always-multiline", - "exports": "always-multiline", - "functions": "ignore" - }], + "comma-dangle": [ + "error", + { + "arrays": "always-multiline", + "objects": "always-multiline", + "imports": "always-multiline", + "exports": "always-multiline", + "functions": "ignore" + } + ], "object-curly-newline": [0], "function-paren-newline": [0], "no-restricted-globals": [0], - "require-yield": [1], - "compat/compat": "error" + "require-yield": [1] }, "parserOptions": { "ecmaFeatures": { diff --git a/.gitignore b/.gitignore index 409be881..aa3fce58 100755 --- a/.gitignore +++ b/.gitignore @@ -20,4 +20,3 @@ yarn.lock package-lock.json *bak jsconfig.json -.prettierrc diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 00000000..a28adee0 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,2 @@ +**/*.md +**/*.svg \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 00000000..0cc0de65 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,11 @@ +{ + "singleQuote": true, + "trailingComma": "es5", + "printWidth": 100, + "overrides": [ + { + "files": ".prettierrc", + "options": { "parser": "json" } + } + ] +} diff --git a/.roadhogrc.mock.js b/.roadhogrc.mock.js index 284f3161..af60fec1 100644 --- a/.roadhogrc.mock.js +++ b/.roadhogrc.mock.js @@ -14,7 +14,7 @@ const noProxy = process.env.NO_PROXY === 'true'; const proxy = { // 支持值为 Object 和 Array 'GET /api/currentUser': { - $desc: "获取当前用户接口", + $desc: '获取当前用户接口', $params: { pageSize: { desc: '分页', @@ -29,22 +29,26 @@ const proxy = { }, }, // GET POST 可省略 - 'GET /api/users': [{ - key: '1', - name: 'John Brown', - age: 32, - address: 'New York No. 1 Lake Park', - }, { - key: '2', - name: 'Jim Green', - age: 42, - address: 'London No. 1 Lake Park', - }, { - key: '3', - name: 'Joe Black', - age: 32, - address: 'Sidney No. 1 Lake Park', - }], + 'GET /api/users': [ + { + key: '1', + name: 'John Brown', + age: 32, + address: 'New York No. 1 Lake Park', + }, + { + key: '2', + name: 'Jim Green', + age: 42, + address: 'London No. 1 Lake Park', + }, + { + key: '3', + name: 'Joe Black', + age: 32, + address: 'Sidney No. 1 Lake Park', + }, + ], 'GET /api/project/notice': getNotice, 'GET /api/activities': getActivities, 'GET /api/rule': getRule, @@ -61,7 +65,7 @@ const proxy = { res.send({ message: 'Ok' }); }, 'GET /api/tags': mockjs.mock({ - 'list|100': [{ name: '@city', 'value|1-100': 150, 'type|0-2': 1 }] + 'list|100': [{ name: '@city', 'value|1-100': 150, 'type|0-2': 1 }], }), 'GET /api/fake_list': getFakeList, 'GET /api/fake_chart_data': getFakeChartData, @@ -69,26 +73,26 @@ const proxy = { 'GET /api/profile/advanced': getProfileAdvancedData, 'POST /api/login/account': (req, res) => { const { password, userName, type } = req.body; - if(password === '888888' && userName === 'admin'){ + if (password === '888888' && userName === 'admin') { res.send({ status: 'ok', type, - currentAuthority: 'admin' + currentAuthority: 'admin', }); - return ; + return; } - if(password === '123456' && userName === 'user'){ + if (password === '123456' && userName === 'user') { res.send({ status: 'ok', type, - currentAuthority: 'user' + currentAuthority: 'user', }); - return ; + return; } res.send({ status: 'error', type, - currentAuthority: 'guest' + currentAuthority: 'guest', }); }, 'POST /api/register': (req, res) => { @@ -97,40 +101,40 @@ const proxy = { 'GET /api/notices': getNotices, 'GET /api/500': (req, res) => { res.status(500).send({ - "timestamp": 1513932555104, - "status": 500, - "error": "error", - "message": "error", - "path": "/base/category/list" + timestamp: 1513932555104, + status: 500, + error: 'error', + message: 'error', + path: '/base/category/list', }); }, 'GET /api/404': (req, res) => { res.status(404).send({ - "timestamp": 1513932643431, - "status": 404, - "error": "Not Found", - "message": "No message available", - "path": "/base/category/list/2121212" + timestamp: 1513932643431, + status: 404, + error: 'Not Found', + message: 'No message available', + path: '/base/category/list/2121212', }); }, 'GET /api/403': (req, res) => { res.status(403).send({ - "timestamp": 1513932555104, - "status": 403, - "error": "Unauthorized", - "message": "Unauthorized", - "path": "/base/category/list" + timestamp: 1513932555104, + status: 403, + error: 'Unauthorized', + message: 'Unauthorized', + path: '/base/category/list', }); }, 'GET /api/401': (req, res) => { res.status(401).send({ - "timestamp": 1513932555104, - "status": 401, - "error": "Unauthorized", - "message": "Unauthorized", - "path": "/base/category/list" + timestamp: 1513932555104, + status: 401, + error: 'Unauthorized', + message: 'Unauthorized', + path: '/base/category/list', }); }, }; -export default noProxy ? {} : delay(proxy, 1000); +export default (noProxy ? {} : delay(proxy, 1000)); diff --git a/.stylelintrc b/.stylelintrc index 10271529..a883e81c 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,5 +1,5 @@ { - "extends": "stylelint-config-standard", + "extends": ["stylelint-config-standard", "stylelint-config-prettier"], "rules": { "selector-pseudo-class-no-unknown": null, "shorthand-property-no-redundant-values": null, @@ -17,6 +17,7 @@ "number-no-trailing-zeros": null, "rule-empty-line-before": null, "selector-combinator-space-after": null, + "selector-descendant-combinator-no-non-space": null, "selector-list-comma-newline-after": null, "selector-pseudo-element-colon-notation": null, "unit-no-unknown": null, diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..ad92582b --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "editor.formatOnSave": true +} diff --git a/.webpackrc.js b/.webpackrc.js index b562f775..db3421fd 100755 --- a/.webpackrc.js +++ b/.webpackrc.js @@ -12,7 +12,7 @@ export default { }, }, alias: { - 'components': path.resolve(__dirname, 'src/components/'), + components: path.resolve(__dirname, 'src/components/'), }, ignoreMomentLocale: true, theme: './src/theme.js', diff --git a/mock/api.js b/mock/api.js index 969c1518..a274afb9 100644 --- a/mock/api.js +++ b/mock/api.js @@ -69,21 +69,23 @@ export function fakeList(count) { owner: user[i % 10], title: titles[i % 8], avatar: avatars[i % 8], - cover: parseInt(i / 4, 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)], + cover: parseInt(i / 4, 10) % 2 === 0 ? covers[i % 4] : covers[3 - i % 4], status: ['active', 'exception', 'normal'][i % 3], percent: Math.ceil(Math.random() * 50) + 50, logo: avatars[i % 8], href: 'https://ant.design', - updatedAt: new Date(new Date().getTime() - (1000 * 60 * 60 * 2 * i)), - createdAt: new Date(new Date().getTime() - (1000 * 60 * 60 * 2 * i)), + updatedAt: new Date(new Date().getTime() - 1000 * 60 * 60 * 2 * i), + createdAt: new Date(new Date().getTime() - 1000 * 60 * 60 * 2 * i), subDescription: desc[i % 5], - description: '在中台产品的研发过程中,会出现不同的设计规范和实现方式,但其中往往存在很多类似的页面和组件,这些类似的组件会被抽离成一套标准规范。', + description: + '在中台产品的研发过程中,会出现不同的设计规范和实现方式,但其中往往存在很多类似的页面和组件,这些类似的组件会被抽离成一套标准规范。', activeUser: Math.ceil(Math.random() * 100000) + 100000, newUser: Math.ceil(Math.random() * 1000) + 1000, star: Math.ceil(Math.random() * 100) + 100, like: Math.ceil(Math.random() * 100) + 100, message: Math.ceil(Math.random() * 10) + 10, - content: '段落示意:蚂蚁金服设计平台 ant.design,用最小的工作量,无缝接入蚂蚁金服生态,提供跨越设计与开发的体验解决方案。蚂蚁金服设计平台 ant.design,用最小的工作量,无缝接入蚂蚁金服生态,提供跨越设计与开发的体验解决方案。', + content: + '段落示意:蚂蚁金服设计平台 ant.design,用最小的工作量,无缝接入蚂蚁金服生态,提供跨越设计与开发的体验解决方案。蚂蚁金服设计平台 ant.design,用最小的工作量,无缝接入蚂蚁金服生态,提供跨越设计与开发的体验解决方案。', members: [ { avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', @@ -112,7 +114,7 @@ export function getFakeList(req, res, u) { const params = parse(url, true).query; - const count = (params.count * 1) || 20; + const count = params.count * 1 || 20; const result = fakeList(count); @@ -287,7 +289,6 @@ export const getActivities = [ }, ]; - export default { getNotice, getActivities, diff --git a/mock/chart.js b/mock/chart.js index e1673347..55c8a412 100644 --- a/mock/chart.js +++ b/mock/chart.js @@ -7,7 +7,7 @@ const beginDay = new Date().getTime(); const fakeY = [7, 5, 4, 2, 4, 7, 5, 6, 5, 9, 6, 3, 1, 5, 3, 6, 5]; for (let i = 0; i < fakeY.length; i += 1) { visitData.push({ - x: moment(new Date(beginDay + (1000 * 60 * 60 * 24 * i))).format('YYYY-MM-DD'), + x: moment(new Date(beginDay + 1000 * 60 * 60 * 24 * i)).format('YYYY-MM-DD'), y: fakeY[i], }); } @@ -16,7 +16,7 @@ const visitData2 = []; const fakeY2 = [1, 6, 4, 8, 3, 7, 2]; for (let i = 0; i < fakeY2.length; i += 1) { visitData2.push({ - x: moment(new Date(beginDay + (1000 * 60 * 60 * 24 * i))).format('YYYY-MM-DD'), + x: moment(new Date(beginDay + 1000 * 60 * 60 * 24 * i)).format('YYYY-MM-DD'), y: fakeY2[i], }); } @@ -125,7 +125,7 @@ for (let i = 0; i < 10; i += 1) { const offlineChartData = []; for (let i = 0; i < 20; i += 1) { offlineChartData.push({ - x: (new Date().getTime()) + (1000 * 60 * 30 * i), + x: new Date().getTime() + 1000 * 60 * 30 * i, y1: Math.floor(Math.random() * 100) + 10, y2: Math.floor(Math.random() * 100) + 10, }); @@ -167,8 +167,8 @@ const radarTitleMap = { contribute: '贡献', hot: '热度', }; -radarOriginData.forEach((item) => { - Object.keys(item).forEach((key) => { +radarOriginData.forEach(item => { + Object.keys(item).forEach(key => { if (key !== 'name') { radarData.push({ name: item.name, diff --git a/mock/rule.js b/mock/rule.js index 78fb95d1..e89b9496 100644 --- a/mock/rule.js +++ b/mock/rule.js @@ -5,9 +5,12 @@ let tableListDataSource = []; for (let i = 0; i < 46; i += 1) { tableListDataSource.push({ key: i, - disabled: ((i % 6) === 0), + disabled: i % 6 === 0, href: 'https://ant.design', - avatar: ['https://gw.alipayobjects.com/zos/rmsportal/eeHMaZBwmTvLdIwMfBpg.png', 'https://gw.alipayobjects.com/zos/rmsportal/udxAbMEhpwthVVcjLXik.png'][i % 2], + avatar: [ + 'https://gw.alipayobjects.com/zos/rmsportal/eeHMaZBwmTvLdIwMfBpg.png', + 'https://gw.alipayobjects.com/zos/rmsportal/udxAbMEhpwthVVcjLXik.png', + ][i % 2], no: `TradeCode ${i}`, title: `一个任务名称 ${i}`, owner: '曲丽丽', @@ -43,7 +46,7 @@ export function getRule(req, res, u) { if (params.status) { const status = params.status.split(','); let filterDataSource = []; - status.forEach((s) => { + status.forEach(s => { filterDataSource = filterDataSource.concat( [...dataSource].filter(data => parseInt(data.status, 10) === parseInt(s[0], 10)) ); @@ -95,7 +98,10 @@ export function postRule(req, res, u, b) { tableListDataSource.unshift({ key: i, href: 'https://ant.design', - avatar: ['https://gw.alipayobjects.com/zos/rmsportal/eeHMaZBwmTvLdIwMfBpg.png', 'https://gw.alipayobjects.com/zos/rmsportal/udxAbMEhpwthVVcjLXik.png'][i % 2], + avatar: [ + 'https://gw.alipayobjects.com/zos/rmsportal/eeHMaZBwmTvLdIwMfBpg.png', + 'https://gw.alipayobjects.com/zos/rmsportal/udxAbMEhpwthVVcjLXik.png', + ][i % 2], no: `TradeCode ${i}`, title: `一个任务名称 ${i}`, owner: '曲丽丽', diff --git a/package.json b/package.json index 572201ad..94012aab 100755 --- a/package.json +++ b/package.json @@ -17,7 +17,8 @@ "lint-staged:js": "eslint --ext .js", "test": "roadhog test", "test:component": "roadhog test ./src/components", - "test:all": "node ./tests/run-tests.js" + "test:all": "node ./tests/run-tests.js", + "prettier": "prettier --write ./src/**/**/**/*" }, "dependencies": { "@antv/data-set": "^0.8.0", @@ -64,31 +65,31 @@ "eslint-plugin-jsx-a11y": "^6.0.3", "eslint-plugin-markdown": "^1.0.0-beta.6", "eslint-plugin-react": "^7.0.1", + "eslint-config-prettier": "^2.9.0", "gh-pages": "^1.0.0", "husky": "^0.14.3", "lint-staged": "^6.0.0", "mockjs": "^1.0.1-beta3", + "prettier": "1.11.1", "pro-download": "^1.0.1", "redbox-react": "^1.5.0", "regenerator-runtime": "^0.11.1", "roadhog": "^2.3.0", "roadhog-api-doc": "^0.3.4", "stylelint": "^8.4.0", + "stylelint-config-prettier": "^3.0.4", "stylelint-config-standard": "^18.0.0" }, "optionalDependencies": { "puppeteer": "^1.1.1" }, "lint-staged": { + "**/*.{js,jsx,less}": ["prettier --wirter", "git add"], "**/*.{js,jsx}": "lint-staged:js", "**/*.less": "stylelint --syntax less" }, "engines": { "node": ">=8.0.0" }, - "browserslist": [ - "> 1%", - "last 2 versions", - "not ie <= 10" - ] + "browserslist": ["> 1%", "last 2 versions", "not ie <= 10"] } diff --git a/src/common/menu.js b/src/common/menu.js index a5da89ad..ee3875ec 100644 --- a/src/common/menu.js +++ b/src/common/menu.js @@ -1,123 +1,163 @@ import { isUrl } from '../utils/utils'; -const menuData = [{ - name: 'dashboard', - icon: 'dashboard', - path: 'dashboard', - children: [{ - name: '分析页', - path: 'analysis', - }, { - name: '监控页', - path: 'monitor', - }, { - name: '工作台', - path: 'workplace', - // hideInBreadcrumb: true, - // hideInMenu: true, - }], -}, { - name: '表单页', - icon: 'form', - path: 'form', - children: [{ - name: '基础表单', - path: 'basic-form', - }, { - name: '分步表单', - path: 'step-form', - }, { - name: '高级表单', - authority: 'admin', - path: 'advanced-form', - }], -}, { - name: '列表页', - icon: 'table', - path: 'list', - children: [{ - name: '查询表格', - path: 'table-list', - }, { - name: '标准列表', - path: 'basic-list', - }, { - name: '卡片列表', - path: 'card-list', - }, { - name: '搜索列表', - path: 'search', - children: [{ - name: '搜索列表(文章)', - path: 'articles', - }, { - name: '搜索列表(项目)', - path: 'projects', - }, { - name: '搜索列表(应用)', - path: 'applications', - }], - }], -}, { - name: '详情页', - icon: 'profile', - path: 'profile', - children: [{ - name: '基础详情页', - path: 'basic', - }, { - name: '高级详情页', - path: 'advanced', - authority: 'admin', - }], -}, { - name: '结果页', - icon: 'check-circle-o', - path: 'result', - children: [{ - name: '成功', - path: 'success', - }, { - name: '失败', - path: 'fail', - }], -}, { - name: '异常页', - icon: 'warning', - path: 'exception', - children: [{ - name: '403', - path: '403', - }, { - name: '404', - path: '404', - }, { - name: '500', - path: '500', - }, { - name: '触发异常', - path: 'trigger', - hideInMenu: true, - }], -}, { - name: '账户', - icon: 'user', - path: 'user', - authority: 'guest', - children: [{ - name: '登录', - path: 'login', - }, { - name: '注册', - path: 'register', - }, { - name: '注册结果', - path: 'register-result', - }], -}]; +const menuData = [ + { + name: 'dashboard', + icon: 'dashboard', + path: 'dashboard', + children: [ + { + name: '分析页', + path: 'analysis', + }, + { + name: '监控页', + path: 'monitor', + }, + { + name: '工作台', + path: 'workplace', + // hideInBreadcrumb: true, + // hideInMenu: true, + }, + ], + }, + { + name: '表单页', + icon: 'form', + path: 'form', + children: [ + { + name: '基础表单', + path: 'basic-form', + }, + { + name: '分步表单', + path: 'step-form', + }, + { + name: '高级表单', + authority: 'admin', + path: 'advanced-form', + }, + ], + }, + { + name: '列表页', + icon: 'table', + path: 'list', + children: [ + { + name: '查询表格', + path: 'table-list', + }, + { + name: '标准列表', + path: 'basic-list', + }, + { + name: '卡片列表', + path: 'card-list', + }, + { + name: '搜索列表', + path: 'search', + children: [ + { + name: '搜索列表(文章)', + path: 'articles', + }, + { + name: '搜索列表(项目)', + path: 'projects', + }, + { + name: '搜索列表(应用)', + path: 'applications', + }, + ], + }, + ], + }, + { + name: '详情页', + icon: 'profile', + path: 'profile', + children: [ + { + name: '基础详情页', + path: 'basic', + }, + { + name: '高级详情页', + path: 'advanced', + authority: 'admin', + }, + ], + }, + { + name: '结果页', + icon: 'check-circle-o', + path: 'result', + children: [ + { + name: '成功', + path: 'success', + }, + { + name: '失败', + path: 'fail', + }, + ], + }, + { + name: '异常页', + icon: 'warning', + path: 'exception', + children: [ + { + name: '403', + path: '403', + }, + { + name: '404', + path: '404', + }, + { + name: '500', + path: '500', + }, + { + name: '触发异常', + path: 'trigger', + hideInMenu: true, + }, + ], + }, + { + name: '账户', + icon: 'user', + path: 'user', + authority: 'guest', + children: [ + { + name: '登录', + path: 'login', + }, + { + name: '注册', + path: 'register', + }, + { + name: '注册结果', + path: 'register-result', + }, + ], + }, +]; function formatter(data, parentPath = '/', parentAuthority) { - return data.map((item) => { + return data.map(item => { let { path } = item; if (!isUrl(path)) { path = parentPath + item.path; diff --git a/src/common/router.js b/src/common/router.js index 60235976..e7312c48 100644 --- a/src/common/router.js +++ b/src/common/router.js @@ -5,25 +5,24 @@ import { getMenuData } from './menu'; let routerDataCache; -const modelNotExisted = (app, model) => ( +const modelNotExisted = (app, model) => // eslint-disable-next-line !app._models.some(({ namespace }) => { return namespace === model.substring(model.lastIndexOf('/') + 1); - }) -); + }); // wrapper of dynamic const dynamicWrapper = (app, models, component) => { // () => require('module') // transformed by babel-plugin-dynamic-import-node-sync if (component.toString().indexOf('.then(') < 0) { - models.forEach((model) => { + models.forEach(model => { if (modelNotExisted(app, model)) { // eslint-disable-next-line app.model(require(`../models/${model}`).default); } }); - return (props) => { + return props => { if (!routerDataCache) { routerDataCache = getRouterData(app); } @@ -36,20 +35,20 @@ const dynamicWrapper = (app, models, component) => { // () => import('module') return dynamic({ app, - models: () => models.filter( - model => modelNotExisted(app, model)).map(m => import(`../models/${m}.js`) - ), + models: () => + models.filter(model => modelNotExisted(app, model)).map(m => import(`../models/${m}.js`)), // add routerData prop component: () => { if (!routerDataCache) { routerDataCache = getRouterData(app); } - return component().then((raw) => { + return component().then(raw => { const Component = raw.default || raw; - return props => createElement(Component, { - ...props, - routerData: routerDataCache, - }); + return props => + createElement(Component, { + ...props, + routerData: routerDataCache, + }); }); }, }); @@ -57,7 +56,7 @@ const dynamicWrapper = (app, models, component) => { function getFlatMenuData(menus) { let keys = {}; - menus.forEach((item) => { + menus.forEach(item => { if (item.children) { keys[item.path] = { ...item }; keys = { ...keys, ...getFlatMenuData(item.children) }; @@ -68,7 +67,7 @@ function getFlatMenuData(menus) { return keys; } -export const getRouterData = (app) => { +export const getRouterData = app => { const routerConfig = { '/': { component: dynamicWrapper(app, ['user', 'login'], () => import('../layouts/BasicLayout')), @@ -80,7 +79,9 @@ export const getRouterData = (app) => { component: dynamicWrapper(app, ['monitor'], () => import('../routes/Dashboard/Monitor')), }, '/dashboard/workplace': { - component: dynamicWrapper(app, ['project', 'activities', 'chart'], () => import('../routes/Dashboard/Workplace')), + component: dynamicWrapper(app, ['project', 'activities', 'chart'], () => + import('../routes/Dashboard/Workplace') + ), // hideInBreadcrumb: true, // name: '工作台', // authority: 'admin', @@ -131,7 +132,9 @@ export const getRouterData = (app) => { component: dynamicWrapper(app, ['profile'], () => import('../routes/Profile/BasicProfile')), }, '/profile/advanced': { - component: dynamicWrapper(app, ['profile'], () => import('../routes/Profile/AdvancedProfile')), + component: dynamicWrapper(app, ['profile'], () => + import('../routes/Profile/AdvancedProfile') + ), }, '/result/success': { component: dynamicWrapper(app, [], () => import('../routes/Result/Success')), @@ -149,7 +152,9 @@ export const getRouterData = (app) => { component: dynamicWrapper(app, [], () => import('../routes/Exception/500')), }, '/exception/trigger': { - component: dynamicWrapper(app, ['error'], () => import('../routes/Exception/triggerException')), + component: dynamicWrapper(app, ['error'], () => + import('../routes/Exception/triggerException') + ), }, '/user': { component: dynamicWrapper(app, [], () => import('../layouts/UserLayout')), @@ -174,7 +179,7 @@ export const getRouterData = (app) => { // eg. {name,authority ...routerConfig } const routerData = {}; // The route matches the menu - Object.keys(routerConfig).forEach((path) => { + Object.keys(routerConfig).forEach(path => { // Regular match item name // eg. router /user/:id === /user/chen const pathRegexp = pathToRegexp(path); diff --git a/src/components/ActiveChart/index.js b/src/components/ActiveChart/index.js index d708641c..cd6119b9 100644 --- a/src/components/ActiveChart/index.js +++ b/src/components/ActiveChart/index.js @@ -14,7 +14,7 @@ function getActiveData() { for (let i = 0; i < 24; i += 1) { activeData.push({ x: `${fixedZero(i)}:00`, - y: Math.floor(Math.random() * 200) + (i * 50), + y: Math.floor(Math.random() * 200) + i * 50, }); } return activeData; diff --git a/src/components/Authorized/AuthorizedRoute.js b/src/components/Authorized/AuthorizedRoute.js index f7cd679d..60b45dc9 100644 --- a/src/components/Authorized/AuthorizedRoute.js +++ b/src/components/Authorized/AuthorizedRoute.js @@ -4,29 +4,13 @@ import Authorized from './Authorized'; class AuthorizedRoute extends React.Component { render() { - const { - component: Component, - render, - authority, - redirectPath, - ...rest - } = this.props; + const { component: Component, render, authority, redirectPath, ...rest } = this.props; return ( } - /> - } + noMatch={ } />} > - - (Component ? : render(props)) - } - /> + (Component ? : render(props))} /> ); } diff --git a/src/components/Authorized/CheckPermissions.test.js b/src/components/Authorized/CheckPermissions.test.js index eda08a7f..b4b5e2ce 100644 --- a/src/components/Authorized/CheckPermissions.test.js +++ b/src/components/Authorized/CheckPermissions.test.js @@ -20,24 +20,16 @@ describe('test CheckPermissions', () => { expect(checkPermissions('admin', 'user', target, error)).toEqual('error'); }); it('Correct Array permission authentication', () => { - expect(checkPermissions(['user', 'admin'], 'user', target, error)).toEqual( - 'ok' - ); + expect(checkPermissions(['user', 'admin'], 'user', target, error)).toEqual('ok'); }); it('Wrong Array permission authentication,currentAuthority error', () => { - expect( - checkPermissions(['user', 'admin'], 'user,admin', target, error) - ).toEqual('error'); + expect(checkPermissions(['user', 'admin'], 'user,admin', target, error)).toEqual('error'); }); it('Wrong Array permission authentication', () => { - expect(checkPermissions(['user', 'admin'], 'guest', target, error)).toEqual( - 'error' - ); + expect(checkPermissions(['user', 'admin'], 'guest', target, error)).toEqual('error'); }); it('Wrong Function permission authentication', () => { - expect(checkPermissions(() => false, 'guest', target, error)).toEqual( - 'error' - ); + expect(checkPermissions(() => false, 'guest', target, error)).toEqual('error'); }); it('Correct Function permission authentication', () => { expect(checkPermissions(() => true, 'guest', target, error)).toEqual('ok'); diff --git a/src/components/Authorized/PromiseRender.js b/src/components/Authorized/PromiseRender.js index 43a4fa9e..02518ad5 100644 --- a/src/components/Authorized/PromiseRender.js +++ b/src/components/Authorized/PromiseRender.js @@ -32,7 +32,7 @@ export default class PromiseRender extends React.PureComponent { // AuthorizedRoute is already instantiated // Authorized render is already instantiated, children is no instantiated // Secured is not instantiated - checkIsInstantiation = (target) => { + checkIsInstantiation = target => { if (!React.isValidElement(target)) { return target; } diff --git a/src/components/Authorized/Secured.js b/src/components/Authorized/Secured.js index 4303883e..1012da46 100644 --- a/src/components/Authorized/Secured.js +++ b/src/components/Authorized/Secured.js @@ -5,15 +5,13 @@ import CheckPermissions from './CheckPermissions'; * 默认不能访问任何页面 * default is "NULL" */ -const Exception403 = () => ( - -); +const Exception403 = () => ; // Determine whether the incoming component has been instantiated // AuthorizedRoute is already instantiated // Authorized render is already instantiated, children is no instantiated // Secured is not instantiated -const checkIsInstantiation = (target) => { +const checkIsInstantiation = target => { if (!React.isValidElement(target)) { return target; } diff --git a/src/components/Authorized/index.d.ts b/src/components/Authorized/index.d.ts index 4a68fa18..ba9bc5b2 100644 --- a/src/components/Authorized/index.d.ts +++ b/src/components/Authorized/index.d.ts @@ -11,24 +11,19 @@ export type IReactComponent

= | React.ClassicComponentClass

; interface Secured { - (authority: authority, error?: React.ReactNode): ( - target: T, - ) => T; + (authority: authority, error?: React.ReactNode): (target: T) => T; } export interface AuthorizedRouteProps extends RouteProps { authority: authority; } -export class AuthorizedRoute extends React.Component< - AuthorizedRouteProps, - any -> {} +export class AuthorizedRoute extends React.Component {} interface check { ( authority: authority, target: T, - Exception: S, + Exception: S ): T | S; } diff --git a/src/components/Authorized/index.js b/src/components/Authorized/index.js index c39de291..48d1b2b8 100644 --- a/src/components/Authorized/index.js +++ b/src/components/Authorized/index.js @@ -14,7 +14,7 @@ Authorized.check = check; * use authority or getAuthority * @param {string|()=>String} currentAuthority */ -const renderAuthorize = (currentAuthority) => { +const renderAuthorize = currentAuthority => { if (currentAuthority) { if (currentAuthority.constructor.name === 'Function') { CURRENT = currentAuthority(); diff --git a/src/components/AvatarList/index.d.ts b/src/components/AvatarList/index.d.ts index bc8ce19c..5b9352ef 100644 --- a/src/components/AvatarList/index.d.ts +++ b/src/components/AvatarList/index.d.ts @@ -4,9 +4,7 @@ import AvatarItem from './AvatarItem'; export interface IAvatarListProps { size?: 'large' | 'small' | 'mini' | 'default'; style?: React.CSSProperties; - children: - | React.ReactElement - | Array>; + children: React.ReactElement | Array>; } export default class AvatarList extends React.Component { diff --git a/src/components/AvatarList/index.js b/src/components/AvatarList/index.js index 08c502f1..6fc59273 100644 --- a/src/components/AvatarList/index.js +++ b/src/components/AvatarList/index.js @@ -18,7 +18,7 @@ const AvatarList = ({ children, size, ...other }) => { ); }; -const Item = ({ src, size, tips, onClick = (() => {}) }) => { +const Item = ({ src, size, tips, onClick = () => {} }) => { const cls = classNames(styles.avatarItem, { [styles.avatarItemLarge]: size === 'large', [styles.avatarItemSmall]: size === 'small', @@ -26,14 +26,14 @@ const Item = ({ src, size, tips, onClick = (() => {}) }) => { }); return ( -

  • - { - tips ? ( - - - - ) : - } +
  • + {tips ? ( + + + + ) : ( + + )}
  • ); }; diff --git a/src/components/AvatarList/index.less b/src/components/AvatarList/index.less index 601babd2..8660ba43 100644 --- a/src/components/AvatarList/index.less +++ b/src/components/AvatarList/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .avatarList { display: inline-block; diff --git a/src/components/Charts/Bar/index.d.ts b/src/components/Charts/Bar/index.d.ts index 2813a272..48990825 100644 --- a/src/components/Charts/Bar/index.d.ts +++ b/src/components/Charts/Bar/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface IBarProps { title: React.ReactNode; color?: string; diff --git a/src/components/Charts/Bar/index.js b/src/components/Charts/Bar/index.js index 9eee7a07..a3c36084 100644 --- a/src/components/Charts/Bar/index.js +++ b/src/components/Charts/Bar/index.js @@ -46,11 +46,11 @@ class Bar extends Component { } } - handleRoot = (n) => { + handleRoot = n => { this.root = n; }; - handleRef = (n) => { + handleRef = n => { this.node = n; }; diff --git a/src/components/Charts/ChartCard/index.d.ts b/src/components/Charts/ChartCard/index.d.ts index ad450dfa..80fd3762 100644 --- a/src/components/Charts/ChartCard/index.d.ts +++ b/src/components/Charts/ChartCard/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface IChartCardProps { title: React.ReactNode; action?: React.ReactNode; diff --git a/src/components/Charts/ChartCard/index.js b/src/components/Charts/ChartCard/index.js index 035b3131..c7875b06 100644 --- a/src/components/Charts/ChartCard/index.js +++ b/src/components/Charts/ChartCard/index.js @@ -4,7 +4,7 @@ import classNames from 'classnames'; import styles from './index.less'; -const renderTotal = (total) => { +const renderTotal = total => { let totalDom; switch (typeof total) { case undefined: @@ -33,7 +33,9 @@ const ChartCard = ({ const content = (
    {avatar}
    @@ -50,7 +52,11 @@ const ChartCard = ({
    )} {footer && ( -
    +
    {footer}
    )} diff --git a/src/components/Charts/ChartCard/index.less b/src/components/Charts/ChartCard/index.less index 02a1d7ec..fa2eb16d 100644 --- a/src/components/Charts/ChartCard/index.less +++ b/src/components/Charts/ChartCard/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .chartCard { position: relative; diff --git a/src/components/Charts/Field/index.d.ts b/src/components/Charts/Field/index.d.ts index c89aaf96..975fb667 100644 --- a/src/components/Charts/Field/index.d.ts +++ b/src/components/Charts/Field/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface IFieldProps { label: React.ReactNode; value: React.ReactNode; diff --git a/src/components/Charts/Field/index.less b/src/components/Charts/Field/index.less index 2848f9db..aeafbcb8 100644 --- a/src/components/Charts/Field/index.less +++ b/src/components/Charts/Field/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .field { white-space: nowrap; diff --git a/src/components/Charts/Gauge/index.d.ts b/src/components/Charts/Gauge/index.d.ts index e91dd562..66e3c003 100644 --- a/src/components/Charts/Gauge/index.d.ts +++ b/src/components/Charts/Gauge/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface IGaugeProps { title: React.ReactNode; color?: string; diff --git a/src/components/Charts/Gauge/index.js b/src/components/Charts/Gauge/index.js index 608b0f2e..d9289eaa 100644 --- a/src/components/Charts/Gauge/index.js +++ b/src/components/Charts/Gauge/index.js @@ -4,7 +4,7 @@ import autoHeight from '../autoHeight'; const { Arc, Html, Line } = Guide; -const defaultFormatter = (val) => { +const defaultFormatter = val => { switch (val) { case '2': return '差'; diff --git a/src/components/Charts/MiniProgress/index.d.ts b/src/components/Charts/MiniProgress/index.d.ts index bbcc1d0b..aaeb7261 100644 --- a/src/components/Charts/MiniProgress/index.d.ts +++ b/src/components/Charts/MiniProgress/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface IMiniProgressProps { target: number; color?: string; @@ -7,7 +7,4 @@ export interface IMiniProgressProps { style?: React.CSSProperties; } -export default class MiniProgress extends React.Component< - IMiniProgressProps, - any -> {} +export default class MiniProgress extends React.Component {} diff --git a/src/components/Charts/MiniProgress/index.js b/src/components/Charts/MiniProgress/index.js index 08fe9b53..795c79b1 100644 --- a/src/components/Charts/MiniProgress/index.js +++ b/src/components/Charts/MiniProgress/index.js @@ -6,21 +6,18 @@ import styles from './index.less'; const MiniProgress = ({ target, color = 'rgb(19, 194, 194)', strokeWidth, percent }) => (
    -
    - - +
    + +
    diff --git a/src/components/Charts/MiniProgress/index.less b/src/components/Charts/MiniProgress/index.less index 06823be4..e5f148cb 100644 --- a/src/components/Charts/MiniProgress/index.less +++ b/src/components/Charts/MiniProgress/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .miniProgress { padding: 5px 0; @@ -9,7 +9,7 @@ position: relative; } .progress { - transition: all .4s cubic-bezier(.08, .82, .17, 1) 0s; + transition: all 0.4s cubic-bezier(0.08, 0.82, 0.17, 1) 0s; border-radius: 1px 0 0 1px; background-color: @primary-color; width: 0; diff --git a/src/components/Charts/Pie/index.js b/src/components/Charts/Pie/index.js index 2784ad60..ac7248d7 100644 --- a/src/components/Charts/Pie/index.js +++ b/src/components/Charts/Pie/index.js @@ -44,7 +44,7 @@ export default class Pie extends Component { this.resize.cancel(); } - getG2Instance = (chart) => { + getG2Instance = chart => { this.chart = chart; }; @@ -54,7 +54,7 @@ export default class Pie extends Component { const geom = this.chart.getAllGeoms()[0]; // 获取所有的图形 const items = geom.get('dataArray') || []; // 获取图形对应的 - const legendData = items.map((item) => { + const legendData = items.map(item => { /* eslint no-underscore-dangle:0 */ const origin = item[0]._origin; origin.color = item[0].color; @@ -89,7 +89,7 @@ export default class Pie extends Component { } } - handleRoot = (n) => { + handleRoot = n => { this.root = n; }; @@ -154,7 +154,7 @@ export default class Pie extends Component { if (percent) { selected = false; tooltip = false; - formatColor = (value) => { + formatColor = value => { if (value === '占比') { return color || 'rgba(24, 144, 255, 0.85)'; } else { @@ -235,7 +235,9 @@ export default class Pie extends Component {
  • this.handleLegendClick(item, i)}> {item.x} diff --git a/src/components/Charts/Pie/index.less b/src/components/Charts/Pie/index.less index 94787398..277274cd 100644 --- a/src/components/Charts/Pie/index.less +++ b/src/components/Charts/Pie/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .pie { position: relative; @@ -6,7 +6,7 @@ position: relative; } &.hasLegend .chart { - width: ~"calc(100% - 240px)"; + width: ~'calc(100% - 240px)'; } .legend { position: absolute; diff --git a/src/components/Charts/Radar/index.d.ts b/src/components/Charts/Radar/index.d.ts index d0f0dcfd..963ac8c3 100644 --- a/src/components/Charts/Radar/index.d.ts +++ b/src/components/Charts/Radar/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface IRadarProps { title?: React.ReactNode; height: number; diff --git a/src/components/Charts/Radar/index.js b/src/components/Charts/Radar/index.js index b7f7caf3..fc3ab444 100644 --- a/src/components/Charts/Radar/index.js +++ b/src/components/Charts/Radar/index.js @@ -21,7 +21,7 @@ export default class Radar extends Component { } } - getG2Instance = (chart) => { + getG2Instance = chart => { this.chart = chart; }; @@ -31,7 +31,7 @@ export default class Radar extends Component { const geom = this.chart.getAllGeoms()[0]; // 获取所有的图形 const items = geom.get('dataArray') || []; // 获取图形对应的 - const legendData = items.map((item) => { + const legendData = items.map(item => { // eslint-disable-next-line const origins = item.map(t => t._origin); const result = { @@ -49,7 +49,7 @@ export default class Radar extends Component { }); }; - handleRef = (n) => { + handleRef = n => { this.node = n; }; @@ -60,9 +60,7 @@ export default class Radar extends Component { const { legendData } = this.state; legendData[i] = newItem; - const filteredLegendData = legendData - .filter(l => l.checked) - .map(l => l.name); + const filteredLegendData = legendData.filter(l => l.checked).map(l => l.name); if (this.chart) { this.chart.filter('name', val => filteredLegendData.indexOf(val) > -1); @@ -143,12 +141,7 @@ export default class Radar extends Component { }, }} /> - + {item.value}
  • - ))} + ))} )}
    diff --git a/src/components/Charts/Radar/index.less b/src/components/Charts/Radar/index.less index 378db9c4..15b8725c 100644 --- a/src/components/Charts/Radar/index.less +++ b/src/components/Charts/Radar/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .radar { .legend { diff --git a/src/components/Charts/TagCloud/index.d.ts b/src/components/Charts/TagCloud/index.d.ts index a85bac76..462650c4 100644 --- a/src/components/Charts/TagCloud/index.d.ts +++ b/src/components/Charts/TagCloud/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface ITagCloudProps { data: Array<{ name: string; diff --git a/src/components/Charts/TagCloud/index.js b/src/components/Charts/TagCloud/index.js index 77e63fa7..50b947d3 100644 --- a/src/components/Charts/TagCloud/index.js +++ b/src/components/Charts/TagCloud/index.js @@ -39,7 +39,7 @@ class TagCloud extends Component { this.renderChart(); }; - saveRootRef = (node) => { + saveRootRef = node => { this.root = node; }; @@ -77,7 +77,7 @@ class TagCloud extends Component { @Bind() @Debounce(500) - renderChart = (nextProps) => { + renderChart = nextProps => { // const colors = ['#1890FF', '#41D9C7', '#2FC25B', '#FACC14', '#9AE65C']; const { data, height } = nextProps || this.props; diff --git a/src/components/Charts/TimelineChart/index.d.ts b/src/components/Charts/TimelineChart/index.d.ts index 5ab7a664..d9312fe6 100644 --- a/src/components/Charts/TimelineChart/index.d.ts +++ b/src/components/Charts/TimelineChart/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface ITimelineChartProps { data: Array<{ x: string; @@ -11,7 +11,4 @@ export interface ITimelineChartProps { style?: React.CSSProperties; } -export default class TimelineChart extends React.Component< - ITimelineChartProps, - any -> {} +export default class TimelineChart extends React.Component {} diff --git a/src/components/Charts/TimelineChart/index.js b/src/components/Charts/TimelineChart/index.js index 38649837..f00c9bb6 100644 --- a/src/components/Charts/TimelineChart/index.js +++ b/src/components/Charts/TimelineChart/index.js @@ -48,7 +48,7 @@ export default class TimelineChart extends React.Component { .source(data) .transform({ type: 'filter', - callback: (obj) => { + callback: obj => { const date = obj.x; return date <= ds.state.end && date >= ds.state.start; }, diff --git a/src/components/Charts/WaterWave/index.less b/src/components/Charts/WaterWave/index.less index d185ca3b..43ba05ca 100644 --- a/src/components/Charts/WaterWave/index.less +++ b/src/components/Charts/WaterWave/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .waterWave { display: inline-block; @@ -22,7 +22,7 @@ } } .waterWaveCanvasWrapper { - transform: scale(.5); + transform: scale(0.5); transform-origin: 0 0; } } diff --git a/src/components/Charts/autoHeight.js b/src/components/Charts/autoHeight.js index d8582ffd..01ae92dc 100644 --- a/src/components/Charts/autoHeight.js +++ b/src/components/Charts/autoHeight.js @@ -30,7 +30,7 @@ function getAutoHeight(n) { return height; } -const autoHeight = () => (WrappedComponent) => { +const autoHeight = () => WrappedComponent => { return class extends React.Component { state = { computedHeight: 0, @@ -45,7 +45,7 @@ const autoHeight = () => (WrappedComponent) => { } } - handleRoot = (node) => { + handleRoot = node => { this.root = node; }; diff --git a/src/components/CountDown/index.d.ts b/src/components/CountDown/index.d.ts index c2d4bcf9..d39a2e95 100644 --- a/src/components/CountDown/index.d.ts +++ b/src/components/CountDown/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface ICountDownProps { format?: (time: number) => void; target: Date | number; diff --git a/src/components/CountDown/index.js b/src/components/CountDown/index.js index f7aa6e08..875fb1e2 100644 --- a/src/components/CountDown/index.js +++ b/src/components/CountDown/index.js @@ -23,11 +23,14 @@ class CountDown extends Component { if (this.props.target !== nextProps.target) { clearTimeout(this.timer); const { lastTime } = this.initTime(nextProps); - this.setState({ - lastTime, - }, () => { - this.tick(); - }); + this.setState( + { + lastTime, + }, + () => { + this.tick(); + } + ); } } @@ -37,7 +40,7 @@ class CountDown extends Component { timer = 0; interval = 1000; - initTime = (props) => { + initTime = props => { let lastTime = 0; let targetTime = 0; try { @@ -54,21 +57,23 @@ class CountDown extends Component { return { lastTime: lastTime < 0 ? 0 : lastTime, }; - } + }; // defaultFormat = time => ( // {moment(time).format('hh:mm:ss')} // ); - defaultFormat = (time) => { + defaultFormat = time => { const hours = 60 * 60 * 1000; const minutes = 60 * 1000; const h = Math.floor(time / hours); - const m = Math.floor((time - (h * hours)) / minutes); - const s = Math.floor((time - (h * hours) - (m * minutes)) / 1000); + const m = Math.floor((time - h * hours) / minutes); + const s = Math.floor((time - h * hours - m * minutes) / 1000); return ( - {fixedZero(h)}:{fixedZero(m)}:{fixedZero(s)} + + {fixedZero(h)}:{fixedZero(m)}:{fixedZero(s)} + ); - } + }; tick = () => { const { onEnd } = this.props; let { lastTime } = this.state; @@ -76,30 +81,36 @@ class CountDown extends Component { this.timer = setTimeout(() => { if (lastTime < this.interval) { clearTimeout(this.timer); - this.setState({ - lastTime: 0, - }, () => { - if (onEnd) { - onEnd(); + this.setState( + { + lastTime: 0, + }, + () => { + if (onEnd) { + onEnd(); + } } - }); + ); } else { lastTime -= this.interval; - this.setState({ - lastTime, - }, () => { - this.tick(); - }); + this.setState( + { + lastTime, + }, + () => { + this.tick(); + } + ); } }, this.interval); - } + }; render() { const { format = this.defaultFormat, onEnd, ...rest } = this.props; const { lastTime } = this.state; const result = format(lastTime); - return ({result}); + return {result}; } } diff --git a/src/components/DescriptionList/DescriptionList.js b/src/components/DescriptionList/DescriptionList.js index bef2cec9..128b0d31 100644 --- a/src/components/DescriptionList/DescriptionList.js +++ b/src/components/DescriptionList/DescriptionList.js @@ -3,8 +3,16 @@ import classNames from 'classnames'; import { Row } from 'antd'; import styles from './index.less'; -export default ({ className, title, col = 3, layout = 'horizontal', gutter = 32, - children, size, ...restProps }) => { +export default ({ + className, + title, + col = 3, + layout = 'horizontal', + gutter = 32, + children, + size, + ...restProps +}) => { const clsString = classNames(styles.descriptionList, styles[layout], className, { [styles.small]: size === 'small', [styles.large]: size === 'large', diff --git a/src/components/DescriptionList/index.d.ts b/src/components/DescriptionList/index.d.ts index e7b2baf6..96ccfa7d 100644 --- a/src/components/DescriptionList/index.d.ts +++ b/src/components/DescriptionList/index.d.ts @@ -10,9 +10,6 @@ export interface IDescriptionListProps { style?: React.CSSProperties; } -export default class DescriptionList extends React.Component< - IDescriptionListProps, - any -> { +export default class DescriptionList extends React.Component { public static Description: typeof Description; } diff --git a/src/components/DescriptionList/index.less b/src/components/DescriptionList/index.less index e8d5280e..ebffa55f 100644 --- a/src/components/DescriptionList/index.less +++ b/src/components/DescriptionList/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .descriptionList { // offset the padding-bottom of last row @@ -25,10 +25,10 @@ display: table-cell; &:after { - content: ":"; + content: ':'; margin: 0 8px 0 2px; position: relative; - top: -.5px; + top: -0.5px; } } @@ -51,7 +51,8 @@ margin-bottom: 12px; color: @text-color; } - .term, .detail { + .term, + .detail { padding-bottom: 8px; } } diff --git a/src/components/EditableItem/index.js b/src/components/EditableItem/index.js index b0563c17..fcda844e 100644 --- a/src/components/EditableItem/index.js +++ b/src/components/EditableItem/index.js @@ -7,48 +7,34 @@ export default class EditableItem extends PureComponent { value: this.props.value, editable: false, }; - handleChange = (e) => { + handleChange = e => { const { value } = e.target; this.setState({ value }); - } + }; check = () => { this.setState({ editable: false }); if (this.props.onChange) { this.props.onChange(this.state.value); } - } + }; edit = () => { this.setState({ editable: true }); - } + }; render() { const { value, editable } = this.state; return (
    - { - editable ? ( -
    - - -
    - ) : ( -
    - {value || ' '} - -
    - ) - } + {editable ? ( +
    + + +
    + ) : ( +
    + {value || ' '} + +
    + )}
    ); } diff --git a/src/components/EditableItem/index.less b/src/components/EditableItem/index.less index 8c068686..457a18bd 100644 --- a/src/components/EditableItem/index.less +++ b/src/components/EditableItem/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .editableItem { line-height: @input-height-base; diff --git a/src/components/EditableLinkGroup/index.js b/src/components/EditableLinkGroup/index.js index 97d70fc1..e230c3dd 100644 --- a/src/components/EditableLinkGroup/index.js +++ b/src/components/EditableLinkGroup/index.js @@ -22,15 +22,17 @@ class EditableLinkGroup extends PureComponent { const { links, linkElement, onAdd } = this.props; return (
    - { - links.map(link => ( - createElement(linkElement, { + {links.map(link => + createElement( + linkElement, + { key: `linkGroup-item-${link.id || link.title}`, to: link.href, href: link.href, - }, link.title) - )) - } + }, + link.title + ) + )} { ) - } + }, + + )}
    diff --git a/src/components/Exception/index.less b/src/components/Exception/index.less index 394af178..5ef378be 100644 --- a/src/components/Exception/index.less +++ b/src/components/Exception/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .exception { display: flex; @@ -12,7 +12,7 @@ zoom: 1; &:before, &:after { - content: " "; + content: ' '; display: table; } &:after { diff --git a/src/components/FooterToolbar/index.d.ts b/src/components/FooterToolbar/index.d.ts index 130021d8..9c6ac5b4 100644 --- a/src/components/FooterToolbar/index.d.ts +++ b/src/components/FooterToolbar/index.d.ts @@ -4,7 +4,4 @@ export interface IFooterToolbarProps { style?: React.CSSProperties; } -export default class FooterToolbar extends React.Component< - IFooterToolbarProps, - any -> {} +export default class FooterToolbar extends React.Component {} diff --git a/src/components/FooterToolbar/index.js b/src/components/FooterToolbar/index.js index 62527e9e..d5ce75b8 100644 --- a/src/components/FooterToolbar/index.js +++ b/src/components/FooterToolbar/index.js @@ -6,10 +6,7 @@ export default class FooterToolbar extends Component { render() { const { children, className, extra, ...restProps } = this.props; return ( -
    +
    {extra}
    {children}
    diff --git a/src/components/FooterToolbar/index.less b/src/components/FooterToolbar/index.less index b6b6399e..de6606bd 100644 --- a/src/components/FooterToolbar/index.less +++ b/src/components/FooterToolbar/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .toolbar { position: fixed; @@ -7,14 +7,14 @@ right: 0; height: 56px; line-height: 56px; - box-shadow: 0 -1px 2px rgba(0, 0, 0, .03); + box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.03); background: #fff; border-top: 1px solid @border-color-split; padding: 0 24px; z-index: 9; &:after { - content: ""; + content: ''; display: block; clear: both; } diff --git a/src/components/GlobalFooter/index.d.ts b/src/components/GlobalFooter/index.d.ts index cc1224e3..85a9ca65 100644 --- a/src/components/GlobalFooter/index.d.ts +++ b/src/components/GlobalFooter/index.d.ts @@ -1,4 +1,4 @@ -import * as React from "react"; +import * as React from 'react'; export interface IGlobalFooterProps { links?: Array<{ title: React.ReactNode; @@ -9,7 +9,4 @@ export interface IGlobalFooterProps { style?: React.CSSProperties; } -export default class GlobalFooter extends React.Component< - IGlobalFooterProps, - any -> {} +export default class GlobalFooter extends React.Component {} diff --git a/src/components/GlobalFooter/index.js b/src/components/GlobalFooter/index.js index 36abafca..837fe6f9 100644 --- a/src/components/GlobalFooter/index.js +++ b/src/components/GlobalFooter/index.js @@ -6,21 +6,15 @@ export default ({ className, links, copyright }) => { const clsString = classNames(styles.globalFooter, className); return (
    - { - links && ( -
    - {links.map(link => ( - - {link.title} - - ))} -
    - ) - } + {links && ( +
    + {links.map(link => ( + + {link.title} + + ))} +
    + )} {copyright &&
    {copyright}
    }
    ); diff --git a/src/components/GlobalFooter/index.less b/src/components/GlobalFooter/index.less index 7fce6004..101dcf04 100644 --- a/src/components/GlobalFooter/index.less +++ b/src/components/GlobalFooter/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .globalFooter { padding: 0 16px; @@ -10,7 +10,7 @@ a { color: @text-color-secondary; - transition: all .3s; + transition: all 0.3s; &:not(:last-child) { margin-right: 40px; diff --git a/src/components/GlobalHeader/index.js b/src/components/GlobalHeader/index.js index 61871a7d..3e91ee21 100644 --- a/src/components/GlobalHeader/index.js +++ b/src/components/GlobalHeader/index.js @@ -17,7 +17,7 @@ export default class GlobalHeader extends PureComponent { if (notices.length === 0) { return {}; } - const newNotices = notices.map((notice) => { + const newNotices = notices.map(notice => { const newNotice = { ...notice }; if (newNotice.datetime) { newNotice.datetime = moment(notice.datetime).fromNow(); @@ -27,13 +27,17 @@ export default class GlobalHeader extends PureComponent { newNotice.key = newNotice.id; } if (newNotice.extra && newNotice.status) { - const color = ({ + const color = { todo: '', processing: 'blue', urgent: 'red', doing: 'gold', - })[newNotice.status]; - newNotice.extra = {newNotice.extra}; + }[newNotice.status]; + newNotice.extra = ( + + {newNotice.extra} + + ); } return newNotice; }); @@ -43,40 +47,50 @@ export default class GlobalHeader extends PureComponent { const { collapsed, onCollapse } = this.props; onCollapse(!collapsed); this.triggerResizeEvent(); - } + }; @Debounce(600) - triggerResizeEvent() { // eslint-disable-line + triggerResizeEvent = () => { const event = document.createEvent('HTMLEvents'); event.initEvent('resize', true, false); window.dispatchEvent(event); - } + }; render() { const { - currentUser, collapsed, fetchingNotices, isMobile, logo, - onNoticeVisibleChange, onMenuClick, onNoticeClear, + currentUser, + collapsed, + fetchingNotices, + isMobile, + logo, + onNoticeVisibleChange, + onMenuClick, + onNoticeClear, } = this.props; const menu = ( - 个人中心 - 设置 - 触发报错 + + 个人中心 + + + 设置 + + + 触发报错 + - 退出登录 + + 退出登录 + ); const noticeData = this.getNoticeData(); return (
    - {isMobile && ( - [ - ( - - logo - - ), - , - ] - )} + {isMobile && [ + + logo + , + , + ]} { + onSearch={value => { console.log('input', value); // eslint-disable-line }} - onPressEnter={(value) => { + onPressEnter={value => { console.log('enter', value); // eslint-disable-line }} /> @@ -102,7 +116,7 @@ export default class GlobalHeader extends PureComponent { className={styles.action} > - + {currentUser.name} - ) : } + ) : ( + + )}
    ); diff --git a/src/components/GlobalHeader/index.less b/src/components/GlobalHeader/index.less index a9e9d92f..8508930a 100644 --- a/src/components/GlobalHeader/index.less +++ b/src/components/GlobalHeader/index.less @@ -1,10 +1,10 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .header { height: 64px; padding: 0 12px 0 0; background: #fff; - box-shadow: 0 1px 4px rgba(0, 21, 41, .08); + box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); position: relative; } @@ -42,7 +42,7 @@ i.trigger { font-size: 20px; line-height: 64px; cursor: pointer; - transition: all .3s, padding 0s; + transition: all 0.3s, padding 0s; padding: 0 24px; &:hover { background: @primary-1; @@ -56,7 +56,7 @@ i.trigger { cursor: pointer; padding: 0 12px; display: inline-block; - transition: all .3s; + transition: all 0.3s; height: 100%; > i { font-size: 16px; @@ -79,7 +79,7 @@ i.trigger { .avatar { margin: 20px 8px 20px 0; color: @primary-color; - background: rgba(255, 255, 255, .85); + background: rgba(255, 255, 255, 0.85); vertical-align: middle; } } diff --git a/src/components/HeaderSearch/index.d.ts b/src/components/HeaderSearch/index.d.ts index a11d63a1..3a06d758 100644 --- a/src/components/HeaderSearch/index.d.ts +++ b/src/components/HeaderSearch/index.d.ts @@ -8,7 +8,4 @@ export interface IHeaderSearchProps { style?: React.CSSProperties; } -export default class HeaderSearch extends React.Component< - IHeaderSearchProps, - any -> {} +export default class HeaderSearch extends React.Component {} diff --git a/src/components/HeaderSearch/index.js b/src/components/HeaderSearch/index.js index 85c990ef..49b9072f 100644 --- a/src/components/HeaderSearch/index.js +++ b/src/components/HeaderSearch/index.js @@ -28,42 +28,39 @@ export default class HeaderSearch extends PureComponent { componentWillUnmount() { clearTimeout(this.timeout); } - onKeyDown = (e) => { + onKeyDown = e => { if (e.key === 'Enter') { this.timeout = setTimeout(() => { this.props.onPressEnter(this.state.value); // Fix duplicate onPressEnter }, 0); } - } - onChange = (value) => { + }; + onChange = value => { this.setState({ value }); if (this.props.onChange) { this.props.onChange(); } - } + }; enterSearchMode = () => { this.setState({ searchMode: true }, () => { if (this.state.searchMode) { this.input.focus(); } }); - } + }; leaveSearchMode = () => { this.setState({ searchMode: false, value: '', }); - } + }; render() { const { className, placeholder, ...restProps } = this.props; const inputClass = classNames(styles.input, { [styles.show]: this.state.searchMode, }); return ( - + { this.input = node; }} + ref={node => { + this.input = node; + }} onKeyDown={this.onKeyDown} onBlur={this.leaveSearchMode} /> diff --git a/src/components/HeaderSearch/index.less b/src/components/HeaderSearch/index.less index 37433088..e97386d8 100644 --- a/src/components/HeaderSearch/index.less +++ b/src/components/HeaderSearch/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .headerSearch { :global(.anticon-search) { @@ -6,7 +6,7 @@ font-size: 16px; } .input { - transition: width .3s, margin-left .3s; + transition: width 0.3s, margin-left 0.3s; width: 0; background: transparent; border-radius: 0; diff --git a/src/components/Login/LoginItem.js b/src/components/Login/LoginItem.js index b7332b2e..98efb333 100644 --- a/src/components/Login/LoginItem.js +++ b/src/components/Login/LoginItem.js @@ -8,7 +8,7 @@ import map from './map'; const FormItem = Form.Item; function generator({ defaultProps, defaultRules, type }) { - return (WrappedComponent) => { + return WrappedComponent => { return class BasicComponent extends Component { static contextTypes = { form: PropTypes.object, @@ -41,7 +41,7 @@ function generator({ defaultProps, defaultRules, type }) { clearInterval(this.interval); } }, 1000); - } + }; render() { const { getFieldDecorator } = this.context.form; const options = {}; @@ -93,7 +93,7 @@ function generator({ defaultProps, defaultRules, type }) { } const LoginItem = {}; -Object.keys(map).forEach((item) => { +Object.keys(map).forEach(item => { LoginItem[item] = generator({ defaultProps: map[item].props, defaultRules: map[item].rules, diff --git a/src/components/Login/index.d.ts b/src/components/Login/index.d.ts index 79842922..2c0fd01a 100644 --- a/src/components/Login/index.d.ts +++ b/src/components/Login/index.d.ts @@ -1,5 +1,5 @@ -import * as React from "react"; -import Button from "antd/lib/button"; +import * as React from 'react'; +import Button from 'antd/lib/button'; export interface LoginProps { defaultActiveKey?: string; onTabChange?: (key: string) => void; diff --git a/src/components/Login/index.js b/src/components/Login/index.js index 58ce0297..07016c31 100644 --- a/src/components/Login/index.js +++ b/src/components/Login/index.js @@ -34,19 +34,19 @@ class Login extends Component { getChildContext() { return { tabUtil: { - addTab: (id) => { + addTab: id => { this.setState({ tabs: [...this.state.tabs, id], }); }, - removeTab: (id) => { + removeTab: id => { this.setState({ tabs: this.state.tabs.filter(currentId => currentId !== id), }); }, }, form: this.props.form, - updateActive: (activeItem) => { + updateActive: activeItem => { const { type, active } = this.state; if (active[type]) { active[type].push(activeItem); @@ -59,28 +59,26 @@ class Login extends Component { }, }; } - onSwitch = (type) => { + onSwitch = type => { this.setState({ type, }); this.props.onTabChange(type); - } - handleSubmit = (e) => { + }; + handleSubmit = e => { e.preventDefault(); const { active, type } = this.state; const activeFileds = active[type]; - this.props.form.validateFields(activeFileds, { force: true }, - (err, values) => { - this.props.onSubmit(err, values); - } - ); - } + this.props.form.validateFields(activeFileds, { force: true }, (err, values) => { + this.props.onSubmit(err, values); + }); + }; render() { const { className, children } = this.props; const { type, tabs } = this.state; const TabChildren = []; const otherChildren = []; - React.Children.forEach(children, (item) => { + React.Children.forEach(children, item => { if (!item) { return; } @@ -94,21 +92,21 @@ class Login extends Component { return (
    - { - tabs.length ? ( -
    - - {TabChildren} - - {otherChildren} -
    - ) : [...children] - } + {tabs.length ? ( +
    + + {TabChildren} + + {otherChildren} +
    + ) : ( + [...children] + )}
    ); @@ -117,7 +115,7 @@ class Login extends Component { Login.Tab = LoginTab; Login.Submit = LoginSubmit; -Object.keys(LoginItem).forEach((item) => { +Object.keys(LoginItem).forEach(item => { Login[item] = LoginItem[item]; }); diff --git a/src/components/Login/index.less b/src/components/Login/index.less index 331ed5a6..e0a984cd 100644 --- a/src/components/Login/index.less +++ b/src/components/Login/index.less @@ -1,7 +1,6 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .login { - .tabs { padding: 0 2px; margin: 0 -2px; diff --git a/src/components/Login/map.js b/src/components/Login/map.js index 4f596fff..c278ee08 100644 --- a/src/components/Login/map.js +++ b/src/components/Login/map.js @@ -10,9 +10,12 @@ const map = { prefix: , placeholder: 'admin', }, - rules: [{ - required: true, message: 'Please enter username!', - }], + rules: [ + { + required: true, + message: 'Please enter username!', + }, + ], }, Password: { component: Input, @@ -22,9 +25,12 @@ const map = { type: 'password', placeholder: '888888', }, - rules: [{ - required: true, message: 'Please enter password!', - }], + rules: [ + { + required: true, + message: 'Please enter password!', + }, + ], }, Mobile: { component: Input, @@ -33,11 +39,16 @@ const map = { prefix: , placeholder: 'mobile number', }, - rules: [{ - required: true, message: 'Please enter mobile number!', - }, { - pattern: /^1\d{10}$/, message: 'Wrong mobile number format!', - }], + rules: [ + { + required: true, + message: 'Please enter mobile number!', + }, + { + pattern: /^1\d{10}$/, + message: 'Wrong mobile number format!', + }, + ], }, Captcha: { component: Input, @@ -46,9 +57,12 @@ const map = { prefix: , placeholder: 'captcha', }, - rules: [{ - required: true, message: 'Please enter Captcha!', - }], + rules: [ + { + required: true, + message: 'Please enter Captcha!', + }, + ], }, }; diff --git a/src/components/NoticeIcon/NoticeIconTab.d.ts b/src/components/NoticeIcon/NoticeIconTab.d.ts index 0f58e817..5a577870 100644 --- a/src/components/NoticeIcon/NoticeIconTab.d.ts +++ b/src/components/NoticeIcon/NoticeIconTab.d.ts @@ -16,7 +16,4 @@ export interface INoticeIconTabProps { style?: React.CSSProperties; } -export default class NoticeIconTab extends React.Component< - INoticeIconTabProps, - any -> {} +export default class NoticeIconTab extends React.Component {} diff --git a/src/components/NoticeIcon/NoticeList.js b/src/components/NoticeIcon/NoticeList.js index 2ffe72ad..c107e2d9 100644 --- a/src/components/NoticeIcon/NoticeList.js +++ b/src/components/NoticeIcon/NoticeList.js @@ -4,14 +4,18 @@ import classNames from 'classnames'; import styles from './NoticeList.less'; export default function NoticeList({ - data = [], onClick, onClear, title, locale, emptyText, emptyImage, + data = [], + onClick, + onClear, + title, + locale, + emptyText, + emptyImage, }) { if (data.length === 0) { return (
    - {emptyImage ? ( - not found - ) : null} + {emptyImage ? not found : null}
    {emptyText || locale.emptyText}
    ); @@ -48,7 +52,8 @@ export default function NoticeList({ })}
    - {locale.clear}{title} + {locale.clear} + {title}
    ); diff --git a/src/components/NoticeIcon/NoticeList.less b/src/components/NoticeIcon/NoticeList.less index db2bc6d1..f99d59e8 100644 --- a/src/components/NoticeIcon/NoticeList.less +++ b/src/components/NoticeIcon/NoticeList.less @@ -1,10 +1,10 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .list { max-height: 400px; overflow: auto; .item { - transition: all .3s; + transition: all 0.3s; overflow: hidden; cursor: pointer; padding-left: 24px; @@ -20,7 +20,7 @@ } &.read { - opacity: .4; + opacity: 0.4; } &:last-child { border-bottom: 0; @@ -69,7 +69,7 @@ color: @text-color; border-radius: 0 0 @border-radius-base @border-radius-base; border-top: 1px solid @border-color-split; - transition: all .3s; + transition: all 0.3s; cursor: pointer; &:hover { diff --git a/src/components/NoticeIcon/index.js b/src/components/NoticeIcon/index.js index 3134aced..be2f44f9 100644 --- a/src/components/NoticeIcon/index.js +++ b/src/components/NoticeIcon/index.js @@ -30,19 +30,21 @@ export default class NoticeIcon extends PureComponent { onItemClick = (item, tabProps) => { const { onItemClick } = this.props; onItemClick(item, tabProps); - } - onTabChange = (tabType) => { + }; + onTabChange = tabType => { this.setState({ tabType }); this.props.onTabChange(tabType); - } + }; getNotificationBox() { const { children, loading, locale } = this.props; if (!children) { return null; } - const panes = React.Children.map(children, (child) => { - const title = child.props.list && child.props.list.length > 0 - ? `${child.props.title} (${child.props.list.length})` : child.props.title; + const panes = React.Children.map(children, child => { + const title = + child.props.list && child.props.list.length > 0 + ? `${child.props.title} (${child.props.list.length})` + : child.props.title; return ( {} +export default class NumberInfo extends React.Component {} diff --git a/src/components/NumberInfo/index.js b/src/components/NumberInfo/index.js index 0b90cbd9..afe914a1 100644 --- a/src/components/NumberInfo/index.js +++ b/src/components/NumberInfo/index.js @@ -3,15 +3,11 @@ import { Icon } from 'antd'; import classNames from 'classnames'; import styles from './index.less'; -export default ({ - theme, title, subTitle, total, subTotal, status, suffix, gap, ...rest -}) => ( +export default ({ theme, title, subTitle, total, subTotal, status, suffix, gap, ...rest }) => (
    {title &&
    {title}
    } @@ -21,14 +17,12 @@ export default ({ {total} {suffix && {suffix}} - { - (status || subTotal) && ( - - {subTotal} - {status && } - - ) - } + {(status || subTotal) && ( + + {subTotal} + {status && } + + )}
    ); diff --git a/src/components/NumberInfo/index.less b/src/components/NumberInfo/index.less index 1854dd70..c8fad650 100644 --- a/src/components/NumberInfo/index.less +++ b/src/components/NumberInfo/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .numberInfo { .suffix { @@ -11,7 +11,7 @@ color: @text-color; font-size: @font-size-lg; margin-bottom: 16px; - transition: all .3s; + transition: all 0.3s; } .numberInfoSubTitle { color: @text-color-secondary; diff --git a/src/components/PageHeader/index.js b/src/components/PageHeader/index.js index 42713c4e..a36fa7f1 100644 --- a/src/components/PageHeader/index.js +++ b/src/components/PageHeader/index.js @@ -10,7 +10,7 @@ const { TabPane } = Tabs; export function getBreadcrumb(breadcrumbNameMap, url) { let breadcrumb = breadcrumbNameMap[url]; if (!breadcrumb) { - Object.keys(breadcrumbNameMap).forEach((item) => { + Object.keys(breadcrumbNameMap).forEach(item => { if (pathToRegexp(item).test(url)) { breadcrumb = breadcrumbNameMap[item]; } @@ -26,7 +26,7 @@ export default class PageHeader extends PureComponent { location: PropTypes.object, breadcrumbNameMap: PropTypes.object, }; - onChange = (key) => { + onChange = key => { if (this.props.onTabChange) { this.props.onTabChange(key); } @@ -36,17 +36,12 @@ export default class PageHeader extends PureComponent { routes: this.props.routes || this.context.routes, params: this.props.params || this.context.params, routerLocation: this.props.location || this.context.location, - breadcrumbNameMap: - this.props.breadcrumbNameMap || this.context.breadcrumbNameMap, + breadcrumbNameMap: this.props.breadcrumbNameMap || this.context.breadcrumbNameMap, }; }; // Generated according to props conversionFromProps = () => { - const { - breadcrumbList, - breadcrumbSeparator, - linkElement = 'a', - } = this.props; + const { breadcrumbList, breadcrumbSeparator, linkElement = 'a' } = this.props; return ( {breadcrumbList.map(item => ( @@ -57,7 +52,7 @@ export default class PageHeader extends PureComponent { { [linkElement === 'a' ? 'href' : 'to']: item.href, }, - item.title, + item.title ) : item.title} @@ -72,14 +67,13 @@ export default class PageHeader extends PureComponent { // Loop data mosaic routing const extraBreadcrumbItems = pathSnippets.map((url, index) => { const currentBreadcrumb = getBreadcrumb(breadcrumbNameMap, url); - const isLinkable = - index !== pathSnippets.length - 1 && currentBreadcrumb.component; + const isLinkable = index !== pathSnippets.length - 1 && currentBreadcrumb.component; return currentBreadcrumb.name && !currentBreadcrumb.hideInBreadcrumb ? ( {createElement( isLinkable ? linkElement : 'span', { [linkElement === 'a' ? 'href' : 'to']: url }, - currentBreadcrumb.name, + currentBreadcrumb.name )} ) : null; @@ -92,9 +86,9 @@ export default class PageHeader extends PureComponent { { [linkElement === 'a' ? 'href' : 'to']: '/', }, - '首页', + '首页' )} - , + ); return ( @@ -108,12 +102,7 @@ export default class PageHeader extends PureComponent { */ conversionBreadcrumbList = () => { const { breadcrumbList, breadcrumbSeparator } = this.props; - const { - routes, - params, - routerLocation, - breadcrumbNameMap, - } = this.getBreadcrumbProps(); + const { routes, params, routerLocation, breadcrumbNameMap } = this.getBreadcrumbProps(); if (breadcrumbList && breadcrumbList.length) { return this.conversionFromProps(); } @@ -151,7 +140,7 @@ export default class PageHeader extends PureComponent { href: paths.join('/') || '/', to: paths.join('/') || '/', }, - route.breadcrumbName, + route.breadcrumbName ) ); }; @@ -191,9 +180,7 @@ export default class PageHeader extends PureComponent {
    {content &&
    {content}
    } - {extraContent && ( -
    {extraContent}
    - )} + {extraContent &&
    {extraContent}
    }
    diff --git a/src/components/PageHeader/index.less b/src/components/PageHeader/index.less index a1e3b2e9..ae0fddc3 100644 --- a/src/components/PageHeader/index.less +++ b/src/components/PageHeader/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .pageHeader { background: @component-background; @@ -61,19 +61,27 @@ } } - .title, .action, .content, .extraContent, .main { + .title, + .action, + .content, + .extraContent, + .main { flex: auto; } - .title, .action { + .title, + .action { margin-bottom: 16px; } - .logo, .content, .extraContent { + .logo, + .content, + .extraContent { margin-bottom: 16px; } - .action, .extraContent { + .action, + .extraContent { text-align: right; } @@ -105,7 +113,8 @@ display: block; } - .action, .extraContent { + .action, + .extraContent { margin-left: 0; text-align: left; } @@ -124,7 +133,8 @@ .pageHeader { .action { :global { - .ant-btn-group, .ant-btn { + .ant-btn-group, + .ant-btn { display: block; margin-bottom: 8px; } diff --git a/src/components/PageHeader/index.test.js b/src/components/PageHeader/index.test.js index e4c44f18..5238ac55 100644 --- a/src/components/PageHeader/index.test.js +++ b/src/components/PageHeader/index.test.js @@ -17,35 +17,29 @@ const routerData = { }; describe('test getBreadcrumb', () => { it('Simple url', () => { - expect(getBreadcrumb(routerData, '/dashboard/analysis').name).toEqual( - '分析页', - ); + expect(getBreadcrumb(routerData, '/dashboard/analysis').name).toEqual('分析页'); }); it('Parameters url', () => { - expect(getBreadcrumb(routerData, '/userinfo/2144').name).toEqual( - '用户信息', - ); + expect(getBreadcrumb(routerData, '/userinfo/2144').name).toEqual('用户信息'); }); it('The middle parameter url', () => { - expect(getBreadcrumb(routerData, '/userinfo/2144/addr').name).toEqual( - '收货订单', - ); + expect(getBreadcrumb(routerData, '/userinfo/2144/addr').name).toEqual('收货订单'); }); it('Loop through the parameters', () => { - const urlNameList = urlToList('/userinfo/2144/addr').map((url) => { + const urlNameList = urlToList('/userinfo/2144/addr').map(url => { return getBreadcrumb(routerData, url).name; }); expect(urlNameList).toEqual(['用户列表', '用户信息', '收货订单']); }); it('a path', () => { - const urlNameList = urlToList('/userinfo').map((url) => { + const urlNameList = urlToList('/userinfo').map(url => { return getBreadcrumb(routerData, url).name; }); expect(urlNameList).toEqual(['用户列表']); }); it('Secondary path', () => { - const urlNameList = urlToList('/userinfo/2144').map((url) => { + const urlNameList = urlToList('/userinfo/2144').map(url => { return getBreadcrumb(routerData, url).name; }); expect(urlNameList).toEqual(['用户列表', '用户信息']); diff --git a/src/components/Result/index.js b/src/components/Result/index.js index 389a4ef5..ada2f5f4 100644 --- a/src/components/Result/index.js +++ b/src/components/Result/index.js @@ -4,7 +4,13 @@ import { Icon } from 'antd'; import styles from './index.less'; export default function Result({ - className, type, title, description, extra, actions, ...restProps + className, + type, + title, + description, + extra, + actions, + ...restProps }) { const iconMap = { error: , diff --git a/src/components/Result/index.less b/src/components/Result/index.less index 9204f0f6..9953392c 100644 --- a/src/components/Result/index.less +++ b/src/components/Result/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .result { text-align: center; diff --git a/src/components/SiderMenu/SiderMenu.js b/src/components/SiderMenu/SiderMenu.js index e8e6d9e4..639d4ad3 100644 --- a/src/components/SiderMenu/SiderMenu.js +++ b/src/components/SiderMenu/SiderMenu.js @@ -12,7 +12,7 @@ const { SubMenu } = Menu; // icon: 'setting', // icon: 'http://demo.com/icon.png', // icon: , -const getIcon = (icon) => { +const getIcon = icon => { if (typeof icon === 'string' && icon.indexOf('http') === 0) { return icon; } @@ -23,7 +23,7 @@ const getIcon = (icon) => { }; export const getMeunMatcheys = (flatMenuKeys, path) => { - return flatMenuKeys.filter((item) => { + return flatMenuKeys.filter(item => { return pathToRegexp(item).test(path); }); }; @@ -52,7 +52,7 @@ export default class SiderMenu extends PureComponent { getDefaultCollapsedSubMenus(props) { const { location: { pathname } } = props || this.props; return urlToList(pathname) - .map((item) => { + .map(item => { return getMeunMatcheys(this.flatMenuKeys, item)[0]; }) .filter(item => item); @@ -64,7 +64,7 @@ export default class SiderMenu extends PureComponent { */ getFlatMenuKeys(menus) { let keys = []; - menus.forEach((item) => { + menus.forEach(item => { if (item.children) { keys = keys.concat(this.getFlatMenuKeys(item.children)); } @@ -77,7 +77,7 @@ export default class SiderMenu extends PureComponent { * Judge whether it is http link.return a or Link * @memberof SiderMenu */ - getMenuItemPath = (item) => { + getMenuItemPath = item => { const itemPath = this.conversionPath(item.path); const icon = getIcon(item.icon); const { target, name } = item; @@ -111,7 +111,7 @@ export default class SiderMenu extends PureComponent { /** * get SubMenu or Item */ - getSubMenuOrItem = (item) => { + getSubMenuOrItem = item => { if (item.children && item.children.some(child => child.name)) { const childrenItems = this.getNavMenuItems(item.children); // 当无子菜单时就不展示菜单 @@ -125,8 +125,8 @@ export default class SiderMenu extends PureComponent { {item.name} ) : ( - item.name - ) + item.name + ) } key={item.path} > @@ -136,22 +136,20 @@ export default class SiderMenu extends PureComponent { } return null; } else { - return ( - {this.getMenuItemPath(item)} - ); + return {this.getMenuItemPath(item)}; } }; /** * 获得菜单子节点 * @memberof SiderMenu */ - getNavMenuItems = (menusData) => { + getNavMenuItems = menusData => { if (!menusData) { return []; } return menusData .filter(item => item.name && !item.hideInMenu) - .map((item) => { + .map(item => { // make dom const ItemDom = this.getSubMenuOrItem(item); return this.checkPermissionItem(item.authority, ItemDom); @@ -161,13 +159,11 @@ export default class SiderMenu extends PureComponent { // Get the currently selected menu getSelectedMenuKeys = () => { const { location: { pathname } } = this.props; - return urlToList(pathname).map(itemPath => - getMeunMatcheys(this.flatMenuKeys, itemPath).pop(), - ); + return urlToList(pathname).map(itemPath => getMeunMatcheys(this.flatMenuKeys, itemPath).pop()); }; // conversion Path // 转化路径 - conversionPath = (path) => { + conversionPath = path => { if (path && path.indexOf('http') === 0) { return path; } else { @@ -182,13 +178,10 @@ export default class SiderMenu extends PureComponent { } return ItemDom; }; - isMainMenu = (key) => { - return this.menus.some( - item => - key && (item.key === key || item.path === key), - ); - } - handleOpenChange = (openKeys) => { + isMainMenu = key => { + return this.menus.some(item => key && (item.key === key || item.path === key)); + }; + handleOpenChange = openKeys => { const lastOpenKey = openKeys[openKeys.length - 1]; const moreThanOne = openKeys.filter(openKey => this.isMainMenu(openKey)).length > 1; this.setState({ @@ -202,8 +195,8 @@ export default class SiderMenu extends PureComponent { const menuProps = collapsed ? {} : { - openKeys, - }; + openKeys, + }; // if pathname can't match, use the nearest parent's key let selectedKeys = this.getSelectedMenuKeys(); if (!selectedKeys.length) { diff --git a/src/components/SiderMenu/SilderMenu.test.js b/src/components/SiderMenu/SilderMenu.test.js index e6f1f55a..d74a5f5d 100644 --- a/src/components/SiderMenu/SilderMenu.test.js +++ b/src/components/SiderMenu/SilderMenu.test.js @@ -1,12 +1,6 @@ import { getMeunMatcheys } from './SiderMenu'; -const meun = [ - '/dashboard', - '/userinfo', - '/dashboard/name', - '/userinfo/:id', - '/userinfo/:id/info', -]; +const meun = ['/dashboard', '/userinfo', '/dashboard/name', '/userinfo/:id', '/userinfo/:id/info']; describe('test meun match', () => { it('simple path', () => { @@ -17,20 +11,14 @@ describe('test meun match', () => { }); it('Secondary path', () => { - expect(getMeunMatcheys(meun, '/dashboard/name')).toEqual([ - '/dashboard/name', - ]); + expect(getMeunMatcheys(meun, '/dashboard/name')).toEqual(['/dashboard/name']); }); it('Parameter path', () => { - expect(getMeunMatcheys(meun, '/userinfo/2144')).toEqual([ - '/userinfo/:id', - ]); + expect(getMeunMatcheys(meun, '/userinfo/2144')).toEqual(['/userinfo/:id']); }); it('three parameter path', () => { - expect(getMeunMatcheys(meun, '/userinfo/2144/info')).toEqual([ - '/userinfo/:id/info', - ]); + expect(getMeunMatcheys(meun, '/userinfo/2144/info')).toEqual(['/userinfo/:id/info']); }); }); diff --git a/src/components/SiderMenu/index.js b/src/components/SiderMenu/index.js index 70b3e474..640d6ba5 100644 --- a/src/components/SiderMenu/index.js +++ b/src/components/SiderMenu/index.js @@ -3,17 +3,20 @@ import React from 'react'; import DrawerMenu from 'rc-drawer-menu'; import SiderMenu from './SiderMenu'; -export default props => ( +export default props => props.isMobile ? ( { props.onCollapse(true); }} + onMaskClick={() => { + props.onCollapse(true); + }} width="256px" > - ) : -); + ) : ( + + ); diff --git a/src/components/SiderMenu/index.less b/src/components/SiderMenu/index.less index 2f02116d..9fa1a91a 100644 --- a/src/components/SiderMenu/index.less +++ b/src/components/SiderMenu/index.less @@ -51,7 +51,12 @@ } .ant-menu-inline-collapsed { & > .ant-menu-item .sider-menu-item-img + span, - & > .ant-menu-item-group > .ant-menu-item-group-list > .ant-menu-item .sider-menu-item-img + span, + & + > .ant-menu-item-group + > .ant-menu-item-group-list + > .ant-menu-item + .sider-menu-item-img + + span, & > .ant-menu-submenu > .ant-menu-submenu-title .sider-menu-item-img + span { max-width: 0; display: inline-block; @@ -60,7 +65,7 @@ } .ant-menu-item .sider-menu-item-img + span, .ant-menu-submenu-title .sider-menu-item-img + span { - transition: opacity .3s @ease-in-out, width .3s @ease-in-out; + transition: opacity 0.3s @ease-in-out, width 0.3s @ease-in-out; opacity: 1; } } diff --git a/src/components/StandardFormRow/index.js b/src/components/StandardFormRow/index.js index 4ed6d9d9..ec8ae1dc 100644 --- a/src/components/StandardFormRow/index.js +++ b/src/components/StandardFormRow/index.js @@ -11,16 +11,12 @@ export default ({ title, children, last, block, grid, ...rest }) => { return (
    - { - title && ( -
    - {title} -
    - ) - } -
    - {children} -
    + {title && ( +
    + {title} +
    + )} +
    {children}
    ); }; diff --git a/src/components/StandardFormRow/index.less b/src/components/StandardFormRow/index.less index d36ac596..83ab019f 100644 --- a/src/components/StandardFormRow/index.less +++ b/src/components/StandardFormRow/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .standardFormRow { border-bottom: 1px dashed @border-color-split; diff --git a/src/components/StandardTable/index.js b/src/components/StandardTable/index.js index a2c35eaf..95198e4c 100644 --- a/src/components/StandardTable/index.js +++ b/src/components/StandardTable/index.js @@ -4,7 +4,7 @@ import styles from './index.less'; function initTotalList(columns) { const totalList = []; - columns.forEach((column) => { + columns.forEach(column => { if (column.needTotal) { totalList.push({ ...column, total: 0 }); } @@ -37,7 +37,7 @@ class StandardTable extends PureComponent { handleRowSelectChange = (selectedRowKeys, selectedRows) => { let needTotalList = [...this.state.needTotalList]; - needTotalList = needTotalList.map((item) => { + needTotalList = needTotalList.map(item => { return { ...item, total: selectedRows.reduce((sum, val) => { @@ -51,15 +51,15 @@ class StandardTable extends PureComponent { } this.setState({ selectedRowKeys, needTotalList }); - } + }; handleTableChange = (pagination, filters, sorter) => { this.props.onChange(pagination, filters, sorter); - } + }; cleanSelectedKeys = () => { this.handleRowSelectChange([], []); - } + }; render() { const { selectedRowKeys, needTotalList } = this.state; @@ -83,22 +83,22 @@ class StandardTable extends PureComponent {
    已选择 {selectedRowKeys.length} 项   - { - needTotalList.map(item => ( - {item.title}总计  - - {item.render ? item.render(item.total) : item.total} - + {needTotalList.map(item => ( + + {item.title}总计  + + {item.render ? item.render(item.total) : item.total} - ) - ) - } - 清空 + + ))} + + 清空 + - )} + } type="info" showIcon /> diff --git a/src/components/StandardTable/index.less b/src/components/StandardTable/index.less index 4ced9e78..817be991 100644 --- a/src/components/StandardTable/index.less +++ b/src/components/StandardTable/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .standardTable { :global { diff --git a/src/components/TagSelect/TagSelectOption.d.ts b/src/components/TagSelect/TagSelectOption.d.ts index c69d421a..366b297a 100644 --- a/src/components/TagSelect/TagSelectOption.d.ts +++ b/src/components/TagSelect/TagSelectOption.d.ts @@ -5,7 +5,4 @@ export interface ITagSelectOptionProps { style?: React.CSSProperties; } -export default class TagSelectOption extends React.Component< - ITagSelectOptionProps, - any -> {} +export default class TagSelectOption extends React.Component {} diff --git a/src/components/TagSelect/index.js b/src/components/TagSelect/index.js index e0159aa7..773b9c84 100644 --- a/src/components/TagSelect/index.js +++ b/src/components/TagSelect/index.js @@ -7,11 +7,7 @@ import styles from './index.less'; const { CheckableTag } = Tag; const TagSelectOption = ({ children, checked, onChange, value }) => ( - onChange(value, state)} - > + onChange(value, state)}> {children} ); @@ -29,7 +25,7 @@ class TagSelect extends Component { } } - onChange = (value) => { + onChange = value => { const { onChange } = this.props; if (!('value' in this.props)) { this.setState({ value }); @@ -37,15 +33,15 @@ class TagSelect extends Component { if (onChange) { onChange(value); } - } + }; - onSelectAll = (checked) => { + onSelectAll = checked => { let checkedTags = []; if (checked) { checkedTags = this.getAllTags(); } this.onChange(checkedTags); - } + }; getAllTags() { let { children } = this.props; @@ -66,19 +62,21 @@ class TagSelect extends Component { checkedTags.splice(index, 1); } this.onChange(checkedTags); - } + }; handleExpand = () => { this.setState({ expand: !this.state.expand, }); - } + }; - isTagSelectOption = (node) => { - return node && node.type && ( - node.type.isTagSelectOption || node.type.displayName === 'TagSelectOption' + isTagSelectOption = node => { + return ( + node && + node.type && + (node.type.isTagSelectOption || node.type.displayName === 'TagSelectOption') ); - } + }; render() { const { value, expand } = this.state; @@ -92,15 +90,11 @@ class TagSelect extends Component { }); return (
    - + 全部 - { - value && React.Children.map(children, (child) => { + {value && + React.Children.map(children, child => { if (this.isTagSelectOption(child)) { return React.cloneElement(child, { key: `tag-select-${child.props.value}`, @@ -110,15 +104,12 @@ class TagSelect extends Component { }); } return child; - }) - } - { - expandable && ( - - {expand ? '收起' : '展开'} - - ) - } + })} + {expandable && ( + + {expand ? '收起' : '展开'} + + )}
    ); } diff --git a/src/components/TagSelect/index.less b/src/components/TagSelect/index.less index df2669c4..834b39a6 100644 --- a/src/components/TagSelect/index.less +++ b/src/components/TagSelect/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .tagSelect { user-select: none; @@ -7,7 +7,7 @@ overflow: hidden; max-height: 32px; line-height: 32px; - transition: all .3s; + transition: all 0.3s; :global { .ant-tag { padding: 0 8px; @@ -16,7 +16,7 @@ } } &.expanded { - transition: all .3s; + transition: all 0.3s; max-height: 200px; } .trigger { diff --git a/src/components/Trend/index.js b/src/components/Trend/index.js index 2cbaad4e..cde4ef60 100644 --- a/src/components/Trend/index.js +++ b/src/components/Trend/index.js @@ -4,17 +4,21 @@ import classNames from 'classnames'; import styles from './index.less'; const Trend = ({ colorful = true, flag, children, className, ...rest }) => { - const classString = classNames(styles.trendItem, { - [styles.trendItemGrey]: !colorful, - }, className); + const classString = classNames( + styles.trendItem, + { + [styles.trendItemGrey]: !colorful, + }, + className + ); return ( -
    +
    {children} - {flag && } + {flag && ( + + + + )}
    ); }; diff --git a/src/components/Trend/index.less b/src/components/Trend/index.less index 48695c96..ea66fcf7 100644 --- a/src/components/Trend/index.less +++ b/src/components/Trend/index.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .trendItem { display: inline-block; diff --git a/src/components/_utils/pathTools.test.js b/src/components/_utils/pathTools.test.js index 4daf28b4..a9b93155 100644 --- a/src/components/_utils/pathTools.test.js +++ b/src/components/_utils/pathTools.test.js @@ -5,10 +5,7 @@ describe('test urlToList', () => { expect(urlToList('/userinfo')).toEqual(['/userinfo']); }); it('Secondary path', () => { - expect(urlToList('/userinfo/2144')).toEqual([ - '/userinfo', - '/userinfo/2144', - ]); + expect(urlToList('/userinfo/2144')).toEqual(['/userinfo', '/userinfo/2144']); }); it('Three paths', () => { expect(urlToList('/userinfo/2144/addr')).toEqual([ diff --git a/src/index.ejs b/src/index.ejs index fc8bf98d..586f62e8 100644 --- a/src/index.ejs +++ b/src/index.ejs @@ -13,4 +13,4 @@
    - + \ No newline at end of file diff --git a/src/index.js b/src/index.js index b4da8eed..cfa30d22 100644 --- a/src/index.js +++ b/src/index.js @@ -27,4 +27,4 @@ app.router(require('./router').default); // 5. Start app.start('#root'); -export default app._store; // eslint-disable-line +export default app._store; // eslint-disable-line diff --git a/src/layouts/BasicLayout.js b/src/layouts/BasicLayout.js index 6ee29894..8a92c6cd 100644 --- a/src/layouts/BasicLayout.js +++ b/src/layouts/BasicLayout.js @@ -23,14 +23,14 @@ const { AuthorizedRoute, check } = Authorized; * 根据菜单取得重定向地址. */ const redirectData = []; -const getRedirect = (item) => { +const getRedirect = item => { if (item && item.children) { if (item.children[0] && item.children[0].path) { redirectData.push({ from: `${item.path}`, to: `${item.children[0].path}`, }); - item.children.forEach((children) => { + item.children.forEach(children => { getRedirect(children); }); } @@ -79,7 +79,7 @@ const query = { }; let isMobile; -enquireScreen((b) => { +enquireScreen(b => { isMobile = b; }); @@ -87,7 +87,7 @@ class BasicLayout extends React.PureComponent { static childContextTypes = { location: PropTypes.object, breadcrumbNameMap: PropTypes.object, - } + }; state = { isMobile, }; @@ -99,7 +99,7 @@ class BasicLayout extends React.PureComponent { }; } componentDidMount() { - enquireScreen((mobile) => { + enquireScreen(mobile => { this.setState({ isMobile: mobile, }); @@ -130,25 +130,26 @@ class BasicLayout extends React.PureComponent { } else { const { routerData } = this.props; // get the first authorized route path in routerData - const authorizedPath = Object.keys(routerData).find(item => - check(routerData[item].authority, item) && item !== '/'); + const authorizedPath = Object.keys(routerData).find( + item => check(routerData[item].authority, item) && item !== '/' + ); return authorizedPath; } return redirect; - } - handleMenuCollapse = (collapsed) => { + }; + handleMenuCollapse = collapsed => { this.props.dispatch({ type: 'global/changeLayoutCollapsed', payload: collapsed, }); - } - handleNoticeClear = (type) => { + }; + handleNoticeClear = type => { message.success(`清空了${type}`); this.props.dispatch({ type: 'global/clearNotices', payload: type, }); - } + }; handleMenuClick = ({ key }) => { if (key === 'triggerError') { this.props.dispatch(routerRedux.push('/exception/trigger')); @@ -159,17 +160,23 @@ class BasicLayout extends React.PureComponent { type: 'login/logout', }); } - } - handleNoticeVisibleChange = (visible) => { + }; + handleNoticeVisibleChange = visible => { if (visible) { this.props.dispatch({ type: 'global/fetchNotices', }); } - } + }; render() { const { - currentUser, collapsed, fetchingNotices, notices, routerData, match, location, + currentUser, + collapsed, + fetchingNotices, + notices, + routerData, + match, + location, } = this.props; const bashRedirect = this.getBashRedirect(); const layout = ( @@ -203,47 +210,45 @@ class BasicLayout extends React.PureComponent { - { - redirectData.map(item => - - ) - } - { - getRoutes(match.path, routerData).map(item => - ( - - ) - ) - } + {redirectData.map(item => ( + + ))} + {getRoutes(match.path, routerData).map(item => ( + + ))}
    , - href: 'https://github.com/ant-design/ant-design-pro', - blankTarget: true, - }, { - key: 'Ant Design', - title: 'Ant Design', - href: 'http://ant.design', - blankTarget: true, - }]} + links={[ + { + key: 'Pro 首页', + title: 'Pro 首页', + href: 'http://pro.ant.design', + blankTarget: true, + }, + { + key: 'github', + title: , + href: 'https://github.com/ant-design/ant-design-pro', + blankTarget: true, + }, + { + key: 'Ant Design', + title: 'Ant Design', + href: 'http://ant.design', + blankTarget: true, + }, + ]} copyright={ Copyright 2018 蚂蚁金服体验技术部出品 diff --git a/src/layouts/PageHeaderLayout.less b/src/layouts/PageHeaderLayout.less index a0c0a6ef..39a44965 100644 --- a/src/layouts/PageHeaderLayout.less +++ b/src/layouts/PageHeaderLayout.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .content { margin: 24px 24px 0; diff --git a/src/layouts/UserLayout.js b/src/layouts/UserLayout.js index e736b2a0..8fb53534 100644 --- a/src/layouts/UserLayout.js +++ b/src/layouts/UserLayout.js @@ -7,21 +7,29 @@ import styles from './UserLayout.less'; import logo from '../assets/logo.svg'; import { getRoutes } from '../utils/utils'; -const links = [{ - key: 'help', - title: '帮助', - href: '', -}, { - key: 'privacy', - title: '隐私', - href: '', -}, { - key: 'terms', - title: '条款', - href: '', -}]; +const links = [ + { + key: 'help', + title: '帮助', + href: '', + }, + { + key: 'privacy', + title: '隐私', + href: '', + }, + { + key: 'terms', + title: '条款', + href: '', + }, +]; -const copyright = Copyright 2018 蚂蚁金服体验技术部出品; +const copyright = ( + + Copyright 2018 蚂蚁金服体验技术部出品 + +); class UserLayout extends React.PureComponent { getPageTitle() { @@ -49,16 +57,14 @@ class UserLayout extends React.PureComponent {
    Ant Design 是西湖区最具影响力的 Web 设计规范
    - {getRoutes(match.path, routerData).map(item => - ( - - ) - )} + {getRoutes(match.path, routerData).map(item => ( + + ))}
    diff --git a/src/layouts/UserLayout.less b/src/layouts/UserLayout.less index bf216037..a6d8df06 100644 --- a/src/layouts/UserLayout.less +++ b/src/layouts/UserLayout.less @@ -1,4 +1,4 @@ -@import "~antd/lib/style/themes/default.less"; +@import '~antd/lib/style/themes/default.less'; .container { display: flex; diff --git a/src/models/index.js b/src/models/index.js index 049c0149..902cb5cb 100644 --- a/src/models/index.js +++ b/src/models/index.js @@ -1,4 +1,7 @@ // Use require.context to require reducers automatically // Ref: https://webpack.js.org/guides/dependency-management/#require-context const context = require.context('./', false, /\.js$/); -export default context.keys().filter(item => item !== './index.js').map(key => context(key)); +export default context + .keys() + .filter(item => item !== './index.js') + .map(key => context(key)); diff --git a/src/router.js b/src/router.js index 23fdae17..3c3a9786 100644 --- a/src/router.js +++ b/src/router.js @@ -21,10 +21,7 @@ function RouterConfig({ history, app }) { - + } diff --git a/src/routes/Dashboard/Analysis.js b/src/routes/Dashboard/Analysis.js index b7582b03..0d2d09b9 100644 --- a/src/routes/Dashboard/Analysis.js +++ b/src/routes/Dashboard/Analysis.js @@ -66,19 +66,19 @@ export default class Analysis extends Component { }); } - handleChangeSalesType = (e) => { + handleChangeSalesType = e => { this.setState({ salesType: e.target.value, }); }; - handleTabChange = (key) => { + handleTabChange = key => { this.setState({ currentTabKey: key, }); }; - handleRangePickerChange = (rangePickerValue) => { + handleRangePickerChange = rangePickerValue => { this.setState({ rangePickerValue, }); @@ -88,7 +88,7 @@ export default class Analysis extends Component { }); }; - selectDate = (type) => { + selectDate = type => { this.setState({ rangePickerValue: getTimeDistance(type), }); diff --git a/src/routes/Dashboard/Analysis.less b/src/routes/Dashboard/Analysis.less index 38682c30..cd1d43ba 100644 --- a/src/routes/Dashboard/Analysis.less +++ b/src/routes/Dashboard/Analysis.less @@ -1,5 +1,5 @@ -@import "~antd/lib/style/themes/default.less"; -@import "../../utils/utils.less"; +@import '~antd/lib/style/themes/default.less'; +@import '../../utils/utils.less'; .iconGroup { i { diff --git a/src/routes/Dashboard/Monitor.js b/src/routes/Dashboard/Monitor.js index c6787b63..96fbfed0 100644 --- a/src/routes/Dashboard/Monitor.js +++ b/src/routes/Dashboard/Monitor.js @@ -14,7 +14,7 @@ const { Secured } = Authorized; const targetTime = new Date().getTime() + 3900000; // use permission as a parameter -const havePermissionAsync = new Promise((resolve) => { +const havePermissionAsync = new Promise(resolve => { // Call resolve on behalf of passed setTimeout(() => resolve(), 1000); }); @@ -81,11 +81,7 @@ export default class Monitor extends PureComponent { bodyStyle={{ textAlign: 'center' }} bordered={false} > - + diff --git a/src/routes/Dashboard/Monitor.less b/src/routes/Dashboard/Monitor.less index e52dd30c..3f0701f1 100644 --- a/src/routes/Dashboard/Monitor.less +++ b/src/routes/Dashboard/Monitor.less @@ -1,5 +1,5 @@ -@import "~antd/lib/style/themes/default.less"; -@import "../../utils/utils.less"; +@import '~antd/lib/style/themes/default.less'; +@import '../../utils/utils.less'; .mapChart { padding-top: 24px; @@ -13,7 +13,7 @@ } .pieCard :global(.pie-stat) { - font-size: 24px!important; + font-size: 24px !important; } @media screen and (max-width: @screen-lg) { diff --git a/src/routes/Dashboard/Workplace.js b/src/routes/Dashboard/Workplace.js index e596118a..9c8bdc79 100644 --- a/src/routes/Dashboard/Workplace.js +++ b/src/routes/Dashboard/Workplace.js @@ -99,13 +99,15 @@ export default class Workplace extends PureComponent { } renderActivities() { - const { - activities: { list }, - } = this.props; - return list.map((item) => { - const events = item.template.split(/@\{([^{}]*)\}/gi).map((key) => { + const { activities: { list } } = this.props; + return list.map(item => { + const events = item.template.split(/@\{([^{}]*)\}/gi).map(key => { if (item[key]) { - return {item[key].name}; + return ( + + {item[key].name} + + ); } return key; }); @@ -142,7 +144,10 @@ export default class Workplace extends PureComponent { const pageHeaderContent = (
    - +
    早安,曲丽丽,祝你开心每一天!
    @@ -159,7 +164,9 @@ export default class Workplace extends PureComponent {

    团队内排名

    -

    8 / 24

    +

    + 8 / 24 +

    项目访问

    @@ -169,10 +176,7 @@ export default class Workplace extends PureComponent { ); return ( - + - { - notice.map(item => ( - - - - - {item.title} -
    - )} - description={item.description} - /> -
    - {item.member || ''} - {item.updatedAt && ( - - {moment(item.updatedAt).fromNow()} - - )} -
    - - - )) - } + {notice.map(item => ( + + + + + {item.title} +
    + } + description={item.description} + /> +
    + {item.member || ''} + {item.updatedAt && ( + + {moment(item.updatedAt).fromNow()} + + )} +
    + + + ))} -
    - {this.renderActivities()} -
    +
    {this.renderActivities()}
    @@ -231,11 +231,7 @@ export default class Workplace extends PureComponent { bordered={false} bodyStyle={{ padding: 0 }} > - {}} - links={links} - linkElement={Link} - /> + {}} links={links} linkElement={Link} />
    - +
    - { - members.map(item => ( - - - - {item.title} - - - )) - } + {members.map(item => ( + + + + {item.title} + + + ))}
    diff --git a/src/routes/Dashboard/Workplace.less b/src/routes/Dashboard/Workplace.less index 4c875292..a8005fe1 100644 --- a/src/routes/Dashboard/Workplace.less +++ b/src/routes/Dashboard/Workplace.less @@ -1,5 +1,5 @@ -@import "~antd/lib/style/themes/default.less"; -@import "../../utils/utils.less"; +@import '~antd/lib/style/themes/default.less'; +@import '../../utils/utils.less'; .activitiesList { padding: 0 24px 8px 24px; @@ -96,7 +96,7 @@ max-width: 100px; vertical-align: top; margin-left: 12px; - transition: all .3s; + transition: all 0.3s; display: inline-block; .textOverflow(); } @@ -164,7 +164,7 @@ color: @disabled-color; } -@media screen and (max-width: @screen-xl) and (min-width: @screen-lg) { +@media screen and (max-width: @screen-xl) and (min-width: @screen-lg) { .activeCard { margin-bottom: 24px; } diff --git a/src/routes/Exception/style.less b/src/routes/Exception/style.less index 44fccccf..91ec7dcf 100644 --- a/src/routes/Exception/style.less +++ b/src/routes/Exception/style.less @@ -1,5 +1,5 @@ .trigger { - background: "red"; + background: 'red'; :global(.ant-btn) { margin-right: 8px; margin-bottom: 12px; diff --git a/src/routes/Exception/triggerException.js b/src/routes/Exception/triggerException.js index 0a2d489e..2dccfb75 100644 --- a/src/routes/Exception/triggerException.js +++ b/src/routes/Exception/triggerException.js @@ -10,7 +10,7 @@ export default class TriggerException extends PureComponent { state = { isloading: false, }; - triggerError = (code) => { + triggerError = code => { this.setState({ isloading: true, }); diff --git a/src/routes/Forms/AdvancedForm.js b/src/routes/Forms/AdvancedForm.js index 5b557646..16b7e3b0 100644 --- a/src/routes/Forms/AdvancedForm.js +++ b/src/routes/Forms/AdvancedForm.js @@ -1,5 +1,17 @@ import React, { PureComponent } from 'react'; -import { Card, Button, Form, Icon, Col, Row, DatePicker, TimePicker, Input, Select, Popover } from 'antd'; +import { + Card, + Button, + Form, + Icon, + Col, + Row, + DatePicker, + TimePicker, + Input, + Select, + Popover, +} from 'antd'; import { connect } from 'dva'; import FooterToolbar from 'components/FooterToolbar'; import PageHeaderLayout from '../../layouts/PageHeaderLayout'; @@ -24,22 +36,26 @@ const fieldLabels = { type2: '任务类型', }; -const tableData = [{ - key: '1', - workId: '00001', - name: 'John Brown', - department: 'New York No. 1 Lake Park', -}, { - key: '2', - workId: '00002', - name: 'Jim Green', - department: 'London No. 1 Lake Park', -}, { - key: '3', - workId: '00003', - name: 'Joe Black', - department: 'Sidney No. 1 Lake Park', -}]; +const tableData = [ + { + key: '1', + workId: '00001', + name: 'John Brown', + department: 'New York No. 1 Lake Park', + }, + { + key: '2', + workId: '00002', + name: 'Jim Green', + department: 'London No. 1 Lake Park', + }, + { + key: '3', + workId: '00003', + name: 'Joe Black', + department: 'Sidney No. 1 Lake Park', + }, +]; class AdvancedForm extends PureComponent { state = { @@ -57,7 +73,7 @@ class AdvancedForm extends PureComponent { if (this.state.width !== width) { this.setState({ width }); } - } + }; render() { const { form, dispatch, submitting } = this.props; const { getFieldDecorator, validateFieldsAndScroll, getFieldsError } = form; @@ -78,13 +94,13 @@ class AdvancedForm extends PureComponent { if (!errors || errorCount === 0) { return null; } - const scrollToField = (fieldKey) => { + const scrollToField = fieldKey => { const labelNode = document.querySelector(`label[for="${fieldKey}"]`); if (labelNode) { labelNode.scrollIntoView(true); } }; - const errorList = Object.keys(errors).map((key) => { + const errorList = Object.keys(errors).map(key => { if (!errors[key]) { return null; } @@ -124,9 +140,7 @@ class AdvancedForm extends PureComponent { {getFieldDecorator('name', { rules: [{ required: true, message: '请输入仓库名称' }], - })( - - )} + })()} @@ -200,18 +214,14 @@ class AdvancedForm extends PureComponent { {getFieldDecorator('name2', { rules: [{ required: true, message: '请输入' }], - })( - - )} + })()} {getFieldDecorator('url2', { rules: [{ required: true, message: '请选择' }], - })( - - )} + })()} diff --git a/src/routes/Forms/BasicForm.js b/src/routes/Forms/BasicForm.js index bb1b3355..967ced1f 100644 --- a/src/routes/Forms/BasicForm.js +++ b/src/routes/Forms/BasicForm.js @@ -1,7 +1,16 @@ import React, { PureComponent } from 'react'; import { connect } from 'dva'; import { - Form, Input, DatePicker, Select, Button, Card, InputNumber, Radio, Icon, Tooltip, + Form, + Input, + DatePicker, + Select, + Button, + Card, + InputNumber, + Radio, + Icon, + Tooltip, } from 'antd'; import PageHeaderLayout from '../../layouts/PageHeaderLayout'; import styles from './style.less'; @@ -16,7 +25,7 @@ const { TextArea } = Input; })) @Form.create() export default class BasicForms extends PureComponent { - handleSubmit = (e) => { + handleSubmit = e => { e.preventDefault(); this.props.form.validateFieldsAndScroll((err, values) => { if (!err) { @@ -26,7 +35,7 @@ export default class BasicForms extends PureComponent { }); } }); - } + }; render() { const { submitting } = this.props; const { getFieldDecorator, getFieldValue } = this.props.form; @@ -51,60 +60,57 @@ export default class BasicForms extends PureComponent { }; return ( - + -
    - + + {getFieldDecorator('title', { - rules: [{ - required: true, message: '请输入标题', - }], - })( - - )} + rules: [ + { + required: true, + message: '请输入标题', + }, + ], + })()} - + {getFieldDecorator('date', { - rules: [{ - required: true, message: '请选择起止日期', - }], - })( - - )} + rules: [ + { + required: true, + message: '请选择起止日期', + }, + ], + })()} - + {getFieldDecorator('goal', { - rules: [{ - required: true, message: '请输入目标描述', - }], + rules: [ + { + required: true, + message: '请输入目标描述', + }, + ], })( -