Merge pull request #144 from ts-react/v1

V1

Author: wangxingkang

.prettierignore

@@ -1,7 +1,5 @@
-**.*.md
 **/*.svg
-**/*.ejs
-**/*.html
 package.json
+
 .umi
 .umi-production

.prettierrc.js

@@ -1,8 +1,9 @@
 module.exports = {
-  tabWidth: 2,
-  semi: true,
+  // 行最大长度规则
+  printWidth: 100,
+  // 使用单引号
   singleQuote: true,
   bracketSpacing: true,
-  jsxBracketSameLine: false,
-  arrowParens: 'always'
+  trailingComma: 'all',
+  proseWrap: 'never'
 };

.stylelintrc.json

@@ -2,13 +2,15 @@
   "extends": [
     "stylelint-config-standard",
     "stylelint-config-rational-order",
-    "stylelint-config-prettier"
+    "stylelint-prettier/recommended"
   ],
   "plugins": [
+    "stylelint-prettier",
     "stylelint-order",
     "stylelint-declaration-block-no-ignored-properties"
   ],
   "rules": {
+    "prettier/prettier": true,
     "no-descending-specificity": null,
     "plugin/declaration-block-no-ignored-properties": true
   }

lint-staged.config.js

@@ -12,16 +12,13 @@
     "build:prod": "cross-env SERVER_ENV=production umi build",
     "build:web": "yarn build && cd ./dist && anywhere -h localhost -p 8080",
     "gh-pages": "yarn build:prod && gh-pages -d dist",
-    "lint-staged": "lint-staged",
-    "lint-staged:ts": "npm run tsc",
     "lint:ts": "tslint --project tsconfig.json --format codeFrame",
     "lint:style": "stylelint --fix 'src/**/*.less' --syntax less",
     "docker:build": "./scripts/docker-build.sh",
     "tsc": "tsc",
     "test": "umi test",
     "test:component": "umi test ./src/components",
-    "deploy": "yarn build && rm -rf node_modules/gh-pages/.cache && gh-pages -d dist",
-    "prettier": "prettier --write ./src/**/**/**/*"
+    "deploy": "yarn build && rm -rf node_modules/gh-pages/.cache && gh-pages -d dist"
   },
   "repository": "https://github.com/ts-react/react-admin-template.git",
   "author": "JiuMao FE Team",
@@ -89,26 +86,35 @@
     "husky": "^2.2.0",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^24.1.0",
-    "lint-staged": "^8.1.4",
+    "lint-staged": "^8.1.7",
     "mockjs": "^1.0.1-beta3",
-    "prettier": "^1.17.0",
+    "prettier": "^1.17.1",
     "rimraf": "^2.6.2",
     "stylelint": "^10.0.1",
     "stylelint-config-prettier": "^5.2.0",
     "stylelint-config-rational-order": "^0.1.2",
     "stylelint-config-standard": "^18.3.0",
     "stylelint-declaration-block-no-ignored-properties": "^2.1.0",
     "stylelint-order": "^3.0.0",
+    "stylelint-prettier": "^1.1.1",
     "typescript": "^3.5.1",
     "umi": "^2.6.17",
     "umi-plugin-react": "^1.7.5",
     "umi-types": "^0.3.2"
   },
   "husky": {
     "hooks": {
+      "pre-commit": "lint-staged",
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
     }
   },
+  "lint-staged": {
+    "**/*.less": "stylelint --syntax less",
+    "**/*.{js,ts,tsx,md,json,jsx,less}": [
+      "prettier --write",
+      "git add"
+    ]
+  },
   "engines": {
     "node": ">=8.9.0"
   }

package.json

@@ -11,16 +11,17 @@ interface IProps extends PageHeaderProps {
   wrapperClassName?: string;
 }
 
