From cb64940608ea37f909c0dcb8d18b590ce34be4aa Mon Sep 17 00:00:00 2001 From: afc163 Date: Mon, 14 Jul 2025 11:27:45 +0800 Subject: [PATCH] refactor: remove unused pages --- .../center/components/Applications/index.tsx | 130 ----- src/pages/account/center/index.tsx | 278 --------- .../components/Charts/ChartCard/index.tsx | 110 ---- .../components/Charts/MiniProgress/index.tsx | 48 -- .../analysis/components/IntroduceRow.tsx | 168 ------ .../analysis/components/OfflineData.tsx | 110 ---- .../analysis/components/TopSearch.tsx | 181 ------ src/pages/dashboard/monitor/index.tsx | 203 ------- src/pages/form/advanced-form/index.tsx | 549 ------------------ src/pages/form/basic-form/index.tsx | 194 ------- src/pages/form/step-form/index.tsx | 248 -------- .../basic-list/components/OperationModal.tsx | 129 ---- src/pages/list/basic-list/index.tsx | 280 --------- src/pages/list/search/applications/index.tsx | 239 -------- src/pages/list/search/articles/index.tsx | 261 --------- src/pages/list/search/projects/index.tsx | 176 ------ .../list/table-list/components/CreateForm.tsx | 26 - .../list/table-list/components/UpdateForm.tsx | 161 ----- src/pages/profile/advanced/index.tsx | 493 ---------------- src/pages/profile/basic/index.tsx | 236 -------- src/pages/result/fail/index.tsx | 75 --- src/pages/result/success/index.tsx | 137 ----- src/pages/user/register/index.tsx | 309 ---------- 23 files changed, 4741 deletions(-) delete mode 100644 src/pages/account/center/components/Applications/index.tsx delete mode 100644 src/pages/account/center/index.tsx delete mode 100644 src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx delete mode 100644 src/pages/dashboard/analysis/components/Charts/MiniProgress/index.tsx delete mode 100644 src/pages/dashboard/analysis/components/IntroduceRow.tsx delete mode 100644 src/pages/dashboard/analysis/components/OfflineData.tsx delete mode 100644 src/pages/dashboard/analysis/components/TopSearch.tsx delete mode 100644 src/pages/dashboard/monitor/index.tsx delete mode 100644 src/pages/form/advanced-form/index.tsx delete mode 100644 src/pages/form/basic-form/index.tsx delete mode 100644 src/pages/form/step-form/index.tsx delete mode 100644 src/pages/list/basic-list/components/OperationModal.tsx delete mode 100644 src/pages/list/basic-list/index.tsx delete mode 100644 src/pages/list/search/applications/index.tsx delete mode 100644 src/pages/list/search/articles/index.tsx delete mode 100644 src/pages/list/search/projects/index.tsx delete mode 100644 src/pages/list/table-list/components/CreateForm.tsx delete mode 100644 src/pages/list/table-list/components/UpdateForm.tsx delete mode 100644 src/pages/profile/advanced/index.tsx delete mode 100644 src/pages/profile/basic/index.tsx delete mode 100644 src/pages/result/fail/index.tsx delete mode 100644 src/pages/result/success/index.tsx delete mode 100644 src/pages/user/register/index.tsx diff --git a/src/pages/account/center/components/Applications/index.tsx b/src/pages/account/center/components/Applications/index.tsx deleted file mode 100644 index e8c273f5..00000000 --- a/src/pages/account/center/components/Applications/index.tsx +++ /dev/null @@ -1,130 +0,0 @@ -import { - DownloadOutlined, - EditOutlined, - EllipsisOutlined, - ShareAltOutlined, -} from '@ant-design/icons'; -import { useRequest } from '@umijs/max'; -import { Avatar, Card, Dropdown, List, Tooltip } from 'antd'; -import numeral from 'numeral'; -import React from 'react'; -import type { ListItemDataType } from '../../data.d'; -import { queryFakeList } from '../../service'; -import useStyles from './index.style'; -export function formatWan(val: number) { - const v = val * 1; - if (!v || Number.isNaN(v)) return ''; - let result: React.ReactNode = val; - if (val > 10000) { - result = ( - - {Math.floor(val / 10000)} - - 万 - - - ); - } - return result; -} -const Applications: React.FC = () => { - const { styles: stylesApplications } = useStyles(); - // 获取tab列表数据 - const { data: listData } = useRequest(() => { - return queryFakeList({ - count: 30, - }); - }); - - const CardInfo: React.FC<{ - activeUser: React.ReactNode; - newUser: React.ReactNode; - }> = ({ activeUser, newUser }) => ( -
-
-

活跃用户

-

{activeUser}

-
-
-

新增用户

-

{newUser}

-
-
- ); - return ( - - rowKey="id" - className={stylesApplications.filterCardList} - grid={{ - gutter: 24, - xxl: 3, - xl: 2, - lg: 2, - md: 2, - sm: 2, - xs: 1, - }} - dataSource={listData?.list || []} - renderItem={(item) => ( - - - - , - - - , - - - , - - - , - ]} - > - } - title={item.title} - /> -
- -
-
-
- )} - /> - ); -}; -export default Applications; diff --git a/src/pages/account/center/index.tsx b/src/pages/account/center/index.tsx deleted file mode 100644 index 88881321..00000000 --- a/src/pages/account/center/index.tsx +++ /dev/null @@ -1,278 +0,0 @@ -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 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, TagType, tabKeyType } from './data.d'; -import { queryCurrent } from './service'; - -const operationTabList = [ - { - key: 'articles', - tab: ( - - 文章{' '} - - (8) - - - ), - }, - { - key: 'applications', - tab: ( - - 应用{' '} - - (8) - - - ), - }, - { - key: 'projects', - tab: ( - - 项目{' '} - - (8) - - - ), - }, -]; -const TagList: React.FC<{ - tags: CurrentUser['tags']; -}> = ({ tags }) => { - const { styles } = useStyles(); - const ref = useRef(null); - const [newTags, setNewTags] = useState([]); - const [inputVisible, setInputVisible] = useState(false); - const [inputValue, setInputValue] = useState(''); - const showInput = () => { - setInputVisible(true); - if (ref.current) { - // eslint-disable-next-line no-unused-expressions - ref.current?.focus(); - } - }; - const handleInputChange = (e: React.ChangeEvent) => { - setInputValue(e.target.value); - }; - const handleInputConfirm = () => { - let tempsTags = [...newTags]; - if ( - inputValue && - tempsTags.filter((tag) => tag.label === inputValue).length === 0 - ) { - tempsTags = [ - ...tempsTags, - { - key: `new-${tempsTags.length}`, - label: inputValue, - }, - ]; - } - setNewTags(tempsTags); - setInputVisible(false); - setInputValue(''); - }; - return ( -
-
标签
- {(tags || []).concat(newTags).map((item) => ( - {item.label} - ))} - {inputVisible && ( - - )} - {!inputVisible && ( - - - - )} -
- ); -}; -const Center: React.FC = () => { - const { styles } = useStyles(); - const [tabKey, setTabKey] = useState('articles'); - - // 获取用户信息 - const { data: currentUser, loading } = useRequest(() => { - return queryCurrent(); - }); - - // 渲染用户信息 - const renderUserInfo = ({ - title, - group, - geographic, - }: Partial) => { - return ( -
-

- - {title} -

-

- - {group} -

-

- - { - ( - geographic || { - province: { - label: '', - }, - } - ).province.label - } - { - ( - geographic || { - city: { - label: '', - }, - } - ).city.label - } -

-
- ); - }; - - // 渲染tab切换 - const renderChildrenByTabKey = (tabValue: tabKeyType) => { - if (tabValue === 'projects') { - return ; - } - if (tabValue === 'applications') { - return ; - } - if (tabValue === 'articles') { - return ; - } - return null; - }; - return ( - - - - - {!loading && currentUser && ( - <> -
- -
{currentUser.name}
-
{currentUser?.signature}
-
- {renderUserInfo(currentUser)} - - - -
-
团队
- - {currentUser.notice?.map((item) => ( - - - - {item.member} - - - ))} - -
- - )} -
- - - { - setTabKey(_tabKey as tabKeyType); - }} - > - {renderChildrenByTabKey(tabKey)} - - -
-
- ); -}; -export default Center; diff --git a/src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx b/src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx deleted file mode 100644 index fe4194d5..00000000 --- a/src/pages/dashboard/analysis/components/Charts/ChartCard/index.tsx +++ /dev/null @@ -1,110 +0,0 @@ -import { Card } from 'antd'; -import type { CardProps } from 'antd/es/card'; -import classNames from 'classnames'; -import omit from 'rc-util/lib/omit'; -import React from 'react'; -import useStyles from './index.style'; - -type totalType = () => React.ReactNode; - -export type ChartCardProps = { - title: React.ReactNode; - action?: React.ReactNode; - total?: React.ReactNode | number | (() => React.ReactNode | number); - footer?: React.ReactNode; - contentHeight?: number; - avatar?: React.ReactNode; - style?: React.CSSProperties; -} & CardProps; - -const ChartCard: React.FC = (props) => { - const { styles } = useStyles(); - const renderTotal = (total?: number | totalType | React.ReactNode) => { - if (!total && total !== 0) { - return null; - } - let totalDom: React.ReactNode | null = null; - switch (typeof total) { - case 'undefined': - totalDom = null; - break; - case 'function': - totalDom =
{total()}
; - break; - default: - totalDom =
{total}
; - } - return totalDom; - }; - const renderContent = () => { - const { - contentHeight, - title, - avatar, - action, - total, - footer, - children, - loading, - } = props; - if (loading) { - return false; - } - return ( -
-
-
{avatar}
-
-
- {title} - {action} -
- {renderTotal(total)} -
-
- {children && ( -
-
- {children} -
-
- )} - {footer && ( -
- {footer} -
- )} -
- ); - }; - - const { loading = false, ...rest } = props; - const cardProps = omit(rest, ['total', 'contentHeight', 'action']); - return ( - - {renderContent()} - - ); -}; -export default ChartCard; diff --git a/src/pages/dashboard/analysis/components/Charts/MiniProgress/index.tsx b/src/pages/dashboard/analysis/components/Charts/MiniProgress/index.tsx deleted file mode 100644 index 5376e01c..00000000 --- a/src/pages/dashboard/analysis/components/Charts/MiniProgress/index.tsx +++ /dev/null @@ -1,48 +0,0 @@ -import { Tooltip } from 'antd'; -import React from 'react'; -export type MiniProgressProps = { - target: number; - targetLabel?: string; - color?: string; - size?: number; - percent?: number; - style?: React.CSSProperties; -}; -const MiniProgress: React.FC = ({ - targetLabel, - target, - color = 'rgb(19, 194, 194)', - size, - percent, -}) => { - return ( -
- -
- - -
-
-
-
- ); -}; -export default MiniProgress; diff --git a/src/pages/dashboard/analysis/components/IntroduceRow.tsx b/src/pages/dashboard/analysis/components/IntroduceRow.tsx deleted file mode 100644 index 6e21f1f3..00000000 --- a/src/pages/dashboard/analysis/components/IntroduceRow.tsx +++ /dev/null @@ -1,168 +0,0 @@ -import { InfoCircleOutlined } from '@ant-design/icons'; -import { Area, Column } from '@ant-design/plots'; -import { Col, Progress, Row, Tooltip } from 'antd'; -import numeral from 'numeral'; -import type { DataItem } from '../data.d'; -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, - md: 12, - lg: 12, - xl: 6, - style: { - marginBottom: 24, - }, -}; -const IntroduceRow = ({ - loading, - visitData, -}: { - loading: boolean; - visitData: DataItem[]; -}) => { - const { styles } = useStyles(); - return ( - - - - - - } - loading={loading} - total={() => 126560} - footer={ - - } - contentHeight={46} - > - - 周同比 - 12% - - - 日同比 - 11% - - - - - - - - - } - total={numeral(8846).format('0,0')} - footer={ - - } - contentHeight={46} - > - - - - - - - - } - total={numeral(6560).format('0,0')} - footer={} - contentHeight={46} - > - - - - - - - - } - total="78%" - footer={ -
- - 周同比 - 12% - - - 日同比 - 11% - -
- } - contentHeight={46} - > - -
- -
- ); -}; -export default IntroduceRow; diff --git a/src/pages/dashboard/analysis/components/OfflineData.tsx b/src/pages/dashboard/analysis/components/OfflineData.tsx deleted file mode 100644 index f271c9af..00000000 --- a/src/pages/dashboard/analysis/components/OfflineData.tsx +++ /dev/null @@ -1,110 +0,0 @@ -import { Line, Tiny } from '@ant-design/plots'; -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, -}: { - data: OfflineDataType; - currentTabKey: string; -}) => ( - - - - - - - - -); - -const OfflineData = ({ - activeKey, - loading, - offlineData, - offlineChartData, - handleTabChange, -}: { - activeKey: string; - loading: boolean; - offlineData: OfflineDataType[]; - offlineChartData: DataItem[]; - handleTabChange: (activeKey: string) => void; -}) => { - const { styles } = useStyles(); - return ( - - ({ - key: shop.name, - label: , - children: ( -
- -
- ), - }))} - /> -
- ); -}; -export default OfflineData; diff --git a/src/pages/dashboard/analysis/components/TopSearch.tsx b/src/pages/dashboard/analysis/components/TopSearch.tsx deleted file mode 100644 index 2833b0a4..00000000 --- a/src/pages/dashboard/analysis/components/TopSearch.tsx +++ /dev/null @@ -1,181 +0,0 @@ -import { InfoCircleOutlined } from '@ant-design/icons'; -import { Area } from '@ant-design/plots'; -import { Card, Col, Row, Table, Tooltip } from 'antd'; -import numeral from 'numeral'; -import React from 'react'; -import type { DataItem } from '../data.d'; -import NumberInfo from './NumberInfo'; -import Trend from './Trend'; - -const TopSearch = ({ - loading, - visitData2, - searchData, - dropdownGroup, -}: { - loading: boolean; - visitData2: DataItem[]; - dropdownGroup: React.ReactNode; - searchData: DataItem[]; -}) => { - const columns = [ - { - title: '排名', - dataIndex: 'index', - key: 'index', - }, - { - title: '搜索关键词', - dataIndex: 'keyword', - key: 'keyword', - render: (text: React.ReactNode) => {text}, - }, - { - title: '用户数', - dataIndex: 'count', - key: 'count', - sorter: ( - a: { - count: number; - }, - b: { - count: number; - }, - ) => a.count - b.count, - }, - { - title: '周涨幅', - dataIndex: 'range', - key: 'range', - sorter: ( - a: { - range: number; - }, - b: { - range: number; - }, - ) => a.range - b.range, - render: ( - text: React.ReactNode, - record: { - status: number; - }, - ) => ( - - - {text}% - - - ), - }, - ]; - return ( - - - - - 搜索用户数 - - - - - } - gap={8} - total={numeral(12321).format('0,0')} - status="up" - subTotal={17.1} - /> - - - - - 人均搜索次数 - - - - - } - total={2.7} - status="down" - subTotal={26.2} - gap={8} - /> - - - - - rowKey={(record) => record.index} - size="small" - columns={columns} - dataSource={searchData} - pagination={{ - style: { - marginBottom: 0, - }, - pageSize: 5, - }} - /> - - ); -}; -export default TopSearch; diff --git a/src/pages/dashboard/monitor/index.tsx b/src/pages/dashboard/monitor/index.tsx deleted file mode 100644 index a17fb72d..00000000 --- a/src/pages/dashboard/monitor/index.tsx +++ /dev/null @@ -1,203 +0,0 @@ -import { Gauge, Liquid, WordCloud } from '@ant-design/plots'; -import { GridContent } from '@ant-design/pro-components'; -import { useRequest } from '@umijs/max'; -import { Card, Col, Progress, Row, Statistic } from 'antd'; -import numeral from 'numeral'; -import type { FC } from 'react'; -import ActiveChart from './components/ActiveChart'; -import MonitorMap from './components/Map'; -import { queryTags } from './service'; -import useStyles from './style.style'; - -const deadline = Date.now() + 1000 * 60 * 60 * 24 * 2 + 1000 * 30; // Moment is also OK - -const Monitor: FC = () => { - const { styles } = useStyles(); - const { loading, data } = useRequest(queryTags); - const wordCloudData = (data?.list || []).map((item) => { - return { - id: +Date.now(), - word: item.name, - weight: item.value, - }; - }); - return ( - - - - - - - - - - - - - - - - - - -
- -
-
- - - - - - - '优', - }} - meta={{ - color: { - range: [ - '#6395FA', - '#62DAAB', - '#657798', - '#F7C128', - '#1F8718', - ], - }, - }} - /> - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
- ); -}; -export default Monitor; diff --git a/src/pages/form/advanced-form/index.tsx b/src/pages/form/advanced-form/index.tsx deleted file mode 100644 index 83a262ed..00000000 --- a/src/pages/form/advanced-form/index.tsx +++ /dev/null @@ -1,549 +0,0 @@ -import { CloseCircleOutlined } from '@ant-design/icons'; -import type { ProColumnType } from '@ant-design/pro-components'; -import { - EditableProTable, - FooterToolbar, - PageContainer, - ProForm, - ProFormDateRangePicker, - ProFormSelect, - ProFormText, - ProFormTimePicker, -} from '@ant-design/pro-components'; -import { Card, Col, message, Popover, Row } from 'antd'; -import type { FC } from 'react'; -import { useState } from 'react'; -import { fakeSubmitForm } from './service'; -import useStyles from './style.style'; - -interface TableFormDateType { - key: string; - workId?: string; - name?: string; - department?: string; - isNew?: boolean; - editable?: boolean; -} -type InternalNamePath = (string | number)[]; -const fieldLabels = { - name: '仓库名', - url: '仓库域名', - owner: '仓库管理员', - approver: '审批人', - dateRange: '生效日期', - type: '仓库类型', - name2: '任务名', - url2: '任务描述', - owner2: '执行人', - approver2: '责任人', - dateRange2: '生效日期', - type2: '任务类型', -}; -const tableData = [ - { - key: '1', - workId: '00001', - name: 'John Brown', - department: 'New York No. 1 Lake Park', - }, - { - key: '2', - workId: '00002', - name: 'Jim Green', - department: 'London No. 1 Lake Park', - }, - { - key: '3', - workId: '00003', - name: 'Joe Black', - department: 'Sidney No. 1 Lake Park', - }, -]; -interface ErrorField { - name: InternalNamePath; - errors: string[]; -} -const AdvancedForm: FC> = () => { - const { styles } = useStyles(); - const [error, setError] = useState([]); - const getErrorInfo = (errors: ErrorField[]) => { - const errorCount = errors.filter((item) => item.errors.length > 0).length; - if (!errors || errorCount === 0) { - return null; - } - const scrollToField = (fieldKey: string) => { - const labelNode = document.querySelector(`label[for="${fieldKey}"]`); - if (labelNode) { - labelNode.scrollIntoView(true); - } - }; - const errorList = errors.map((err) => { - if (!err || err.errors.length === 0) { - return null; - } - const key = err.name[0] as - | 'name' - | 'url' - | 'owner' - | 'approver' - | 'dateRange' - | 'type'; - return ( -
  • scrollToField(key)} - > - -
    {err.errors[0]}
    -
    {fieldLabels[key]}
    -
  • - ); - }); - return ( - - { - if (trigger?.parentNode) { - return trigger.parentNode as HTMLElement; - } - return trigger; - }} - > - - - {errorCount} - - ); - }; - const onFinish = async (values: Record) => { - setError([]); - try { - await fakeSubmitForm(values); - message.success('提交成功'); - } catch { - // console.log - } - }; - const onFinishFailed = (errorInfo: any) => { - setError(errorInfo.errorFields); - }; - const columns: ProColumnType[] = [ - { - title: '成员姓名', - dataIndex: 'name', - key: 'name', - width: '20%', - }, - { - title: '工号', - dataIndex: 'workId', - key: 'workId', - width: '20%', - }, - { - title: '所属部门', - dataIndex: 'department', - key: 'department', - width: '40%', - }, - { - title: '操作', - key: 'action', - valueType: 'option', - render: (_, record: TableFormDateType, _index, action) => { - return [ - { - action?.startEditable(record.key); - }} - > - 编辑 - , - ]; - }, - }, - ]; - return ( - { - return ( - - {getErrorInfo(error)} - {dom} - - ); - }, - }} - initialValues={{ - members: tableData, - }} - onFinish={onFinish} - onFinishFailed={onFinishFailed} - > - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - recordCreatorProps={{ - record: () => { - return { - key: `0${Date.now()}`, - }; - }, - }} - columns={columns} - rowKey="key" - /> - - - - - ); -}; -export default AdvancedForm; diff --git a/src/pages/form/basic-form/index.tsx b/src/pages/form/basic-form/index.tsx deleted file mode 100644 index 7d053f99..00000000 --- a/src/pages/form/basic-form/index.tsx +++ /dev/null @@ -1,194 +0,0 @@ -import { - PageContainer, - ProForm, - ProFormDateRangePicker, - ProFormDependency, - ProFormDigit, - ProFormRadio, - ProFormSelect, - ProFormText, - ProFormTextArea, -} from '@ant-design/pro-components'; -import { useRequest } from '@umijs/max'; -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, { - manual: true, - onSuccess: () => { - message.success('提交成功'); - }, - }); - const onFinish = async (values: Record) => { - run(values); - }; - return ( - - - - - - - - - - - 客户 - (选填) - - } - tooltip="目标的服务对象" - name="client" - placeholder="请描述你服务的客户,内部客户直接 @姓名/工号" - /> - - - 邀评人 - (选填) - - } - name="invites" - placeholder="请直接 @姓名/工号,最多可邀请 5 人" - /> - - - 权重 - (选填) - - } - name="weight" - placeholder="请输入" - min={0} - max={100} - width="xs" - fieldProps={{ - formatter: (value) => `${value || 0}%`, - parser: (value) => Number(value ? value.replace('%', '') : '0'), - }} - /> - - - - {({ publicType }) => { - return ( - - ); - }} - - - - - ); -}; -export default BasicForm; diff --git a/src/pages/form/step-form/index.tsx b/src/pages/form/step-form/index.tsx deleted file mode 100644 index d70b31aa..00000000 --- a/src/pages/form/step-form/index.tsx +++ /dev/null @@ -1,248 +0,0 @@ -import { - PageContainer, - ProForm, - ProFormDigit, - ProFormSelect, - ProFormText, - StepsForm, -} from '@ant-design/pro-components'; -import type { FormInstance } 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; -}> = ({ stepData, bordered }) => { - const { payAccount, receiverAccount, receiverName, amount } = stepData; - return ( - - {payAccount} - {receiverAccount} - {receiverName} - - - 元 - - } - precision={2} - /> - - - ); -}; -const StepResult: React.FC<{ - onFinish: () => Promise; - children?: React.ReactNode; -}> = (props) => { - const { styles } = useStyles(); - return ( - - - - - } - className={styles.result} - > - {props.children} - - ); -}; -const StepForm: React.FC> = () => { - const { styles } = useStyles(); - const [stepData, setStepData] = useState({ - payAccount: 'ant-design@alipay.com', - receiverAccount: 'test@example.com', - receiverName: 'Alex', - amount: '500', - receiverMode: 'alipay', - }); - const [current, setCurrent] = useState(0); - const formRef = useRef(null); - return ( - - - { - if (props.step === 2) { - return null; - } - return dom; - }, - }} - > - - formRef={formRef} - title="填写转账信息" - initialValues={stepData} - onFinish={async (values) => { - setStepData(values); - return true; - }} - > - - - - - - - - - - - -
    - - - - -
    -
    - - { - setCurrent(0); - formRef.current?.resetFields(); - }} - > - - - -
    - -
    -

    说明

    -

    转账到支付宝账户

    -

    - 如果需要,这里可以放一些关于产品的常见问题说明。如果需要,这里可以放一些关于产品的常见问题说明。如果需要,这里可以放一些关于产品的常见问题说明。 -

    -

    转账到银行卡

    -

    - 如果需要,这里可以放一些关于产品的常见问题说明。如果需要,这里可以放一些关于产品的常见问题说明。如果需要,这里可以放一些关于产品的常见问题说明。 -

    -
    -
    -
    - ); -}; -export default StepForm; diff --git a/src/pages/list/basic-list/components/OperationModal.tsx b/src/pages/list/basic-list/components/OperationModal.tsx deleted file mode 100644 index ebb2e082..00000000 --- a/src/pages/list/basic-list/components/OperationModal.tsx +++ /dev/null @@ -1,129 +0,0 @@ -import { - ModalForm, - ProFormDateTimePicker, - ProFormSelect, - ProFormText, - ProFormTextArea, -} from '@ant-design/pro-components'; -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; - current: Partial | undefined; - onDone: () => void; - onSubmit: (values: BasicListItemDataType) => void; - children?: React.ReactNode; -}; -const OperationModal: FC = (props) => { - const { styles } = useStyles(); - const { done, open, current, onDone, onSubmit, children } = props; - if (!open) { - return null; - } - return ( - - open={open} - title={done ? null : `任务${current ? '编辑' : '添加'}`} - className={styles.standardListForm} - width={640} - onFinish={async (values) => { - onSubmit(values); - }} - initialValues={current} - submitter={{ - render: (_, dom) => (done ? null : dom), - }} - trigger={children} - modalProps={{ - onCancel: () => onDone(), - destroyOnHidden: true, - bodyStyle: done - ? { - padding: '72px 0', - } - : {}, - }} - > - {!done ? ( - <> - - - - - - ) : ( - - 知道了 - - } - className={styles.formResult} - /> - )} - - ); -}; -export default OperationModal; diff --git a/src/pages/list/basic-list/index.tsx b/src/pages/list/basic-list/index.tsx deleted file mode 100644 index 3ac9e29a..00000000 --- a/src/pages/list/basic-list/index.tsx +++ /dev/null @@ -1,280 +0,0 @@ -import { DownOutlined, PlusOutlined } from '@ant-design/icons'; -import { PageContainer } from '@ant-design/pro-components'; -import { useRequest } from '@umijs/max'; -import { - Avatar, - Button, - Card, - Col, - Dropdown, - Input, - List, - Modal, - Progress, - Row, - Segmented, -} from 'antd'; -import dayjs from 'dayjs'; -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 useStyles from './style.style'; - -const { Search } = Input; -const Info: FC<{ - title: React.ReactNode; - value: React.ReactNode; - bordered?: boolean; -}> = ({ title, value, bordered }) => { - const { styles } = useStyles(); - return ( -
    - {title} -

    {value}

    - {bordered && } -
    - ); -}; -const ListContent = ({ - data: { owner, createdAt, percent, status }, -}: { - data: BasicListItemDataType; -}) => { - const { styles } = useStyles(); - return ( -
    -
    - Owner -

    {owner}

    -
    -
    - 开始时间 -

    {dayjs(createdAt).format('YYYY-MM-DD HH:mm')}

    -
    -
    - -
    -
    - ); -}; -export const BasicList: FC = () => { - const { styles } = useStyles(); - const [done, setDone] = useState(false); - const [open, setVisible] = useState(false); - const [current, setCurrent] = useState< - Partial | undefined - >(undefined); - const { - data: listData, - loading, - mutate, - } = useRequest(() => { - return queryFakeList({ - count: 50, - }); - }); - const { run: postRun } = useRequest( - (method, params) => { - if (method === 'remove') { - return removeFakeList(params); - } - if (method === 'update') { - return updateFakeList(params); - } - return addFakeList(params); - }, - { - manual: true, - onSuccess: (result) => { - mutate(result); - }, - }, - ); - const list = listData?.list || []; - const paginationProps = { - showSizeChanger: true, - showQuickJumper: true, - pageSize: 5, - total: list.length, - }; - const showEditModal = (item: BasicListItemDataType) => { - setVisible(true); - setCurrent(item); - }; - const deleteItem = (id: string) => { - postRun('remove', { - id, - }); - }; - const editAndDelete = ( - key: string | number, - currentItem: BasicListItemDataType, - ) => { - if (key === 'edit') showEditModal(currentItem); - else if (key === 'delete') { - Modal.confirm({ - title: '删除任务', - content: '确定删除该任务吗?', - okText: '确认', - cancelText: '取消', - onOk: () => deleteItem(currentItem.id), - }); - } - }; - const extraContent = ( -
    - - ({})} - variant="filled" - /> -
    - ); - const MoreBtn: React.FC<{ - item: BasicListItemDataType; - }> = ({ item }) => ( - editAndDelete(key, item), - items: [ - { - key: 'edit', - label: '编辑', - }, - { - key: 'delete', - label: '删除', - }, - ], - }} - > - - 更多 - - - ); - const handleDone = () => { - setDone(false); - setVisible(false); - setCurrent({}); - }; - const handleSubmit = (values: BasicListItemDataType) => { - setDone(true); - const method = values?.id ? 'update' : 'add'; - postRun(method, values); - }; - return ( -
    - -
    - - - - - - - - - - - - - - - - ( - { - e.preventDefault(); - showEditModal(item); - }} - > - 编辑 - , - , - ]} - > - - } - title={{item.title}} - description={item.subDescription} - /> - - - )} - /> - -
    -
    - - -
    - ); -}; -export default BasicList; diff --git a/src/pages/list/search/applications/index.tsx b/src/pages/list/search/applications/index.tsx deleted file mode 100644 index 4b69ccad..00000000 --- a/src/pages/list/search/applications/index.tsx +++ /dev/null @@ -1,239 +0,0 @@ -import { - DownloadOutlined, - EditOutlined, - EllipsisOutlined, - ShareAltOutlined, -} from '@ant-design/icons'; -import { useRequest } from '@umijs/max'; -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'; -import { categoryOptions } from '../../mock'; -import StandardFormRow from './components/StandardFormRow'; -import TagSelect from './components/TagSelect'; -import type { ListItemDataType } from './data.d'; -import { queryFakeList } from './service'; -import useStyles from './style.style'; -export function formatWan(val: number) { - const v = val * 1; - if (!v || Number.isNaN(v)) return ''; - let result: React.ReactNode = val; - if (val > 10000) { - result = ( - - {Math.floor(val / 10000)} - - 万 - - - ); - } - return result; -} -const formItemLayout = { - wrapperCol: { - xs: { - span: 24, - }, - sm: { - span: 16, - }, - }, -}; -const CardInfo: React.FC<{ - activeUser: React.ReactNode; - newUser: React.ReactNode; -}> = ({ activeUser, newUser }) => { - const { styles } = useStyles(); - return ( -
    -
    -

    活跃用户

    -

    {activeUser}

    -
    -
    -

    新增用户

    -

    {newUser}

    -
    -
    - ); -}; -export const Applications: FC> = () => { - const { styles } = useStyles(); - const { data, loading, run } = useRequest((values: any) => { - console.log('form data', values); - return queryFakeList({ - count: 8, - }); - }); - - const list = data?.list || []; - - return ( -
    - -
    { - run(values); - }} - > - - - - {categoryOptions - .filter( - ( - category, - ): category is { value: string | number; label: string } => - category.value !== undefined && category.value !== null, - ) - .map((category) => ( - - {category.label} - - ))} - - - - - - - - - - - - -
    -
    -
    - - rowKey="id" - grid={{ - gutter: 16, - xs: 1, - sm: 2, - md: 3, - lg: 3, - xl: 4, - xxl: 4, - }} - loading={loading} - dataSource={list} - renderItem={(item) => ( - - - - , - - - , - - - , - - - , - ]} - > - } - title={item.title} - /> -
    - -
    -
    -
    - )} - /> -
    - ); -}; -export default Applications; diff --git a/src/pages/list/search/articles/index.tsx b/src/pages/list/search/articles/index.tsx deleted file mode 100644 index 868a11cf..00000000 --- a/src/pages/list/search/articles/index.tsx +++ /dev/null @@ -1,261 +0,0 @@ -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'; -import type { FC } from 'react'; -import React, { useMemo } from 'react'; -import { categoryOptions } from '../../mock'; -import ArticleListContent from './components/ArticleListContent'; -import StandardFormRow from './components/StandardFormRow'; -import TagSelect from './components/TagSelect'; -import type { ListItemDataType } from './data.d'; -import { queryFakeList } from './service'; -import useStyles from './style.style'; - -const FormItem = Form.Item; - -const pageSize = 5; - -const Articles: FC = () => { - const [form] = Form.useForm(); - - const { styles } = useStyles(); - - const { data, reload, loading, loadMore, loadingMore } = useRequest( - () => { - return queryFakeList({ - count: pageSize, - }); - }, - { - loadMore: true, - }, - ); - - const list = data?.list || []; - - const setOwner = () => { - form.setFieldsValue({ - owner: ['wzj'], - }); - }; - - const owners = [ - { - id: 'wzj', - name: '我自己', - }, - { - id: 'wjh', - name: '吴家豪', - }, - { - id: 'zxx', - name: '周星星', - }, - { - id: 'zly', - name: '赵丽颖', - }, - { - id: 'ym', - name: '姚明', - }, - ]; - - const IconText: React.FC<{ - type: string; - text: React.ReactNode; - }> = ({ type, text }) => { - switch (type) { - case 'star-o': - return ( - - - {text} - - ); - case 'like-o': - return ( - - - {text} - - ); - case 'message': - return ( - - - {text} - - ); - default: - return null; - } - }; - - const formItemLayout = { - wrapperCol: { - xs: { span: 24 }, - sm: { span: 24 }, - md: { span: 12 }, - }, - }; - - const loadMoreDom = list.length > 0 && ( -
    - -
    - ); - - const ownerOptions = useMemo( - () => - owners.map((item) => ({ - label: item.name, - value: item.id, - })), - [], - ); - - return ( - <> - -
    - - - - {categoryOptions - .filter( - ( - category, - ): category is { value: string | number; label: string } => - category.value !== undefined && category.value !== null, - ) - .map((category) => ( - - {category.label} - - ))} - - - - - - - - - - - - - - - - - - { - if (node?.parentNode) { - return node.parentNode as HTMLElement; - } - return node; - }} - content={ - open && ( -
    - {passwordStatusMap[getPasswordStatus()]} - {renderPasswordProgress()} -
    - 请至少输入 6 个字符。请不要使用容易被猜到的密码。 -
    -
    - ) - } - overlayStyle={{ - width: 240, - }} - placement="right" - open={open} - > - 0 && - styles.password - } - rules={[ - { - validator: checkPassword, - }, - ]} - > - - -
    - - - - - - - - - - - - - - - - - - - - - -
    - - - 使用已有账户登录 - -
    -
    - -
    - ); -}; -export default Register;