Added view of occupancy approval list
This commit is contained in:
parent
500d138339
commit
d8296d9c0e
1 changed files with 161 additions and 56 deletions
|
|
@ -37,8 +37,10 @@ export default () => {
|
|||
// const [amountList, setAmountList] = createSignal<string[]>([])
|
||||
// const [dateOpList, setDateOpList] = createSignal<string[]>([])
|
||||
|
||||
const [applicationList, setApplicationList] = createSignal<string[]>([])
|
||||
const [nameList, setNameList] = 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)
|
||||
|
|
@ -50,38 +52,73 @@ export default () => {
|
|||
|
||||
const getListForApproval = async () => {
|
||||
try {
|
||||
const response = await ofetch(API + 'get-listopapproval-electrical', { parseResponse: JSON.parse })
|
||||
setApplicationList(response.result)
|
||||
setNameList(response.result2)
|
||||
const responseE = await ofetch(API + 'get-listopapproval-electrical', { parseResponse: JSON.parse })
|
||||
setApplicationListElectrical(responseE.result)
|
||||
setNameListElectrical(responseE.result2)
|
||||
|
||||
const responseO = await ofetch(API + 'get-listopapproval-occupancy', { parseResponse: JSON.parse })
|
||||
setApplicationListOccupancy(responseO.result)
|
||||
setNameListOccupancy(responseO.result2)
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
const load = async () => {
|
||||
const getListForApprovalElectrical = async () => {
|
||||
try {
|
||||
const responseE = await ofetch(API + 'get-listopapproval-electrical', { parseResponse: JSON.parse })
|
||||
setApplicationListElectrical(responseE.result)
|
||||
setNameListElectrical(responseE.result2)
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
const getListForApprovalOccupancy = async () => {
|
||||
try {
|
||||
const responseO = await ofetch(API + 'get-listopapproval-occupancy', { parseResponse: JSON.parse })
|
||||
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 (applicationNo: string) => {
|
||||
const getopdetails = async (division: string, applicationNo: string) => {
|
||||
if (division === 'electrical') {
|
||||
const op = await ofetch(API + 'get-opdetails-electrical/' + applicationNo, { parseResponse: JSON.parse })
|
||||
setAssessor(op.result7[0])
|
||||
setLocation(op.result5[0])
|
||||
setType(op.result6[0])
|
||||
setDateOp(dayjs(op.result10[0]).format('MMMM DD, YYYY'))
|
||||
setApplicationId(op.result11[0])
|
||||
// setAssessorId(op.result12[0])
|
||||
setTotalOp(calculateTotal(op.result9))
|
||||
|
||||
// setDescriptionList(op.result8)
|
||||
// setAmountList(op.result9)
|
||||
// setDateOpList(op.result10)
|
||||
// calculateAmounts()
|
||||
} else if (division === 'occupancy') {
|
||||
const op = await ofetch(API + 'get-opdetails-occupancy/' + applicationNo, { parseResponse: JSON.parse })
|
||||
setAssessor(op.result7[0])
|
||||
setLocation(op.result5[0])
|
||||
setType(op.result6[0])
|
||||
setDateOp(dayjs(op.result10[0]).format('MMMM DD, YYYY'))
|
||||
setApplicationId(op.result11[0])
|
||||
setTotalOp(calculateTotal(op.result9))
|
||||
}
|
||||
}
|
||||
|
||||
const calculateTotal = (list: number[]) => {
|
||||
|
|
@ -217,11 +254,7 @@ export default () => {
|
|||
|
||||
const closeNotification = async () => {
|
||||
setApproved(false)
|
||||
await load()
|
||||
}
|
||||
|
||||
const openPDF = () => {
|
||||
createPdf()
|
||||
await load('all')
|
||||
}
|
||||
|
||||
const removeEmployee = () => {
|
||||
|
|
@ -280,8 +313,14 @@ export default () => {
|
|||
}
|
||||
}
|
||||
|
||||
const refresh = async () => {
|
||||
await load()
|
||||
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 () => {
|
||||
|
|
@ -293,7 +332,7 @@ export default () => {
|
|||
const logged = await checkLogged()
|
||||
|
||||
if (logged) {
|
||||
await load()
|
||||
await load('all')
|
||||
}
|
||||
})
|
||||
|
||||
|
|
@ -361,33 +400,12 @@ export default () => {
|
|||
</Tabs.Content>
|
||||
<Tabs.Content class="tabs__content" value="occupancy">
|
||||
<Row>
|
||||
{/* <h2>List of Ready to Approve and Sign Occupancy 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="electrical">
|
||||
<Row>
|
||||
<h2 onClick={openPDF}>List of Ready to Approve and Sign in Electrical Order of Payments</h2>
|
||||
<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}></Button>
|
||||
<Button label="Refresh Data" edges="curved" design="bo-primary" icon={VsRefresh} onClick={() => refresh('occupancy')}></Button>
|
||||
</Row>
|
||||
</Padding>
|
||||
|
||||
|
|
@ -401,10 +419,10 @@ export default () => {
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{applicationList().map((item, index) => (
|
||||
{applicationListOccupancy().map((item, index) => (
|
||||
<tr>
|
||||
<td>{item}</td>
|
||||
<td>{nameList()[index]}</td>
|
||||
<td>{nameListOccupancy()[index]}</td>
|
||||
|
||||
<td>
|
||||
<ModalButton
|
||||
|
|
@ -414,7 +432,7 @@ export default () => {
|
|||
background="#121e2acc"
|
||||
color="#ffffffec"
|
||||
function={async () => {
|
||||
await getopdetails(item)
|
||||
await getopdetails('occupancy', item)
|
||||
}}
|
||||
>
|
||||
<Padding top={0} left={2} right={2} bottom={0}>
|
||||
|
|
@ -423,7 +441,94 @@ export default () => {
|
|||
<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>
|
||||
<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().toFixed(2)}
|
||||
</span>
|
||||
</section>
|
||||
</Padding>
|
||||
|
||||
<Row padding="2rem 0 0 0">
|
||||
<Button wide label="Approve" edges="curved" design="bo-primary" onClick={() => approveHandler(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">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue