Added assesors page
This commit is contained in:
parent
2b925a537d
commit
98fcbd93a0
3 changed files with 209 additions and 0 deletions
1
src/pages/AssessorPage/Assessor.sass
Normal file
1
src/pages/AssessorPage/Assessor.sass
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
@use '/src/styles/classes.sass'
|
||||||
204
src/pages/AssessorPage/Assessor.tsx
Normal file
204
src/pages/AssessorPage/Assessor.tsx
Normal file
|
|
@ -0,0 +1,204 @@
|
||||||
|
import './Assessor.sass'
|
||||||
|
import { Logo, Link, Page, Row, Padding, ModalButton, Box, Button, Modal, Column } from '../../components'
|
||||||
|
import { FiLogOut } from 'solid-icons/fi'
|
||||||
|
import { Tabs } from '@kobalte/core/tabs'
|
||||||
|
import { ofetch } from 'ofetch'
|
||||||
|
import { onMount, createSignal } from 'solid-js'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
import { checkConnection, createPdf } from '../../utils/functions'
|
||||||
|
import { FaSolidThumbsUp } from 'solid-icons/fa'
|
||||||
|
import { _employeeName } from '../../stores/employee'
|
||||||
|
|
||||||
|
const API = import.meta.env.VITE_BACKEND
|
||||||
|
const PESO = import.meta.env.VITE_PESO
|
||||||
|
const ID = import.meta.env.VITE_HEADID
|
||||||
|
|
||||||
|
export default () => {
|
||||||
|
const [totalOp, setTotalOp] = createSignal(0)
|
||||||
|
const [assessor, setAssessor] = createSignal('')
|
||||||
|
const [dateOp, setDateOp] = createSignal('')
|
||||||
|
const [location, setLocation] = createSignal('')
|
||||||
|
const [type, setType] = createSignal('')
|
||||||
|
const [applicationId, setApplicationId] = createSignal(0)
|
||||||
|
const [assessorId, setAssessorId] = createSignal(0)
|
||||||
|
|
||||||
|
const [gflgu, setGflgu] = createSignal<number[]>([])
|
||||||
|
const [gfdpwh, setGfdpwh] = createSignal<number[]>([])
|
||||||
|
const [tfbo, setTfbo] = createSignal<number[]>([])
|
||||||
|
|
||||||
|
const [descriptionList, setDescriptionList] = createSignal<string[]>([])
|
||||||
|
const [amountList, setAmountList] = createSignal<string[]>([])
|
||||||
|
const [dateOpList, setDateOpList] = createSignal<string[]>([])
|
||||||
|
|
||||||
|
const [applicationList, setApplicationList] = createSignal<string[]>([])
|
||||||
|
const [nameList, setNameList] = createSignal<string[]>([])
|
||||||
|
|
||||||
|
const [errorMessage, setErrorMessage] = createSignal('')
|
||||||
|
const [connected, setConnected] = createSignal(true)
|
||||||
|
const [approved, setApproved] = createSignal(false)
|
||||||
|
const [approvedApplication, setApprovedApplication] = createSignal('')
|
||||||
|
|
||||||
|
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>
|
||||||
|
|
||||||
|
<Row content="left" gap={1}>
|
||||||
|
<span class="name">{_employeeName.get()}</span>
|
||||||
|
<Link to="/">
|
||||||
|
<Row gap={0.5}>
|
||||||
|
<FiLogOut size={25} />
|
||||||
|
<span>Logout</span>
|
||||||
|
</Row>
|
||||||
|
</Link>
|
||||||
|
</Row>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Row content="center">
|
||||||
|
<Tabs aria-label="Main navigation" class="tabs">
|
||||||
|
<Row>
|
||||||
|
<Tabs.List class="tabs__list">
|
||||||
|
<Tabs.Trigger class="tabs__trigger" value="building">
|
||||||
|
Building
|
||||||
|
</Tabs.Trigger>
|
||||||
|
<Tabs.Trigger class="tabs__trigger" value="occupancy">
|
||||||
|
Occupancy
|
||||||
|
</Tabs.Trigger>
|
||||||
|
<Tabs.Trigger class="tabs__trigger" value="electrical">
|
||||||
|
Electrical
|
||||||
|
</Tabs.Trigger>
|
||||||
|
<Tabs.Indicator class="tabs__indicator" />
|
||||||
|
</Tabs.List>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Tabs.Content class="tabs__content" value="building">
|
||||||
|
<Row>
|
||||||
|
<h2>List of Ready to Approve and Sign Building Order of Payments</h2>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Row>
|
||||||
|
<table class="table">
|
||||||
|
<thead>
|
||||||
|
{/* <tr>
|
||||||
|
<th>Application Number</th>
|
||||||
|
<th>Name</th>
|
||||||
|
<th style="text-align: center">Show Details</th>
|
||||||
|
</tr> */}
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</Row>
|
||||||
|
</Tabs.Content>
|
||||||
|
<Tabs.Content class="tabs__content" value="occupancy">
|
||||||
|
<Row>
|
||||||
|
<h2>List of Ready to Approve and Sign Occupancy Order of Payments</h2>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Row>
|
||||||
|
<table class="table">
|
||||||
|
<thead>
|
||||||
|
{/* <tr>
|
||||||
|
<th>Application Number</th>
|
||||||
|
<th>Name</th>
|
||||||
|
<th style="text-align: center">Show Details</th>
|
||||||
|
</tr> */}
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</Row>
|
||||||
|
</Tabs.Content>
|
||||||
|
<Tabs.Content class="tabs__content" value="electrical">
|
||||||
|
<Row>
|
||||||
|
<h2>List of Ready to Approve and Sign Electrical Order of Payments</h2>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Row>
|
||||||
|
<table class="table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Application Number</th>
|
||||||
|
<th>Name</th>
|
||||||
|
<th style="text-align: center">Show Details</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{applicationList().map((item, index) => (
|
||||||
|
<tr>
|
||||||
|
<td>{item}</td>
|
||||||
|
<td>{nameList()[index]}</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<ModalButton
|
||||||
|
class="modal"
|
||||||
|
label="Show Details"
|
||||||
|
design="bo-link"
|
||||||
|
background="#121e2acc"
|
||||||
|
color="#ffffffec"
|
||||||
|
// function={async () => {
|
||||||
|
// await getopdetails(item)
|
||||||
|
// }}
|
||||||
|
>
|
||||||
|
<Padding top={0} left={2} right={2} bottom={0}>
|
||||||
|
<span class="modal__application-number">{item}</span>
|
||||||
|
|
||||||
|
<Padding top={1} left={0} right={0} bottom={0}>
|
||||||
|
<section class="modal__row">
|
||||||
|
<span class="modal__row__label">Name of Applicant:</span>
|
||||||
|
<span class="modal__row__detail">{nameList()[index]}</span>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="modal__row">
|
||||||
|
<span class="modal__row__label">Location:</span>
|
||||||
|
<span class="modal__row__detail">{location()}</span>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="modal__row">
|
||||||
|
<span class="modal__row__label">Type:</span>
|
||||||
|
<span class="modal__row__detail">{type().toUpperCase()}</span>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="modal__row">
|
||||||
|
<span class="modal__row__label">Assessed By:</span>
|
||||||
|
<span class="modal__row__detail">{assessor()}</span>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="modal__row">
|
||||||
|
<span class="modal__row__label">Date Assessed:</span>
|
||||||
|
<span class="modal__row__detail">{dateOp().toUpperCase()}</span>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="modal__row">
|
||||||
|
<span class="modal__row__label">Total Fee:</span>
|
||||||
|
<span class="modal__row__detail__price">
|
||||||
|
{PESO} {totalOp().toFixed(2)}
|
||||||
|
</span>
|
||||||
|
</section>
|
||||||
|
</Padding>
|
||||||
|
|
||||||
|
<Row padding="2rem 0 0 0">
|
||||||
|
<Button wide label="Approve" edges="curved" design="bo-primary"></Button>
|
||||||
|
<span class="modal__cancel">Click anywhere to cancel</span>
|
||||||
|
</Row>
|
||||||
|
</Padding>
|
||||||
|
</ModalButton>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</Row>
|
||||||
|
</Tabs.Content>
|
||||||
|
</Tabs>
|
||||||
|
</Row>
|
||||||
|
</Padding>
|
||||||
|
</Page>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
@ -20,6 +20,10 @@ export const routes: RouteDefinition[] = [
|
||||||
path: '/login',
|
path: '/login',
|
||||||
component: lazy(() => import('./pages/LoginPage/Login.tsx')),
|
component: lazy(() => import('./pages/LoginPage/Login.tsx')),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/assessor',
|
||||||
|
component: lazy(() => import('./pages/AssessorPage/Assessor.tsx')),
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: '**',
|
path: '**',
|
||||||
component: lazy(() => import('./errors/404')),
|
component: lazy(() => import('./errors/404')),
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue