49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
'use client'
|
|
import React from 'react'
|
|
|
|
/**
|
|
* 预购进度单元格组件
|
|
* 在列表网格视图中显示订单计数和进度
|
|
*/
|
|
export function PreorderProgressCell({ rowData }: any) {
|
|
const orderCount = parseInt(rowData?.orderCount || '0', 10) || 0
|
|
const fakeOrderCount = parseInt(rowData?.fakeOrderCount || '0', 10) || 0
|
|
const fundingGoal = parseInt(rowData?.fundingGoal || '0', 10) || 100
|
|
|
|
const totalCount = orderCount + fakeOrderCount
|
|
const percentage = fundingGoal > 0 ? Math.min(Math.round((totalCount / fundingGoal) * 100), 100) : 0
|
|
|
|
return (
|
|
<div className="preorder-progress-info">
|
|
<div className="progress-label">
|
|
<span>预购进度</span>
|
|
<span className="progress-count">
|
|
{totalCount} / {fundingGoal}
|
|
</span>
|
|
</div>
|
|
|
|
<div className="progress-bar">
|
|
<div
|
|
className="progress-fill"
|
|
style={{ width: `${percentage}%` }}
|
|
/>
|
|
</div>
|
|
|
|
<div className="progress-stats">
|
|
<div className="stat-item">
|
|
<span className="stat-label">真实</span>
|
|
<span className="stat-value">{orderCount}</span>
|
|
</div>
|
|
<div className="stat-item">
|
|
<span className="stat-label">Fake</span>
|
|
<span className="stat-value">{fakeOrderCount}</span>
|
|
</div>
|
|
<div className="stat-item">
|
|
<span className="stat-label">完成度</span>
|
|
<span className="stat-value">{percentage}%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|