shiyue/ittoview
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: show relevant option progress for scoped practice

Browse Source
This commit is contained in:
ittoview
2026-05-13 19:29:22 +01:00
parent 45dd71311f
commit 643aeb498d
1 changed files with 44 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/pages/PerformanceDomainPracticePage.tsx
View File

@@ -369,12 +369,20 @@ export default function PerformanceDomainPracticePage() {
</div>
</div>
<div>
{(() => {
const activeProgress = progress.scope === 'expectedGoal' ? expectedGoalProgress : keyPointProgress
const activeLabel = progress.scope === 'expectedGoal' ? '目标' : '要点'
const isFull = activeProgress.total > 0 && activeProgress.completed >= activeProgress.total
if (progress.scope === 'all') {
return (
<div className="grid grid-cols-2 gap-2">
{[
{ label: '目标', data: expectedGoalProgress },
{ label: '要点', data: keyPointProgress },
].map((item) => {
const isFull = item.data.total > 0 && item.data.completed >= item.data.total
const itemFull = item.data.total > 0 && item.data.completed >= item.data.total
return (
<div key={item.label} className="min-w-0">
<div className="mb-1 flex items-center justify-between gap-1 text-[11px] text-gray-500 dark:text-gray-400">
@@ -385,7 +393,7 @@ export default function PerformanceDomainPracticePage() {
<div
className={clsx(
'h-full rounded-full transition-all duration-300',
isFull ? 'bg-gray-300 dark:bg-gray-500' : 'bg-indigo-500'
itemFull ? 'bg-gray-300 dark:bg-gray-500' : 'bg-indigo-500'
)}
style={{ width: `${item.data.percent}%` }}
/>
@@ -394,6 +402,28 @@ export default function PerformanceDomainPracticePage() {
)
})}
</div>
)
}
return (
<div>
<div className="mb-1 flex items-center justify-between gap-1 text-[11px] text-gray-500 dark:text-gray-400">
<span>{activeLabel}</span>
<span>{activeProgress.completed}/{activeProgress.total}</span>
</div>
<div className="h-1.5 overflow-hidden rounded-full bg-gray-100 dark:bg-gray-700">
<div
className={clsx(
'h-full rounded-full transition-all duration-300',
isFull ? 'bg-gray-300 dark:bg-gray-500' : 'bg-indigo-500'
)}
style={{ width: `${activeProgress.percent}%` }}
/>
</div>
</div>
)
})()}
</div>
<div className="pointer-events-none absolute right-3 top-3 flex h-5 w-12 items-center justify-end">
{isCorrectSelected && (