-const PageHeaderWrapper: React.FC<IProps> = (props) => {
+const PageHeaderWrapper: React.FC<IProps> = props => {
   const { wrapperClassName, prefixCls, ...restProps } = props;
   const { location, breadcrumbNameMap } = React.useContext(MenuContext);
 
   const getRoutes = (pathname, breadcrumbNameMap) => {
     const pathSnippets = urlToList(pathname);
     const routes = [];
 
-    pathSnippets.forEach((url) => {
+    pathSnippets.forEach(url => {
       const menuData = breadcrumbNameMap[url];
+      if (!menuData) return;
       routes.push({
         path: menuData.path,
         breadcrumbName: menuData.name,
@@ -32,9 +33,11 @@ const PageHeaderWrapper: React.FC<IProps> = (props) => {
 
   const itemRender = (route, params, routes) => {
     const last = routes.indexOf(route) === routes.length - 1;
-    return last
-      ? <span>{route.breadcrumbName}</span>
-      : <Link to={route.path}>{route.breadcrumbName}</Link>;
+    return last ? (
+      <span>{route.breadcrumbName}</span>
+    ) : (
+      <Link to={route.path}>{route.breadcrumbName}</Link>
+    );
   };
 
   const pathname = location!.pathname;
@@ -43,22 +46,22 @@ const PageHeaderWrapper: React.FC<IProps> = (props) => {
   return (
     <div
       className={classNames(wrapperClassName, {
-        [`${prefixCls}`]: true
+        [`${prefixCls}`]: true,
       })}
     >
       <PageHeader
         breadcrumb={{
           itemRender,
-          routes
+          routes,
         }}
         {...restProps}
       />
     </div>
-  )
+  );
 };
 
 PageHeaderWrapper.defaultProps = {
-  prefixCls: 'lotus-page-header-wrapper'
+  prefixCls: 'lotus-page-header-wrapper',
 };
 
 export default PageHeaderWrapper;

src/components/page-header-wrapper/page-header-wrapper.tsx

@@ -1,17 +1,12 @@
 import React, { useState } from 'react';
 import classNames from 'classnames';
 import { Table } from 'antd';
-import {
-  PaginationConfig,
-  TableProps,
-  SorterResult,
-  TableCurrentDataSource
-} from 'antd/es/table';
+import { PaginationConfig, TableProps, SorterResult, TableCurrentDataSource } from 'antd/es/table';
 import './standard-table.less';
 
 export interface ITableData<T> {
   list: T[];
-  pagination?: PaginationConfig
+  pagination?: PaginationConfig;
 }
 
 interface IProps<T> extends TableProps<T> {
@@ -26,50 +21,57 @@ interface IProps<T> extends TableProps<T> {
   ) => void;
 }
 
-const StandardTable: React.FC<IProps<any>> = (props) => {
-  const {
-    className,
-    prefixCls,
-    style,
-    rowKey,
-    data,
-    onChange,
-    ...restProps
-  } = props;
+const StandardTable: React.FC<IProps<any>> = props => {
+  const { className, prefixCls, style, rowKey, data, onChange, onSelectRow, ...restProps } = props;
   const { list = [], pagination } = data;
   const [selectedRowKeys, setSelectedRowKeys] = useState<string[] | number[]>([]);
 
-  const handleTableChange = (
-    pagination,
-    filters,
-    sorter
-  ) => {
+  const handleTableChange = (pagination, filters, sorter) => {
     onChange && onChange(pagination, filters, sorter);
   };
 
+  const handleShowTotal = (total, range) => {
+    return `共 ${total} 条`;
+  };
+
   const paginationProps = {
     showSizeChanger: true,
     showQuickJumper: true,
+    showTotal: handleShowTotal,
+    pageSizeOptions: ['10', '30', '50'],
     ...pagination,
   };
 
+  const handleRowSelectChange = (selectedRowKeys: string[] | number[], selectedRows: any[]) => {
+    onSelectRow && onSelectRow(selectedRows);
+
+    setSelectedRowKeys(selectedRowKeys);
+  };
+
+  const rowSelection = {
+    selectedRowKeys,
+    onChange: handleRowSelectChange,
+  };
+
   return (
     <Table
       className={classNames(className, {
-        [`${prefixCls}`]: true
+        [`${prefixCls}`]: true,
       })}
       style={style}
       rowKey={rowKey}
       dataSource={list}
+      rowSelection={onSelectRow ? rowSelection : null}
       pagination={paginationProps}
       onChange={handleTableChange}
       {...restProps}
     />
-  )
+  );
 };
 
 StandardTable.defaultProps = {
-  rowKey: 'id'
+  prefixCls: 'lotus-standard-table',
+  rowKey: 'id',
 };
 
 export default StandardTable;