phc/problemi
6
3
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: table style and empty scoreboard page

Browse Source
This commit is contained in:
aziis98
2023-01-11 17:52:29 +01:00
parent 515280621d
commit 0955f18e04
2 changed files with 53 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/pages/ScoresPage.tsx
+50 -44
View File
@@ -50,55 +50,61 @@ export const ScoresPage = () => {
<Header />
<main class="page-scores">
<div class="subtitle">Classifica</div>
<div class="scrollable">
<div class="table">
<div class="cell header">
<span>Studente</span>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('student'))}>
<span class="material-symbols-outlined icon">
{sortStateColumn === 'student'
? sortStateOrder === 'ascending'
? 'expand_more'
: 'expand_less'
: 'unfold_more'}
{orderedStats.length > 0 ? (
<div class="scrollable">
<div class="table">
<div class="cell header">
<span>Studente</span>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('student'))}>
<span class="material-symbols-outlined icon">
{sortStateColumn === 'student'
? sortStateOrder === 'ascending'
? 'expand_more'
: 'expand_less'
: 'unfold_more'}
</span>
</span>
</span>
</div>
<div class="cell header">
<span>Soluzioni Inviate</span>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('sent'))}>
<span class="material-symbols-outlined icon">
{sortStateColumn === 'sent'
? sortStateOrder === 'ascending'
? 'expand_more'
: 'expand_less'
: 'unfold_more'}
</div>
<div class="cell header">
<span>Soluzioni Inviate</span>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('sent'))}>
<span class="material-symbols-outlined icon">
{sortStateColumn === 'sent'
? sortStateOrder === 'ascending'
? 'expand_more'
: 'expand_less'
: 'unfold_more'}
</span>
</span>
</span>
</div>
<div class="cell header">
<span>Soluzioni Corrette</span>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('correct'))}>
<span class="material-symbols-outlined icon">
{sortStateColumn === 'correct'
? sortStateOrder === 'ascending'
? 'expand_more'
: 'expand_less'
: 'unfold_more'}
</div>
<div class="cell header">
<span>Soluzioni Corrette</span>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('correct'))}>
<span class="material-symbols-outlined icon">
{sortStateColumn === 'correct'
? sortStateOrder === 'ascending'
? 'expand_more'
: 'expand_less'
: 'unfold_more'}
</span>
</span>
</span>
</div>
{orderedStats.map(([user, s]) => (
<>
<div class="cell">
<a href={prependBaseUrl(`/u/${user}`)}>@{user}</a>
</div>
<div class="cell">{s.sentSolutionsCount}</div>
<div class="cell last-col">{s.correctSolutionsCount}</div>
</>
))}
</div>
{orderedStats.map(([user, s]) => (
<>
<div class="cell">
<a href={prependBaseUrl(`/u/${user}`)}>@{user}</a>
</div>
<div class="cell">{s.sentSolutionsCount}</div>
<div class="cell last-col">{s.correctSolutionsCount}</div>
</>
))}
</div>
</div>
) : (
<>
<p>Nessuno ha ancora inviato soluzioni</p>
</>
)}
</main>
</>
)