mz/video-gen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改页面分页情况

Browse Source
This commit is contained in:
root
2026-06-15 17:50:47 +08:00
parent 3aa6c7cf2f
commit d71b50c200
12 changed files with 187 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
video-gen-app/src/api/index.ts
+26 -8
View File
@@ -153,9 +153,15 @@ export async function generateVideo(recordId: string, params: GenerateParams): P
});
}
// ── Credits ───────────────────────────────────────────────
export async function getCredits(): Promise<{ credits: number; records: CreditRecord[] }> {
if (USE_MOCK) return mock.mockGetCredits();
return api.get('/credits');
export async function getCredits(page = 1, pageSize = 20): Promise<{ credits: number; records: CreditRecord[]; total: number }> {
if (USE_MOCK) {
const data = await mock.mockGetCredits();
return data;
}
const params = new URLSearchParams();
params.set('page', String(page));
params.set('page_size', String(pageSize));
return api.get(`/credits?${params.toString()}`);
}
// ── Captcha ───────────────────────────────────────────────
export async function getSliderCaptcha(): Promise<{ captcha_id: string; bg_image: string; slider_image: string }> {
@@ -191,9 +197,18 @@ export async function verifySms(phone: string, code: string): Promise<{ token: s
return api.post('/sms/verify', { phone, code }, false);
}
// ── Notifications ─────────────────────────────────────────
export async function getNotifications(): Promise<AdminNotification[]> {
if (USE_MOCK) return mock.mockGetAdminNotifications();
return api.get('/notifications');
export async function getNotifications(page = 1, pageSize = 20, isRead?: boolean): Promise<{ items: AdminNotification[], total: number }> {
if (USE_MOCK) {
const items = await mock.mockGetAdminNotifications();
return { items, total: items.length };
}
const params = new URLSearchParams();
params.set('page', String(page));
params.set('page_size', String(pageSize));
if (isRead !== undefined) {
params.set('is_read', String(isRead));
}
return api.get(`/notifications?${params.toString()}`);
}
export async function getUnreadCount(): Promise<number> {
if (USE_MOCK) return mock.mockGetAdminNotifications().then(n => n.filter(x => !x.isRead).length);
@@ -271,8 +286,11 @@ export async function createRechargeOrder(planId: string, method: string = 'wech
return api.post('/payments/recharge', { plan: planId, method });
}
export async function getPaymentOrders(): Promise<any[]> {
return api.get('/payments/orders');
export async function getPaymentOrders(page = 1, pageSize = 20): Promise<{ items: any[]; total: number }> {
const params = new URLSearchParams();
params.set('page', String(page));
params.set('page_size', String(pageSize));
return api.get(`/payments/orders?${params.toString()}`);
}
export async function getPaymentOrder(orderNo: string): Promise<any> {
video-gen-app/src/api/mock.ts
+2 -1
View File
@@ -157,11 +157,12 @@ export async function mockGetUser(): Promise<User | null> {
return currentUser;
}
export async function mockGetCredits(): Promise<{ credits: number; records: CreditRecord[] }> {
export async function mockGetCredits(): Promise<{ credits: number; records: CreditRecord[]; total: number }> {
await delay(400);
return {
credits: currentUser?.credits ?? 0,
records: MOCK_CREDIT_RECORDS,
total: MOCK_CREDIT_RECORDS.length,
};
}
video-gen-app/src/components/NotificationPopup.tsx
+2 -1
View File
@@ -27,7 +27,8 @@ const NotificationPopup: React.FC = () => {
const fetchNotifications = useCallback(async () => {
try {
const data = await getNotifications();
const result = await getNotifications();
const data = result.items || [];
const unread = data.filter((n: Notification) => !n.isRead);
setNotifications(unread);
if (unread.length > 0 && !visible) {
video-gen-app/src/pages/CreditRecordsPage.tsx
+29 -10
View File
@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { Table, Tag, Empty, Spin, Typography, Row, Col } from 'antd';
import { Table, Tag, Empty, Spin, Typography, Row, Col, Pagination } from 'antd';
import { WalletOutlined, PlusCircleOutlined, ThunderboltOutlined } from '@ant-design/icons';
import { getCredits } from '../api';
@@ -7,23 +7,31 @@ const CreditRecordsPage: React.FC = () => {
const [loading, setLoading] = useState(true);
const [records, setRecords] = useState<any[]>([]);
const [credits, setCredits] = useState(0);
const [total, setTotal] = useState(0);
const [page, setPage] = useState(1);
const [pageSize] = useState(10);
useEffect(() => {
loadData();
}, []);
}, [page]);
const loadData = async () => {
setLoading(true);
try {
const data = await getCredits();
const data = await getCredits(page, pageSize);
setRecords(data.records || []);
setCredits(data.credits || 0);
setTotal(data.total || 0);
} catch {
setRecords([]);
}
setLoading(false);
};
const handlePageChange = (newPage: number) => {
setPage(newPage);
};
const columns = [
{
title: '变动类型',
@@ -139,13 +147,24 @@ const CreditRecordsPage: React.FC = () => {
description={<span style={{ color: '#94a3b8' }}>暂无积分变动记录</span>}
/>
) : (
<Table
dataSource={records}
columns={columns}
rowKey="id"
pagination={{ pageSize: 10, size: 'small' }}
bordered={false}
/>
<>
<Table
dataSource={records}
columns={columns}
rowKey="id"
pagination={false}
bordered={false}
/>
<div style={{ padding: '16px', textAlign: 'right' }}>
<Pagination
current={page}
pageSize={pageSize}
total={total}
onChange={handlePageChange}
size="small"
/>
</div>
</>
)}
</Spin>
</div>
video-gen-app/src/pages/MessagesPage.tsx
+42 -13
View File
@@ -1,36 +1,54 @@
import React, { useEffect, useState } from 'react';
import { Table, Tag, Empty, Spin, Typography, Button } from 'antd';
import { Table, Tag, Empty, Spin, Typography, Button, Pagination } from 'antd';
import { BellOutlined, SettingOutlined, WalletOutlined, GiftOutlined } from '@ant-design/icons';
import { getNotifications, markNotificationRead } from '../api';
import { getNotifications, markNotificationRead, getUnreadCount } from '../api';
const MessagesPage: React.FC = () => {
const [loading, setLoading] = useState(true);
const [notifications, setNotifications] = useState<any[]>([]);
const [unreadCount, setUnreadCount] = useState(0);
const [total, setTotal] = useState(0);
const [page, setPage] = useState(1);
const [pageSize] = useState(10);
useEffect(() => {
loadData();
}, []);
loadUnreadCount();
}, [page]);
const loadData = async () => {
setLoading(true);
try {
const data = await getNotifications();
setNotifications(data || []);
setUnreadCount(data.filter((n: any) => !(n.isRead ?? n.is_read)).length);
const data = await getNotifications(page, pageSize);
setNotifications(data.items || []);
setTotal(data.total || 0);
} catch {
setNotifications([]);
}
setLoading(false);
};
const loadUnreadCount = async () => {
try {
const count = await getUnreadCount();
setUnreadCount(count);
} catch {
setUnreadCount(0);
}
};
const handleMarkRead = async (id: string) => {
try {
await markNotificationRead(id);
loadData();
loadUnreadCount();
} catch { /* ignore */ }
};
const handlePageChange = (newPage: number) => {
setPage(newPage);
};
const columns = [
{
title: '类型',
@@ -131,13 +149,24 @@ const MessagesPage: React.FC = () => {
description={<span style={{ color: '#94a3b8' }}>暂无消息</span>}
/>
) : (
<Table
dataSource={notifications}
columns={columns}
rowKey="id"
pagination={{ pageSize: 10, size: 'small' }}
bordered={false}
/>
<>
<Table
dataSource={notifications}
columns={columns}
rowKey="id"
pagination={false}
bordered={false}
/>
<div style={{ padding: '16px', textAlign: 'right' }}>
<Pagination
current={page}
pageSize={pageSize}
total={total}
onChange={handlePageChange}
size="small"
/>
</div>
</>
)}
</Spin>
</div>
video-gen-app/src/pages/OrderRecordsPage.tsx
+30 -11
View File
@@ -1,27 +1,35 @@
import React, { useEffect, useState } from 'react';
import { Table, Tag, Empty, Spin, Typography } from 'antd';
import { Table, Tag, Empty, Spin, Typography, Pagination } from 'antd';
import { FileTextOutlined, AlipayCircleOutlined, WechatOutlined } from '@ant-design/icons';
import { getPaymentOrders } from '../api';
const OrderRecordsPage: React.FC = () => {
const [loading, setLoading] = useState(true);
const [orders, setOrders] = useState<any[]>([]);
const [total, setTotal] = useState(0);
const [page, setPage] = useState(1);
const [pageSize] = useState(10);
useEffect(() => {
loadData();
}, []);
}, [page]);
const loadData = async () => {
setLoading(true);
try {
const data = await getPaymentOrders();
setOrders(data || []);
const data = await getPaymentOrders(page, pageSize);
setOrders(data.items || []);
setTotal(data.total || 0);
} catch {
setOrders([]);
}
setLoading(false);
};
const handlePageChange = (newPage: number) => {
setPage(newPage);
};
const columns = [
{
title: '订单号',
@@ -140,13 +148,24 @@ const OrderRecordsPage: React.FC = () => {
description={<span style={{ color: '#94a3b8' }}>暂无订单记录</span>}
/>
) : (
<Table
dataSource={orders}
columns={columns}
rowKey="order_no"
pagination={{ pageSize: 10, size: 'small' }}
bordered={false}
/>
<>
<Table
dataSource={orders}
columns={columns}
rowKey="order_no"
pagination={false}
bordered={false}
/>
<div style={{ padding: '16px', textAlign: 'right' }}>
<Pagination
current={page}
pageSize={pageSize}
total={total}
onChange={handlePageChange}
size="small"
/>
</div>
</>
)}
</Spin>
</div>