Ranklist table fixes

This commit is contained in:
mrfry 2021-03-16 19:34:21 +01:00
parent 2456794387
commit 7f4163736c
2 changed files with 110 additions and 129 deletions

View file

@ -127,92 +127,102 @@ 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 className={styles.container}>
<div>
<center>
<div id="rankHeader" className={'pageHeader'}>
<h1>Ranklista</h1>
</div>
<Sleep />
<div className={styles.timeRangeSelect}>
<div>Megjelenítés:</div>
<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>
</div>
<div className={styles.headerRow}>
<div>{'Rank'}</div>
<div>{'Felhasználó ID'}</div>
{Object.keys(selectOptions).map((listKey) => {
const val = selectOptions[listKey]
</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 />
<div className={styles.selectContainer}>
<div>Megjelenítés:</div>
<select
onChange={(e) => {
updateSince(e.target.value)
}}
>
{Object.keys(sinceOptions).map((key) => {
const val = sinceOptions[key]
return (
<div
className={`${styles.clickable} ${listKey === key &&
styles.selected}`}
key={listKey}
onClick={() => {
setKey(listKey)
}}
>
<option key={key} value={key}>
{val.name}
</div>
</option>
)
})}
</div>
<div className={`${styles.row} ${styles.sumrow}`}>
<div />
<div>{'Összesen'}</div>
<div>{sum.newQuestions}</div>
<div>{sum.allQuestions}</div>
<div>{sum.count}</div>
</div>
</select>
</div>
<div className={styles.table}>
{list ? (
list.map((listItem, i) => {
<div className={styles.selectContainer}>
<div>Rendezés:</div>
<select
value={key}
onChange={(e) => {
setKey(e.target.value)
}}
>
{Object.keys(selectOptions).map((key) => {
const val = selectOptions[key]
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>
<option key={key} value={key}>
{val.name}
</option>
)
})
) : (
<LoadingIndicator />
)}
})}
</select>
</div>
<div className={styles.headerRow}>
<div>{'Rank'}</div>
<div>{'Felhasználó ID'}</div>
{Object.keys(selectOptions).map((listKey) => {
const val = selectOptions[listKey]
return (
<div
className={`${listKey === key && styles.selected}`}
key={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>