Compare commits
No commits in common. "8f8735ccce1b1715d2bb4e3d3b652efc0e89b24c" and "6a5bea364c39e15c976f87b9b76ad53c0b72d522" have entirely different histories.
8f8735ccce
...
6a5bea364c
4 changed files with 31 additions and 317 deletions
|
|
@ -450,30 +450,14 @@ func connect() {
|
||||||
c.JSON(http.StatusOK, gin.H{
|
c.JSON(http.StatusOK, gin.H{
|
||||||
"result": result,
|
"result": result,
|
||||||
})
|
})
|
||||||
|
|
||||||
case "check-registered":
|
|
||||||
err := db.QueryRow("SELECT IFNULL(esignid, 0) AS result FROM esign WHERE employeeid = ?", data).Scan(&result)
|
|
||||||
if err != nil {
|
|
||||||
if err == sql.ErrNoRows {
|
|
||||||
result = "0"
|
|
||||||
} else {
|
|
||||||
c.AbortWithError(http.StatusBadRequest, err)
|
|
||||||
c.String(http.StatusBadRequest, err.Error())
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
c.JSON(http.StatusOK, gin.H{
|
|
||||||
"result": result,
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
router.POST("/api/post-registration", func(c *gin.Context) {
|
router.POST("/api/post-registration", func(c *gin.Context) {
|
||||||
type RegistrationData struct {
|
type RegistrationData struct {
|
||||||
Data int `json:"data"`
|
Data int `json:"data"`
|
||||||
Data2 string `json:"data2"`
|
Data2 string `json:"data2"`
|
||||||
Data3 string `json:"data3"`
|
Data3 string `json:"data3"`
|
||||||
Data4 string `json:"data4"`
|
|
||||||
}
|
}
|
||||||
var registrationData RegistrationData
|
var registrationData RegistrationData
|
||||||
if err := c.ShouldBindJSON(®istrationData); err != nil {
|
if err := c.ShouldBindJSON(®istrationData); err != nil {
|
||||||
|
|
@ -488,13 +472,13 @@ func connect() {
|
||||||
c.Writer.Header().Set("X-Download-Options", "noopen")
|
c.Writer.Header().Set("X-Download-Options", "noopen")
|
||||||
c.Writer.Header().Set("Referrer-Policy", "no-referrer")
|
c.Writer.Header().Set("Referrer-Policy", "no-referrer")
|
||||||
|
|
||||||
dbpost, err := db.Prepare("INSERT INTO esign (esignid, employeeid, password, signature, image) VALUES (NULL, ?, ?, ?, ?)")
|
dbpost, err := db.Prepare("INSERT INTO esign (esignid, employeeid, signature, image) VALUES (NULL, ?, ?, ?)")
|
||||||
if err != nil {
|
if err != nil {
|
||||||
panic(err.Error())
|
panic(err.Error())
|
||||||
}
|
}
|
||||||
defer dbpost.Close()
|
defer dbpost.Close()
|
||||||
|
|
||||||
exec, err := dbpost.Exec(registrationData.Data, registrationData.Data2, registrationData.Data3, registrationData.Data4)
|
exec, err := dbpost.Exec(registrationData.Data, registrationData.Data2, registrationData.Data3)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
panic(err.Error())
|
panic(err.Error())
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,7 @@ export { default as Table } from './Table/Table'
|
||||||
export { default as Combobox } from './Combobox/Combobox'
|
export { default as Combobox } from './Combobox/Combobox'
|
||||||
export { default as File } from './File/File'
|
export { default as File } from './File/File'
|
||||||
export { default as QR } from './QR/QR'
|
export { default as QR } from './QR/QR'
|
||||||
export { default as Input } from './Input/Input'
|
|
||||||
// export { default as OptimizeBackground } from './Optimizers/OptimizeBackground'
|
// export { default as OptimizeBackground } from './Optimizers/OptimizeBackground'
|
||||||
// export { default as OptimizeImage } from './Optimizers/OptimizeImage'
|
// export { default as OptimizeImage } from './Optimizers/OptimizeImage'
|
||||||
// export { default as OptimizeLogo } from './Optimizers/OptimizeLogo'
|
// export { default as OptimizeLogo } from './Optimizers/OptimizeLogo'
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,3 @@
|
||||||
@use '/src/styles/variables' as vars
|
|
||||||
@use 'sass:color'
|
|
||||||
|
|
||||||
.back-button-text
|
.back-button-text
|
||||||
font-size: 1rem
|
font-size: 1rem
|
||||||
|
|
||||||
|
|
@ -9,132 +6,4 @@
|
||||||
|
|
||||||
.box-title
|
.box-title
|
||||||
font-size: 1.75rem
|
font-size: 1.75rem
|
||||||
font-weight: 700
|
font-weight: 700
|
||||||
|
|
||||||
.digital-sign-details
|
|
||||||
display: flex
|
|
||||||
flex-direction: column
|
|
||||||
gap: 0.25rem
|
|
||||||
font-size: 0.8rem
|
|
||||||
|
|
||||||
&__image
|
|
||||||
margin: 0 0 1rem 0
|
|
||||||
width: 14rem
|
|
||||||
|
|
||||||
.already-registered
|
|
||||||
padding: 1rem
|
|
||||||
border-radius: 8px
|
|
||||||
background-color: color.adjust(#0D64E4, $blackness: 20%)
|
|
||||||
opacity: 0.6
|
|
||||||
|
|
||||||
.filefield
|
|
||||||
display: flex
|
|
||||||
flex-direction: column
|
|
||||||
align-items: center
|
|
||||||
justify-content: center
|
|
||||||
height: 250px
|
|
||||||
width: 100%
|
|
||||||
row-gap: 5px
|
|
||||||
border: 1px solid #ffffff6c
|
|
||||||
border-radius: 8px
|
|
||||||
|
|
||||||
&__label
|
|
||||||
color: white
|
|
||||||
font-size: 14px
|
|
||||||
font-weight: 500
|
|
||||||
user-select: none
|
|
||||||
|
|
||||||
&__dropzone
|
|
||||||
display: flex
|
|
||||||
flex-direction: column
|
|
||||||
row-gap: 10px
|
|
||||||
align-items: center
|
|
||||||
justify-content: center
|
|
||||||
width: 100%
|
|
||||||
height: 100%
|
|
||||||
color: #5f8ebebf
|
|
||||||
cursor: pointer
|
|
||||||
font-size: 1rem
|
|
||||||
|
|
||||||
// &__trigger
|
|
||||||
// background-color: vars.$primaryColor
|
|
||||||
// border: none
|
|
||||||
// border-radius: 8px
|
|
||||||
// color: white
|
|
||||||
// padding: 0.5rem 1.25rem
|
|
||||||
// text-align: center
|
|
||||||
// text-decoration: none
|
|
||||||
// display: inline-block
|
|
||||||
// font-size: 1rem
|
|
||||||
// font-weight: 500
|
|
||||||
// cursor: pointer
|
|
||||||
// transition: all 0.2s ease-out
|
|
||||||
|
|
||||||
// &:hover
|
|
||||||
// background-color: color.adjust(vars.$primaryColor, $blackness: 20%)
|
|
||||||
|
|
||||||
// &:active
|
|
||||||
// transform: scale(0.95)
|
|
||||||
|
|
||||||
&__itemList
|
|
||||||
display: flex
|
|
||||||
flex-direction: column
|
|
||||||
gap: 3px
|
|
||||||
width: 100%
|
|
||||||
|
|
||||||
&__item
|
|
||||||
width: 82%
|
|
||||||
display: grid
|
|
||||||
// padding: 1rem
|
|
||||||
column-gap: 10px
|
|
||||||
border-radius: 8px
|
|
||||||
grid-template-columns: auto 1fr auto
|
|
||||||
grid-template-areas: "preview name delete" "preview size delete"
|
|
||||||
column-gap: 5px
|
|
||||||
// border: 1px solid rgba(187, 187, 187, 0.706)
|
|
||||||
padding: 10px
|
|
||||||
background-color: #2b405542
|
|
||||||
margin: 0 1rem
|
|
||||||
|
|
||||||
&__itemPreview
|
|
||||||
grid-area: preview
|
|
||||||
|
|
||||||
&__itemPreviewImage
|
|
||||||
width: 6rem
|
|
||||||
object-fit: scale-down
|
|
||||||
height: auto
|
|
||||||
aspect-ratio: 1
|
|
||||||
|
|
||||||
&__itemName
|
|
||||||
font-weight: 500
|
|
||||||
grid-area: name
|
|
||||||
font-size: 1rem
|
|
||||||
color: #fff
|
|
||||||
|
|
||||||
&__itemSize
|
|
||||||
grid-area: size
|
|
||||||
font-size: 14px
|
|
||||||
color: rgb(181, 179, 173)
|
|
||||||
|
|
||||||
&__itemDeleteTrigger
|
|
||||||
grid-area: delete
|
|
||||||
background-color: #a23434
|
|
||||||
border: none
|
|
||||||
border-radius: 8px
|
|
||||||
color: white
|
|
||||||
padding: 0.5rem 1.25rem
|
|
||||||
text-align: center
|
|
||||||
text-decoration: none
|
|
||||||
display: inline-block
|
|
||||||
font-size: 1rem
|
|
||||||
font-weight: 500
|
|
||||||
cursor: pointer
|
|
||||||
transition: all 0.2s ease-out
|
|
||||||
height: max-content
|
|
||||||
align-self: center
|
|
||||||
|
|
||||||
&:hover
|
|
||||||
background-color: color.adjust(#a23434, $blackness: 20%)
|
|
||||||
|
|
||||||
&:active
|
|
||||||
transform: scale(0.95)
|
|
||||||
|
|
@ -1,48 +1,34 @@
|
||||||
import './Register.sass'
|
import './Register.sass'
|
||||||
import { Logo, Link, Page, Row, Padding, Combobox, Box, Button, Modal, Column, QR, Input } from '../../components'
|
import { Logo, Link, Page, Row, Padding, Combobox, Box, File, Button, Modal, Column } from '../../components'
|
||||||
import { IoChevronBack } from 'solid-icons/io'
|
import { IoChevronBack } from 'solid-icons/io'
|
||||||
import { Show, createSignal, createEffect } from 'solid-js'
|
import { Show, createSignal } from 'solid-js'
|
||||||
import { ofetch } from 'ofetch'
|
import { ofetch } from 'ofetch'
|
||||||
import { SHA3, SHA1 } from 'crypto-js'
|
import { SHA3 } from 'crypto-js'
|
||||||
import dayjs from 'dayjs'
|
|
||||||
import { FileField } from '@kobalte/core/file-field'
|
|
||||||
import bcrypt from 'bcryptjs'
|
|
||||||
|
|
||||||
export default () => {
|
export default () => {
|
||||||
const API = import.meta.env.VITE_BACKEND
|
const API = import.meta.env.VITE_BACKEND
|
||||||
const APPROVERNAME = 'ARCH. KHASHAYAR L. TOGHYANI'
|
|
||||||
const assessors = JSON.parse(sessionStorage.getItem('assessors')!)
|
const assessors = JSON.parse(sessionStorage.getItem('assessors')!)
|
||||||
const roles = ['ASSESSOR', 'APPROVER']
|
const roles = ['ASSESSOR', 'APPROVER']
|
||||||
|
|
||||||
const [role, setRole] = createSignal('')
|
const [role, setRole] = createSignal('')
|
||||||
const [name, setName] = createSignal('')
|
const [name, setName] = createSignal('')
|
||||||
const [password, setPassword] = createSignal('')
|
const [id, setId] = createSignal(0)
|
||||||
const [hashPassword, setHashPassword] = createSignal('')
|
|
||||||
const [id, setId] = createSignal<number>(0)
|
|
||||||
const [signature, setSignature] = createSignal('')
|
const [signature, setSignature] = createSignal('')
|
||||||
const [saved, setSaved] = createSignal(false)
|
const [saved, setSaved] = createSignal(false)
|
||||||
const [file, setFile] = createSignal<File[]>()
|
|
||||||
const [base64image, setBase64image] = createSignal('')
|
|
||||||
const [allow, setAllow] = createSignal(0)
|
|
||||||
|
|
||||||
const getEmployeeId = async (val: string) => {
|
const getEmployeeId = async (val: string) => {
|
||||||
try {
|
try {
|
||||||
setName(val)
|
setName(val)
|
||||||
const id = await ofetch(API + 'get-employeeid/' + val, { parseResponse: JSON.parse })
|
const id = await ofetch(API + 'get-employeeid/' + val, { parseResponse: JSON.parse })
|
||||||
setId(parseInt(id.result))
|
setId(id.result)
|
||||||
await checkRegistered()
|
|
||||||
} catch {
|
} catch {
|
||||||
setId(0)
|
setId(0)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const generateSignature = () => {
|
const generateSignature = () => {
|
||||||
if (role() === 'APPROVER') {
|
|
||||||
setId(276)
|
|
||||||
setName(APPROVERNAME)
|
|
||||||
}
|
|
||||||
const hash = SHA3(id().toString())
|
const hash = SHA3(id().toString())
|
||||||
setSignature(`Scan this using OCBO e-Sign Validator - scanid=${hash.toString()}`)
|
setSignature(hash.toString())
|
||||||
|
|
||||||
try {
|
try {
|
||||||
register()
|
register()
|
||||||
|
|
@ -53,68 +39,12 @@ export default () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const register = async () => {
|
const register = async () => {
|
||||||
await securePassword()
|
|
||||||
const blob = new Blob(file())
|
|
||||||
const base64 = await convertBase64(blob)
|
|
||||||
setBase64image(base64 as string)
|
|
||||||
|
|
||||||
await ofetch(API + 'post-registration', {
|
await ofetch(API + 'post-registration', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: { data: id(), data2: hashPassword(), data3: signature(), data4: base64 },
|
body: { data: id(), data2: signature() },
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const getDate = () => {
|
|
||||||
const today = new Date()
|
|
||||||
const formattedDate = dayjs(today).format('YYYY-MM-DD HH:mm:ss Z')
|
|
||||||
return formattedDate
|
|
||||||
}
|
|
||||||
|
|
||||||
const securePassword = async () => {
|
|
||||||
const salt = bcrypt.genSaltSync(9)
|
|
||||||
const hash = bcrypt.hashSync(password(), salt)
|
|
||||||
const sha = SHA1(hash)
|
|
||||||
setHashPassword(sha.toString())
|
|
||||||
}
|
|
||||||
|
|
||||||
const convertBase64 = (blob: Blob) => {
|
|
||||||
return new Promise((resolve, _) => {
|
|
||||||
const reader = new FileReader()
|
|
||||||
reader.onloadend = () => resolve(reader.result)
|
|
||||||
reader.readAsDataURL(blob)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const checkRegistered = async () => {
|
|
||||||
const employeeid = id()
|
|
||||||
|
|
||||||
try {
|
|
||||||
const registered = await ofetch(API + 'check-registered/' + employeeid, { parseResponse: JSON.parse })
|
|
||||||
if (registered.result > 0) {
|
|
||||||
setAllow(1)
|
|
||||||
} else {
|
|
||||||
setAllow(2)
|
|
||||||
}
|
|
||||||
} catch {
|
|
||||||
setAllow(2)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
createEffect(async () => {
|
|
||||||
if (role() === 'APPROVER') {
|
|
||||||
try {
|
|
||||||
const registered = await ofetch(API + 'check-registered/' + 276, { parseResponse: JSON.parse })
|
|
||||||
if (registered.result > 0) {
|
|
||||||
setAllow(1)
|
|
||||||
} else {
|
|
||||||
setAllow(2)
|
|
||||||
}
|
|
||||||
} catch {
|
|
||||||
setAllow(2)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Page alignment="column">
|
<Page alignment="column">
|
||||||
|
|
@ -143,85 +73,29 @@ export default () => {
|
||||||
</Row>
|
</Row>
|
||||||
<h4>Role</h4>
|
<h4>Role</h4>
|
||||||
<Combobox options={roles} placeholder="Select your role" value={role()} onChange={setRole} />
|
<Combobox options={roles} placeholder="Select your role" value={role()} onChange={setRole} />
|
||||||
|
|
||||||
<Show when={role() === 'ASSESSOR'}>
|
<Show when={role() === 'ASSESSOR'}>
|
||||||
<h4>List of Assessors</h4>
|
<h4>List of Assessors</h4>
|
||||||
<Combobox options={assessors} placeholder="Select your name" value={name()} onChange={(val) => getEmployeeId(val!)} />
|
<Combobox options={assessors} placeholder="Select your name" value={name()} onChange={(val) => getEmployeeId(val!)} />
|
||||||
|
<h4>Upload Signature</h4>
|
||||||
|
<File />
|
||||||
|
|
||||||
<Show when={allow() === 2}>
|
<Padding top={2} bottom={0} left={0} right={0}>
|
||||||
<h4>Password</h4>
|
<Row>
|
||||||
<Input value={password()} onChange={setPassword}></Input>
|
<Button edges="curved" design="bo-primary" label="Register" onClick={generateSignature} />
|
||||||
<h4>Upload Signature</h4>
|
</Row>
|
||||||
<FileField class="filefield" maxFiles={1} onFileAccept={(data) => setFile(data)} accept=".jpg, .jpeg, .png, .webp, .avif">
|
</Padding>
|
||||||
<FileField.Dropzone class="filefield__dropzone">Drag and drop or click to upload file</FileField.Dropzone>
|
|
||||||
<FileField.HiddenInput />
|
|
||||||
<FileField.ItemList class="filefield__itemList">
|
|
||||||
{() => (
|
|
||||||
<FileField.Item class="filefield__item">
|
|
||||||
<FileField.ItemPreviewImage class="filefield__itemPreviewImage" />
|
|
||||||
<FileField.ItemName class="filefield__itemName" />
|
|
||||||
<FileField.ItemSize class="filefield__itemSize" />
|
|
||||||
<FileField.ItemDeleteTrigger class="filefield__itemDeleteTrigger" onClick={() => setFile()}>
|
|
||||||
Delete
|
|
||||||
</FileField.ItemDeleteTrigger>
|
|
||||||
</FileField.Item>
|
|
||||||
)}
|
|
||||||
</FileField.ItemList>
|
|
||||||
</FileField>
|
|
||||||
|
|
||||||
<Padding top={2} bottom={0} left={0} right={0}>
|
|
||||||
<Row>
|
|
||||||
<Button edges="curved" design="bo-primary" label="Register" onClick={generateSignature} />
|
|
||||||
</Row>
|
|
||||||
</Padding>
|
|
||||||
</Show>
|
|
||||||
|
|
||||||
<Show when={allow() === 1}>
|
|
||||||
<Padding top={2} bottom={0} left={0} right={0}>
|
|
||||||
<Row>
|
|
||||||
<span class="already-registered">Already Registered</span>
|
|
||||||
</Row>
|
|
||||||
</Padding>
|
|
||||||
</Show>
|
|
||||||
</Show>
|
</Show>
|
||||||
|
|
||||||
<Show when={role() === 'APPROVER'}>
|
<Show when={role() === 'APPROVER'}>
|
||||||
<h4>Name of Approver</h4>
|
<h4>Name of Approver</h4>
|
||||||
<span class="approver-name">{APPROVERNAME}</span>
|
<span class="approver-name">ARCH. KHASHAYAR L. TOGHYANI</span>
|
||||||
|
<h4>Upload Signature</h4>
|
||||||
|
<File />
|
||||||
|
|
||||||
<Show when={allow() === 2}>
|
<Padding top={2} bottom={0} left={0} right={0}>
|
||||||
<h4>Upload Signature</h4>
|
<Row>
|
||||||
<FileField class="filefield" maxFiles={1} onFileAccept={(data) => setFile(data)} accept=".jpg, .jpeg, .png, .webp, .avif">
|
<Button edges="curved" design="bo-primary" label="Register" onClick={generateSignature} />
|
||||||
<FileField.Dropzone class="filefield__dropzone">Drag and drop or click to upload file</FileField.Dropzone>
|
</Row>
|
||||||
<FileField.HiddenInput />
|
</Padding>
|
||||||
<FileField.ItemList class="filefield__itemList">
|
|
||||||
{() => (
|
|
||||||
<FileField.Item class="filefield__item">
|
|
||||||
<FileField.ItemPreviewImage class="filefield__itemPreviewImage" />
|
|
||||||
<FileField.ItemName class="filefield__itemName" />
|
|
||||||
<FileField.ItemSize class="filefield__itemSize" />
|
|
||||||
<FileField.ItemDeleteTrigger class="filefield__itemDeleteTrigger" onClick={() => setFile()}>
|
|
||||||
Delete
|
|
||||||
</FileField.ItemDeleteTrigger>
|
|
||||||
</FileField.Item>
|
|
||||||
)}
|
|
||||||
</FileField.ItemList>
|
|
||||||
</FileField>
|
|
||||||
|
|
||||||
<Padding top={2} bottom={0} left={0} right={0}>
|
|
||||||
<Row>
|
|
||||||
<Button edges="curved" design="bo-primary" label="Register" onClick={generateSignature} />
|
|
||||||
</Row>
|
|
||||||
</Padding>
|
|
||||||
</Show>
|
|
||||||
|
|
||||||
<Show when={allow() === 1}>
|
|
||||||
<Padding top={2} bottom={0} left={0} right={0}>
|
|
||||||
<Row>
|
|
||||||
<span class="already-registered">Already Registered</span>
|
|
||||||
</Row>
|
|
||||||
</Padding>
|
|
||||||
</Show>
|
|
||||||
</Show>
|
</Show>
|
||||||
</Box>
|
</Box>
|
||||||
</Row>
|
</Row>
|
||||||
|
|
@ -229,27 +103,14 @@ export default () => {
|
||||||
</Padding>
|
</Padding>
|
||||||
</Page>
|
</Page>
|
||||||
|
|
||||||
<Modal trigger={saved()} background="#d5e3f2f3" color="#181818e4">
|
<Modal trigger={!saved()} background="#0f1720f3" color="#ffffffe4">
|
||||||
<Padding top={1} bottom={1} left={4} right={4}>
|
<Padding top={1} bottom={1} left={4} right={4}>
|
||||||
<Column>
|
<Column>
|
||||||
<Row>
|
<Row>
|
||||||
<h2>e-Sign Registration Completed</h2>
|
<span>e-Sign Registration Complete</span>
|
||||||
</Row>
|
|
||||||
<Row>
|
|
||||||
<h3>Your Digital Signature</h3>
|
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
<Row gap={1}>
|
<span>e-Sign Registration Complete</span>
|
||||||
<QR value={signature()} width={10} />
|
|
||||||
<section class="digital-sign-details">
|
|
||||||
<div>
|
|
||||||
<img class="digital-sign-details__image" src={base64image()} alt="Image of signature" />
|
|
||||||
</div>
|
|
||||||
<span>Digitally signed by:</span>
|
|
||||||
<span>{name()}</span>
|
|
||||||
<span>Date: {getDate()}</span>
|
|
||||||
</section>
|
|
||||||
</Row>
|
|
||||||
</Column>
|
</Column>
|
||||||
</Padding>
|
</Padding>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue