ocbo-esign/src/pages/RegisterPage/Register.tsx

62 lines
2.1 KiB
TypeScript

import './Register.sass'
import { Logo, Link, Page, Row, Padding, Form, Combobox, Box, File } from '../../components'
import { IoChevronBack } from 'solid-icons/io'
import { Show, createSignal } from 'solid-js'
export default () => {
const assessors = JSON.parse(sessionStorage.getItem('assessors')!)
const roles = ['ASSESSOR', 'APPROVER']
const [role, setRole] = createSignal('')
const [name, setName] = createSignal('')
return (
<>
<Page alignment="column">
<Padding left={4.75} right={4.75}>
<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}>
<Row>
<Box curved thickness={2} padding={2} color="#2f465cd7">
<Row>
<span class="box-title">Registration</span>
</Row>
<Form>
<h4>Role</h4>
<Combobox options={roles} placeholder="Select your role" value={role()} onChange={setRole} />
<Show when={role() === 'ASSESSOR'}>
<h4>List of Assessors</h4>
<Combobox options={assessors} placeholder="Select your name" value={name()} onChange={setName} />
<h4>Upload Signature</h4>
<File />
</Show>
<Show when={role() === 'APPROVER'}>
<h4>Name of Approver</h4>
<span class="approver-name">ARCH. KHASHAYAR L. TOGHYANI</span>
<h4>Upload Signature</h4>
<File />
</Show>
</Form>
</Box>
</Row>
</Padding>
</Padding>
</Page>
</>
)
}