From a12b3579845690808d76fea5ea4ee7f02069b2f7 Mon Sep 17 00:00:00 2001 From: wangxingkang Date: Mon, 14 Feb 2022 14:09:49 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=8D=87=E7=BA=A7=E7=9B=B8=E5=85=B3?= =?UTF-8?q?=E4=BE=9D=E8=B5=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 54 +++++++------ .../right-content/avatar-dropdown.tsx | 10 +-- src/layouts/user-layout.tsx | 4 +- src/pages/404.tsx | 4 +- src/pages/dashboard/index.tsx | 4 - src/pages/index.tsx | 11 --- .../amap/components/cluster/index.tsx | 7 +- src/pages/libraries/amap/index.tsx | 26 +++---- src/pages/libraries/watermark/index.tsx | 35 +++------ .../action/components/operation.tsx | 75 ++++++++++--------- src/pages/permission/action/index.tsx | 9 +-- src/pages/permission/button/index.tsx | 4 +- src/pages/permission/page/index.tsx | 5 +- src/pages/permission/policy/index.tsx | 4 +- src/pages/register/index.tsx | 3 +- src/pages/system/role/index.tsx | 4 +- src/pages/system/user/index.tsx | 4 +- 17 files changed, 107 insertions(+), 156 deletions(-) delete mode 100644 src/pages/index.tsx diff --git a/package.json b/package.json index facddf68..51b461b7 100644 --- a/package.json +++ b/package.json @@ -20,45 +20,47 @@ }, "dependencies": { "@alitajs/antd-plus": "^2.5.0", - "@ant-design/icons": "^4.6.2", - "@ant-design/pro-card": "^1.11.6", - "@ant-design/pro-layout": "^6.16.0", - "@ant-design/pro-table": "^2.32.1", - "@formily/antd": "^1.3.13", - "@formily/antd-components": "^1.3.13", - "@pansy/hooks": "^2.3.0", + "@ant-design/icons": "^4.7.0", + "@ant-design/pro-card": "^1.18.30", + "@ant-design/pro-layout": "^6.32.12", + "@ant-design/pro-table": "^2.63.4", + "@formily/antd": "^2.0.10", + "@formily/antd-components": "^1.3.17", + "@formily/core": "^2.0.10", + "@formily/react": "^2.0.10", "@pansy/policy": "^0.5.0", - "@pansy/react-amap": "1.1.0", + "@pansy/react-amap": "2.12.3", "@pansy/react-charts": "^1.0.0", - "@pansy/react-watermark": "^2.1.0", - "antd": "^4.15.0", - "classnames": "^2.2.6", + "@pansy/react-hooks": "^0.9.2", + "@pansy/react-watermark": "^3.1.8", + "antd": "^4.18.6", + "classnames": "^2.3.1", "moment": "^2.29.1", "numeral": "^2.0.6", "react": "^17.0.2", "react-dom": "^17.0.2", - "react-helmet-async": "^1.0.9", - "styled-components": "^5.2.2", - "umi": "^3.4.7", - "umi-request": "^1.3.5", + "react-helmet-async": "^1.2.2", + "styled-components": "^5.3.3", + "umi": "^3.5.20", + "umi-request": "^1.4.0", "use-merge-value": "^1.0.2" }, "devDependencies": { "@alitajs/umi-plugin-antd-plus": "0.2.0", "@alitajs/umi-plugin-console-version": "0.4.0", "@alitajs/umi-preset-react": "0.3.0", - "@types/classnames": "2.3.0", - "@types/numeral": "2.0.1", - "@types/react": "17.0.3", - "@types/react-dom": "17.0.3", - "@types/styled-components": "5.1.10", + "@types/classnames": "2.3.1", + "@types/numeral": "2.0.2", + "@types/react": "17.0.39", + "@types/react-dom": "17.0.11", + "@types/styled-components": "5.1.22", "@walrus/cli": "1.3.4", - "@walrus/plugin-release": "1.13.0", + "@walrus/plugin-release": "1.14.3", "@walrus/preset-lint": "1.1.8", - "better-mock": "0.3.1", + "better-mock": "0.3.2", "cross-env": "7.0.3", "husky": "5.2.0", - "typescript": "4.2.4" + "typescript": "4.5.5" }, "husky": { "hooks": { @@ -70,9 +72,5 @@ "> 1%", "last 2 versions", "not ie < 10" - ], - "engines": { - "node": ">=10.13.0", - "yarn": ">=1.3.2" - } + ] } diff --git a/src/components/right-content/avatar-dropdown.tsx b/src/components/right-content/avatar-dropdown.tsx index ed0a61e3..0437f850 100644 --- a/src/components/right-content/avatar-dropdown.tsx +++ b/src/components/right-content/avatar-dropdown.tsx @@ -1,6 +1,7 @@ import React, { useCallback } from 'react'; import { LogoutOutlined, SettingOutlined, UserOutlined } from '@ant-design/icons'; import { Avatar, Menu, Spin } from 'antd'; +import { MenuProps } from 'antd/es/menu'; import { history, useModel } from 'umi'; import { getPageQuery } from '@/utils'; import { fetchLogout } from '@/services/login'; @@ -32,13 +33,8 @@ const loginOut = async () => { const AvatarDropdown: React.FC = ({ menu }) => { const { initialState, setInitialState } = useModel('@@initialState'); - const onMenuClick = useCallback( - (event: { - key: React.Key; - keyPath: React.Key[]; - item: React.ReactInstance; - domEvent: React.MouseEvent; - }) => { + const onMenuClick: MenuProps['onClick'] = useCallback( + (event) => { const { key } = event; if (key === 'logout') { // @ts-ignore diff --git a/src/layouts/user-layout.tsx b/src/layouts/user-layout.tsx index 77651f3b..77013259 100644 --- a/src/layouts/user-layout.tsx +++ b/src/layouts/user-layout.tsx @@ -1,4 +1,4 @@ -import React, { FC } from 'react'; +import React from 'react'; import { Link, useIntl, SelectLang } from 'umi'; import { MenuDataItem, @@ -18,7 +18,7 @@ export interface UserLayoutProps { route?: ProLayoutProps['route']; } -const UserLayout: FC = (props) => { +const UserLayout: React.FC = (props) => { const { children, location = { diff --git a/src/pages/404.tsx b/src/pages/404.tsx index 3480c6bb..12ecc8b2 100644 --- a/src/pages/404.tsx +++ b/src/pages/404.tsx @@ -2,7 +2,7 @@ import { Button, Result } from 'antd'; import React from 'react'; import { useHistory } from 'umi'; -const NoFoundPage: React.FC<{}> = () => { +export default () => { const history = useHistory(); return ( @@ -18,5 +18,3 @@ const NoFoundPage: React.FC<{}> = () => { /> ) }; - -export default NoFoundPage; diff --git a/src/pages/dashboard/index.tsx b/src/pages/dashboard/index.tsx index d6432eff..c3304e01 100644 --- a/src/pages/dashboard/index.tsx +++ b/src/pages/dashboard/index.tsx @@ -1,8 +1,6 @@ import React, { Suspense } from 'react'; import { Space, Row, Col } from 'antd'; -import moment from 'moment'; import { useRequest } from 'umi'; -import Watermark from '@pansy/react-watermark'; import { GridContent, PageLoading } from '@ant-design/pro-layout'; import { fetchChartData } from '@/services/dashboard'; @@ -21,8 +19,6 @@ const Dashboard: React.FC = () => { }> - - diff --git a/src/pages/index.tsx b/src/pages/index.tsx deleted file mode 100644 index 84d2a65f..00000000 --- a/src/pages/index.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import React, { FC } from 'react'; - -const Index: FC = () => { - return ( -
- Index Page -
- ) -} - -export default Index; diff --git a/src/pages/libraries/amap/components/cluster/index.tsx b/src/pages/libraries/amap/components/cluster/index.tsx index c1b3bdd5..0834aaad 100644 --- a/src/pages/libraries/amap/components/cluster/index.tsx +++ b/src/pages/libraries/amap/components/cluster/index.tsx @@ -1,8 +1,11 @@ import React from 'react'; -import { ClusterComponentProps } from '@pansy/react-amap/es/markers'; import styles from './index.less'; -export const Cluster: React.FC = ({ count }) => { +export interface ClusterProps { + count: number; +} + +export const Cluster: React.FC = ({ count }) => { return (
{count} diff --git a/src/pages/libraries/amap/index.tsx b/src/pages/libraries/amap/index.tsx index ccd115f2..2d148909 100644 --- a/src/pages/libraries/amap/index.tsx +++ b/src/pages/libraries/amap/index.tsx @@ -1,33 +1,27 @@ import React, { useState } from 'react'; import { PageContainer } from '@ant-design/pro-layout'; -import { Map, Markers, ControlBar } from '@pansy/react-amap'; -import { MarkersProps } from '@pansy/react-amap/es/markers'; +import { Map, ControlBar, MarkerCluster } from '@pansy/react-amap'; import { Marker, Cluster } from './components'; import './styles.less'; const randomMarker = (len: number) => ( Array(len).fill(true).map(() => ({ - position: { - longitude: 100 + Math.random() * 30, - latitude: 30 + Math.random() * 20, - }, - })) + lnglat: [ 100 + Math.random() * 30, 30 + Math.random() * 20,] + })) as AMap.MarkerCluster.DataOptions[] ); -const MapComponent: React.FC = () => { - const [markers] = useState(randomMarker(100)); +export default () => { + const [markers] = useState(randomMarker(100)); return (
- { - return - } + { + return }} render={() => } /> @@ -36,5 +30,3 @@ const MapComponent: React.FC = () => { ) } - -export default MapComponent; diff --git a/src/pages/libraries/watermark/index.tsx b/src/pages/libraries/watermark/index.tsx index d14bde86..28aae2df 100644 --- a/src/pages/libraries/watermark/index.tsx +++ b/src/pages/libraries/watermark/index.tsx @@ -1,37 +1,24 @@ -import React, { useState, useEffect, useRef } from 'react'; +import React, { useState } from 'react'; import moment from 'moment'; +import { useInterval } from '@pansy/react-hooks' import Watermark from '@pansy/react-watermark'; export default () => { - const interval = useRef(); const [watermarkTexts, setWatermarkTexts] = useState( ['王某某 6909', moment().format('YYYY-MM-DD HH:mm:ss')] ); - useEffect( - () => { - // @ts-ignore - interval.current = setInterval( - () => { - setWatermarkTexts((texts) => { - texts[1] = moment().format('YYYY-MM-DD HH:mm:ss'); + useInterval(() => { + setWatermarkTexts((texts) => { + texts[1] = moment().format('YYYY-MM-DD HH:mm:ss'); - return texts; - }) - }, - 3000 - ) - - return () => { - interval.current && clearInterval(interval.current); - } - }, - [] - ); + return texts; + }) + }, 3 * 1000); return ( -
- -
+ +
+ ) } diff --git a/src/pages/permission/action/components/operation.tsx b/src/pages/permission/action/components/operation.tsx index f5e56a74..7d8cd997 100644 --- a/src/pages/permission/action/components/operation.tsx +++ b/src/pages/permission/action/components/operation.tsx @@ -1,23 +1,24 @@ import React from 'react'; import { - SchemaForm, - SchemaMarkupField as Field, - createFormActions + Select, + Input, } from '@formily/antd'; +import { FormProvider, Field } from '@formily/react' +import { createForm } from '@formily/core' import { useRequest } from 'umi'; -import { Input, Select } from '@formily/antd-components' import { Button, Drawer } from 'antd'; -import { UseModalResult } from '@pansy/hooks/es/use-modal'; -import { createAction, updateAction } from '@/services/permission'; +import { UseModalResult } from '@pansy/react-hooks'; +import { createAction } from '@/services/permission'; import { modules } from '../../constant'; const TextArea = Input.TextArea; -const actions = createFormActions() const Operation: React.FC = ({ visible, - closeModal + close }) => { + const form = createForm() + const request = useRequest( (data: API.PermissionActionData) => { return createAction(data); @@ -31,14 +32,14 @@ const Operation: React.FC = ({ ); const handleSubmit = () => { - actions.submit((values) => { + form.submit((values) => { request.run(values); }); } const handleCancel = () => { - actions.reset(); - closeModal?.(); + form.reset(); + close?.(); } return ( @@ -63,43 +64,47 @@ const Operation: React.FC = ({
} > - { console.log(values); }} + = ({ - + ) } diff --git a/src/pages/permission/action/index.tsx b/src/pages/permission/action/index.tsx index 35abdde9..bd580d2a 100644 --- a/src/pages/permission/action/index.tsx +++ b/src/pages/permission/action/index.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Button } from 'antd'; import { PageContainer } from '@ant-design/pro-layout'; import Table, { ProColumns } from '@ant-design/pro-table'; -import { useModal } from '@pansy/hooks'; +import { useModal } from '@pansy/react-hooks'; import { fetchActionList } from '@/services/permission'; import { handleTableRequest } from '@/utils'; import Operation from './components/operation'; @@ -41,11 +41,11 @@ const columns: ProColumns[] = [ }, ] -const ActionList: React.FC = () => { +export default () => { const modal = useModal(); const handleClick = () => { - modal.openModal(); + modal.open(); } return ( @@ -53,6 +53,7 @@ const ActionList: React.FC = () => { columns={columns} request={(params, sorter, filter) => { + // @ts-ignore return handleTableRequest(params, sorter, filter, fetchActionList); }} rowKey="id" @@ -71,5 +72,3 @@ const ActionList: React.FC = () => { ) } - -export default ActionList; diff --git a/src/pages/permission/button/index.tsx b/src/pages/permission/button/index.tsx index 33f89ad4..d7a27f0a 100644 --- a/src/pages/permission/button/index.tsx +++ b/src/pages/permission/button/index.tsx @@ -4,7 +4,7 @@ import { Radio, Divider, Alert, Tag, Space } from 'antd'; import { RadioChangeEvent } from 'antd/es/radio/interface'; import { PageContainer } from '@ant-design/pro-layout'; -const PermissionButton: React.FC = () => { +export default () => { const [role, setRole] = useState('admin'); const { singleVerify } = useAuthority(); @@ -53,5 +53,3 @@ const PermissionButton: React.FC = () => { ) } - -export default PermissionButton; diff --git a/src/pages/permission/page/index.tsx b/src/pages/permission/page/index.tsx index 9f67927c..084266b9 100644 --- a/src/pages/permission/page/index.tsx +++ b/src/pages/permission/page/index.tsx @@ -3,8 +3,7 @@ import { Radio } from 'antd'; import { RadioChangeEvent } from 'antd/es/radio/interface'; import { PageContainer } from '@ant-design/pro-layout'; -const PermissionPage: React.FC = (props) => { - console.log(props); +export default () => { const [role, setRole] = useState('admin'); const handleChange = (e: RadioChangeEvent) => { @@ -27,5 +26,3 @@ const PermissionPage: React.FC = (props) => { ) } - -export default PermissionPage; diff --git a/src/pages/permission/policy/index.tsx b/src/pages/permission/policy/index.tsx index 3eb5953e..1aa9004b 100644 --- a/src/pages/permission/policy/index.tsx +++ b/src/pages/permission/policy/index.tsx @@ -1,12 +1,10 @@ import React from 'react'; import { PageContainer } from '@ant-design/pro-layout'; -const PolicyList: React.FC = () => { +export default () => { return ( Policy list page ) } - -export default PolicyList; diff --git a/src/pages/register/index.tsx b/src/pages/register/index.tsx index 8cbfcb80..1e2216c6 100644 --- a/src/pages/register/index.tsx +++ b/src/pages/register/index.tsx @@ -41,7 +41,7 @@ const passwordProgressMap: { poor: 'exception', }; -const Register: React.FC = () => { +export default () => { const [visible, setVisible] = useState(false); const [prefix, setPrefix] = useState('86'); const [popover, setPopover] = useState(false); @@ -256,4 +256,3 @@ const Register: React.FC = () => { ); }; -export default Register; diff --git a/src/pages/system/role/index.tsx b/src/pages/system/role/index.tsx index 1716a532..c3b4bf8e 100644 --- a/src/pages/system/role/index.tsx +++ b/src/pages/system/role/index.tsx @@ -1,12 +1,10 @@ import React from 'react'; import { PageContainer } from '@ant-design/pro-layout'; -const Role: React.FC = () => { +export default () => { return ( Role page ) } - -export default Role; diff --git a/src/pages/system/user/index.tsx b/src/pages/system/user/index.tsx index 315e3816..b8ecb76b 100644 --- a/src/pages/system/user/index.tsx +++ b/src/pages/system/user/index.tsx @@ -41,7 +41,7 @@ const columns: ProColumns[] = [ }, ] -const User: React.FC = () => { +export default () => { return ( @@ -60,5 +60,3 @@ const User: React.FC = () => { ) } - -export default User;