Files
dukang/apps/mini-user/src/pages/benefit-detail/index.tsx
T

71 lines
2.3 KiB
TypeScript

import { useEffect, useState } from 'react';
import { View, Text } from '@tarojs/components';
import Taro from '@tarojs/taro';
import PageShell from '../../components/PageShell';
import SubPageHeader from '../../components/SubPageHeader';
import { request } from '../../lib/api';
type LedgerItem = {
id: string;
title?: string;
amount: number;
createdAt?: string;
type?: string;
};
export default function BenefitDetailPage() {
const [items, setItems] = useState<LedgerItem[]>([]);
const [loading, setLoading] = useState(true);
useEffect(() => {
request<LedgerItem[]>('/benefit/ledger')
.then((data) => setItems(Array.isArray(data) ? data : []))
.catch(() => {
// UI shell fallback demo rows when API missing
setItems([]);
})
.finally(() => setLoading(false));
}, []);
return (
<PageShell variant="sub" className="benefit-detail-page">
<SubPageHeader
title="权益明细"
onBack={() => {
const pages = Taro.getCurrentPages();
if (pages.length > 1) {
Taro.navigateBack();
return;
}
Taro.switchTab({ url: '/pages/mine/index' });
}}
/>
<View className="sub-page-body">
<View className="order-card">
{loading ? <View className="u-empty">加载中…</View> : null}
{!loading && items.length === 0 ? (
<View className="u-empty">暂无明细记录</View>
) : null}
{items.map((item) => {
const isOut = Number(item.amount) < 0 || item.type === 'REDEEM';
return (
<View key={item.id} className="ledger-item">
<View>
<Text className="ledger-title">{item.title || (isOut ? '门店核销' : '购酒入账')}</Text>
<Text className="ledger-time">
{item.createdAt ? String(item.createdAt).slice(0, 19).replace('T', ' ') : '-'}
</Text>
</View>
<Text className={`ledger-amount ${isOut ? 'ledger-amount--out' : 'ledger-amount--in'}`}>
{isOut ? '' : '+'}
{Number(item.amount).toFixed(2)}
</Text>
</View>
);
})}
</View>
</View>
</PageShell>
);
}