Added filter search

.env

@@ -1,5 +1,5 @@
 VITE_BACKEND=http://localhost:4320/api/
-#VITE_BACKEND=https://ocboapps.davaocity.gov.ph/esign-server/api/
+# VITE_BACKEND=https://ocboapps.davaocity.gov.ph/esign-server/api/
 # VITE_BACKEND=http://192.168.7.163/server/api/
 VITE_HEAD=ARCH. KHASHAYAR L. TOGHYANI
 VITE_PESO=₱

backend/Dockerfile

@@ -1,13 +1,15 @@
 FROM golang:1.25.3 AS build
+ENV GIN_MODE=release
+ENV PORT=4320
 WORKDIR /app
 COPY go.mod go.sum ./
 RUN go mod download
 
 COPY . .
-RUN GOOS=linux GOARCH=amd64 GOAMD64=v1 go build -pgo=auto -ldflags="-s -w" -o bin/esign-server main.go
+RUN GOOS=linux GOARCH=amd64 GOAMD64=v1 go build -pgo=auto -ldflags="-s -w" -o /bin/esign-server main.go
 
 FROM alpine:latest
 WORKDIR /app
-COPY --from=build /app/bin/esign-server .
+COPY --from=build /bin/esign-server ./server
-EXPOSE 4320
+EXPOSE $PORT
-CMD ["./esign-server"]
+CMD ["./server"]

index.html

@@ -8,7 +8,8 @@
     <meta name="description" content="Digital Signature added for OCBO (Office of the City Building Official)" />
     <meta name="title" property="og:title" content="OCBO e-Sign" />
     <meta name="keywords" content="HTML, CSS, JavaScript" />
-    <meta name="author" content="Patrick Alvin Alcala" />
+    <meta name="developer" content="Patrick Alvin Alcala" />
+    <meta name="designer" content="Patrick Alvin Alcala" />
     <meta property="og:description" content="Digital Signature added for OCBO (Office of the City Building Official)" />
     <meta property="og:type" content="website" />
     <link rel="icon" type="image/svg+xml" href="/favicon.png" />

src/components/Input/Input.tsx

