qmining-page/src/pages/pwRequest.js
2021-04-19 22:33:24 +02:00

166 lines
5 KiB
JavaScript

import React, { useState, useEffect } from 'react'
import fetch from 'unfetch'
import Head from 'next/head'
import Link from 'next/link'
import Sleep from '../components/sleep'
import styles from './pwRequest.module.css'
import constants from '../constants.json'
function fetchAvailablePWS() {
return new Promise((resolve) => {
fetch(`${constants.apiUrl}avaiblePWS`, {
credentials: 'include',
})
.then((resp) => {
return resp.json()
})
.then((res) => {
resolve(res)
})
})
}
function requestPw() {
return new Promise((resolve) => {
fetch(constants.apiUrl + 'getpw', {
method: 'POST',
credentials: 'include',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({}),
})
.then((res) => {
return res.json()
})
.then((res) => {
resolve(res)
})
})
}
export default function PwRequest({ globalData }) {
const userId = globalData.userId || '...'
const [result, setResult] = useState([])
const [data, setData] = useState({
userCreated: '...',
availablePWS: '...',
requestedPWS: '...',
maxPWCount: '...',
daysAfterUserGetsPWs: '...',
addPWPerDay: '...',
addPWCount: '...',
dayDiff: '...',
userCount: '...',
})
const {
userCreated,
availablePWS,
requestedPWS,
maxPWCount,
daysAfterUserGetsPWs,
addPWPerDay,
addPWCount,
dayDiff,
userCount,
} = data
useEffect(() => {
fetchAvailablePWS().then((data) => {
setData(data)
})
}, [])
return (
<div>
<Head>
<title>Jelszó generálás - Qmining | Frylabs.net</title>
</Head>
<div className={'pageHeader'}>
<h1>Jelszó generálás</h1>
</div>
<center>
<Sleep />
<div id="form">
<div className={styles.text}>
<p className={styles.descrip}>
Minden felhasználó egyedi jelszót kap. Ne használjatok többen egy
jelszót, mert egy idő után -biztonsági okokból- kidob a rendszer,
ha ugyan az a felhasználó több helyen is belépve marad. A
jelszavakról bővebben a{' '}
<Link href="/faq?tab=pw">
<a>GYIK</a>
</Link>{' '}
vonatkozó részében olvashatsz.
</p>
</div>
<div className={styles.text}>
Minden <span>{' ' + daysAfterUserGetsPWs + ' '}</span> napnál
régebbi felhasználó generálhat magának{' '}
<span>{' ' + maxPWCount + 'db '}</span> jelszót. Miután lekértél{' '}
<span>{' ' + maxPWCount + 'db'}</span>-ot, a lehetőségeid nem
fogytak el, ismét lesz módod további{' '}
<span>{' ' + maxPWCount + 'db'}</span>-ot kérni, összességében
korlátlan mennyiségben. Az egyszerre rendelkezésre álló lehetőségeid
számát lentebb látod, ez maximum egyszerre{' '}
<span>{' ' + maxPWCount + 'db '}</span> lehet. Ezt követően{' '}
<span>{' ' + addPWPerDay + ' '}</span>
naponta kapsz további <span>{' ' + addPWCount + ' '}</span> új
lehetőséget generálásra, amíg a lehetőségeid száma ismét el nem éri
a <span>{' ' + maxPWCount + 'db'}</span>-ot. Eddig
<span>{' ' + requestedPWS + ' '}</span>
jelszót kértél le, vagyis jelen pillanatban
<span>{' ' + (availablePWS - requestedPWS) + 'db '}</span>
jelszót generálhatsz még.
<br />
<br />A jelenleg bejelentkezett felhasználó{' '}
<span>{' ' + dayDiff + ' '}</span>
napos,{' '}
<span>
{userCreated ? new Date(userCreated).toLocaleString() : '...'}
</span>
-kor lett létrehozva.
<br />
Az oldalnak jelenleg
<span>{' ' + userCount + ' '}</span>
felhasználója van.
</div>
<div className={`buttonContainer ${styles.pwButton}`}>
<div
onClick={() => {
requestPw().then((res) => {
setData(res)
if (res.success) {
setResult([...result, res.pw])
} else {
setResult([
...result,
'Jelszó kérési lehetőségeid elfogytak, nézz vissza később',
])
}
})
}}
>
Jelszó kérése
</div>
</div>
{result ? (
<div className={styles.pwContainer}>
{result.map((res, i) => {
return (
<div key={i} className={styles.pw}>
{i + 1}.: {res}
</div>
)
})}
</div>
) : null}
</div>
</center>
</div>
)
}