mirror of
https://gitlab.com/MrFry/qmining-page
synced 2025-04-01 20:23:44 +02:00
Prettying stuff
This commit is contained in:
parent
4281b5c5d2
commit
1a27d0b881
3 changed files with 155 additions and 154 deletions
|
@ -127,93 +127,94 @@ export default function RankList() {
|
|||
<Head>
|
||||
<title>Ranklista - Qmining | Frylabs.net</title>
|
||||
</Head>
|
||||
<div className={'endofpage'}>
|
||||
<div className={styles.wrapper}>
|
||||
<div className={styles.sinceTable}>
|
||||
<center>
|
||||
<div id="rankHeader" className={'pageHeader'}>
|
||||
<h1>Ranklista</h1>
|
||||
</div>
|
||||
</center>
|
||||
<div
|
||||
className={styles.infoText}
|
||||
>{`A felhasználó ID-d: #${selfUserId}`}</div>
|
||||
<div className={styles.text}>
|
||||
<p>Az adatok kb 2020. április eleje óta vannak gyűjtve, és azonnal
|
||||
frissülnek.</p>
|
||||
</div>
|
||||
<Sleep />
|
||||
<center>
|
||||
<label>Megjelenítés:
|
||||
<select className={styles.sinceHeaderRow} onChange={(e) => {
|
||||
console.log(e.target.value)
|
||||
updateSince(e.target.value)
|
||||
}}
|
||||
>
|
||||
{Object.keys(sinceOptions).map((key) => {
|
||||
const val = sinceOptions[key]
|
||||
return (
|
||||
<option
|
||||
key={key}
|
||||
value={key}
|
||||
>
|
||||
{val.name}
|
||||
</option>
|
||||
)
|
||||
})}
|
||||
</select>
|
||||
</label>
|
||||
</center>
|
||||
<div className={styles.headerRow}>
|
||||
<div>{'Rank'}</div>
|
||||
<div>{'Felhasználó ID'}</div>
|
||||
{Object.keys(selectOptions).map((listKey) => {
|
||||
const val = selectOptions[listKey]
|
||||
return (
|
||||
<div
|
||||
className={`${styles.clickable} ${listKey === key &&
|
||||
styles.selected}`}
|
||||
key={listKey}
|
||||
onClick={() => {
|
||||
setKey(listKey)
|
||||
<div className={'endofpage'}>
|
||||
<div className={styles.wrapper}>
|
||||
<div className={styles.sinceTable}>
|
||||
<center>
|
||||
<div id="rankHeader" className={'pageHeader'}>
|
||||
<h1>Ranklista</h1>
|
||||
</div>
|
||||
</center>
|
||||
<div
|
||||
className={styles.infoText}
|
||||
>{`A felhasználó ID-d: #${selfUserId}`}</div>
|
||||
<div className={styles.text}>
|
||||
<p>
|
||||
Az adatok kb 2020. április eleje óta vannak gyűjtve, és azonnal
|
||||
frissülnek.
|
||||
</p>
|
||||
</div>
|
||||
<Sleep />
|
||||
<center>
|
||||
<label>
|
||||
Megjelenítés:
|
||||
<select
|
||||
className={styles.sinceHeaderRow}
|
||||
onChange={(e) => {
|
||||
console.log(e.target.value)
|
||||
updateSince(e.target.value)
|
||||
}}
|
||||
>
|
||||
{val.name}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
<div className={`${styles.row} ${styles.sumrow}`}>
|
||||
<div />
|
||||
<div>{'Összesen'}</div>
|
||||
<div>{sum.newQuestions}</div>
|
||||
<div>{sum.allQuestions}</div>
|
||||
<div>{sum.count}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.table}>
|
||||
|
||||
{list ? (
|
||||
list.map((listItem, i) => {
|
||||
return (
|
||||
<div
|
||||
className={`${styles.row} ${listItem.userId === selfUserId &&
|
||||
styles.selfRow}`}
|
||||
key={i}
|
||||
>
|
||||
<div>{i + 1}</div>
|
||||
<div>{'#' + listItem.userId}</div>
|
||||
{Object.keys(selectOptions).map((listKey) => {
|
||||
const val = listItem[listKey]
|
||||
return <div key={listKey}>{val}</div>
|
||||
{Object.keys(sinceOptions).map((key) => {
|
||||
const val = sinceOptions[key]
|
||||
return (
|
||||
<option key={key} value={key}>
|
||||
{val.name}
|
||||
</option>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)
|
||||
})
|
||||
) : (
|
||||
<LoadingIndicator />
|
||||
)}
|
||||
</div>
|
||||
</select>
|
||||
</label>
|
||||
</center>
|
||||
<div className={styles.headerRow}>
|
||||
<div>{'Rank'}</div>
|
||||
<div>{'Felhasználó ID'}</div>
|
||||
{Object.keys(selectOptions).map((listKey) => {
|
||||
const val = selectOptions[listKey]
|
||||
return (
|
||||
<div
|
||||
className={`${styles.clickable} ${listKey === key &&
|
||||
styles.selected}`}
|
||||
key={listKey}
|
||||
onClick={() => {
|
||||
setKey(listKey)
|
||||
}}
|
||||
>
|
||||
{val.name}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
<div className={`${styles.row} ${styles.sumrow}`}>
|
||||
<div />
|
||||
<div>{'Összesen'}</div>
|
||||
<div>{sum.newQuestions}</div>
|
||||
<div>{sum.allQuestions}</div>
|
||||
<div>{sum.count}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.table}>
|
||||
{list ? (
|
||||
list.map((listItem, i) => {
|
||||
return (
|
||||
<div
|
||||
className={`${styles.row} ${listItem.userId ===
|
||||
selfUserId && styles.selfRow}`}
|
||||
key={i}
|
||||
>
|
||||
<div>{i + 1}</div>
|
||||
<div>{'#' + listItem.userId}</div>
|
||||
{Object.keys(selectOptions).map((listKey) => {
|
||||
const val = listItem[listKey]
|
||||
return <div key={listKey}>{val}</div>
|
||||
})}
|
||||
</div>
|
||||
)
|
||||
})
|
||||
) : (
|
||||
<LoadingIndicator />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue