diff --git a/src/app/home/layout.module.css b/src/app/home/layout.module.css deleted file mode 100644 index 851a4bf..0000000 --- a/src/app/home/layout.module.css +++ /dev/null @@ -1,80 +0,0 @@ -.title { - color: light-dark(var(--mantine-color-black), var(--mantine-color-white)); - font-family: - Greycliff CF, - var(--mantine-font-family); -} - -.navbar { - flex-grow: 1; - padding: var(--mantine-spacing-md); - display: flex; - flex-direction: column; -} - -.navbarMain { - flex: 1; -} - -.header { - padding-bottom: var(--mantine-spacing-md); - margin-bottom: calc(var(--mantine-spacing-md) * 1.5); - border-bottom: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4)); -} - -.user { - padding: var(--mantine-spacing-md); - color: light-dark(var(--mantine-color-black), var(--mantine-color-dark-0)); - border-radius: var(--mantine-radius-sm); - - @mixin hover { - background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-8)); - } -} - -.footer { - padding-top: var(--mantine-spacing-md); - margin-top: var(--mantine-spacing-md); - border-top: rem(1px) solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-4)); -} - -.link { - cursor: pointer; - display: flex; - align-items: center; - text-decoration: none; - font-size: var(--mantine-font-size-sm); - color: light-dark(var(--mantine-color-gray-7), var(--mantine-color-dark-1)); - padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm); - border-radius: var(--mantine-radius-sm); - font-weight: 500; - - @mixin hover { - background-color: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6)); - color: light-dark(var(--mantine-color-black), var(--mantine-color-white)); - - .linkIcon { - color: light-dark(var(--mantine-color-black), var(--mantine-color-white)); - } - } - - &[data-active] { - &, - &:hover { - background-color: var(--mantine-primary-color-light); - color: var(--mantine-primary-color-light-color); - - .linkIcon { - color: var(--mantine-primary-color-light-color); - } - } - } -} - -.linkIcon { - color: light-dark(var(--mantine-color-gray-6), var(--mantine-color-dark-2)); - margin-right: var(--mantine-spacing-sm); - width: rem(25px); - height: rem(25px); -} - diff --git a/src/app/home/layout.tsx b/src/app/home/layout.tsx deleted file mode 100644 index b2695bf..0000000 --- a/src/app/home/layout.tsx +++ /dev/null @@ -1,159 +0,0 @@ -"use client" - -import React, { useContext, useState } from "react"; -import { UserContext } from "../_components/user-context"; -import { redirect } from "next/navigation"; - -import { AppShell, Burger, Group, Image, Text, LoadingOverlay, Avatar, UnstyledButton, Title, Skeleton, Center, Switch, NavLink, ScrollArea, Code } from '@mantine/core'; -import { IconLogout, IconExclamationCircle, IconNotes, IconCategory, IconTicket, IconEye } from '@tabler/icons-react'; -import { useDisclosure } from '@mantine/hooks'; -import classes from './layout.module.css'; -import { KccbTheme } from "../_themes/KccbTheme"; -import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; -import Link from "next/link"; -import { notifications } from "@mantine/notifications"; -import axios, { AxiosError } from "axios"; -import { useRouter } from "next/navigation"; - - -async function logout() { - try { - await axios.post('/api/auth/logout'); - } catch (error: AxiosError | any) { - notifications.show({ - color: 'red', - title: error.code, - message: error.message - }) - } -} - -export default function HomeLayout({ - children, -}: Readonly<{ - children: React.ReactNode; -}>) { - - const user = useContext(UserContext); - if (user === null) redirect('/login'); - - const router = useRouter(); - - const queryClient = useQueryClient(); - - const [burgerOpened, { toggle: toggleBurger }] = useDisclosure(); - const [activeNavItem, setActiveNavItem] = useState(null); - - const logoutMutation = useMutation({ - mutationKey: ['logout'], - mutationFn: logout - }) - - async function handleLogout(event: React.MouseEvent) { - event.preventDefault(); - await logoutMutation.mutateAsync(); - await queryClient.refetchQueries({ queryKey: ['user'] }) - } - - let navItems: React.ReactNode[] = []; - - navItems.push(<> - - - Create Ticket - - } - active={activeNavItem === 'raised-ticket' || undefined} - onClick={event => { - event.preventDefault(); - setActiveNavItem('raised-ticket') - router.push('/home/user/raised-ticket') - }} - /> - - View Ticket - - } - active={activeNavItem === 'view-ticket' || undefined} - onClick={event => { - event.preventDefault(); - setActiveNavItem('view-ticket') - router.push('/home/user/view-ticket'); - }} - /> - - ) - - return ( - <> - - - {user && - - - - - - Customer Request Management - - {/* - - { - setActiveNavItem(null); - router.push('/home/user'); - }}> - - */} - - - -
- - Account No: [{user.bank_account_no}] - - {/* User: - {user.id} */} -
- - - - - Menu - - - - - {children} - - } - - ) -} \ No newline at end of file diff --git a/src/app/home/page.tsx b/src/app/home/page.tsx index 6bbd9c5..5a42e81 100644 --- a/src/app/home/page.tsx +++ b/src/app/home/page.tsx @@ -1,18 +1,38 @@ "use client"; -import { UserContextConsumer } from "../_components/user-context"; +import { Button } from "@mantine/core"; +import { useRouter } from "next/navigation"; +import { useEffect, useState } from "react"; + + export default function Home() { - return ( + const[authorized,SetAuthorized] =useState(null); + const router = useRouter(); + + async function handleLogout(e: React.FormEvent) { + e.preventDefault(); + localStorage.removeItem("access_token"); + router.push("/login") + } + useEffect(() => { + const token = localStorage.getItem("access_token"); + if (!token) { + SetAuthorized(false); + router.push("/login"); + } + else{ + SetAuthorized(true); + } + }, []); + + if(authorized){ + return ( <> -

Welcome to IB Portal

- - { - user => user &&

Your Present Login Account No: {user.bank_account_no}

- } - -

  • For raise a complain or assistance ,please click on Create Ticket

    • -

  • For track a ticket ,please click on View Ticket

    • +

    Welcome to IB portal

    + ); + } + } diff --git a/src/app/home/user/raised-ticket/page.tsx b/src/app/home/user/raised-ticket/page.tsx deleted file mode 100644 index 4fd7615..0000000 --- a/src/app/home/user/raised-ticket/page.tsx +++ /dev/null @@ -1,263 +0,0 @@ -"use client"; - -import { notifications } from "@mantine/notifications"; -import axios, { AxiosError } from "axios"; -import React, { useState } from "react"; - -const ComplaintForm: React.FC = () => { - const [category, setCategory] = useState(""); - const [description, setDescription] = useState(""); - const [additionalFields, setAdditionalFields] = useState([]); - const [additionalFieldValues, setAdditionalFieldValues] = useState>({}); - const [message, setMessage] = useState(""); - - const handleCategoryChange = (e: React.ChangeEvent) => { - const selectedCategory = e.target.value; - setCategory(selectedCategory); - setDescription(""); // Reset description when category changes - setAdditionalFields([]); - setAdditionalFieldValues({}); - }; - - const handleDescriptionClick = () => { - if (!category) { - alert("Please select the Category of Complaint first."); - } - }; - - const handleDescriptionChange = (e: React.ChangeEvent) => { - if (!category) { - setDescription(""); // Prevent changing description without category - return; - } - - const selectedDescription = e.target.value; - setDescription(selectedDescription); - - // Add additional fields for specific descriptions - if (selectedDescription === "Transaction Issue") { - setAdditionalFields([ - "Debit Card", - "Transaction Amount", - "Transaction Reference Number ", - "Transaction Date", - "ATM ID/Terminal ID", - ]); - } - else if(selectedDescription === "Fund Transfer failure"){ - setAdditionalFields([ - "Transaction Amount", - "Transaction ID/Transaction Reference Number", - "Transaction Date" - ]); - } - else { - setAdditionalFields([]); - } - }; - - const handleAdditionalFieldChange = (field: string, value: string) => { - if(field === "Transaction Amount" && isNaN(Number(value))) - { - alert ('Please enter a valid number'); - return; - } - if(field === "Debit Card" && isNaN(Number(value))) - { - alert ('Please Enter Valid Debit Card Number'); - return; - } - setAdditionalFieldValues((prevValues) => ({ - ...prevValues, - [field]: value, - })); - }; - - async function handleSubmit(e: React.FormEvent) { - e.preventDefault(); - for (const field of additionalFields) { - if (!additionalFieldValues[field]) { - alert(`Please fill in the ${field}`); - return; - } - } - if (!message.trim()) { - alert("Message field is required."); - return; - } - - const additionalInformation: string[] = []; - if (additionalFieldValues['ATM ID/Terminal ID']) { - additionalInformation.push(`ATM ID: ${additionalFieldValues['ATM ID/Terminal ID']}`); - } - if (additionalFieldValues['Debit Card']) { - additionalInformation.push(`Debit Card: ${additionalFieldValues['Debit Card']}`); - } - if (additionalFieldValues['Transaction Amount']) { - additionalInformation.push(`Transaction Amount: ${additionalFieldValues['Transaction Amount']}`); - } - if (additionalFieldValues['Transaction Reference Number ']) { - additionalInformation.push(`Transaction Reference Number : ${additionalFieldValues['Transaction Reference Number ']}`); - } - if (additionalFieldValues['Transaction Date']) { - additionalInformation.push(`Transaction Date: ${additionalFieldValues['Transaction Date']}`); - } - if(additionalFieldValues['Transaction ID/Transaction Reference Number']){ - additionalInformation.push(`Transaction ID/Transaction Reference Number: ${additionalFieldValues['Transaction ID/Transaction Reference Number']}`); - } - - const requestBody = { - summary: category, - description: description, - additional_information: additionalInformation.join(", "), - steps_to_reproduce: message, - }; - - try { - const response = await axios.post("/api/ticket", requestBody); - const data = await response.data; - alert(data.message); - window.location.reload(); - } - catch (error: AxiosError | any) { - notifications.show({ - color: 'red', - title: error.response.status, - message: error.response.data.message - }) - } - } - - return ( -
    -
    -

    Create New Ticket

    - - - - - - {additionalFields.map((field, index) => ( -
    - {field === "Transaction Date" ? ( - - ) : ( - - )} -
    - ))} -