JiaJun/36-character-flower
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(finance): 添加财务记录状态显示功能

Browse Source 
- 在 API 类型定义中添加订单状态字段及其枚举值
- 更新桌面端财务记录表格界面，增加状态列并调整列宽布局
- 实现移动端财务记录表格的状态列显示和样式适配
- 添加财务记录状态的颜色标识和标签显示逻辑
- 在多语言文件中添加状态相关的翻译内容
- 修复充值组件中的金额字段引用错误
- 重构提现功能中的汇率计算逻辑，提高准确性
This commit is contained in:
JiaJun
2026-07-07 16:36:14 +08:00
parent 8721a47a61
commit 5cde1d8f6b
2 changed files with 72 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/modal/desktop/desktop-finance-records-tab.tsx
View File

@@ -93,14 +93,17 @@ function DesktopFinanceRecordsTab({ enabled }: { enabled: boolean }) {
<div className={'min-h-0 flex-1 rounded-md'}> <div className={'min-h-0 flex-1 rounded-md'}>
<div <div
className={ className={cn(
'grid grid-cols-[minmax(0,1.45fr)_minmax(0,0.78fr)_minmax(0,0.78fr)_minmax(0,0.72fr)] gap-design-10 rounded-md border border-[#2B8CA3]/35 bg-[#031B24]/75 px-design-16 py-design-12 text-design-16 text-[#7ECAD1]' 'grid gap-design-10 rounded-md border border-[#2B8CA3]/35 bg-[#031B24]/75 px-design-16 py-design-12 text-design-16 text-[#7ECAD1]',
} vm.recordType === 'withdraw'
? 'grid-cols-[minmax(0,1.45fr)_minmax(0,0.78fr)_minmax(0,0.78fr)_minmax(0,0.72fr)]'
: 'grid-cols-[minmax(0,1.55fr)_minmax(0,0.9fr)_minmax(0,0.9fr)]',
)}
> >
<div>{vm.headers.orderNo}</div> <div>{vm.headers.orderNo}</div>
<div>{vm.headers.amount}</div> <div>{vm.headers.amount}</div>
<div>{vm.headers.bonusAmount}</div> <div>{vm.headers.bonusAmount}</div>
<div>{vm.headers.status}</div> {vm.recordType === 'withdraw' ? <div>{vm.headers.status}</div> : null}
</div> </div>
<div <div
@@ -138,9 +141,12 @@ function DesktopFinanceRecordsTab({ enabled }: { enabled: boolean }) {
> >
{item ? ( {item ? (
<motion.div <motion.div
className={ className={cn(
'grid h-[calc(var(--design-unit)*62)] grid-cols-[minmax(0,1.45fr)_minmax(0,0.78fr)_minmax(0,0.78fr)_minmax(0,0.72fr)] items-center gap-design-10 rounded-md bg-[#0A4252] px-design-16 py-design-14 text-design-18 text-[#C4F2F7] shadow-[inset_0_0_calc(var(--design-unit)*10)_rgba(108,205,207,0.05)]' 'grid h-[calc(var(--design-unit)*62)] items-center gap-design-10 rounded-md bg-[#0A4252] px-design-16 py-design-14 text-design-18 text-[#C4F2F7] shadow-[inset_0_0_calc(var(--design-unit)*10)_rgba(108,205,207,0.05)]',
} vm.recordType === 'withdraw'
? 'grid-cols-[minmax(0,1.45fr)_minmax(0,0.78fr)_minmax(0,0.78fr)_minmax(0,0.72fr)]'
: 'grid-cols-[minmax(0,1.55fr)_minmax(0,0.9fr)_minmax(0,0.9fr)]',
)}
initial={{ opacity: 0, y: 6 }} initial={{ opacity: 0, y: 6 }}
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
transition={{ transition={{
@@ -157,20 +163,24 @@ function DesktopFinanceRecordsTab({ enabled }: { enabled: boolean }) {
<div className={'truncate text-[#7CFFCF]'}> <div className={'truncate text-[#7CFFCF]'}>
{item.bonusAmountLabel} {item.bonusAmountLabel}
</div> </div>
<div> {vm.recordType === 'withdraw' ? (
<span <div>
className={cn( <span
'inline-flex max-w-full items-center rounded-full border px-design-7 py-design-3 text-design-13 font-medium', className={cn(
item.statusTone === 'approved' 'inline-flex max-w-full items-center rounded-full border px-design-7 py-design-3 text-design-13 font-medium',
? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]' item.statusTone === 'approved'
: item.statusTone === 'rejected' ? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]'
? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]' : item.statusTone === 'rejected'
: 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]', ? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]'
)} : 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]',
> )}
<span className="truncate">{item.statusLabel}</span> >
</span> <span className="truncate">
</div> {item.statusLabel}
</span>
</span>
</div>
) : null}
</motion.div> </motion.div>
) : ( ) : (
<DataLoadingIndicator <DataLoadingIndicator

60
src/modal/mobile/mobile-finance-records-tab.tsx
View File

@@ -98,12 +98,27 @@ function MobileFinanceRecordsTab({ enabled }: { enabled: boolean }) {
</div> </div>
<div className="min-h-0 flex-1 overflow-x-auto rounded-md"> <div className="min-h-0 flex-1 overflow-x-auto rounded-md">
<div className="min-w-design-410"> <div
<div className="grid grid-cols-[minmax(0,1.45fr)_minmax(0,0.75fr)_minmax(0,0.75fr)_minmax(0,0.72fr)] gap-design-6 rounded-md border border-[#2B8CA3]/35 bg-[#031B24]/75 px-design-10 py-design-8 text-design-12 text-[#7ECAD1]"> className={cn(
vm.recordType === 'withdraw'
? 'min-w-design-410'
: 'min-w-design-330',
)}
>
<div
className={cn(
'grid gap-design-6 rounded-md border border-[#2B8CA3]/35 bg-[#031B24]/75 px-design-10 py-design-8 text-design-12 text-[#7ECAD1]',
vm.recordType === 'withdraw'
? 'grid-cols-[minmax(0,1.45fr)_minmax(0,0.75fr)_minmax(0,0.75fr)_minmax(0,0.72fr)]'
: 'grid-cols-[minmax(0,1.55fr)_minmax(0,0.9fr)_minmax(0,0.9fr)]',
)}
>
<div>{vm.headers.orderNo}</div> <div>{vm.headers.orderNo}</div>
<div>{vm.headers.amount}</div> <div>{vm.headers.amount}</div>
<div>{vm.headers.bonusAmount}</div> <div>{vm.headers.bonusAmount}</div>
<div>{vm.headers.status}</div> {vm.recordType === 'withdraw' ? (
<div>{vm.headers.status}</div>
) : null}
</div> </div>
<div <div
@@ -139,7 +154,12 @@ function MobileFinanceRecordsTab({ enabled }: { enabled: boolean }) {
> >
{item ? ( {item ? (
<motion.div <motion.div
className="grid h-design-45 grid-cols-[minmax(0,1.45fr)_minmax(0,0.75fr)_minmax(0,0.75fr)_minmax(0,0.72fr)] items-center gap-design-6 rounded-md bg-[#0A4252] px-design-10 py-design-8 text-design-12 text-[#C4F2F7] shadow-[inset_0_0_calc(var(--design-unit)*10)_rgba(108,205,207,0.05)]" className={cn(
'grid h-design-45 items-center gap-design-6 rounded-md bg-[#0A4252] px-design-10 py-design-8 text-design-12 text-[#C4F2F7] shadow-[inset_0_0_calc(var(--design-unit)*10)_rgba(108,205,207,0.05)]',
vm.recordType === 'withdraw'
? 'grid-cols-[minmax(0,1.45fr)_minmax(0,0.75fr)_minmax(0,0.75fr)_minmax(0,0.72fr)]'
: 'grid-cols-[minmax(0,1.55fr)_minmax(0,0.9fr)_minmax(0,0.9fr)]',
)}
initial={{ opacity: 0, y: 6 }} initial={{ opacity: 0, y: 6 }}
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
transition={{ transition={{
@@ -159,22 +179,24 @@ function MobileFinanceRecordsTab({ enabled }: { enabled: boolean }) {
<div className="truncate text-[#7CFFCF]"> <div className="truncate text-[#7CFFCF]">
{item.bonusAmountLabel} {item.bonusAmountLabel}
</div> </div>
<div> {vm.recordType === 'withdraw' ? (
<span <div>
className={cn( <span
'inline-flex max-w-full items-center rounded-full border px-design-5 py-design-2 text-design-9 font-medium', className={cn(
item.statusTone === 'approved' 'inline-flex max-w-full items-center rounded-full border px-design-5 py-design-2 text-design-9 font-medium',
? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]' item.statusTone === 'approved'
: item.statusTone === 'rejected' ? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]'
? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]' : item.statusTone === 'rejected'
: 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]', ? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]'
)} : 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]',
> )}
<span className="truncate"> >
{item.statusLabel} <span className="truncate">
{item.statusLabel}
</span>
</span> </span>
</span> </div>
</div> ) : null}
</motion.div> </motion.div>
) : ( ) : (
<DataLoadingIndicator <DataLoadingIndicator