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 2025-09-26 17:33:32 +08:00
parent 64d4e90d70
commit 640f02470f
2 changed files with 94 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -0,0 +1,6 @@
.box-title
font-size: 1.75rem
font-weight: 700
.approver-name
font-size: 1.25rem

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

@ -1,42 +1,101 @@
import './Login.sass'
import { Logo, Link, Page, Row, Padding, Form, Box } from '../../components'
import { Logo, Link, Page, Row, Padding, Form, Box, Radio, Combobox, Input, Button, Modal } from '../../components'
import { IoChevronBack } from 'solid-icons/io'
import { createSignal, Show } from 'solid-js'
import { ofetch } from 'ofetch'
import { SHA1, SHA3 } from 'crypto-js'
import { useNavigate } from '@solidjs/router'
export default () => {
const API = import.meta.env.VITE_BACKEND
const APPROVERNAME = import.meta.env.VITE_HEAD
const assessors = JSON.parse(sessionStorage.getItem('assessors')!)
const roles = ['Assessor', 'Approver']
const [role, setRole] = createSignal('')
const [name, setName] = createSignal('')
const [password, setPassword] = createSignal('')
const [matched, setMatched] = createSignal(false)
const navigate = useNavigate()
const login = async () => {
const employeeid = await ofetch(API + 'get-employeeid/' + name(), { parseResponse: JSON.parse })
const dbpassword = await ofetch(API + 'get-password/' + employeeid.result, { parseResponse: JSON.parse })
const hashPassword = await securePassword()
console.log('dbpassword', dbpassword.result)
console.log('hashPassword', hashPassword)
console.log(dbpassword.result === hashPassword)
if (dbpassword.result === hashPassword) {
setMatched(true)
navigate('/')
}
}
const securePassword = async () => {
const firstHashing = SHA1(password())
const secondHashing = SHA3(firstHashing)
const thirdHashing = SHA1(secondHashing)
return thirdHashing.toString()
}
return (
<>
<Page alignment="column">
<Padding left={4.75} right={4.75} top={0} bottom={0}>
<Row content="split">
<Link to="/">
<Row content="left" gap={2}>
<Logo size={200} />
<h1>OCBO e-Sign</h1>
</Row>
</Link>
<Link to="/">
<Row content="right">
<IoChevronBack size={45} />
<span class="back-button-text">Back</span>
</Row>
</Link>
</Row>
<Padding top={2} left={0} right={0} bottom={0}>
<Row>
<Box curved thickness={2} padding={2} color="#2f465cd7">
<Row>
<span class="box-title">Login</span>
</Row>
<Form>
<h4>Role</h4>
</Form>
</Box>
<Row content="split">
<Link to="/">
<Row content="left" gap={2}>
<Logo size={200} />
<h1>OCBO e-Sign</h1>
</Row>
</Padding>
</Link>
<Link to="/">
<Row content="right">
<IoChevronBack size={45} />
<span class="back-button-text">Back</span>
</Row>
</Link>
</Row>
<Padding top={2} left={0} right={0} bottom={0}>
<Row>
<Box curved thickness={2} padding={2} color="#2f465cd7" background="#04040642">
<Row>
<span class="box-title">Login</span>
</Row>
<Padding top={2} left={2} right={2} bottom={0}>
<Row>
<Radio data={roles} value={role()} onChange={setRole} gap={10} />
</Row>
</Padding>
<h4>Name</h4>
<Show when={role() !== 'Approver'}>
<Combobox options={assessors} placeholder="Select your name" value={name()} onChange={setName} />
</Show>
<Show when={role() === 'Approver'}>
<span class="approver-name">{APPROVERNAME}</span>
</Show>
<h4>Password</h4>
<Input value={password()} onChange={setPassword}></Input>
<Padding top={2} left={0} right={0} bottom={0}>
<Row>
<Button edges="curved" design="bo-primary" label="Login" wide onClick={login}></Button>
</Row>
</Padding>
</Box>
</Row>
</Padding>
</Page>
<Modal trigger={matched()} background="#ffffffff" color="#000000e4" opacity={0.5}>
<h1>1</h1>
</Modal>
</>
)
}