From eb51b87590e340ba851c40b2e87fbd36c4028998 Mon Sep 17 00:00:00 2001 From: afc163 Date: Mon, 7 Jul 2025 17:24:45 +0800 Subject: [PATCH] chore: fix biome lint errors --- biome.json | 3 + package.json | 2 +- src/app.tsx | 6 +- src/components/HeaderDropdown/index.tsx | 2 +- src/pages/account/center/_mock.ts | 21 +- .../center/components/Applications/index.tsx | 5 +- .../center/components/Articles/index.tsx | 7 +- .../center/components/AvatarList/index.tsx | 20 +- .../center/components/Projects/index.tsx | 12 +- src/pages/account/center/index.tsx | 46 ++- src/pages/account/settings/_mock.ts | 3 +- .../account/settings/components/base.tsx | 27 +- .../account/settings/components/binding.tsx | 6 +- .../settings/components/notification.tsx | 4 +- .../account/settings/components/security.tsx | 16 +- src/pages/account/settings/index.tsx | 10 +- src/pages/account/settings/service.ts | 4 +- src/pages/dashboard/analysis/_mock.ts | 2 +- .../components/Charts/ChartCard/index.tsx | 21 +- .../components/Charts/WaterWave/index.tsx | 6 +- .../analysis/components/IntroduceRow.tsx | 26 +- .../analysis/components/NumberInfo/index.tsx | 11 +- .../analysis/components/OfflineData.tsx | 15 +- .../analysis/components/ProportionSales.tsx | 1 + .../analysis/components/SalesCard.tsx | 34 +- .../analysis/components/TopSearch.tsx | 10 +- .../analysis/components/Trend/index.tsx | 6 +- src/pages/dashboard/analysis/index.tsx | 113 +++---- src/pages/dashboard/analysis/utils/utils.ts | 9 +- .../components/ActiveChart/index.style.ts | 10 +- .../monitor/components/ActiveChart/index.tsx | 13 +- .../components/Charts/WaterWave/index.tsx | 6 +- .../monitor/components/Charts/autoHeight.tsx | 4 +- .../monitor/components/Map/index.tsx | 10 +- src/pages/dashboard/monitor/index.tsx | 295 +++++++++--------- src/pages/dashboard/workplace/_mock.ts | 2 +- src/pages/dashboard/workplace/index.tsx | 20 +- src/pages/dashboard/workplace/style.style.ts | 28 +- .../advanced-form/components/TableForm.tsx | 24 +- src/pages/form/advanced-form/index.tsx | 15 +- src/pages/form/basic-form/index.tsx | 4 +- src/pages/form/step-form/index.tsx | 11 +- src/pages/list/basic-list/_mock.ts | 18 +- .../basic-list/components/OperationModal.tsx | 1 + src/pages/list/basic-list/index.tsx | 27 +- src/pages/list/basic-list/style.style.ts | 17 +- src/pages/list/card-list/_mock.ts | 18 +- src/pages/list/card-list/index.tsx | 32 +- src/pages/list/search/applications/_mock.ts | 18 +- .../components/StandardFormRow/index.tsx | 1 + .../components/TagSelect/index.tsx | 47 ++- src/pages/list/search/applications/index.tsx | 28 +- src/pages/list/search/articles/_mock.ts | 18 +- .../components/ArticleListContent/index.tsx | 1 + .../components/StandardFormRow/index.tsx | 1 + .../articles/components/TagSelect/index.tsx | 47 ++- src/pages/list/search/articles/index.tsx | 20 +- src/pages/list/search/index.tsx | 8 +- src/pages/list/search/projects/_mock.ts | 18 +- .../projects/components/AvatarList/index.tsx | 20 +- .../components/StandardFormRow/index.tsx | 1 + .../projects/components/TagSelect/index.tsx | 47 ++- src/pages/list/search/projects/index.tsx | 17 +- src/pages/list/table-list/_mock.ts | 22 +- src/pages/list/table-list/index.tsx | 22 +- src/pages/list/table-list/service.ts | 15 +- src/pages/profile/advanced/index.tsx | 60 +++- src/pages/profile/basic/index.tsx | 5 +- src/pages/result/success/index.tsx | 4 +- .../table-list/components/CreateForm.tsx | 9 +- .../table-list/components/UpdateForm.tsx | 4 +- src/pages/table-list/index.tsx | 17 +- src/pages/user/register/index.tsx | 19 +- 73 files changed, 1017 insertions(+), 455 deletions(-) diff --git a/biome.json b/biome.json index e7d474b2..00e41234 100644 --- a/biome.json +++ b/biome.json @@ -28,6 +28,9 @@ "suspicious": { "noExplicitAny": "off" }, + "correctness": { + "useExhaustiveDependencies": "off" + }, "a11y": { "noStaticElementInteractions": "off", "useValidAnchor": "off", diff --git a/package.json b/package.json index 1f69c76f..008c33d7 100644 --- a/package.json +++ b/package.json @@ -108,4 +108,4 @@ "create-umi" ] } -} \ No newline at end of file +} diff --git a/src/app.tsx b/src/app.tsx index f4396fa0..599b8111 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -41,7 +41,11 @@ export async function getInitialState(): Promise<{ }; // 如果不是登录页面，执行 const { location } = history; - if (![loginPath, '/user/register', '/user/register-result'].includes(location.pathname)) { + if ( + ![loginPath, '/user/register', '/user/register-result'].includes( + location.pathname, + ) + ) { const currentUser = await fetchUserInfo(); return { fetchUserInfo, diff --git a/src/components/HeaderDropdown/index.tsx b/src/components/HeaderDropdown/index.tsx index 71dddc3c..b77a8ded 100644 --- a/src/components/HeaderDropdown/index.tsx +++ b/src/components/HeaderDropdown/index.tsx @@ -1,6 +1,6 @@ import { Dropdown } from 'antd'; -import { createStyles } from 'antd-style'; import type { DropDownProps } from 'antd/es/dropdown'; +import { createStyles } from 'antd-style'; import classNames from 'classnames'; import React from 'react'; diff --git a/src/pages/account/center/_mock.ts b/src/pages/account/center/_mock.ts index a2fa9b6c..635dea0a 100644 --- a/src/pages/account/center/_mock.ts +++ b/src/pages/account/center/_mock.ts @@ -52,7 +52,8 @@ const user = [ // 当前用户信息 const currentUseDetail = { name: 'Serati Ma', - avatar: 'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png', + avatar: + 'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png', userid: '00000001', email: 'antdesign@alipay.com', signature: '海纳百川，有容乃大', @@ -171,7 +172,10 @@ function fakeList(count: number): ListItemDataType[] { 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] as | 'normal' | 'exception' @@ -180,8 +184,8 @@ function fakeList(count: number): ListItemDataType[] { percent: Math.ceil(Math.random() * 50) + 50, logo: avatars[i % 8], href: 'https://ant.design', - updatedAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), - createdAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), + updatedAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), + createdAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), subDescription: desc[i % 5], description: '在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，这些类似的组件会被抽离成一套标准规范。', @@ -194,17 +198,20 @@ function fakeList(count: number): ListItemDataType[] { '段落示意：蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。', members: [ { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', name: '曲丽丽', id: 'member1', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', name: '王昭君', id: 'member2', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', name: '董娜娜', id: 'member3', }, diff --git a/src/pages/account/center/components/Applications/index.tsx b/src/pages/account/center/components/Applications/index.tsx index 57bb2f74..a60e072d 100644 --- a/src/pages/account/center/components/Applications/index.tsx +++ b/src/pages/account/center/components/Applications/index.tsx @@ -107,7 +107,10 @@ const Applications: React.FC = () => { , ]} > - } title={item.title} /> + } + title={item.title} + />
{ const { styles } = useStyles(); const IconText: React.FC<{ @@ -36,7 +37,11 @@ const Articles: React.FC = () => { actions={[ } text={item.star} />, } text={item.like} />, - } text={item.message} />, + } + text={item.message} + />, ]} > | React.ReactElement[]; + children: + | React.ReactElement + | React.ReactElement[]; }; -const Item: React.FC = ({ src, size, tips, onClick = () => {} }) => { +const Item: React.FC = ({ + src, + size, + tips, + onClick = () => {}, +}) => { const { styles } = useStyles(); const avatarSizeToClassName = (size?: SizeType | 'mini') => classNames(styles.avatarItem, { @@ -51,7 +58,9 @@ const AvatarList: React.FC & { const { styles } = useStyles(); const numOfChildren = React.Children.count(children); const numToShow = maxLength >= numOfChildren ? numOfChildren : maxLength; - const childrenArray = React.Children.toArray(children) as React.ReactElement[]; + const childrenArray = React.Children.toArray( + children, + ) as React.ReactElement[]; const childrenWithProps = childrenArray.slice(0, numToShow).map((child) => React.cloneElement(child, { size, @@ -61,7 +70,10 @@ const AvatarList: React.FC & { const cls = avatarSizeToClassName(size); childrenWithProps.push(
  • - {`+${numOfChildren - maxLength}`} + {`+${numOfChildren - maxLength}`}
    • , ); } diff --git a/src/pages/account/center/components/Projects/index.tsx b/src/pages/account/center/components/Projects/index.tsx index 1d6ac5da..85b566c7 100644 --- a/src/pages/account/center/components/Projects/index.tsx +++ b/src/pages/account/center/components/Projects/index.tsx @@ -7,6 +7,7 @@ import type { ListItemDataType } from '../../data.d'; import { queryFakeList } from '../../service'; import AvatarList from '../AvatarList'; import useStyles from './index.style'; + dayjs.extend(relativeTime); const Projects: React.FC = () => { const { styles } = useStyles(); @@ -32,8 +33,15 @@ const Projects: React.FC = () => { dataSource={listData?.list || []} renderItem={(item) => ( - }> - {item.title}} description={item.subDescription} /> + } + > + {item.title}} + description={item.subDescription} + />
    {dayjs(item.updatedAt).fromNow()}
    diff --git a/src/pages/account/center/index.tsx b/src/pages/account/center/index.tsx index d73c1c01..2830f428 100644 --- a/src/pages/account/center/index.tsx +++ b/src/pages/account/center/index.tsx @@ -1,14 +1,29 @@ -import { ClusterOutlined, ContactsOutlined, HomeOutlined, PlusOutlined } from '@ant-design/icons'; +import { + ClusterOutlined, + ContactsOutlined, + HomeOutlined, + PlusOutlined, +} from '@ant-design/icons'; import { GridContent } from '@ant-design/pro-components'; import { useRequest } from '@umijs/max'; -import { Avatar, Card, Col, Divider, Input, type InputRef, Row, Tag } from 'antd'; +import { + Avatar, + Card, + Col, + Divider, + Input, + type InputRef, + Row, + Tag, +} from 'antd'; import React, { useRef, useState } from 'react'; import useStyles from './Center.style'; import Applications from './components/Applications'; import Articles from './components/Articles'; import Projects from './components/Projects'; -import type { CurrentUser, tabKeyType, TagType } from './data.d'; +import type { CurrentUser, TagType, tabKeyType } from './data.d'; import { queryCurrent } from './service'; + const operationTabList = [ { key: 'articles', @@ -76,7 +91,10 @@ const TagList: React.FC<{ }; const handleInputConfirm = () => { let tempsTags = [...newTags]; - if (inputValue && tempsTags.filter((tag) => tag.label === inputValue).length === 0) { + if ( + inputValue && + tempsTags.filter((tag) => tag.label === inputValue).length === 0 + ) { tempsTags = [ ...tempsTags, { @@ -132,7 +150,11 @@ const Center: React.FC = () => { }); // 渲染用户信息 - const renderUserInfo = ({ title, group, geographic }: Partial) => { + const renderUserInfo = ({ + title, + group, + geographic, + }: Partial) => { return (

    @@ -224,13 +246,13 @@ const Center: React.FC = () => {

    团队
    {currentUser.notice?.map((item) => ( - - - - {item.member} - - - ))} + + + + {item.member} + + + ))}
    diff --git a/src/pages/account/settings/_mock.ts b/src/pages/account/settings/_mock.ts index e0ab541d..4e786929 100644 --- a/src/pages/account/settings/_mock.ts +++ b/src/pages/account/settings/_mock.ts @@ -19,7 +19,8 @@ function getCurrentUse(_req: Request, res: Response) { return res.json({ data: { name: 'Serati Ma', - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png', userid: '00000001', email: 'antdesign@alipay.com', signature: '海纳百川，有容乃大', diff --git a/src/pages/account/settings/components/base.tsx b/src/pages/account/settings/components/base.tsx index 8e02506e..2d224392 100644 --- a/src/pages/account/settings/components/base.tsx +++ b/src/pages/account/settings/components/base.tsx @@ -13,7 +13,11 @@ import React from 'react'; import { queryCity, queryCurrent, queryProvince } from '../service'; import useStyles from './index.style'; -const validatorPhone = (_rule: any, value: string[], callback: (message?: string) => void) => { +const validatorPhone = ( + _rule: any, + value: string[], + callback: (message?: string) => void, +) => { if (!value[0]) { callback('Please input your area code!'); } @@ -50,7 +54,8 @@ const BaseView: React.FC = () => { if (currentUser.avatar) { return currentUser.avatar; } - const url = 'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png'; + const url = + 'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png'; return url; } return ''; @@ -175,14 +180,16 @@ const BaseView: React.FC = () => { if (!province?.key) { return []; } - return queryCity(province.key || '').then(({ data }) => { - return data.map((item) => { - return { - label: item.name, - value: item.id, - }; - }); - }); + return queryCity(province.key || '').then( + ({ data }) => { + return data.map((item) => { + return { + label: item.name, + value: item.id, + }; + }); + }, + ); }} /> ); diff --git a/src/pages/account/settings/components/binding.tsx b/src/pages/account/settings/components/binding.tsx index 002c4596..8ddfc7f3 100644 --- a/src/pages/account/settings/components/binding.tsx +++ b/src/pages/account/settings/components/binding.tsx @@ -1,4 +1,8 @@ -import { AlipayOutlined, DingdingOutlined, TaobaoOutlined } from '@ant-design/icons'; +import { + AlipayOutlined, + DingdingOutlined, + TaobaoOutlined, +} from '@ant-design/icons'; import { List } from 'antd'; import React, { Fragment } from 'react'; diff --git a/src/pages/account/settings/components/notification.tsx b/src/pages/account/settings/components/notification.tsx index 177c38ce..b7f274b8 100644 --- a/src/pages/account/settings/components/notification.tsx +++ b/src/pages/account/settings/components/notification.tsx @@ -5,7 +5,9 @@ type Unpacked = T extends (infer U)[] ? U : T; const NotificationView: React.FC = () => { const getData = () => { - const Action = ; + const Action = ( + + ); return [ { title: '账户密码', diff --git a/src/pages/account/settings/components/security.tsx b/src/pages/account/settings/components/security.tsx index 3a1507d8..97a7436e 100644 --- a/src/pages/account/settings/components/security.tsx +++ b/src/pages/account/settings/components/security.tsx @@ -46,14 +46,14 @@ const SecurityView: React.FC = () => { const data = getData(); return ( > - itemLayout="horizontal" - dataSource={data} - renderItem={(item) => ( - - - - )} - /> + itemLayout="horizontal" + dataSource={data} + renderItem={(item) => ( + + + + )} + /> ); }; diff --git a/src/pages/account/settings/index.tsx b/src/pages/account/settings/index.tsx index 72874883..3b0a3402 100644 --- a/src/pages/account/settings/index.tsx +++ b/src/pages/account/settings/index.tsx @@ -6,6 +6,7 @@ import BindingView from './components/binding'; import NotificationView from './components/notification'; import SecurityView from './components/security'; import useStyles from './style.style'; + type SettingsStateKeys = 'base' | 'security' | 'binding' | 'notification'; type SettingsState = { mode: 'inline' | 'horizontal'; @@ -23,7 +24,7 @@ const Settings: React.FC = () => { mode: 'inline', selectKey: 'base', }); - const dom = useRef(); + const dom = useRef(null); const resize = () => { requestAnimationFrame(() => { if (!dom.current) { @@ -51,9 +52,12 @@ const Settings: React.FC = () => { return () => { window.removeEventListener('resize', resize); }; - }, [resize]); + }, []); const getMenu = () => { - return Object.keys(menuMap).map((item) => ({ key: item, label: menuMap[item] })); + return Object.keys(menuMap).map((item) => ({ + key: item, + label: menuMap[item], + })); }; const renderChildren = () => { const { selectKey } = initConfig; diff --git a/src/pages/account/settings/service.ts b/src/pages/account/settings/service.ts index fb047d20..2daaf243 100644 --- a/src/pages/account/settings/service.ts +++ b/src/pages/account/settings/service.ts @@ -9,7 +9,9 @@ export async function queryProvince(): Promise<{ data: GeographicItemType[] }> { return request('/api/geographic/province'); } -export async function queryCity(province: string): Promise<{ data: GeographicItemType[] }> { +export async function queryCity( + province: string, +): Promise<{ data: GeographicItemType[] }> { return request(`/api/geographic/city/${province}`); } diff --git a/src/pages/dashboard/analysis/_mock.ts b/src/pages/dashboard/analysis/_mock.ts index ffd294ae..4b6a0767 100644 --- a/src/pages/dashboard/analysis/_mock.ts +++ b/src/pages/dashboard/analysis/_mock.ts @@ -126,7 +126,7 @@ for (let i = 0; i < 10; i += 1) { } const offlineChartData = []; for (let i = 0; i < 20; i += 1) { - const date = dayjs(Date.now()+ 1000 * 60 * 30 * i).format('HH:mm'); + const date = dayjs(Date.now() + 1000 * 60 * 30 * i).format('HH:mm'); offlineChartData.push({ date, type: '客流量', diff --git a/src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx b/src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx index f527c0e4..9ce4ecdc 100644 --- a/src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx +++ b/src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx @@ -4,6 +4,7 @@ import type { CardProps } from 'antd/es/card'; import classNames from 'classnames'; import React from 'react'; import useStyles from './index.style'; + type totalType = () => React.ReactNode; export type ChartCardProps = { @@ -36,7 +37,16 @@ const ChartCard: React.FC = (props) => { return totalDom; }; const renderContent = () => { - const { contentHeight, title, avatar, action, total, footer, children, loading } = props; + const { + contentHeight, + title, + avatar, + action, + total, + footer, + children, + loading, + } = props; if (loading) { return false; } @@ -63,7 +73,9 @@ const ChartCard: React.FC = (props) => { height: contentHeight || 'auto', }} > -
    {children}
    +
    + {children} +
    )} {footer && ( @@ -79,10 +91,7 @@ const ChartCard: React.FC = (props) => { ); }; - const { - loading = false, - ...rest - } = props; + const { loading = false, ...rest } = props; return ( { const bR = radius - lineWidth; const circleOffset = -(Math.PI / 2); let circleLock = true; - for (let i = circleOffset; i < circleOffset + 2 * Math.PI; i += 1 / (8 * Math.PI)) { + for ( + let i = circleOffset; + i < circleOffset + 2 * Math.PI; + i += 1 / (8 * Math.PI) + ) { arcStack.push([radius + bR * Math.cos(i), radius + bR * Math.sin(i)]); } const cStartPoint = arcStack.shift() as number[]; diff --git a/src/pages/dashboard/analysis/components/IntroduceRow.tsx b/src/pages/dashboard/analysis/components/IntroduceRow.tsx index a56ecf3a..432d10c0 100644 --- a/src/pages/dashboard/analysis/components/IntroduceRow.tsx +++ b/src/pages/dashboard/analysis/components/IntroduceRow.tsx @@ -7,6 +7,7 @@ import useStyles from '../style.style'; import Yuan from '../utils/Yuan'; import { ChartCard, Field } from './Charts'; import Trend from './Trend'; + const topColResponsiveProps = { xs: 24, sm: 12, @@ -17,7 +18,13 @@ const topColResponsiveProps = { marginBottom: 24, }, }; -const IntroduceRow = ({ loading, visitData }: { loading: boolean; visitData: DataItem[] }) => { +const IntroduceRow = ({ + loading, + visitData, +}: { + loading: boolean; + visitData: DataItem[]; +}) => { const { styles } = useStyles(); return ( @@ -32,7 +39,12 @@ const IntroduceRow = ({ loading, visitData }: { loading: boolean; visitData: Dat } loading={loading} total={() => 126560} - footer={} + footer={ + + } contentHeight={46} > } total={numeral(8846).format('0,0')} - footer={} + footer={ + + } contentHeight={46} > - + diff --git a/src/pages/dashboard/analysis/components/NumberInfo/index.tsx b/src/pages/dashboard/analysis/components/NumberInfo/index.tsx index 64af6f9c..fe3062b7 100644 --- a/src/pages/dashboard/analysis/components/NumberInfo/index.tsx +++ b/src/pages/dashboard/analysis/components/NumberInfo/index.tsx @@ -33,7 +33,10 @@ const NumberInfo: React.FC = ({ {...rest} > {title && ( -
    +
    {title}
    )} @@ -62,7 +65,11 @@ const NumberInfo: React.FC = ({ {(status || subTotal) && ( {subTotal} - {status && status === 'up' ? : } + {status && status === 'up' ? ( + + ) : ( + + )} )}
    diff --git a/src/pages/dashboard/analysis/components/OfflineData.tsx b/src/pages/dashboard/analysis/components/OfflineData.tsx index 7dc794c6..a9e5164a 100644 --- a/src/pages/dashboard/analysis/components/OfflineData.tsx +++ b/src/pages/dashboard/analysis/components/OfflineData.tsx @@ -3,6 +3,7 @@ import { Card, Col, Row, Tabs } from 'antd'; import type { DataItem, OfflineDataType } from '../data.d'; import useStyles from '../style.style'; import NumberInfo from './NumberInfo'; + const CustomTab = ({ data, currentTabKey: currentKey, @@ -32,7 +33,12 @@ const CustomTab = ({ paddingTop: 36, }} > - + ); @@ -81,7 +87,12 @@ const OfflineData = ({ slider={{ x: true }} axis={{ x: { title: false }, - y: { title: false, gridLineDash: null, gridStroke: '#ccc', gridStrokeOpacity: 1 }, + y: { + title: false, + gridLineDash: null, + gridStroke: '#ccc', + gridStrokeOpacity: 1, + }, }} legend={{ color: { diff --git a/src/pages/dashboard/analysis/components/ProportionSales.tsx b/src/pages/dashboard/analysis/components/ProportionSales.tsx index d36ea852..57f9b79e 100644 --- a/src/pages/dashboard/analysis/components/ProportionSales.tsx +++ b/src/pages/dashboard/analysis/components/ProportionSales.tsx @@ -5,6 +5,7 @@ import numeral from 'numeral'; import React from 'react'; import type { DataItem } from '../data.d'; import useStyles from '../style.style'; + const { Text } = Typography; const ProportionSales = ({ dropdownGroup, diff --git a/src/pages/dashboard/analysis/components/SalesCard.tsx b/src/pages/dashboard/analysis/components/SalesCard.tsx index 7a31038f..6939acf8 100644 --- a/src/pages/dashboard/analysis/components/SalesCard.tsx +++ b/src/pages/dashboard/analysis/components/SalesCard.tsx @@ -50,16 +50,28 @@ const SalesCard = ({ tabBarExtraContent={
    @@ -123,7 +135,10 @@ const SalesCard = ({ > {i + 1} - + {item.title} {numeral(item.total).format('0,0')} @@ -174,12 +189,17 @@ const SalesCard = ({
  • {i + 1} - + {item.title} {numeral(item.total).format('0,0')} diff --git a/src/pages/dashboard/analysis/components/TopSearch.tsx b/src/pages/dashboard/analysis/components/TopSearch.tsx index 94c985a3..d6a0fef4 100644 --- a/src/pages/dashboard/analysis/components/TopSearch.tsx +++ b/src/pages/dashboard/analysis/components/TopSearch.tsx @@ -116,7 +116,10 @@ const TopSearch = ({ height={45} axis={false} padding={-12} - style={{ fill: 'linear-gradient(-90deg, white 0%, #6294FA 100%)', fillOpacity: 0.4 }} + style={{ + fill: 'linear-gradient(-90deg, white 0%, #6294FA 100%)', + fillOpacity: 0.4, + }} data={visitData2} /> @@ -151,7 +154,10 @@ const TopSearch = ({ shapeField="smooth" height={45} padding={-12} - style={{ fill: 'linear-gradient(-90deg, white 0%, #6294FA 100%)', fillOpacity: 0.4 }} + style={{ + fill: 'linear-gradient(-90deg, white 0%, #6294FA 100%)', + fillOpacity: 0.4, + }} data={visitData2} axis={false} /> diff --git a/src/pages/dashboard/analysis/components/Trend/index.tsx b/src/pages/dashboard/analysis/components/Trend/index.tsx index c39e20d4..110a4aec 100644 --- a/src/pages/dashboard/analysis/components/Trend/index.tsx +++ b/src/pages/dashboard/analysis/components/Trend/index.tsx @@ -30,7 +30,11 @@ const Trend: React.FC = ({ className, ); return ( -
    +
    {children} {flag && ( diff --git a/src/pages/dashboard/analysis/index.tsx b/src/pages/dashboard/analysis/index.tsx index e3f69364..9116b802 100644 --- a/src/pages/dashboard/analysis/index.tsx +++ b/src/pages/dashboard/analysis/index.tsx @@ -18,8 +18,8 @@ import type { AnalysisData } from './data.d'; import { fakeChartData } from './service'; import useStyles from './style.style'; import { getTimeDistance } from './utils/utils'; -type RangePickerValue = RangePickerProps[ - 'value']; + +type RangePickerValue = RangePickerProps['value']; type AnalysisProps = { dashboardAndanalysis: AnalysisData; loading: boolean; @@ -63,7 +63,10 @@ const Analysis: FC = () => { if (salesType === 'all') { salesPieData = data?.salesTypeData; } else { - salesPieData = salesType === 'online' ? data?.salesTypeDataOnline : data?.salesTypeDataOffline; + salesPieData = + salesType === 'online' + ? data?.salesTypeDataOnline + : data?.salesTypeDataOffline; } const dropdownGroup = ( @@ -93,64 +96,62 @@ const Analysis: FC = () => { const handleTabChange = (key: string) => { setCurrentTabKey(key); }; - const activeKey = currentTabKey || (data?.offlineData[0]?.name) || ''; + const activeKey = currentTabKey || data?.offlineData[0]?.name || ''; return ( + }> + + - }> - - - - - - - - - - - - - - - - - - - + + + - - - + + + + + + + + + + + + + + + ); }; diff --git a/src/pages/dashboard/analysis/utils/utils.ts b/src/pages/dashboard/analysis/utils/utils.ts index 425f519e..d0b6acdd 100644 --- a/src/pages/dashboard/analysis/utils/utils.ts +++ b/src/pages/dashboard/analysis/utils/utils.ts @@ -7,7 +7,9 @@ export function fixedZero(val: number) { return val * 1 < 10 ? `0${val}` : val; } -export function getTimeDistance(type: 'today' | 'week' | 'month' | 'year'): RangePickerValue { +export function getTimeDistance( + type: 'today' | 'week' | 'month' | 'year', +): RangePickerValue { const now = new Date(); const oneDay = 1000 * 60 * 60 * 24; @@ -44,7 +46,10 @@ export function getTimeDistance(type: 'today' | 'week' | 'month' | 'year'): Rang return [ dayjs(`${year}-${fixedZero(month + 1)}-01 00:00:00`), - dayjs(dayjs(`${nextYear}-${fixedZero(nextMonth + 1)}-01 00:00:00`).valueOf() - 1000), + dayjs( + dayjs(`${nextYear}-${fixedZero(nextMonth + 1)}-01 00:00:00`).valueOf() - + 1000, + ), ]; } diff --git a/src/pages/dashboard/monitor/components/ActiveChart/index.style.ts b/src/pages/dashboard/monitor/components/ActiveChart/index.style.ts index 4307c905..af0e058c 100644 --- a/src/pages/dashboard/monitor/components/ActiveChart/index.style.ts +++ b/src/pages/dashboard/monitor/components/ActiveChart/index.style.ts @@ -15,7 +15,12 @@ const useStyles = createStyles(() => { marginTop: '8px', fontSize: '0', lineHeight: '20px', - span: { display: 'inline-block', width: '33.33%', fontSize: '12px', textAlign: 'center' }, + span: { + display: 'inline-block', + width: '33.33%', + fontSize: '12px', + textAlign: 'center', + }, 'span:first-child': { textAlign: 'left' }, 'span:last-child': { textAlign: 'right' }, }, @@ -31,7 +36,8 @@ const useStyles = createStyles(() => { left: '0', width: '100%', height: '100%', - backgroundImage: 'linear-gradient(to right, transparent 50%, #e9e9e9 50%)', + backgroundImage: + 'linear-gradient(to right, transparent 50%, #e9e9e9 50%)', backgroundSize: '6px', }, 'dashedLine:last-child': { diff --git a/src/pages/dashboard/monitor/components/ActiveChart/index.tsx b/src/pages/dashboard/monitor/components/ActiveChart/index.tsx index 6f3c8b64..006807d4 100644 --- a/src/pages/dashboard/monitor/components/ActiveChart/index.tsx +++ b/src/pages/dashboard/monitor/components/ActiveChart/index.tsx @@ -1,7 +1,8 @@ import { Area } from '@ant-design/plots'; import { Statistic } from 'antd'; -import { useEffect, useRef, useState, useCallback } from 'react'; +import { useCallback, useEffect, useRef, useState } from 'react'; import useStyles from './index.style'; + function fixedZero(val: number) { return val * 1 < 10 ? `0${val}` : val; } @@ -54,7 +55,10 @@ const ActiveChart = () => { axis={false} yField="y" height={84} - style={{ fill: 'linear-gradient(-90deg, white 0%, #6294FA 100%)', fillOpacity: 0.6 }} + style={{ + fill: 'linear-gradient(-90deg, white 0%, #6294FA 100%)', + fillOpacity: 0.6, + }} data={activeData} />
    @@ -62,7 +66,10 @@ const ActiveChart = () => {

    {[...activeData].sort()[activeData.length - 1]?.y + 200} 亿元

    -

    {[...activeData].sort()[Math.floor(activeData.length / 2)]?.y} 亿元

    +

    + {[...activeData].sort()[Math.floor(activeData.length / 2)]?.y}{' '} + 亿元 +

    diff --git a/src/pages/dashboard/monitor/components/Charts/WaterWave/index.tsx b/src/pages/dashboard/monitor/components/Charts/WaterWave/index.tsx index ed4bae7d..901be207 100644 --- a/src/pages/dashboard/monitor/components/Charts/WaterWave/index.tsx +++ b/src/pages/dashboard/monitor/components/Charts/WaterWave/index.tsx @@ -87,7 +87,11 @@ class WaterWave extends Component { const bR = radius - lineWidth; const circleOffset = -(Math.PI / 2); let circleLock = true; - for (let i = circleOffset; i < circleOffset + 2 * Math.PI; i += 1 / (8 * Math.PI)) { + for ( + let i = circleOffset; + i < circleOffset + 2 * Math.PI; + i += 1 / (8 * Math.PI) + ) { arcStack.push([radius + bR * Math.cos(i), radius + bR * Math.sin(i)]); } const cStartPoint = arcStack.shift() as number[]; diff --git a/src/pages/dashboard/monitor/components/Charts/autoHeight.tsx b/src/pages/dashboard/monitor/components/Charts/autoHeight.tsx index e827959a..c5af01b7 100644 --- a/src/pages/dashboard/monitor/components/Charts/autoHeight.tsx +++ b/src/pages/dashboard/monitor/components/Charts/autoHeight.tsx @@ -1,6 +1,8 @@ import React from 'react'; -export type IReactComponent

    = React.ComponentClass

    | React.ClassicComponentClass

    ; +export type IReactComponent

    = + | React.ComponentClass

    + | React.ClassicComponentClass

    ; function computeHeight(node: HTMLDivElement) { const { style } = node; diff --git a/src/pages/dashboard/monitor/components/Map/index.tsx b/src/pages/dashboard/monitor/components/Map/index.tsx index b434a9f0..df155e1f 100644 --- a/src/pages/dashboard/monitor/components/Map/index.tsx +++ b/src/pages/dashboard/monitor/components/Map/index.tsx @@ -2,7 +2,15 @@ import { PageLoading } from '@ant-design/pro-components'; import { HeatmapLayer, MapboxScene, PointLayer } from '@antv/l7-react'; import * as React from 'react'; -const colors = ['#eff3ff', '#c6dbef', '#9ecae1', '#6baed6', '#4292c6', '#2171b5', '#084594']; +const colors = [ + '#eff3ff', + '#c6dbef', + '#9ecae1', + '#6baed6', + '#4292c6', + '#2171b5', + '#084594', +]; export default class MonitorMap extends React.Component { state = { data: null, diff --git a/src/pages/dashboard/monitor/index.tsx b/src/pages/dashboard/monitor/index.tsx index 61847969..06a9fe9a 100644 --- a/src/pages/dashboard/monitor/index.tsx +++ b/src/pages/dashboard/monitor/index.tsx @@ -24,160 +24,173 @@ const Monitor: FC = () => { }); return ( - - + + + + + + + + + + + + + + + + +

    + +
    + + + + - - - - - - - - - - - - - - - -
    - -
    -     - - - - - - - '优', - }} - meta={{ - color: { - range: ['#6395FA', '#62DAAB', '#657798', '#F7C128', '#1F8718'], - }, - }} - /> - - - - - +     + - - - - - - - - - - - - - - - - '优', + }} + meta={{ + color: { + range: [ + '#6395FA', + '#62DAAB', + '#657798', + '#F7C128', + '#1F8718', + ], + }, + }} + /> + + + + + + + - - - - + + + + + + + + + + + + + - - - - - - + + + + + + + + + ); }; diff --git a/src/pages/dashboard/workplace/_mock.ts b/src/pages/dashboard/workplace/_mock.ts index 75b8fcf5..c0dc9b73 100644 --- a/src/pages/dashboard/workplace/_mock.ts +++ b/src/pages/dashboard/workplace/_mock.ts @@ -127,7 +127,7 @@ for (let i = 0; i < 10; i += 1) { const offlineChartData: DataItem[] = []; for (let i = 0; i < 20; i += 1) { offlineChartData.push({ - x: Date.now()+ 1000 * 60 * 30 * i, + x: Date.now() + 1000 * 60 * 30 * i, y1: Math.floor(Math.random() * 100) + 10, y2: Math.floor(Math.random() * 100) + 10, }); diff --git a/src/pages/dashboard/workplace/index.tsx b/src/pages/dashboard/workplace/index.tsx index e47fa8a8..15f107b9 100644 --- a/src/pages/dashboard/workplace/index.tsx +++ b/src/pages/dashboard/workplace/index.tsx @@ -9,6 +9,7 @@ import EditableLinkGroup from './components/EditableLinkGroup'; import type { ActivitiesType, CurrentUser } from './data.d'; import { fakeChartData, queryActivities, queryProjectNotice } from './service'; import useStyles from './style.style'; + dayjs.extend(relativeTime); const links = [ @@ -89,8 +90,10 @@ const ExtraContent: FC> = () => { }; const Workplace: FC = () => { const { styles } = useStyles(); - const { loading: projectLoading, data: projectNotice = [] } = useRequest(queryProjectNotice); - const { loading: activitiesLoading, data: activities = [] } = useRequest(queryActivities); + const { loading: projectLoading, data: projectNotice = [] } = + useRequest(queryProjectNotice); + const { loading: activitiesLoading, data: activities = [] } = + useRequest(queryActivities); const { data } = useRequest(fakeChartData); const renderActivities = (item: ActivitiesType) => { const events = item.template.split(/@\{([^{}]*)\}/gi).map((key) => { @@ -130,7 +133,8 @@ const Workplace: FC = () => { content={ { padding: 0, }} > - {}} links={links} linkElement={Link} /> + {}} + links={links} + linkElement={Link} + /> { - {item.member.substring(0, 3)} + + {item.member.substring(0, 3)} + ); diff --git a/src/pages/dashboard/workplace/style.style.ts b/src/pages/dashboard/workplace/style.style.ts index fdd467c0..8bd03d35 100644 --- a/src/pages/dashboard/workplace/style.style.ts +++ b/src/pages/dashboard/workplace/style.style.ts @@ -55,9 +55,10 @@ const useStyles = createStyles(({ token }) => { }, float: 'right', whiteSpace: 'nowrap', - [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: { - marginLeft: '-44px', - }, + [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: + { + marginLeft: '-44px', + }, [`@media screen and (max-width: ${token.screenLG}px)`]: { float: 'none', marginRight: '0', @@ -101,9 +102,10 @@ const useStyles = createStyles(({ token }) => { display: 'none', }, }, - [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: { - padding: '0 16px', - }, + [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: + { + padding: '0 16px', + }, [`@media screen and (max-width: ${token.screenLG}px)`]: { padding: '0 16px', textAlign: 'left', @@ -128,9 +130,10 @@ const useStyles = createStyles(({ token }) => { color: token.colorPrimary, }, }, - [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: { - marginBottom: '0', - }, + [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: + { + marginBottom: '0', + }, [`@media screen and (max-width: ${token.screenLG}px)`]: { marginBottom: '0', }, @@ -199,9 +202,10 @@ const useStyles = createStyles(({ token }) => { color: token.colorTextDisabled, }, activeCard: { - [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: { - marginBottom: '24px', - }, + [`@media screen and (max-width: ${token.screenXL}px) and (min-width: @screen-lg)`]: + { + marginBottom: '24px', + }, [`@media screen and (max-width: ${token.screenLG}px)`]: { marginBottom: '24px', }, diff --git a/src/pages/form/advanced-form/components/TableForm.tsx b/src/pages/form/advanced-form/components/TableForm.tsx index b98256c1..e42f0fe9 100644 --- a/src/pages/form/advanced-form/components/TableForm.tsx +++ b/src/pages/form/advanced-form/components/TableForm.tsx @@ -3,6 +3,7 @@ import { Button, Divider, Input, message, Popconfirm, Table } from 'antd'; import type { FC } from 'react'; import React, { useState } from 'react'; import useStyles from '../style.style'; + type TableFormDateType = { key: string; workId?: string; @@ -20,11 +21,16 @@ const TableForm: FC = ({ value, onChange }) => { const [clickedCancel, setClickedCancel] = useState(false); const [loading, setLoading] = useState(false); const [index, setIndex] = useState(0); - const [cacheOriginData, setCacheOriginData] = useState>({}); + const [cacheOriginData, setCacheOriginData] = useState>( + {}, + ); const [data, setData] = useState(value); const getRowByKey = (key: string, newData?: TableFormDateType[]) => (newData || data)?.filter((item) => item.key === key)[0]; - const toggleEditable = (e: React.MouseEvent | React.KeyboardEvent, key: string) => { + const toggleEditable = ( + e: React.MouseEvent | React.KeyboardEvent, + key: string, + ) => { e.preventDefault(); const newData = data?.map((item) => ({ ...item, @@ -59,7 +65,9 @@ const TableForm: FC = ({ value, onChange }) => { setData(newData); }; const remove = (key: string) => { - const newData = data?.filter((item) => item.key !== key) as TableFormDateType[]; + const newData = data?.filter( + (item) => item.key !== key, + ) as TableFormDateType[]; setData(newData); if (onChange) { onChange(newData); @@ -201,7 +209,10 @@ const TableForm: FC = ({ value, onChange }) => { saveRow(e, record.key)}>添加 - remove(record.key)}> + remove(record.key)} + > 删除 @@ -219,7 +230,10 @@ const TableForm: FC = ({ value, onChange }) => { toggleEditable(e, record.key)}>编辑 - remove(record.key)}> + remove(record.key)} + > 删除 diff --git a/src/pages/form/advanced-form/index.tsx b/src/pages/form/advanced-form/index.tsx index a1d05fd7..bc9540c2 100644 --- a/src/pages/form/advanced-form/index.tsx +++ b/src/pages/form/advanced-form/index.tsx @@ -15,6 +15,7 @@ import type { FC } from 'react'; import { useState } from 'react'; import { fakeSubmitForm } from './service'; import useStyles from './style.style'; + interface TableFormDateType { key: string; workId?: string; @@ -80,9 +81,19 @@ const AdvancedForm: FC> = () => { if (!err || err.errors.length === 0) { return null; } - const key = err.name[0] as 'name' | 'url' | 'owner' | 'approver' | 'dateRange' | 'type'; + const key = err.name[0] as + | 'name' + | 'url' + | 'owner' + | 'approver' + | 'dateRange' + | 'type'; return ( -
  • scrollToField(key)}> +
  • scrollToField(key)} + >
    {err.errors[0]}
    {fieldLabels[key]}
    diff --git a/src/pages/form/basic-form/index.tsx b/src/pages/form/basic-form/index.tsx index 323606d3..882fb0b3 100644 --- a/src/pages/form/basic-form/index.tsx +++ b/src/pages/form/basic-form/index.tsx @@ -14,6 +14,7 @@ import { Card, message } from 'antd'; import type { FC } from 'react'; import { fakeSubmitForm } from './service'; import useStyles from './style.style'; + const BasicForm: FC> = () => { const { styles } = useStyles(); const { run } = useRequest(fakeSubmitForm, { @@ -163,7 +164,8 @@ const BasicForm: FC> = () => { fieldProps={{ style: { margin: '8px 0', - display: publicType && publicType === '2' ? 'block' : 'none', + display: + publicType && publicType === '2' ? 'block' : 'none', }, }} options={[ diff --git a/src/pages/form/step-form/index.tsx b/src/pages/form/step-form/index.tsx index d1e5969f..0432c660 100644 --- a/src/pages/form/step-form/index.tsx +++ b/src/pages/form/step-form/index.tsx @@ -7,10 +7,19 @@ import { StepsForm, } from '@ant-design/pro-components'; import type { FormInstance } from 'antd'; -import { Alert, Button, Card, Descriptions, Divider, Result, Statistic } from 'antd'; +import { + Alert, + Button, + Card, + Descriptions, + Divider, + Result, + Statistic, +} from 'antd'; import React, { useRef, useState } from 'react'; import type { StepDataType } from './data.d'; import useStyles from './style.style'; + const StepDescriptions: React.FC<{ stepData: StepDataType; bordered?: boolean; diff --git a/src/pages/list/basic-list/_mock.ts b/src/pages/list/basic-list/_mock.ts index 88ee6eb7..680f6883 100644 --- a/src/pages/list/basic-list/_mock.ts +++ b/src/pages/list/basic-list/_mock.ts @@ -57,7 +57,10 @@ function fakeList(count: number): BasicListItemDataType[] { 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] as | 'normal' | 'exception' @@ -66,8 +69,8 @@ function fakeList(count: number): BasicListItemDataType[] { percent: Math.ceil(Math.random() * 50) + 50, logo: avatars[i % 8], href: 'https://ant.design', - updatedAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), - createdAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), + updatedAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), + createdAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), subDescription: desc[i % 5], description: '在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，这些类似的组件会被抽离成一套标准规范。', @@ -80,17 +83,20 @@ function fakeList(count: number): BasicListItemDataType[] { '段落示意：蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。', members: [ { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', name: '曲丽丽', id: 'member1', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', name: '王昭君', id: 'member2', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', name: '董娜娜', id: 'member3', }, diff --git a/src/pages/list/basic-list/components/OperationModal.tsx b/src/pages/list/basic-list/components/OperationModal.tsx index bc0921cf..4f3fb9e9 100644 --- a/src/pages/list/basic-list/components/OperationModal.tsx +++ b/src/pages/list/basic-list/components/OperationModal.tsx @@ -9,6 +9,7 @@ import { Button, Result } from 'antd'; import type { FC } from 'react'; import type { BasicListItemDataType } from '../data.d'; import useStyles from '../style.style'; + type OperationModalProps = { done: boolean; open: boolean; diff --git a/src/pages/list/basic-list/index.tsx b/src/pages/list/basic-list/index.tsx index b90e8d39..1a3cbee0 100644 --- a/src/pages/list/basic-list/index.tsx +++ b/src/pages/list/basic-list/index.tsx @@ -19,8 +19,14 @@ import type { FC } from 'react'; import React, { useState } from 'react'; import OperationModal from './components/OperationModal'; import type { BasicListItemDataType } from './data.d'; -import { addFakeList, queryFakeList, removeFakeList, updateFakeList } from './service'; +import { + addFakeList, + queryFakeList, + removeFakeList, + updateFakeList, +} from './service'; import useStyles from './style.style'; + const RadioButton = Radio.Button; const RadioGroup = Radio.Group; const { Search } = Input; @@ -71,7 +77,9 @@ export const BasicList: FC = () => { const { styles } = useStyles(); const [done, setDone] = useState(false); const [open, setVisible] = useState(false); - const [current, setCurrent] = useState | undefined>(undefined); + const [current, setCurrent] = useState< + Partial | undefined + >(undefined); const { data: listData, loading, @@ -114,7 +122,10 @@ export const BasicList: FC = () => { id, }); }; - const editAndDelete = (key: string | number, currentItem: BasicListItemDataType) => { + const editAndDelete = ( + key: string | number, + currentItem: BasicListItemDataType, + ) => { if (key === 'edit') showEditModal(currentItem); else if (key === 'delete') { Modal.confirm({ @@ -133,7 +144,11 @@ export const BasicList: FC = () => { 进行中 等待中 - ({})} /> + ({})} + />
    • ); const MoreBtn: React.FC<{ @@ -221,7 +236,9 @@ export const BasicList: FC = () => { ]} > } + avatar={ + + } title={{item.title}} description={item.subDescription} /> diff --git a/src/pages/list/basic-list/style.style.ts b/src/pages/list/basic-list/style.style.ts index 32f1ed67..7e120666 100644 --- a/src/pages/list/basic-list/style.style.ts +++ b/src/pages/list/basic-list/style.style.ts @@ -67,15 +67,16 @@ const useStyles = createStyles(({ token }) => { width: '100%', }, }, - [`@media screen and (max-width: ${token.screenLG}px) and (min-width: @screen-md)`]: { - '& > div': { - display: 'block', + [`@media screen and (max-width: ${token.screenLG}px) and (min-width: @screen-md)`]: + { + '& > div': { + display: 'block', + }, + '& > div:last-child': { + top: '0', + width: '100%', + }, }, - '& > div:last-child': { - top: '0', - width: '100%', - }, - }, [`@media screen and (max-width: ${token.screenXL}px)`]: { '& > div': { marginLeft: '24px', diff --git a/src/pages/list/card-list/_mock.ts b/src/pages/list/card-list/_mock.ts index ad5c1fb1..36b5d755 100644 --- a/src/pages/list/card-list/_mock.ts +++ b/src/pages/list/card-list/_mock.ts @@ -57,7 +57,10 @@ function fakeList(count: number): CardListItemDataType[] { 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] as | 'normal' | 'exception' @@ -66,8 +69,8 @@ function fakeList(count: number): CardListItemDataType[] { percent: Math.ceil(Math.random() * 50) + 50, logo: avatars[i % 8], href: 'https://ant.design', - updatedAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), - createdAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), + updatedAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), + createdAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), subDescription: desc[i % 5], description: '在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，这些类似的组件会被抽离成一套标准规范。', @@ -80,17 +83,20 @@ function fakeList(count: number): CardListItemDataType[] { '段落示意：蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。', members: [ { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', name: '曲丽丽', id: 'member1', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', name: '王昭君', id: 'member2', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', name: '董娜娜', id: 'member3', }, diff --git a/src/pages/list/card-list/index.tsx b/src/pages/list/card-list/index.tsx index 19e619c7..a7b52927 100644 --- a/src/pages/list/card-list/index.tsx +++ b/src/pages/list/card-list/index.tsx @@ -5,6 +5,7 @@ import { Button, Card, List, Typography } from 'antd'; import type { CardListItemDataType } from './data.d'; import { queryFakeList } from './service'; import useStyles from './style.style'; + const { Paragraph } = Typography; const CardList = () => { const { styles } = useStyles(); @@ -17,20 +18,30 @@ const CardList = () => { const content = (

    - 段落示意：蚂蚁金服务设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态， + 段落示意：蚂蚁金服务设计平台 + ant.design，用最小的工作量，无缝接入蚂蚁金服生态， 提供跨越设计与开发的体验解决方案。

    @@ -68,10 +79,19 @@ const CardList = () => { 操作一, 操作二]} + actions={[ + 操作一, + 操作二, + ]} > } + avatar={ + + } title={{item.title}} description={ & { TagSelectOption.isTagSelectOption = true; -type TagSelectOptionElement = React.ReactElement; +type TagSelectOptionElement = React.ReactElement< + TagSelectOptionProps, + typeof TagSelectOption +>; export interface TagSelectProps { onChange?: (value: (string | number)[]) => void; @@ -48,20 +52,33 @@ const TagSelect: FC & { Option: typeof TagSelectOption; } = (props) => { const { styles } = useStyles(); - const { children, hideCheckAll = false, className, style, expandable, actionsText = {} } = props; + const { + children, + hideCheckAll = false, + className, + style, + expandable, + actionsText = {}, + } = props; const [expand, setExpand] = useState(false); - const [value, setValue] = useMergedState<(string | number)[]>(props.defaultValue || [], { - value: props.value, - defaultValue: props.defaultValue, - onChange: props.onChange, - }); + const [value, setValue] = useMergedState<(string | number)[]>( + props.defaultValue || [], + { + value: props.value, + defaultValue: props.defaultValue, + onChange: props.onChange, + }, + ); const isTagSelectOption = (node: TagSelectOptionElement) => node?.type && - (node.type.isTagSelectOption || node.type.displayName === 'TagSelectOption'); + (node.type.isTagSelectOption || + node.type.displayName === 'TagSelectOption'); const getAllTags = () => { - const childrenArray = React.Children.toArray(children) as TagSelectOptionElement[]; + const childrenArray = React.Children.toArray( + children, + ) as TagSelectOptionElement[]; const checkedTags = childrenArray .filter((child) => isTagSelectOption(child)) .map((child) => child.props.value); @@ -85,7 +102,11 @@ const TagSelect: FC & { setValue(checkedTags); }; const checkedAll = getAllTags().length === value?.length; - const { expandText = '展开', collapseText = '收起', selectAllText = '全部' } = actionsText; + const { + expandText = '展开', + collapseText = '收起', + selectAllText = '全部', + } = actionsText; const cls = classNames(styles.tagSelect, className, { [styles.hasExpandTag]: expandable, [styles.expanded]: expand, @@ -93,7 +114,11 @@ const TagSelect: FC & { return (
    {hideCheckAll ? null : ( - + {selectAllText} )} diff --git a/src/pages/list/search/applications/index.tsx b/src/pages/list/search/applications/index.tsx index 1a4dc6bf..e98b5eb8 100644 --- a/src/pages/list/search/applications/index.tsx +++ b/src/pages/list/search/applications/index.tsx @@ -5,7 +5,17 @@ import { ShareAltOutlined, } from '@ant-design/icons'; import { useRequest } from '@umijs/max'; -import { Avatar, Card, Col, Dropdown, Form, List, Row, Select, Tooltip } from 'antd'; +import { + Avatar, + Card, + Col, + Dropdown, + Form, + List, + Row, + Select, + Tooltip, +} from 'antd'; import numeral from 'numeral'; import type { FC } from 'react'; import React from 'react'; @@ -97,11 +107,16 @@ export const Applications: FC> = () => { {categoryOptions .filter( - (category): category is { value: string | number; label: string } => - category.value !== undefined && category.value !== null + ( + category, + ): category is { value: string | number; label: string } => + category.value !== undefined && category.value !== null, ) .map((category) => ( - + {category.label} ))} @@ -202,7 +217,10 @@ export const Applications: FC> = () => { , ]} > - } title={item.title} /> + } + title={item.title} + />
    & { TagSelectOption.isTagSelectOption = true; -type TagSelectOptionElement = React.ReactElement; +type TagSelectOptionElement = React.ReactElement< + TagSelectOptionProps, + typeof TagSelectOption +>; export interface TagSelectProps { onChange?: (value: (string | number)[]) => void; @@ -48,20 +52,33 @@ const TagSelect: FC & { Option: typeof TagSelectOption; } = (props) => { const { styles } = useStyles(); - const { children, hideCheckAll = false, className, style, expandable, actionsText = {} } = props; + const { + children, + hideCheckAll = false, + className, + style, + expandable, + actionsText = {}, + } = props; const [expand, setExpand] = useState(false); - const [value, setValue] = useMergedState<(string | number)[]>(props.defaultValue || [], { - value: props.value, - defaultValue: props.defaultValue, - onChange: props.onChange, - }); + const [value, setValue] = useMergedState<(string | number)[]>( + props.defaultValue || [], + { + value: props.value, + defaultValue: props.defaultValue, + onChange: props.onChange, + }, + ); const isTagSelectOption = (node: TagSelectOptionElement) => node?.type && - (node.type.isTagSelectOption || node.type.displayName === 'TagSelectOption'); + (node.type.isTagSelectOption || + node.type.displayName === 'TagSelectOption'); const getAllTags = () => { - const childrenArray = React.Children.toArray(children) as TagSelectOptionElement[]; + const childrenArray = React.Children.toArray( + children, + ) as TagSelectOptionElement[]; const checkedTags = childrenArray .filter((child) => isTagSelectOption(child)) .map((child) => child.props.value); @@ -85,7 +102,11 @@ const TagSelect: FC & { setValue(checkedTags); }; const checkedAll = getAllTags().length === value?.length; - const { expandText = '展开', collapseText = '收起', selectAllText = '全部' } = actionsText; + const { + expandText = '展开', + collapseText = '收起', + selectAllText = '全部', + } = actionsText; const cls = classNames(styles.tagSelect, className, { [styles.hasExpandTag]: expandable, [styles.expanded]: expand, @@ -93,7 +114,11 @@ const TagSelect: FC & { return (
    {hideCheckAll ? null : ( - + {selectAllText} )} diff --git a/src/pages/list/search/articles/index.tsx b/src/pages/list/search/articles/index.tsx index 381e29de..40ba5461 100644 --- a/src/pages/list/search/articles/index.tsx +++ b/src/pages/list/search/articles/index.tsx @@ -1,4 +1,9 @@ -import { LikeOutlined, LoadingOutlined, MessageOutlined, StarOutlined } from '@ant-design/icons'; +import { + LikeOutlined, + LoadingOutlined, + MessageOutlined, + StarOutlined, +} from '@ant-design/icons'; import { useRequest } from '@umijs/max'; import { Button, Card, Col, Form, List, Row, Select, Tag } from 'antd'; import type { DefaultOptionType } from 'antd/es/select'; @@ -139,13 +144,18 @@ const Articles: FC = () => { - {categoryOptions + {categoryOptions .filter( - (category): category is { value: string | number; label: string } => - category.value !== undefined && category.value !== null + ( + category, + ): category is { value: string | number; label: string } => + category.value !== undefined && category.value !== null, ) .map((category) => ( - + {category.label} ))} diff --git a/src/pages/list/search/index.tsx b/src/pages/list/search/index.tsx index 0aed7bbf..43a5075e 100644 --- a/src/pages/list/search/index.tsx +++ b/src/pages/list/search/index.tsx @@ -27,7 +27,9 @@ const Search: FC = () => { const match = useMatch(location.pathname); const handleTabChange = (key: string) => { const url = - match?.pathname === '/' ? '' : match?.pathname.substring(0, match.pathname.lastIndexOf('/')); + match?.pathname === '/' + ? '' + : match?.pathname.substring(0, match.pathname.lastIndexOf('/')); switch (key) { case 'articles': history.push(`${url}/articles`); @@ -49,7 +51,9 @@ const Search: FC = () => { }; const getTabKey = () => { - const tabKey = location.pathname.substring(location.pathname.lastIndexOf('/') + 1); + const tabKey = location.pathname.substring( + location.pathname.lastIndexOf('/') + 1, + ); if (tabKey && tabKey !== '/') { return tabKey; } diff --git a/src/pages/list/search/projects/_mock.ts b/src/pages/list/search/projects/_mock.ts index 8e97b66f..4c39b899 100644 --- a/src/pages/list/search/projects/_mock.ts +++ b/src/pages/list/search/projects/_mock.ts @@ -56,7 +56,10 @@ function fakeList(count: number): ListItemDataType[] { 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] as | 'normal' | 'exception' @@ -65,8 +68,8 @@ function fakeList(count: number): ListItemDataType[] { percent: Math.ceil(Math.random() * 50) + 50, logo: avatars[i % 8], href: 'https://ant.design', - updatedAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), - createdAt: new Date(Date.now()- 1000 * 60 * 60 * 2 * i).getTime(), + updatedAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), + createdAt: new Date(Date.now() - 1000 * 60 * 60 * 2 * i).getTime(), subDescription: desc[i % 5], description: '在中台产品的研发过程中，会出现不同的设计规范和实现方式，但其中往往存在很多类似的页面和组件，这些类似的组件会被抽离成一套标准规范。', @@ -79,17 +82,20 @@ function fakeList(count: number): ListItemDataType[] { '段落示意：蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。蚂蚁金服设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态，提供跨越设计与开发的体验解决方案。', members: [ { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/ZiESqWwCXBRQoaPONSJe.png', name: '曲丽丽', id: 'member1', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/tBOxZPlITHqwlGjsJWaF.png', name: '王昭君', id: 'member2', }, { - avatar: 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', + avatar: + 'https://gw.alipayobjects.com/zos/rmsportal/sBxjgqiuHMGRkIjqlQCd.png', name: '董娜娜', id: 'member3', }, diff --git a/src/pages/list/search/projects/components/AvatarList/index.tsx b/src/pages/list/search/projects/components/AvatarList/index.tsx index fe9b0051..91d01e4b 100644 --- a/src/pages/list/search/projects/components/AvatarList/index.tsx +++ b/src/pages/list/search/projects/components/AvatarList/index.tsx @@ -16,7 +16,9 @@ export type AvatarListProps = { maxLength?: number; excessItemsStyle?: React.CSSProperties; style?: React.CSSProperties; - children: React.ReactElement | React.ReactElement[]; + children: + | React.ReactElement + | React.ReactElement[]; }; const avatarSizeToClassName = (size: SizeType | 'mini', styles: any) => classNames(styles.avatarItem, { @@ -25,7 +27,12 @@ const avatarSizeToClassName = (size: SizeType | 'mini', styles: any) => [styles.avatarItemMini]: size === 'mini', }); -const Item: React.FC = ({ src, size, tips, onClick = () => {} }) => { +const Item: React.FC = ({ + src, + size, + tips, + onClick = () => {}, +}) => { const { styles } = useStyles(); const cls = avatarSizeToClassName(size || 'default', styles); @@ -54,7 +61,9 @@ const AvatarList: React.FC & { const { styles } = useStyles(); const numOfChildren = React.Children.count(children); const numToShow = maxLength >= numOfChildren ? numOfChildren : maxLength; - const childrenArray = React.Children.toArray(children) as React.ReactElement[]; + const childrenArray = React.Children.toArray( + children, + ) as React.ReactElement[]; const childrenWithProps = childrenArray.slice(0, numToShow).map((child) => React.cloneElement(child, { @@ -65,7 +74,10 @@ const AvatarList: React.FC & { const cls = avatarSizeToClassName(size || 'default', styles); childrenWithProps.push(
  • - {`+${numOfChildren - maxLength}`} + {`+${numOfChildren - maxLength}`}
    • , ); } diff --git a/src/pages/list/search/projects/components/StandardFormRow/index.tsx b/src/pages/list/search/projects/components/StandardFormRow/index.tsx index be8c9c7f..01236990 100644 --- a/src/pages/list/search/projects/components/StandardFormRow/index.tsx +++ b/src/pages/list/search/projects/components/StandardFormRow/index.tsx @@ -1,6 +1,7 @@ import classNames from 'classnames'; import React from 'react'; import useStyles from './index.style'; + type StandardFormRowProps = { title?: string; last?: boolean; diff --git a/src/pages/list/search/projects/components/TagSelect/index.tsx b/src/pages/list/search/projects/components/TagSelect/index.tsx index c49deeb4..4c0baf0d 100644 --- a/src/pages/list/search/projects/components/TagSelect/index.tsx +++ b/src/pages/list/search/projects/components/TagSelect/index.tsx @@ -4,6 +4,7 @@ import classNames from 'classnames'; import { useMergedState } from 'rc-util'; import React, { type FC, useState } from 'react'; import useStyles from './index.style'; + const { CheckableTag } = Tag; export interface TagSelectOptionProps { value: string | number; @@ -26,7 +27,10 @@ const TagSelectOption: React.FC & { TagSelectOption.isTagSelectOption = true; -type TagSelectOptionElement = React.ReactElement; +type TagSelectOptionElement = React.ReactElement< + TagSelectOptionProps, + typeof TagSelectOption +>; export interface TagSelectProps { onChange?: (value: (string | number)[]) => void; @@ -48,20 +52,33 @@ const TagSelect: FC & { Option: typeof TagSelectOption; } = (props) => { const { styles } = useStyles(); - const { children, hideCheckAll = false, className, style, expandable, actionsText = {} } = props; + const { + children, + hideCheckAll = false, + className, + style, + expandable, + actionsText = {}, + } = props; const [expand, setExpand] = useState(false); - const [value, setValue] = useMergedState<(string | number)[]>(props.defaultValue || [], { - value: props.value, - defaultValue: props.defaultValue, - onChange: props.onChange, - }); + const [value, setValue] = useMergedState<(string | number)[]>( + props.defaultValue || [], + { + value: props.value, + defaultValue: props.defaultValue, + onChange: props.onChange, + }, + ); const isTagSelectOption = (node: TagSelectOptionElement) => node?.type && - (node.type.isTagSelectOption || node.type.displayName === 'TagSelectOption'); + (node.type.isTagSelectOption || + node.type.displayName === 'TagSelectOption'); const getAllTags = () => { - const childrenArray = React.Children.toArray(children) as TagSelectOptionElement[]; + const childrenArray = React.Children.toArray( + children, + ) as TagSelectOptionElement[]; const checkedTags = childrenArray .filter((child) => isTagSelectOption(child)) .map((child) => child.props.value); @@ -85,7 +102,11 @@ const TagSelect: FC & { setValue(checkedTags); }; const checkedAll = getAllTags().length === value?.length; - const { expandText = '展开', collapseText = '收起', selectAllText = '全部' } = actionsText; + const { + expandText = '展开', + collapseText = '收起', + selectAllText = '全部', + } = actionsText; const cls = classNames(styles.tagSelect, className, { [styles.hasExpandTag]: expandable, [styles.expanded]: expand, @@ -93,7 +114,11 @@ const TagSelect: FC & { return (
    {hideCheckAll ? null : ( - + {selectAllText} )} diff --git a/src/pages/list/search/projects/index.tsx b/src/pages/list/search/projects/index.tsx index c4744048..ef684b61 100644 --- a/src/pages/list/search/projects/index.tsx +++ b/src/pages/list/search/projects/index.tsx @@ -41,7 +41,11 @@ const Projects: FC = () => { dataSource={list} renderItem={(item) => ( - }> + } + > {item.title}} description={ @@ -105,11 +109,16 @@ const Projects: FC = () => { {categoryOptions .filter( - (category): category is { value: string | number; label: string } => - category.value !== undefined && category.value !== null + ( + category, + ): category is { value: string | number; label: string } => + category.value !== undefined && category.value !== null, ) .map((category) => ( - + {category.label} ))} diff --git a/src/pages/list/table-list/_mock.ts b/src/pages/list/table-list/_mock.ts index 45e5cbb1..f220a7fa 100644 --- a/src/pages/list/table-list/_mock.ts +++ b/src/pages/list/table-list/_mock.ts @@ -1,5 +1,5 @@ -import type { Request, Response } from 'express'; import { parse } from 'node:url'; +import type { Request, Response } from 'express'; import type { TableListItem, TableListParams } from './data.d'; // mock tableListDataSource @@ -34,7 +34,10 @@ let tableListDataSource = genList(1, 100); function getRule(req: Request, res: Response, u: string) { let realUrl = u; - if (!realUrl || Object.prototype.toString.call(realUrl) !== '[object String]') { + if ( + !realUrl || + Object.prototype.toString.call(realUrl) !== '[object String]' + ) { realUrl = req.url; } const { current = 1, pageSize = 10 } = req.query; @@ -84,7 +87,9 @@ function getRule(req: Request, res: Response, u: string) { } if (params.name) { - dataSource = dataSource.filter((data) => data.name.includes(params.name || '')); + dataSource = dataSource.filter((data) => + data.name.includes(params.name || ''), + ); } let finalPageSize = 10; @@ -105,17 +110,22 @@ function getRule(req: Request, res: Response, u: string) { function postRule(req: Request, res: Response, u: string, b: Request) { let realUrl = u; - if (!realUrl || Object.prototype.toString.call(realUrl) !== '[object String]') { + if ( + !realUrl || + Object.prototype.toString.call(realUrl) !== '[object String]' + ) { realUrl = req.url; } - const body = (b?.body) || req.body; + const body = b?.body || req.body; const { name, desc, key } = body; switch (req.method) { /* eslint no-case-declarations:0 */ case 'DELETE': - tableListDataSource = tableListDataSource.filter((item) => key.indexOf(item.key) === -1); + tableListDataSource = tableListDataSource.filter( + (item) => key.indexOf(item.key) === -1, + ); break; case 'POST': (() => { diff --git a/src/pages/list/table-list/index.tsx b/src/pages/list/table-list/index.tsx index d8737683..23ce02c2 100644 --- a/src/pages/list/table-list/index.tsx +++ b/src/pages/list/table-list/index.tsx @@ -1,5 +1,9 @@ import { PlusOutlined } from '@ant-design/icons'; -import type { ActionType, ProColumns, ProDescriptionsItemProps } from '@ant-design/pro-components'; +import type { + ActionType, + ProColumns, + ProDescriptionsItemProps, +} from '@ant-design/pro-components'; import { FooterToolbar, ModalForm, @@ -15,6 +19,7 @@ import type { FormValueType } from './components/UpdateForm'; import UpdateForm from './components/UpdateForm'; import type { TableListItem, TableListPagination } from './data'; import { addRule, removeRule, rule, updateRule } from './service'; + /** * 添加节点 * @@ -41,7 +46,10 @@ const handleAdd = async (fields: TableListItem) => { * @param fields */ -const handleUpdate = async (fields: FormValueType, currentRow?: TableListItem) => { +const handleUpdate = async ( + fields: FormValueType, + currentRow?: TableListItem, +) => { const hide = message.loading('正在配置'); try { @@ -87,7 +95,8 @@ const TableList: React.FC = () => { const [createModalVisible, handleModalVisible] = useState(false); /** 分布更新窗口的弹窗 */ - const [updateModalVisible, handleUpdateModalVisible] = useState(false); + const [updateModalVisible, handleUpdateModalVisible] = + useState(false); const [showDetail, setShowDetail] = useState(false); const actionRef = useRef(); const [currentRow, setCurrentRow] = useState(); @@ -229,7 +238,12 @@ const TableList: React.FC = () => { {' '} 项    - 服务调用次数总计 {selectedRowsState.reduce((pre, item) => pre + (item.callNo ?? 0), 0)} 万 + 服务调用次数总计{' '} + {selectedRowsState.reduce( + (pre, item) => pre + (item.callNo ?? 0), + 0, + )}{' '} + 万
    } diff --git a/src/pages/list/table-list/service.ts b/src/pages/list/table-list/service.ts index 3091ddbc..29168469 100644 --- a/src/pages/list/table-list/service.ts +++ b/src/pages/list/table-list/service.ts @@ -29,7 +29,10 @@ export async function rule( } /** 新建规则 PUT /api/rule */ -export async function updateRule(data: { [key: string]: any }, options?: { [key: string]: any }) { +export async function updateRule( + data: { [key: string]: any }, + options?: { [key: string]: any }, +) { return request('/api/rule', { data, method: 'PUT', @@ -38,7 +41,10 @@ export async function updateRule(data: { [key: string]: any }, options?: { [key: } /** 新建规则 POST /api/rule */ -export async function addRule(data: { [key: string]: any }, options?: { [key: string]: any }) { +export async function addRule( + data: { [key: string]: any }, + options?: { [key: string]: any }, +) { return request('/api/rule', { data, method: 'POST', @@ -47,7 +53,10 @@ export async function addRule(data: { [key: string]: any }, options?: { [key: st } /** 删除规则 DELETE /api/rule */ -export async function removeRule(data: { key: number[] }, options?: { [key: string]: any }) { +export async function removeRule( + data: { key: number[] }, + options?: { [key: string]: any }, +) { return request>('/api/rule', { data, method: 'DELETE', diff --git a/src/pages/profile/advanced/index.tsx b/src/pages/profile/advanced/index.tsx index 8395b842..092a1794 100644 --- a/src/pages/profile/advanced/index.tsx +++ b/src/pages/profile/advanced/index.tsx @@ -4,7 +4,11 @@ import { EllipsisOutlined, InfoCircleOutlined, } from '@ant-design/icons'; -import { GridContent, PageContainer, RouteContext } from '@ant-design/pro-components'; +import { + GridContent, + PageContainer, + RouteContext, +} from '@ant-design/pro-components'; import { useRequest } from '@umijs/max'; import { Badge, @@ -160,15 +164,23 @@ const Advanced: FC = () => { const description = ( {({ isMobile }) => ( - + 曲丽丽 XX 服务 2017-07-07 12421 - 2017-07-07 ~ 2017-08-08 - 请于两个工作日内确认 + + 2017-07-07 ~ 2017-08-08 + + + 请于两个工作日内确认 + )} @@ -252,7 +264,11 @@ const Advanced: FC = () => { ); if (status === 'process') { return ( - + {dot} ); @@ -358,9 +374,15 @@ const Advanced: FC = () => { }} > 付小小 - 32943898021309809423 - 3321944288191034921 - 18112345678 + + 32943898021309809423 + + + 3321944288191034921 + + + 18112345678 + 曲丽丽 18100000000 浙江省杭州市西湖区黄姑山路工专路交叉路口 @@ -372,7 +394,9 @@ const Advanced: FC = () => { title="信息组" > 725 - 2017-08-08 + + 2017-08-08 + @@ -390,7 +414,9 @@ const Advanced: FC = () => { > 725 - 2017-08-08 + + 2017-08-08 +

    { > 林东东 1234567 - XX公司 - YY部 - 2017-08-08 + + XX公司 - YY部 + + + 2017-08-08 + 这段描述很长很长很长很长很长很长很长很长很长很长很长很长很长很长... @@ -451,7 +481,11 @@ const Advanced: FC = () => { > - + {contentList[tabStatus.operationKey] as React.ReactNode} diff --git a/src/pages/profile/basic/index.tsx b/src/pages/profile/basic/index.tsx index a813f680..31647f2e 100644 --- a/src/pages/profile/basic/index.tsx +++ b/src/pages/profile/basic/index.tsx @@ -7,6 +7,7 @@ import React from 'react'; import type { BasicGood, BasicProgress } from './data.d'; import { queryBasicProfile } from './service'; import useStyles from './style.style'; + const progressColumns: ProColumns[] = [ { title: '时间', @@ -191,7 +192,9 @@ const Basic: FC = () => { 付小小 18100000000 菜鸟仓储 - 浙江省杭州市西湖区万塘路18号 + + 浙江省杭州市西湖区万塘路18号 + 无 { 23421 曲丽丽 - 2016-12-12 ~ 2017-12-12 + + 2016-12-12 ~ 2017-12-12 +
    diff --git a/src/pages/table-list/components/CreateForm.tsx b/src/pages/table-list/components/CreateForm.tsx index 22e808b7..9fc324cc 100644 --- a/src/pages/table-list/components/CreateForm.tsx +++ b/src/pages/table-list/components/CreateForm.tsx @@ -1,9 +1,14 @@ -import { addRule } from '@/services/ant-design-pro/api'; import { PlusOutlined } from '@ant-design/icons'; -import { type ActionType, ModalForm, ProFormText, ProFormTextArea } from '@ant-design/pro-components'; +import { + type ActionType, + ModalForm, + ProFormText, + ProFormTextArea, +} from '@ant-design/pro-components'; import { FormattedMessage, useIntl, useRequest } from '@umijs/max'; import { Button, message } from 'antd'; import type { FC } from 'react'; +import { addRule } from '@/services/ant-design-pro/api'; interface CreateFormProps { reload?: ActionType['reload']; diff --git a/src/pages/table-list/components/UpdateForm.tsx b/src/pages/table-list/components/UpdateForm.tsx index 3f236ad1..bbe0a948 100644 --- a/src/pages/table-list/components/UpdateForm.tsx +++ b/src/pages/table-list/components/UpdateForm.tsx @@ -1,4 +1,3 @@ -import { updateRule } from '@/services/ant-design-pro/api'; import { ProFormDateTimePicker, ProFormRadio, @@ -8,8 +7,9 @@ import { StepsForm, } from '@ant-design/pro-components'; import { FormattedMessage, useIntl, useRequest } from '@umijs/max'; -import { message, Modal } from 'antd'; +import { Modal, message } from 'antd'; import React, { cloneElement, useCallback, useState } from 'react'; +import { updateRule } from '@/services/ant-design-pro/api'; export type FormValueType = { target?: string; diff --git a/src/pages/table-list/index.tsx b/src/pages/table-list/index.tsx index 08303246..83f08071 100644 --- a/src/pages/table-list/index.tsx +++ b/src/pages/table-list/index.tsx @@ -1,5 +1,8 @@ -import { removeRule, rule } from '@/services/ant-design-pro/api'; -import type { ActionType, ProColumns, ProDescriptionsItemProps } from '@ant-design/pro-components'; +import type { + ActionType, + ProColumns, + ProDescriptionsItemProps, +} from '@ant-design/pro-components'; import { FooterToolbar, PageContainer, @@ -9,6 +12,7 @@ import { import { FormattedMessage, useIntl, useRequest } from '@umijs/max'; import { Button, Drawer, Input, message } from 'antd'; import React, { useCallback, useRef, useState } from 'react'; +import { removeRule, rule } from '@/services/ant-design-pro/api'; import CreateForm from './components/CreateForm'; import UpdateForm from './components/UpdateForm'; @@ -178,7 +182,10 @@ const TableList: React.FC = () => { - + } key="config" @@ -231,7 +238,9 @@ const TableList: React.FC = () => { search={{ labelWidth: 120, }} - toolBarRender={() => []} + toolBarRender={() => [ + , + ]} request={rule} columns={columns} rowSelection={{ diff --git a/src/pages/user/register/index.tsx b/src/pages/user/register/index.tsx index 0a8e6a8a..b24d3023 100644 --- a/src/pages/user/register/index.tsx +++ b/src/pages/user/register/index.tsx @@ -1,5 +1,16 @@ import { history, Link, useRequest } from '@umijs/max'; -import { Button, Col, Form, Input, message, Popover, Progress, Row, Select, Space } from 'antd'; +import { + Button, + Col, + Form, + Input, + message, + Popover, + Progress, + Row, + Select, + Space, +} from 'antd'; import type { Store } from 'antd/es/form/interface'; import type { FC } from 'react'; import { useEffect, useState } from 'react'; @@ -198,7 +209,11 @@ const Register: FC = () => { }, ]} > - +