From 4eaf3a1be0a949fced13cf829e070ab252e37ccd Mon Sep 17 00:00:00 2001
From: archer <545436317@qq.com>
Date: Sat, 25 Mar 2023 13:55:53 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=BB=9A=E5=8A=A8=E5=8A=A0=E8=BD=BD?=
=?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
package.json | 2 +
pnpm-lock.yaml | 5 +-
src/api/request.ts | 2 +-
src/components/Layout/index.tsx | 4 +-
src/components/ScrollData/index.tsx | 53 ++++++++++++++++--
src/hooks/usePaging.ts | 10 ++--
src/pages/api/user/checkPayResult.ts | 15 ++++--
src/pages/data/list.tsx | 7 +--
src/pages/number/setting.tsx | 80 +++++++++++++++++-----------
9 files changed, 131 insertions(+), 47 deletions(-)
diff --git a/package.json b/package.json
index d13a64250..73d87f068 100644
--- a/package.json
+++ b/package.json
@@ -27,6 +27,7 @@
"hyperdown": "^2.4.29",
"immer": "^9.0.19",
"jsonwebtoken": "^9.0.0",
+ "lodash": "^4.17.21",
"mammoth": "^1.5.1",
"mongoose": "^6.10.0",
"nanoid": "^4.0.1",
@@ -51,6 +52,7 @@
"@svgr/webpack": "^6.5.1",
"@types/formidable": "^2.0.5",
"@types/jsonwebtoken": "^9.0.1",
+ "@types/lodash": "^4.14.191",
"@types/node": "18.14.0",
"@types/nodemailer": "^6.4.7",
"@types/react": "18.0.28",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c52ed57ed..711c59987 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -10,6 +10,7 @@ specifiers:
'@tanstack/react-query': ^4.24.10
'@types/formidable': ^2.0.5
'@types/jsonwebtoken': ^9.0.1
+ '@types/lodash': ^4.14.191
'@types/node': 18.14.0
'@types/nodemailer': ^6.4.7
'@types/nprogress': ^0.2.0
@@ -31,6 +32,7 @@ specifiers:
immer: ^9.0.19
jsonwebtoken: ^9.0.0
lint-staged: ^13.1.2
+ lodash: ^4.17.21
mammoth: ^1.5.1
mongoose: ^6.10.0
nanoid: ^4.0.1
@@ -70,6 +72,7 @@ dependencies:
hyperdown: registry.npmmirror.com/hyperdown/2.4.29
immer: registry.npmmirror.com/immer/9.0.19
jsonwebtoken: registry.npmmirror.com/jsonwebtoken/9.0.0
+ lodash: registry.npmmirror.com/lodash/4.17.21
mammoth: registry.npmmirror.com/mammoth/1.5.1
mongoose: registry.npmmirror.com/mongoose/6.10.0
nanoid: registry.npmmirror.com/nanoid/4.0.1
@@ -94,6 +97,7 @@ devDependencies:
'@svgr/webpack': registry.npmmirror.com/@svgr/webpack/6.5.1
'@types/formidable': registry.npmmirror.com/@types/formidable/2.0.5
'@types/jsonwebtoken': registry.npmmirror.com/@types/jsonwebtoken/9.0.1
+ '@types/lodash': registry.npmmirror.com/@types/lodash/4.14.191
'@types/node': registry.npmmirror.com/@types/node/18.14.0
'@types/nodemailer': registry.npmmirror.com/@types/nodemailer/6.4.7
'@types/react': registry.npmmirror.com/@types/react/18.0.28
@@ -4794,7 +4798,6 @@ packages:
resolution: {integrity: sha512-BdZ5BCCvho3EIXw6wUCXHe7rS53AIDPLE+JzwgT+OsJk53oBfbSmZZ7CX4VaRoN78N+TJpFi9QPlfIVNmJYWxQ==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/@types/lodash/-/lodash-4.14.191.tgz}
name: '@types/lodash'
version: 4.14.191
- dev: false
registry.npmmirror.com/@types/mdast/3.0.10:
resolution: {integrity: sha512-W864tg/Osz1+9f4lrGTZpCSO5/z4608eUp19tbozkq2HJK6i3z1kT0H9tlADXuYIb1YYOBByU4Jsqkk75q48qA==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/@types/mdast/-/mdast-3.0.10.tgz}
diff --git a/src/api/request.ts b/src/api/request.ts
index 0d3987dd5..c1ed57ac6 100644
--- a/src/api/request.ts
+++ b/src/api/request.ts
@@ -37,7 +37,7 @@ function checkRes(data: ResponseDataType) {
console.log('error->', data, 'data is empty');
return Promise.reject('服务器异常');
} else if (data.code < 200 || data.code >= 400) {
- return Promise.reject(data.message);
+ return Promise.reject(data);
}
return data.data;
}
diff --git a/src/components/Layout/index.tsx b/src/components/Layout/index.tsx
index 24d0ad5ce..1c28a6907 100644
--- a/src/components/Layout/index.tsx
+++ b/src/components/Layout/index.tsx
@@ -62,8 +62,8 @@ const Layout = ({ children }: { children: JSX.Element }) => {
-
-
+
+
{children}
diff --git a/src/components/ScrollData/index.tsx b/src/components/ScrollData/index.tsx
index e08e2928c..e0f9c09ae 100644
--- a/src/components/ScrollData/index.tsx
+++ b/src/components/ScrollData/index.tsx
@@ -1,16 +1,63 @@
-import React from 'react';
+import React, { useRef, useEffect, useMemo } from 'react';
import type { BoxProps } from '@chakra-ui/react';
import { Box } from '@chakra-ui/react';
+import { throttle } from 'lodash';
interface Props extends BoxProps {
nextPage: () => void;
+ isLoadAll: boolean;
+ requesting: boolean;
children: React.ReactNode;
}
-const ScrollData = ({ children, nextPage, ...props }: Props) => {
+const ScrollData = ({ children, nextPage, isLoadAll, requesting, ...props }: Props) => {
+ const elementRef = useRef(null);
+ const loadText = useMemo(() => {
+ if (requesting) return '请求中……';
+ if (isLoadAll) return '已加载全部';
+ return '点击加载更多';
+ }, [isLoadAll, requesting]);
+
+ useEffect(() => {
+ if (!elementRef.current) return;
+
+ const scrolling = throttle((e: Event) => {
+ const element = e.target as HTMLDivElement;
+ if (!element) return;
+ // 当前滚动位置
+ const scrollTop = element.scrollTop;
+ // 可视高度
+ const clientHeight = element.clientHeight;
+ // 内容总高度
+ const scrollHeight = element.scrollHeight;
+ // 判断是否滚动到底部
+ if (scrollTop + clientHeight + 100 >= scrollHeight) {
+ nextPage();
+ }
+ }, 100);
+ elementRef.current.addEventListener('scroll', scrolling);
+ return () => {
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ elementRef.current?.removeEventListener('scroll', scrolling);
+ };
+ }, [elementRef, nextPage]);
+
return (
-
+
{children}
+ {
+ if (loadText !== '点击加载更多') return;
+ nextPage();
+ }}
+ >
+ {loadText}
+
);
};
diff --git a/src/hooks/usePaging.ts b/src/hooks/usePaging.ts
index da4b08609..d4bec7e81 100644
--- a/src/hooks/usePaging.ts
+++ b/src/hooks/usePaging.ts
@@ -37,6 +37,7 @@ export const usePaging = ({
setIsLoadAll(true);
}
setTotal(res.total);
+ setPageNum(num);
return data;
});
} catch (error: any) {
@@ -53,15 +54,18 @@ export const usePaging = ({
[api, isLoadAll, pageSize, params, requesting, toast]
);
- useQuery(['init', pageNum], () => getData(pageNum, pageNum === 1));
+ const nextPage = useCallback(() => getData(pageNum + 1), [getData, pageNum]);
+
+ useQuery(['init'], () => getData(1, true));
return {
pageNum,
pageSize,
- setPageNum,
total,
data,
getData,
- requesting
+ requesting,
+ isLoadAll,
+ nextPage
};
};
diff --git a/src/pages/api/user/checkPayResult.ts b/src/pages/api/user/checkPayResult.ts
index b7cf945fb..f1991ed90 100644
--- a/src/pages/api/user/checkPayResult.ts
+++ b/src/pages/api/user/checkPayResult.ts
@@ -4,6 +4,7 @@ import axios from 'axios';
import { connectToDatabase, User, Pay } from '@/service/mongo';
import { authToken } from '@/service/utils/tools';
import { PaySchema } from '@/types/mongoSchema';
+import dayjs from 'dayjs';
export default async function handler(req: NextApiRequest, res: NextApiResponse) {
try {
@@ -28,6 +29,10 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
`https://sif268.laf.dev/wechat-order-query?order_number=${payOrder.orderId}&api_key=${process.env.WXPAYCODE}`
);
+ // 校验下是否超过一天
+ const orderTime = dayjs(payOrder.createTime);
+ const diffInHours = dayjs().diff(orderTime, 'hours');
+
if (data.trade_state === 'SUCCESS') {
// 订单已支付
try {
@@ -47,7 +52,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
$inc: { balance: payOrder.price }
});
jsonRes(res, {
- data: 'success'
+ data: '支付成功'
});
}
} catch (error) {
@@ -56,17 +61,19 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
});
console.log(error);
}
- } else if (data.trade_state === 'CLOSED') {
+ } else if (data.trade_state === 'CLOSED' || diffInHours > 24) {
// 订单已关闭
await Pay.findByIdAndUpdate(payId, {
status: 'CLOSED'
});
+ jsonRes(res, {
+ data: '订单已过期'
+ });
} else {
throw new Error(data.trade_state_desc);
}
- throw new Error('订单已过期');
} catch (err) {
- console.log(err);
+ // console.log(err);
jsonRes(res, {
code: 500,
error: err
diff --git a/src/pages/data/list.tsx b/src/pages/data/list.tsx
index 33c074c79..2c45b85e2 100644
--- a/src/pages/data/list.tsx
+++ b/src/pages/data/list.tsx
@@ -28,8 +28,9 @@ const ImportDataModal = dynamic(() => import('./components/ImportDataModal'));
const DataList = () => {
const {
- setPageNum,
- pageNum,
+ nextPage,
+ isLoadAll,
+ requesting,
data: dataList,
getData
} = usePaging({
@@ -75,7 +76,7 @@ const DataList = () => {
{/* 数据表 */}
- setPageNum(pageNum + 1)}>
+
diff --git a/src/pages/number/setting.tsx b/src/pages/number/setting.tsx
index d5340e31b..f41aeb748 100644
--- a/src/pages/number/setting.tsx
+++ b/src/pages/number/setting.tsx
@@ -32,6 +32,7 @@ import { PaySchema } from '@/types/mongoSchema';
import dayjs from 'dayjs';
import { formatPrice } from '@/utils/user';
import WxConcat from '@/components/WxConcat';
+import ScrollData from '@/components/ScrollData';
const PayModal = dynamic(() => import('./components/PayModal'));
@@ -52,7 +53,12 @@ const NumberSetting = () => {
control,
name: 'accounts'
});
- const { setPageNum, data: bills } = usePaging({
+ const {
+ nextPage,
+ isLoadAll,
+ requesting,
+ data: bills
+ } = usePaging({
api: getUserBills,
pageSize: 30
});
@@ -84,9 +90,14 @@ const NumberSetting = () => {
const handleRefreshPayOrder = useCallback(
async (payId: string) => {
+ setLoading(true);
+
try {
- setLoading(true);
- await checkPayResult(payId);
+ const data = await checkPayResult(payId);
+ toast({
+ title: data,
+ status: 'info'
+ });
const res = await getPayOrders();
setPayOrders(res);
} catch (error: any) {
@@ -96,6 +107,7 @@ const NumberSetting = () => {
});
console.log(error);
}
+
setLoading(false);
},
[setLoading, toast]
@@ -196,8 +208,8 @@ const NumberSetting = () => {
-
-
+
+
充值记录
@@ -205,7 +217,7 @@ const NumberSetting = () => {
异常问题，wx联系
-
+
@@ -240,32 +252,40 @@ const NumberSetting = () => {
-
-
- 使用记录(最新30条)
+
+
+ 使用记录
-
-
-
-
- | 时间 |
- 内容长度 |
- 消费 |
-
-
-
- {bills.map((item) => (
-
- | {item.time} |
-
- {item.textLen}
- |
- {item.price}元 |
+
+
+
+
+
+ | 时间 |
+ 内容长度 |
+ 消费 |
- ))}
-
-
-
+
+
+ {bills.map((item) => (
+
+ | {item.time} |
+
+ {item.textLen}
+ |
+ {item.price}元 |
+
+ ))}
+
+
+
+
{showPay && setShowPay(false)} />}
{/* wx 联系 */}