From 9fc19a3ebd21b6a7a64d1e6398c23eed83b87bc0 Mon Sep 17 00:00:00 2001 From: Dawn_Ocean <1785590531@qq.com> Date: Sat, 20 Apr 2024 21:57:50 +0800 Subject: [PATCH] refactor: request in DutyInfo & Welcome --- src/pages/Admin/DutyInfo/index.tsx | 159 +++++++++++++++++++---------- src/pages/Welcome/index.tsx | 134 ++++++++++++------------ src/pages/Welcome/stat.ts | 8 ++ src/services/api.ts | 3 +- src/services/typings.d.ts | 8 -- 5 files changed, 187 insertions(+), 125 deletions(-) create mode 100644 src/pages/Welcome/stat.ts diff --git a/src/pages/Admin/DutyInfo/index.tsx b/src/pages/Admin/DutyInfo/index.tsx index 1297157..37924fa 100644 --- a/src/pages/Admin/DutyInfo/index.tsx +++ b/src/pages/Admin/DutyInfo/index.tsx @@ -1,7 +1,14 @@ -import { PageContainer, ProForm, ProFormRadio, ProFormText } from '@ant-design/pro-components'; +import { getDutyInfo } from '@/services/api'; +import { + PageContainer, + ProForm, + ProFormDateTimeRangePicker, + ProFormDigit, + ProFormRadio, + ProFormText, +} from '@ant-design/pro-components'; import { Card, Col, Row, Space, message } from 'antd'; -// import { useState } from 'react'; -import request from 'umi-request'; +import { useEffect, useState } from 'react'; import { Info } from './info'; const waitTime = (time: number = 100) => { @@ -13,59 +20,107 @@ const waitTime = (time: number = 100) => { }; const DutyInfo: React.FC = () => { - // const [isNormalDuty, setIsNormalDuty] = useState(true); + const [dutyInfo, setDutyInfo] = useState(); + const [loading, setLoading] = useState(true); + const [messageApi, contextHolder] = message.useMessage(); + useEffect(() => { + getDutyInfo() + .then((res) => { + setDutyInfo(res.data); + setLoading(false); + }) + .catch((err) => { + messageApi.open({ + type: 'error', + content: '获取失败！' + err, + }); + }); + }); + // const [editableKeys, setEditableRowKeys] = useState(() => + // defaultData.map((item) => item.id), + // ); return ( + {contextHolder} - - submitter={{ - render: (props, doms) => { - return ( - - - {doms} - - - ); - }, - }} - onFinish={async (values) => { - await waitTime(2000); - console.log(values); - message.success('提交成功'); - }} - params={{}} - request={async (params = {} as Record) => - request('/admin/duty/current', { - params, - }) - } - > - + submitter={{ + render: (props, doms) => { + return ( + + + {doms} + + + ); + }, }} - /> - - - - + onFinish={async (values) => { + await waitTime(2000); + console.log(values); + message.success('提交成功'); + }} + initialValues={dutyInfo} + > + + + + + + + {/* + rowKey="id" + toolBarRender={false} + columns={columns} + recordCreatorProps={{ + newRecordType: 'dataSource', + position: 'top', + record: () => ({ + id: Date.now(), + addonBefore: 'ccccccc', + decs: 'testdesc', + }), + }} + editable={{ + type: 'multiple', + editableKeys, + onChange: setEditableRowKeys, + actionRender: (row, _, dom) => { + return [dom.delete]; + }, + }} + /> */} + + + + )} ); diff --git a/src/pages/Welcome/index.tsx b/src/pages/Welcome/index.tsx index eaef948..1db1527 100644 --- a/src/pages/Welcome/index.tsx +++ b/src/pages/Welcome/index.tsx @@ -5,6 +5,7 @@ import { PageContainer, ProCard, StatisticCard } from '@ant-design/pro-component import { Card, Statistic, message } from 'antd'; import RcResizeObserver from 'rc-resize-observer'; import { useLayoutEffect, useState } from 'react'; +import { Stat } from './stat'; const percentRing = (percent: number, frontColor: string): React.JSX.Element => { const TinyRing = Tiny.Ring as (props: TinyRingConfig) => JSX.Element; @@ -34,24 +35,21 @@ const percentRing = (percent: number, frontColor: string): React.JSX.Element => const Logs: React.FC = () => { const [responsive, setResponsive] = useState(false); const [messageApi, contextHolder] = message.useMessage(); - - const [todayPT, setTodayPT] = useState(0); - const [report, setReport] = useState(0); - const [oreo, setOreo] = useState(0); - const [totalPT, setTotalPT] = useState(0); - const [allSuccess, setAllSuccess] = useState(0); - const [all, setAll] = useState(0); + const [stat, setStat] = useState({ + todayPT: 0, + totalPT: 0, + oreo: 0, + report: 0, + allSuccess: 0, + all: 0, + }); + const [loading, setLoading] = useState(true); useLayoutEffect(() => { getStat() .then((res) => { - const data = res.data; - setTodayPT(data.todayPT); - setReport(data.report); - setOreo(data.oreo); - setTotalPT(data.totalPT); - setAllSuccess(data.allSuccess); - setAll(data.all); + setStat(res.data); + setLoading(false); }) .catch((err) => { messageApi.open({ @@ -63,62 +61,70 @@ const Logs: React.FC = () => { return ( {contextHolder} - - { - setResponsive(offset.width < 596); - }} - > - - - 左侧内容 - - - - ), - }} - /> - - - + {!loading && ( + + { + setResponsive(offset.width < 596); + }} + > + + + 左侧内容 + + , + title: '今日预填写工单数', + value: stat.todayPT, + description: ( + + ), }} - chartPlacement="left" /> - , - }} - chartPlacement="left" - /> - + + + + , + }} + chartPlacement="left" + /> + , + }} + chartPlacement="left" + /> + + - - - + + + )} ); }; diff --git a/src/pages/Welcome/stat.ts b/src/pages/Welcome/stat.ts new file mode 100644 index 0000000..d38e5ed --- /dev/null +++ b/src/pages/Welcome/stat.ts @@ -0,0 +1,8 @@ +export type Stat = { + todayPT: number; + totalPT: number; + oreo: number; + report: number; + allSuccess: number; + all: number; +}; diff --git a/src/services/api.ts b/src/services/api.ts index 136ce6e..36a022e 100644 --- a/src/services/api.ts +++ b/src/services/api.ts @@ -1,6 +1,7 @@ // @ts-ignore /* eslint-disable */ import { Info } from '@/pages/Admin/DutyInfo/info'; +import { Stat } from '@/pages/Welcome/stat'; import { request } from '@umijs/max'; import { API } from './typings'; @@ -37,7 +38,7 @@ export async function login(body: API.LoginParams, options?: { [key: string]: an /** 获取首页信息 GET /stats */ export async function getStat(options?: { [key: string]: any }) { return request<{ - data: API.Stat; + data: Stat; }>('/stats', { method: 'GET', ...(options || {}), diff --git a/src/services/typings.d.ts b/src/services/typings.d.ts index acbcde8..a9b4a8f 100644 --- a/src/services/typings.d.ts +++ b/src/services/typings.d.ts @@ -41,12 +41,4 @@ declare namespace API { size: number; data: LogsItem[]; }; - type Stat = { - todayPT: number; - totalPT: number; - oreo: number; - report: number; - allSuccess: number; - all: number; - }; }