feat(wallet): migrate to backend API
This commit is contained in:
@@ -10,13 +10,17 @@ import {
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from "@/components/ui/table"
|
||||
import { listTransactions } from "@/lib/api"
|
||||
import { requestWithAuth } from "@/lib/api"
|
||||
import { listWalletTransactions } from "@/lib/api/transactions"
|
||||
import { isActiveOrder, isCompletedOrder } from "@/lib/domain/order-filters"
|
||||
import { resolveOwnerShop } from "@/lib/domain/resolve-current-shop"
|
||||
import { toApiError } from "@/lib/errors"
|
||||
import type { WalletTransaction } from "@/lib/types"
|
||||
import { useAuthStore } from "@/store/auth"
|
||||
import { useOrderStore } from "@/store/orders"
|
||||
import { useShopStore } from "@/store/shops"
|
||||
import { ArrowDownLeft, ArrowUpRight, CreditCard, DollarSign } from "lucide-react"
|
||||
import { useEffect, useState } from "react"
|
||||
|
||||
export default function ShopIncomePage() {
|
||||
const userId = useAuthStore((state) => state.user?.id)
|
||||
@@ -24,6 +28,41 @@ export default function ShopIncomePage() {
|
||||
const orders = useOrderStore((state) => state.orders)
|
||||
const shop = resolveOwnerShop(userId, shops)
|
||||
|
||||
const [transactions, setTransactions] = useState<WalletTransaction[]>([])
|
||||
const [isLoading, setIsLoading] = useState(false)
|
||||
const [loadError, setLoadError] = useState<string | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
if (!shop) return
|
||||
|
||||
let cancelled = false
|
||||
|
||||
async function load() {
|
||||
setIsLoading(true)
|
||||
setLoadError(null)
|
||||
try {
|
||||
const res = await requestWithAuth(() => listWalletTransactions({ offset: 0, limit: 1000 }))
|
||||
if (cancelled) return
|
||||
if (!res) {
|
||||
setLoadError("请先登录")
|
||||
setTransactions([])
|
||||
return
|
||||
}
|
||||
setTransactions(res)
|
||||
} catch (error) {
|
||||
if (cancelled) return
|
||||
setLoadError(toApiError(error).msg)
|
||||
} finally {
|
||||
if (!cancelled) setIsLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
void load()
|
||||
return () => {
|
||||
cancelled = true
|
||||
}
|
||||
}, [shop])
|
||||
|
||||
if (!shop) {
|
||||
return <div className="text-sm text-muted-foreground">当前账号没有可管理的店铺</div>
|
||||
}
|
||||
@@ -45,7 +84,7 @@ export default function ShopIncomePage() {
|
||||
.reduce((acc, order) => acc + order.totalPrice, 0)
|
||||
|
||||
const shopOrderIds = new Set(shopOrders.map((order) => order.id))
|
||||
const relatedTransactions = listTransactions().filter((transaction) => {
|
||||
const relatedTransactions = transactions.filter((transaction) => {
|
||||
if (transaction.type === "withdrawal") return true
|
||||
if (transaction.type !== "income") return false
|
||||
const match = transaction.description.match(/ord[-\d]+/)
|
||||
@@ -102,36 +141,58 @@ export default function ShopIncomePage() {
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{relatedTransactions.map((transaction) => (
|
||||
<TableRow key={transaction.id}>
|
||||
<TableCell>
|
||||
<div className="flex items-center gap-2">
|
||||
{transaction.amount > 0 ? (
|
||||
<ArrowDownLeft className="h-4 w-4 text-green-500" />
|
||||
) : (
|
||||
<ArrowUpRight className="h-4 w-4 text-red-500" />
|
||||
)}
|
||||
<Badge variant={transaction.amount > 0 ? "default" : "secondary"}>
|
||||
{transaction.type === "topup"
|
||||
? "充值"
|
||||
: transaction.type === "payment"
|
||||
? "支付"
|
||||
: transaction.type === "income"
|
||||
? "收入"
|
||||
: transaction.type === "withdrawal"
|
||||
? "提现"
|
||||
: "退款"}
|
||||
</Badge>
|
||||
</div>
|
||||
{isLoading ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={4} className="text-center py-8 text-muted-foreground text-sm">
|
||||
加载中...
|
||||
</TableCell>
|
||||
<TableCell>{transaction.description}</TableCell>
|
||||
<TableCell className={transaction.amount > 0 ? "text-green-600" : "text-red-600"}>
|
||||
{transaction.amount > 0 ? "+" : ""}
|
||||
{transaction.amount}
|
||||
</TableCell>
|
||||
<TableCell>{new Date(transaction.createdAt).toLocaleString()}</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
) : loadError ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={4} className="text-center py-8 text-destructive text-sm">
|
||||
{loadError}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
) : relatedTransactions.length > 0 ? (
|
||||
relatedTransactions.map((transaction) => (
|
||||
<TableRow key={transaction.id}>
|
||||
<TableCell>
|
||||
<div className="flex items-center gap-2">
|
||||
{transaction.amount > 0 ? (
|
||||
<ArrowDownLeft className="h-4 w-4 text-green-500" />
|
||||
) : (
|
||||
<ArrowUpRight className="h-4 w-4 text-red-500" />
|
||||
)}
|
||||
<Badge variant={transaction.amount > 0 ? "default" : "secondary"}>
|
||||
{transaction.type === "topup"
|
||||
? "充值"
|
||||
: transaction.type === "payment"
|
||||
? "支付"
|
||||
: transaction.type === "income"
|
||||
? "收入"
|
||||
: transaction.type === "withdrawal"
|
||||
? "提现"
|
||||
: "退款"}
|
||||
</Badge>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell>{transaction.description}</TableCell>
|
||||
<TableCell
|
||||
className={transaction.amount > 0 ? "text-green-600" : "text-red-600"}
|
||||
>
|
||||
{transaction.amount > 0 ? "+" : ""}
|
||||
{transaction.amount}
|
||||
</TableCell>
|
||||
<TableCell>{new Date(transaction.createdAt).toLocaleString()}</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
) : (
|
||||
<TableRow>
|
||||
<TableCell colSpan={4} className="text-center py-8 text-muted-foreground text-sm">
|
||||
暂无交易记录
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</CardContent>
|
||||
|
||||
Reference in New Issue
Block a user