feat(finance): 添加财务记录状态显示功能
- 在 API 类型定义中添加订单状态字段及其枚举值 - 更新桌面端财务记录表格界面,增加状态列并调整列宽布局 - 实现移动端财务记录表格的状态列显示和样式适配 - 添加财务记录状态的颜色标识和标签显示逻辑 - 在多语言文件中添加状态相关的翻译内容 - 修复充值组件中的金额字段引用错误 - 重构提现功能中的汇率计算逻辑,提高准确性
This commit is contained in:
@@ -95,15 +95,13 @@ function DesktopFinanceRecordsTab({ enabled }: { enabled: boolean }) {
|
||||
<div
|
||||
className={cn(
|
||||
'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)]',
|
||||
'grid-cols-[minmax(0,1.45fr)_minmax(0,0.78fr)_minmax(0,0.78fr)_minmax(0,0.72fr)]',
|
||||
)}
|
||||
>
|
||||
<div>{vm.headers.orderNo}</div>
|
||||
<div>{vm.headers.amount}</div>
|
||||
<div>{vm.headers.bonusAmount}</div>
|
||||
{vm.recordType === 'withdraw' ? <div>{vm.headers.status}</div> : null}
|
||||
<div>{vm.headers.status}</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
@@ -143,9 +141,7 @@ function DesktopFinanceRecordsTab({ enabled }: { enabled: boolean }) {
|
||||
<motion.div
|
||||
className={cn(
|
||||
'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)]',
|
||||
'grid-cols-[minmax(0,1.45fr)_minmax(0,0.78fr)_minmax(0,0.78fr)_minmax(0,0.72fr)]',
|
||||
)}
|
||||
initial={{ opacity: 0, y: 6 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
@@ -163,24 +159,20 @@ function DesktopFinanceRecordsTab({ enabled }: { enabled: boolean }) {
|
||||
<div className={'truncate text-[#7CFFCF]'}>
|
||||
{item.bonusAmountLabel}
|
||||
</div>
|
||||
{vm.recordType === 'withdraw' ? (
|
||||
<div>
|
||||
<span
|
||||
className={cn(
|
||||
'inline-flex max-w-full items-center rounded-full border px-design-7 py-design-3 text-design-13 font-medium',
|
||||
item.statusTone === 'approved'
|
||||
? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]'
|
||||
: item.statusTone === 'rejected'
|
||||
? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]'
|
||||
: 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]',
|
||||
)}
|
||||
>
|
||||
<span className="truncate">
|
||||
{item.statusLabel}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
) : null}
|
||||
<div>
|
||||
<span
|
||||
className={cn(
|
||||
'inline-flex max-w-full items-center rounded-full border px-design-7 py-design-3 text-design-13 font-medium',
|
||||
item.statusTone === 'approved'
|
||||
? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]'
|
||||
: item.statusTone === 'rejected'
|
||||
? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]'
|
||||
: 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]',
|
||||
)}
|
||||
>
|
||||
<span className="truncate">{item.statusLabel}</span>
|
||||
</span>
|
||||
</div>
|
||||
</motion.div>
|
||||
) : (
|
||||
<DataLoadingIndicator
|
||||
|
||||
@@ -98,27 +98,17 @@ function MobileFinanceRecordsTab({ enabled }: { enabled: boolean }) {
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 flex-1 overflow-x-auto rounded-md">
|
||||
<div
|
||||
className={cn(
|
||||
vm.recordType === 'withdraw'
|
||||
? 'min-w-design-410'
|
||||
: 'min-w-design-330',
|
||||
)}
|
||||
>
|
||||
<div className={cn('min-w-design-410')}>
|
||||
<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)]',
|
||||
'grid-cols-[minmax(0,1.45fr)_minmax(0,0.75fr)_minmax(0,0.75fr)_minmax(0,0.72fr)]',
|
||||
)}
|
||||
>
|
||||
<div>{vm.headers.orderNo}</div>
|
||||
<div>{vm.headers.amount}</div>
|
||||
<div>{vm.headers.bonusAmount}</div>
|
||||
{vm.recordType === 'withdraw' ? (
|
||||
<div>{vm.headers.status}</div>
|
||||
) : null}
|
||||
<div>{vm.headers.status}</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
@@ -156,9 +146,7 @@ function MobileFinanceRecordsTab({ enabled }: { enabled: boolean }) {
|
||||
<motion.div
|
||||
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)]',
|
||||
'grid-cols-[minmax(0,1.45fr)_minmax(0,0.75fr)_minmax(0,0.75fr)_minmax(0,0.72fr)]',
|
||||
)}
|
||||
initial={{ opacity: 0, y: 6 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
@@ -179,24 +167,22 @@ function MobileFinanceRecordsTab({ enabled }: { enabled: boolean }) {
|
||||
<div className="truncate text-[#7CFFCF]">
|
||||
{item.bonusAmountLabel}
|
||||
</div>
|
||||
{vm.recordType === 'withdraw' ? (
|
||||
<div>
|
||||
<span
|
||||
className={cn(
|
||||
'inline-flex max-w-full items-center rounded-full border px-design-5 py-design-2 text-design-9 font-medium',
|
||||
item.statusTone === 'approved'
|
||||
? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]'
|
||||
: item.statusTone === 'rejected'
|
||||
? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]'
|
||||
: 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]',
|
||||
)}
|
||||
>
|
||||
<span className="truncate">
|
||||
{item.statusLabel}
|
||||
</span>
|
||||
<div>
|
||||
<span
|
||||
className={cn(
|
||||
'inline-flex max-w-full items-center rounded-full border px-design-5 py-design-2 text-design-9 font-medium',
|
||||
item.statusTone === 'approved'
|
||||
? 'border-[#5BEA99]/35 bg-[#0F593A]/55 text-[#7CFFCF]'
|
||||
: item.statusTone === 'rejected'
|
||||
? 'border-[#F47C7C]/35 bg-[#5D1E24]/55 text-[#FF9C9C]'
|
||||
: 'border-[#F0B44A]/35 bg-[#5D441E]/55 text-[#FFD583]',
|
||||
)}
|
||||
>
|
||||
<span className="truncate">
|
||||
{item.statusLabel}
|
||||
</span>
|
||||
</div>
|
||||
) : null}
|
||||
</span>
|
||||
</div>
|
||||
</motion.div>
|
||||
) : (
|
||||
<DataLoadingIndicator
|
||||
|
||||
Reference in New Issue
Block a user