PatAlcala9/ocbo-esign
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Updated login page

Browse source
This commit is contained in:
Patrick Alvin Alcala 2026-01-07 10:07:54 +08:00
parent 2850fa7c27
commit 119876d227
2 changed files with 58 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/pages/LoginPage/Login.sass
View file

@ -14,3 +14,19 @@
opacity: 0.6
width: 100%
text-align: center
.modal-tooltip
display: flex
flex-direction: column
&__group
display: flex
flex-direction: column
padding: 0 0 1rem 0
&__title
font-weight: bold
padding: 0 0 0.25rem 0
&__info
padding: 0 0 0.15rem 0

45
src/pages/LoginPage/Login.tsx
View file

@ -2,13 +2,14 @@ import { useNavigate } from '@solidjs/router'
import { IoChevronBack } from 'solid-icons/io'
import { createEffect, createSignal } from 'solid-js'
import { Show } from 'solid-js/web'
import { Box, Button, Column, Combobox, Display, Input, Link, Logo, Modal, Padding, Page, Radio, Row, Switch } from '../../components'
import { Box, Button, Clickable, Column, Combobox, Display, Input, Link, Logo, Modal, Padding, Page, Radio, Row, Switch } from '../../components'
import { _employeeId, _employeeName } from '../../stores/employee'
import { checkConnection, getApi, securePassword } from '../../utils/functions'
import { VsQuestion } from 'solid-icons/vs'
import './Login.sass'
export default () => {
const APPROVERNAME = sessionStorage.getItem('head')
const APPROVERNAME = sessionStorage.getItem('head')!
const navigate = useNavigate()
const assessors = JSON.parse(sessionStorage.getItem('registered')!)
const roles = ['Assessor', 'Approver']
@ -20,6 +21,7 @@ export default () => {
const [errorMessage, setErrorMessage] = createSignal('')
const [connected, setConnected] = createSignal(true)
const [encryptionVersion, setEncryptionVersion] = createSignal('v1')
const [openTooltip, setOpenTooltip] = createSignal(false)
const login = async () => {
setConnected(await checkConnection())
@ -106,8 +108,11 @@ export default () => {
<Row>
<span class="box-title">Login</span>
</Row>
<Row content='right'>
<Row content='right' gap={0.5}>
<Switch label={`Enc ${encryptionVersion()}`} checked={encryptionVersion() === 'v1' ? false : true} onChange={() => encryptionVersion() === 'v1' ? setEncryptionVersion('v2') : setEncryptionVersion('v1')} />
<Clickable onClick={() => setOpenTooltip(true)}>
<VsQuestion size={28} style="cursor: pointer" />
</Clickable>
</Row>
<Padding top={2} left={2} right={2} bottom={0}>
@ -225,6 +230,40 @@ export default () => {
</Padding>
</Modal>
</div>
<div onClick={() => setOpenTooltip(false)}>
<Modal trigger={openTooltip()} background="#252525ff" color="#dfe7fbf0" opacity={0.8} width='52rem'>
<Padding top={1} bottom={1} left={1.5} right={1.5}>
<section class='modal-tooltip'>
<div class='modal-tooltip__group'>
<span class='modal-tooltip__title'>Enc v1 (Encryption Version 1)</span>
<span class='modal-tooltip__info'>Use this mode if your password has not been changed.</span>
<span class='modal-tooltip__info'>It is recommended that you update your password after logging in. Open the 'Config' menu in the upper right.</span>
</div>
<div class='modal-tooltip__group'>
<span class='modal-tooltip__title'>Enc v2 (Encryption Version 2)</span>
<span class='modal-tooltip__info'>The new default password encryption.</span>
<span class='modal-tooltip__info'>Use this mode if you've recently registered or changed your password.</span>
</div>
<div class='modal-tooltip__group'>
<span class='modal-tooltip__title'>Note:</span>
<span class='modal-tooltip__info'>To ensure security and privacy, avoid sharing your password.</span>
<span class='modal-tooltip__info'>Your password's encryption is irreversible, which means it cannot be decrypted.</span>
<span class='modal-tooltip__info'>Only encrypted passwords are saved in the database.</span>
<span class='modal-tooltip__info'>Only you know your password. If forgotten, the account will be locked.</span>
<span class='modal-tooltip__info'>If this happens, contact the IT department and request that your account be reset. You will be required to register again.</span>
</div>
<Row>
<span class="close-text">Click anywhere to close</span>
</Row>
</section>
</Padding>
</Modal>
</div>
</>
)
}