@@ -8,6 +8,7 @@ interface Props {
   onChange: Setter<string>
   onKeyDown?: (event: KeyboardEvent) => void
   isPassword?: boolean
+  placeholder?: string
 }
 
 export default (props: Props) => {
@@ -17,7 +18,7 @@ export default (props: Props) => {
         <Show when={props.label}>
           <TextField.Label class="text-field__label">{props.label}</TextField.Label>
         </Show>
-        <TextField.Input class="text-field__input" type={props.isPassword ? 'password' : 'text'} />
+        <TextField.Input class="text-field__input" type={props.isPassword ? 'password' : 'text'} placeholder={props.placeholder || ''}/>
       </TextField>
     </>
   )

src/index.sass

@@ -15,10 +15,7 @@
   z-index: -1
   opacity: 1
   background-attachment: fixed
-
+  background-size: cover
-  // @media only screen and (max-width: views.$mobile)
-  //   background-image: url('/src/assets/images/svg/background-mobile.svg')
-  //   height: 100%
 
 .close-text
   padding: 3rem 0 0 0

src/pages/AssessorPage/Assessor.tsx

@@ -3,7 +3,7 @@ import { Logo, Page, Row, Padding, ModalButton, Button, Clickable, Link, Modal,
 import { FiLogOut } from 'solid-icons/fi'
 import { Tabs } from '@kobalte/core/tabs'
 import { ofetch } from 'ofetch'
-import { onMount, createSignal, Show } from 'solid-js'
+import { onMount, createSignal, Show, createEffect } from 'solid-js'
 import dayjs from 'dayjs'
 import { checkConnection, createPdf } from '../../utils/functions'
 import { FaSolidThumbsUp } from 'solid-icons/fa'
@@ -55,18 +55,18 @@ export default () => {
     }
   }
 
-  const handleFilterChange = (value: string) => {
+  // const handleFilterChange = (value: string) => {
-    // setFilter(value)
+  //   // setFilter(value)
-    if (value.trim() === '') {
+  //   if (value.trim() === '') {
-      setApplicationList(fullIDList())
+  //     setApplicationList(fullIDList())
-      setNameList(fullNameList())
+  //     setNameList(fullNameList())
-    } else {
+  //   } else {
-      const filteredApplications = fullIDList().filter((app) => app.toLowerCase().includes(value.toLowerCase()))
+  //     const filteredApplications = fullIDList().filter((app) => app.toLowerCase().includes(value.toLowerCase()))
-      const filteredNames = fullNameList().slice(0, filteredApplications.length)
+  //     const filteredNames = fullNameList().slice(0, filteredApplications.length)
-      setApplicationList(filteredApplications)
+  //     setApplicationList(filteredApplications)
-      setNameList(filteredNames)
+  //     setNameList(filteredNames)
-    }
+  //   }
-  }
+  // }
 
   const getPrintDetails = async (id: number) => {
     const response = await ofetch(API + 'get-printdetails-electrical/' + id)
@@ -161,8 +161,8 @@ export default () => {
 
     const approversignId = await geteSignId(276)
     getApprovedDate(approversignId, applicationNo)
-    const assessorId = await getEmployeeId(op.result7[0])
+    // const assessorId = await getEmployeeId(op.result7[0])
-    const assessorsignId = await geteSignId(assessorId)
+    // const assessorsignId = await geteSignId(assessorId)
     getAssessedDate(op.result11[0])
   }
 
@@ -171,22 +171,20 @@ export default () => {
     return total
   }
 
-  const getListForPrinting = async (query?: string) => {
+  const getListForPrinting = async () => {
     try {
       const response = await ofetch(API + 'get-listopprinting-electrical', { parseResponse: JSON.parse })
-      const filteredApplications = response.result.filter((item: any) =>
+
-          item
+      if (filter() !== '' && filter().trim().length !== 0) {
-            .toString()
+        const filteredApplications = response.result.filter((item: string) => item.includes(filter()))
-            .toLowerCase()
+        const filteredIndices = response.result.map((item: string, index: number) => (item.includes(filter()) ? index : -1)).filter((index: number) => index !== -1)
-            .includes((query ?? '').toLowerCase())
+        const filteredNames = filteredIndices.map((index: number) => response.result2[index])
-        )
+        setApplicationList(filteredApplications)
-         const filteredNames = response.result2.filter((item: any) =>
+        setNameList(filteredNames)
-      item.toString().toLowerCase().includes((query ?? '').toLowerCase())
+        return
-    )
+      }
-      // setApplicationList(response.result)
+      setApplicationList(response.result)
-      // setNameList(response.result2)
+      setNameList(response.result2)
-      setApplicationList(filteredApplications)
-      setNameList(filteredNames)
     } catch (error) {
       console.error(error)
     }
@@ -352,6 +350,14 @@ export default () => {
     }
   })
 
+  createEffect(async () => {
+    if (filter() !== '') {
+      await getListForPrinting()
+    } else if (filter() === '') {
+      await getListForPrinting()
+    }
+  })
+
   return (
     <>
       <Page alignment="column">
@@ -451,7 +457,7 @@ export default () => {
 
                 <Padding top={0} bottom={0} right={10} left={10}>
                   <Row content="split">
-                    <Input label="aa" value={filter()} onChange={getListForPrinting} />
+                    <Input value={filter()} onChange={setFilter} placeholder="Filter Application Number" />
                     <Button label="Refresh Data" edges="curved" design="bo-primary" icon={VsRefresh} onClick={refresh}></Button>
                   </Row>
                 </Padding>

src/pages/IndexPage/Index.tsx

@@ -42,7 +42,12 @@ export default () => {
     sessionStorage.setItem('registered', JSON.stringify([...registeredNameList]))
   }
 
+  const clearCache = async () => {
+    caches.keys()
+  }
+
   onMount(async () => {
+    await clearCache()
     await getAssessors()
     await getRegistered()
   })

src/styles/classes.sass

@@ -2,7 +2,10 @@
 @use 'sass:color'
 
 .fullscreen
-  position: absolute
+  display: flex
+  align-items: center
+  justify-content: center
+  position: fixed
   top: 0
   left: 0
   width: 100vw