716 lines
28 KiB
TypeScript
716 lines
28 KiB
TypeScript
import './Main.sass'
|
|
import { Logo, Link, Page, Row, Padding, ModalButton, Box, Button, Modal, Column, Clickable } from '../../components/'
|
|
import { FiLogOut } from 'solid-icons/fi'
|
|
import { Tabs } from '@kobalte/core/tabs'
|
|
import { onMount, createSignal } from 'solid-js'
|
|
import dayjs from 'dayjs'
|
|
import { checkConnection, getApi, getApiMulti, postApi } from '../../utils/functions'
|
|
import { FaSolidThumbsUp } from 'solid-icons/fa'
|
|
import { _employeeName } from '../../stores/employee'
|
|
import { useNavigate } from '@solidjs/router'
|
|
import { _applicationNo, _date, _optn, _name, _location, _type, _assessor, _feeList, _codeList, _amountList, _signatureAssessor, _signatureApprover, _assessorid, _approvedDate, _assessedDate } from '../../stores/pdfinfo'
|
|
import { VsRefresh } from 'solid-icons/vs'
|
|
import { BiRegularErrorAlt } from 'solid-icons/bi'
|
|
|
|
const PESO = import.meta.env.VITE_PESO
|
|
const ID = import.meta.env.VITE_HEADID
|
|
// const NAME = import.meta.env.VITE_HEAD
|
|
const PUBLICIP = import.meta.env.VITE_PUBLICIP
|
|
|
|
export default () => {
|
|
const navigate = useNavigate()
|
|
|
|
const [totalOp, setTotalOp] = createSignal('')
|
|
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 [applicationListElectrical, setApplicationListElectrical] = createSignal<string[]>([])
|
|
const [nameListElectrical, setNameListElectrical] = createSignal<string[]>([])
|
|
const [applicationListOccupancy, setApplicationListOccupancy] = createSignal<string[]>([])
|
|
const [nameListOccupancy, setNameListOccupancy] = createSignal<string[]>([])
|
|
|
|
const [errorMessage, setErrorMessage] = createSignal('')
|
|
const [connected, setConnected] = createSignal(true)
|
|
const [approved, setApproved] = createSignal(false)
|
|
const [approvedApplication, setApprovedApplication] = createSignal('')
|
|
|
|
const [employeeId, setEmployeeId] = createSignal(0)
|
|
const [employeeName, setEmployeeName] = createSignal('')
|
|
|
|
const [apology, setApology] = createSignal(false)
|
|
|
|
const getListForApproval = async () => {
|
|
const responseE = await getApiMulti('get-listopapproval-electrical')
|
|
setApplicationListElectrical(responseE.result)
|
|
setNameListElectrical(responseE.result2)
|
|
|
|
const responseO = await getApiMulti('get-listopapproval-occupancy')
|
|
setApplicationListOccupancy(responseO.result)
|
|
setNameListOccupancy(responseO.result2)
|
|
}
|
|
|
|
const getListForApprovalElectrical = async () => {
|
|
try {
|
|
const responseE = await getApiMulti('get-listopapproval-electrical')
|
|
setApplicationListElectrical(responseE.result)
|
|
setNameListElectrical(responseE.result2)
|
|
} catch (error) {
|
|
console.error(error)
|
|
}
|
|
}
|
|
|
|
const getListForApprovalOccupancy = async () => {
|
|
try {
|
|
const responseO = await getApiMulti('get-listopapproval-occupancy')
|
|
setApplicationListOccupancy(responseO.result)
|
|
setNameListOccupancy(responseO.result2)
|
|
} catch (error) {
|
|
console.error(error)
|
|
}
|
|
}
|
|
|
|
const load = async (division: string) => {
|
|
setConnected(await checkConnection())
|
|
if (connected() === false) {
|
|
setErrorMessage('Could not gather list of applicaitons')
|
|
return
|
|
}
|
|
|
|
if (division === 'electrical') {
|
|
await getListForApprovalElectrical()
|
|
}
|
|
if (division === 'occupancy') {
|
|
await getListForApprovalOccupancy()
|
|
} else {
|
|
await getListForApproval()
|
|
}
|
|
}
|
|
|
|
const getopdetails = async (division: string, applicationNo: string) => {
|
|
let op
|
|
if (division === 'electrical') {
|
|
op = await getApiMulti('get-opdetails-electrical', applicationNo)
|
|
} else if (division === 'occupancy') {
|
|
op = await getApiMulti('get-opdetails-occupancy', applicationNo)
|
|
}
|
|
|
|
setLocation(op.result[0])
|
|
setType(op.result2[0])
|
|
setAssessor(op.result3[0])
|
|
const total = calculateTotal(op.result4)
|
|
const formattedTotal = new Intl.NumberFormat('en-US', {
|
|
minimumFractionDigits: 2,
|
|
maximumFractionDigits: 2,
|
|
}).format(total)
|
|
setTotalOp(formattedTotal)
|
|
setDateOp(dayjs(op.result5[0]).format('MMMM DD, YYYY'))
|
|
setApplicationId(op.result6[0])
|
|
}
|
|
|
|
const calculateTotal = (list: number[]) => {
|
|
const total = list.map((item) => parseFloat(item.toString())).reduce((acc, curr) => acc + curr, 0)
|
|
return total
|
|
}
|
|
|
|
// const approveHandler = async (application: string) => {
|
|
// let signed: boolean = false
|
|
// let forprinting: boolean = false
|
|
// let updateOrderofpayment: boolean = false
|
|
|
|
// setConnected(await checkConnection())
|
|
// if (connected() === false) {
|
|
// setErrorMessage('No Connection on Server')
|
|
// return
|
|
// }
|
|
|
|
// signed = await setNewStatus('ELECTRICAL ORDER OF PAYMENT APPROVED AND SIGNED', '170', 'ELECOPAPPROVEDSIGNED', 1)
|
|
// const approvedid = await getIdByApplication(application)
|
|
// updateDocflow(approvedid, 'FOR ELECTRICAL ORDER OF PAYMENT APPROVAL')
|
|
// if (!signed) return
|
|
|
|
// forprinting = await setNewStatus('FOR ELECTRICAL ORDER OF PAYMENT PRINTING', '95', 'ELECOPPRINT', 0)
|
|
// if (!forprinting) return
|
|
|
|
// updateOrderofpayment = await updateOp()
|
|
|
|
// if (updateOrderofpayment) {
|
|
// postTransaction()
|
|
// postPops(application)
|
|
// setApprovedApplication(application)
|
|
// setApproved(true)
|
|
// }
|
|
// }
|
|
|
|
const approveHandler = async (division: string, application: string) => {
|
|
let signed: boolean = false
|
|
let forprinting: boolean = false
|
|
let updateOrderofpayment: boolean = false
|
|
|
|
setConnected(await checkConnection())
|
|
if (connected() === false) {
|
|
setErrorMessage('No Connection on Server')
|
|
return
|
|
}
|
|
|
|
if (division === 'electrical') {
|
|
signed = await setNewStatus(division, 'ELECTRICAL ORDER OF PAYMENT APPROVED AND SIGNED', '170', 'ELECOPAPPROVEDSIGNED', 1)
|
|
const approvedid = await getIdByApplication(division, application)
|
|
updateDocflow(division, approvedid, 'FOR ELECTRICAL ORDER OF PAYMENT APPROVAL')
|
|
if (!signed) return
|
|
|
|
forprinting = await setNewStatus(division, 'FOR ELECTRICAL ORDER OF PAYMENT PRINTING', '95', 'ELECOPPRINT', 0)
|
|
if (!forprinting) return
|
|
|
|
updateOrderofpayment = await updateOp(division)
|
|
|
|
if (updateOrderofpayment) {
|
|
postTransaction()
|
|
postPops(division, application)
|
|
setApprovedApplication(application)
|
|
setApproved(true)
|
|
}
|
|
} else if (division === 'occupancy') {
|
|
signed = await setNewStatus(division, 'OCCUPANCY ORDER OF PAYMENT APPROVED AND SIGNED', '172', 'OCCOPAPPROVEDSIGNED', 1)
|
|
const approvedid = await getIdByApplication(division, application)
|
|
updateDocflow(division, approvedid, 'FOR OCCUPANCY RECOMMENDING APPROVAL')
|
|
if (!signed) return
|
|
|
|
forprinting = await setNewStatus(division, 'APPROVED FOR PRINTING OF BUREAU OF FIRE AND ORDER OF PAYMENT', '23', 'OCORDEROFPAYMENT', 0)
|
|
if (!forprinting) return
|
|
|
|
updateOrderofpayment = await updateOp(division)
|
|
|
|
if (updateOrderofpayment) {
|
|
postTransaction()
|
|
postPops(division, application)
|
|
setApprovedApplication(application)
|
|
setApproved(true)
|
|
}
|
|
}
|
|
}
|
|
|
|
const setNewStatus = async (division: string, status: string, tag: string, tagword: string, approved: number) => {
|
|
const today = new Date()
|
|
const formattedDate = dayjs(today).format('YYYY-MM-DD HH:mm:ss')
|
|
const statusid = parseInt(applicationId().toString())
|
|
|
|
if (division === 'electrical') {
|
|
return await postApi('post-newstatus-electrical', { data: statusid, data2: formattedDate, data3: status, data4: tag, data5: tagword, data6: parseInt(approved.toString()), data7: parseInt(ID) })
|
|
} else {
|
|
return await postApi('post-newstatus-occupancy', { data: statusid, data2: formattedDate, data3: status, data4: tag, data5: tagword, data6: parseInt(approved.toString()), data7: parseInt(ID) })
|
|
}
|
|
}
|
|
|
|
const updateOp = async (division: string) => {
|
|
if (division === 'electrical') {
|
|
return await postApi('update-opapproved-electrical', { data: parseInt(applicationId().toString()) })
|
|
} else {
|
|
return await postApi('update-opapproved-occupancy', { data: parseInt(applicationId().toString()) })
|
|
}
|
|
}
|
|
|
|
// const getPrintDetails = async (id: number) => {
|
|
// const response = await ofetch(API + 'get-printdetails-electrical/' + id)
|
|
// const applicationno = response.result
|
|
// const date = response.result2
|
|
// const location = response.result3
|
|
// const name = response.result8
|
|
// const type = `${response.result4} - ${response.result5}`
|
|
// const assessor = response.result7
|
|
|
|
// _optn.set('M' + applicationno.split('-')[0] + applicationno.split('-')[1])
|
|
// _applicationNo.set(applicationno)
|
|
// _date.set(dayjs(date).format('MMMM DD, YYYY'))
|
|
// _name.set(name)
|
|
// _location.set(location)
|
|
// _type.set(type)
|
|
// _assessor.set(assessor)
|
|
// _assessorid.set(employeeId())
|
|
// }
|
|
|
|
const postPops = async (division: string, application: string) => {
|
|
let response
|
|
|
|
if (division === 'electrical') {
|
|
response = await getApiMulti('get-popsdetails-electrical', application)
|
|
} else if (division === 'occupancy') {
|
|
response = await getApiMulti('get-popsdetails-occupancy', application)
|
|
}
|
|
|
|
const customerid = response.result2[0]
|
|
const customerName = response.result3[0]
|
|
const location = response.result4[0]
|
|
const amountList = response.result5
|
|
const lguList = response.result6
|
|
const dpwhList = response.result7
|
|
const boList = response.result8
|
|
const codeList = response.result9
|
|
|
|
const today = new Date()
|
|
const formattedDate = dayjs(today).format('YYYY-MM-DD')
|
|
const formattedDatewithTime = dayjs(today).format('YYYY-MM-DD HH:mm:ss')
|
|
|
|
for (let i = 0; i < response.result.length; i++) {
|
|
await postApi('post-pops', { data: application, data2: formattedDate, data3: customerid, data4: customerName, data5: location, data6: codeList[i], data7: amountList[i], data8: assessor(), data9: formattedDatewithTime, data10: lguList[i], data11: dpwhList[i], data12: boList[i], data13: PUBLICIP })
|
|
}
|
|
}
|
|
|
|
// const calculateAmounts = () => {
|
|
// const amounts: string[] = amountList()
|
|
// let gflguList: number[] = []
|
|
// let gfdpwhList: number[] = []
|
|
// let tfboList: number[] = []
|
|
|
|
// for (let i = 0; i < amounts.length; i++) {
|
|
// const gflgu = parseFloat(amounts[i]) * 0.8
|
|
// const gfdpwh = parseFloat(amounts[i]) * 0.05
|
|
// const tfbo = parseFloat(amounts[i]) * 0.15
|
|
|
|
// const roundedGflgu = parseFloat(gflgu.toFixed(2))
|
|
// const roundedGfdpwh = parseFloat(gfdpwh.toFixed(2))
|
|
// const roundedTfbo = parseFloat(tfbo.toFixed(2))
|
|
|
|
// gflguList.push(roundedGflgu)
|
|
// gfdpwhList.push(roundedGfdpwh)
|
|
// tfboList.push(roundedTfbo)
|
|
// }
|
|
|
|
// setGflgu(gflguList)
|
|
// setGfdpwh(gfdpwhList)
|
|
// setTfbo(tfboList)
|
|
// }
|
|
|
|
const closeNotification = async () => {
|
|
setApproved(false)
|
|
await load('all')
|
|
}
|
|
|
|
const removeEmployee = () => {
|
|
sessionStorage.removeItem('id')
|
|
sessionStorage.removeItem('name')
|
|
}
|
|
|
|
const checkLogged = async () => {
|
|
const idStore = sessionStorage.getItem('id')
|
|
const nameStore = sessionStorage.getItem('name')
|
|
setEmployeeId(parseInt(idStore!))
|
|
setEmployeeName(nameStore!)
|
|
|
|
if (employeeId() === 0 || employeeId().toString() === 'NaN') {
|
|
removeEmployee()
|
|
navigate('/', { replace: true })
|
|
return false
|
|
}
|
|
return true
|
|
}
|
|
|
|
const geteSignId = async () => {
|
|
try {
|
|
const response = await getApi('get-esignid', ID)
|
|
return response
|
|
} catch {
|
|
return 0
|
|
}
|
|
}
|
|
|
|
const postTransaction = async () => {
|
|
const id = await geteSignId()
|
|
const today = new Date()
|
|
const formatedDate = dayjs(today).format('YYYY-MM-DD HH:mm:ss')
|
|
|
|
await postApi('post-esigntransaction', { data: parseInt(id), data2: approvedApplication(), data3: formatedDate })
|
|
}
|
|
|
|
const updateDocflow = async (division: string, applicationid: number, status: string) => {
|
|
if (division === 'electrical') {
|
|
await postApi('update-docflow-electrical', { data: parseInt(applicationid.toString()), data2: status })
|
|
} else if (division === 'occupancy') {
|
|
await postApi('update-docflow-occupancy', { data: parseInt(applicationid.toString()), data2: status })
|
|
}
|
|
}
|
|
|
|
const getIdByApplication = async (division: string, applicationNo: string) => {
|
|
let response
|
|
if (division === 'electrical') {
|
|
response = await getApi('get-idbyapplication-electrical', applicationNo)
|
|
} else if (division === 'occupancy') {
|
|
response = await getApi('get-idbyapplication-occupancy', applicationNo)
|
|
}
|
|
return parseInt(response)
|
|
}
|
|
|
|
const refresh = async (division: string) => {
|
|
if (division === 'electrical') {
|
|
await load('electrical')
|
|
} else if (division === 'occupancy') {
|
|
await load('occupancy')
|
|
} else {
|
|
await load('all')
|
|
}
|
|
}
|
|
|
|
const logout = async () => {
|
|
removeEmployee()
|
|
navigate('/')
|
|
}
|
|
|
|
onMount(async () => {
|
|
const logged = await checkLogged()
|
|
|
|
if (logged) {
|
|
await load('all')
|
|
}
|
|
})
|
|
|
|
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}>
|
|
<Box curved thickness={0} padding="1.25rem 2.25rem" background="#0f131d56">
|
|
<span class="name">{employeeName()}</span>
|
|
</Box>
|
|
<Clickable onClick={logout}>
|
|
<Row gap={0.5}>
|
|
<FiLogOut size={25} />
|
|
<span>Logout</span>
|
|
</Row>
|
|
</Clickable>
|
|
</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> */}
|
|
<Box curved thickness={0} background="#602a2abf" padding="1rem 2rem">
|
|
<h2>Under Development</h2>
|
|
</Box>
|
|
</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>
|
|
|
|
<Padding top={0} bottom={0} right={10} left={0}>
|
|
<Row content="right">
|
|
<Button label="Refresh Data" edges="curved" design="bo-primary" icon={VsRefresh} onClick={() => refresh('occupancy')}></Button>
|
|
</Row>
|
|
</Padding>
|
|
|
|
<Row>
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>Application Number</th>
|
|
<th>Name</th>
|
|
<th style="text-align: center">Show Details</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{applicationListOccupancy().map((item, index) => (
|
|
<tr>
|
|
<td>{item}</td>
|
|
<td>{nameListOccupancy()[index]}</td>
|
|
|
|
<td>
|
|
<ModalButton
|
|
class="modal"
|
|
label="Show Details"
|
|
design="bo-link"
|
|
background="#121e2acc"
|
|
color="#ffffffec"
|
|
function={async () => {
|
|
// setApology(true)
|
|
// setErrorMessage('Modification of Occupancy Printing has not yet finished')
|
|
await getopdetails('occupancy', 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">{nameListOccupancy()[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()}
|
|
</span>
|
|
</section>
|
|
</Padding>
|
|
|
|
<Row padding="2rem 0 0 0">
|
|
<Button wide label="Approve" edges="curved" design="bo-primary" onClick={() => approveHandler('occupancy', item)}></Button>
|
|
<span class="modal__cancel">Click anywhere to cancel</span>
|
|
</Row>
|
|
</Padding>
|
|
</ModalButton>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</Row>
|
|
</Tabs.Content>
|
|
<Tabs.Content class="tabs__content" value="electrical">
|
|
<Row>
|
|
<h2>List of Ready to Approve and Sign in Electrical Order of Payments</h2>
|
|
</Row>
|
|
|
|
<Padding top={0} bottom={0} right={10} left={0}>
|
|
<Row content="right">
|
|
<Button label="Refresh Data" edges="curved" design="bo-primary" icon={VsRefresh} onClick={() => refresh('electrical')}></Button>
|
|
</Row>
|
|
</Padding>
|
|
|
|
<Row>
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>Application Number</th>
|
|
<th>Name</th>
|
|
<th style="text-align: center">Show Details</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{applicationListElectrical().map((item, index) => (
|
|
<tr>
|
|
<td>{item}</td>
|
|
<td>{nameListElectrical()[index]}</td>
|
|
|
|
<td>
|
|
<ModalButton
|
|
class="modal"
|
|
label="Show Details"
|
|
design="bo-link"
|
|
background="#121e2acc"
|
|
color="#ffffffec"
|
|
function={async () => {
|
|
await getopdetails('electrical', 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">{nameListElectrical()[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()}
|
|
</span>
|
|
</section>
|
|
</Padding>
|
|
|
|
<Row padding="2rem 0 0 0">
|
|
<Button wide label="Approve" edges="curved" design="bo-primary" onClick={() => approveHandler('electrical', item)}></Button>
|
|
<span class="modal__cancel">Click anywhere to cancel</span>
|
|
</Row>
|
|
</Padding>
|
|
</ModalButton>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</Row>
|
|
</Tabs.Content>
|
|
</Tabs>
|
|
</Row>
|
|
</Padding>
|
|
</Page>
|
|
|
|
<div onClick={() => setApproved(false)}>
|
|
<Modal trigger={approved()} background="#123220ff" color="#cdfbe1f0" opacity={0.8}>
|
|
<Padding top={1} bottom={1} left={2} right={2}>
|
|
<Column>
|
|
<Row gap={4}>
|
|
<FaSolidThumbsUp size={75} />
|
|
<Box curved thickness={3} color="#cdfbe1f0" padding="1rem">
|
|
<span class="approval">Approved</span>
|
|
</Box>
|
|
</Row>
|
|
<Row padding="2rem 0 0 0">
|
|
<h2>{approvedApplication()}</h2>
|
|
</Row>
|
|
|
|
<Row>
|
|
<span class="close-text">Click anywhere to proceed</span>
|
|
</Row>
|
|
</Column>
|
|
</Padding>
|
|
</Modal>
|
|
</div>
|
|
|
|
<div onClick={closeNotification}>
|
|
<Modal trigger={approved()} background="#123220ff" color="#cdfbe1f0" opacity={0.8}>
|
|
<Padding top={1} bottom={1} left={2} right={2}>
|
|
<Column>
|
|
<Row gap={4}>
|
|
<FaSolidThumbsUp size={75} />
|
|
<Box curved thickness={3} color="#cdfbe1f0" padding="1rem">
|
|
<span class="approval">Approved</span>
|
|
</Box>
|
|
</Row>
|
|
<Row padding="2rem 0 0 0">
|
|
<h2>{approvedApplication()}</h2>
|
|
</Row>
|
|
|
|
<Row>
|
|
<span class="close-text">Click anywhere to proceed</span>
|
|
</Row>
|
|
</Column>
|
|
</Padding>
|
|
</Modal>
|
|
</div>
|
|
|
|
<div onClick={() => setConnected(true)}>
|
|
<Modal trigger={connected() === false} background="#562020ff" color="#ffebebe6" opacity={0.8}>
|
|
<Padding top={1} bottom={1} left={4} right={4}>
|
|
<Column>
|
|
<Row>
|
|
<Box curved thickness={3} color="#ffebebe6" padding="1rem">
|
|
<h2>Connection Error</h2>
|
|
</Box>
|
|
</Row>
|
|
|
|
<Row>
|
|
<h3>{errorMessage()}</h3>
|
|
</Row>
|
|
|
|
<Row>
|
|
<span class="close-text">Click anywhere to close</span>
|
|
</Row>
|
|
</Column>
|
|
</Padding>
|
|
</Modal>
|
|
</div>
|
|
|
|
<div onClick={() => setApology(false)}>
|
|
<Modal trigger={apology()} background="#562020ff" color="#ffebebe6" opacity={0.8}>
|
|
<Padding top={1} bottom={1} left={4} right={4}>
|
|
<Column>
|
|
<Row gap={2}>
|
|
<BiRegularErrorAlt size={90} color="#ffebebe6" />
|
|
<Box curved thickness={3} color="#ffebebe6" padding="1rem">
|
|
<h2>Delayed Release of Feature</h2>
|
|
</Box>
|
|
</Row>
|
|
|
|
<Row>
|
|
<h3>{errorMessage()}</h3>
|
|
</Row>
|
|
|
|
<Row>
|
|
<Column gap={0.5}>
|
|
<span>Occupancy Approval is delayed until Occupancy Printing is complete</span>
|
|
</Column>
|
|
</Row>
|
|
|
|
<Row>
|
|
<span class="close-text">Click anywhere to close</span>
|
|
</Row>
|
|
</Column>
|
|
</Padding>
|
|
</Modal>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|