added past due task page

2024-03-06 00:00:27 +01:00
parent 3a397aad86
commit bd59f26146
7 changed files with 250 additions and 37 deletions
@@ -0,0 +1,57 @@
+import React, { useState } from "react";
+import { Link } from "react-router-dom";
+import Layout from "../Partials/Layout";
+import CommonHead from "../UserHeader/CommonHead";
+import MyPastDueTaskTable from "./MyPastDueTaskTable";
+import CustomBreadcrumb from "../Breadcrumb/CustomBreadcrumb";
+import LoadingSpinner from "../Spinners/LoadingSpinner";
+import { useSelector } from "react-redux";
+
+export default function MyPastDueTasks(props) {
+
+  const { userDetails: { account_type } } = useSelector((state) => state?.userDetails); // Gets user details
+
+  return (
+    <Layout>
+      {account_type == 'FULL' &&
+        <CommonHead commonHeadData={props.commonHeadData} />
+      }
+      <div className="notification-page w-full mb-10">
+        <div className="notification-wrapper w-full">
+          {/* heading */}
+          {account_type == 'FULL' ?
+          <div className="sm:flex justify-between items-center mb-6">
+            <div className="mb-5 sm:mb-0">
+              <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+                <span
+                >
+                  Past Due Task(s)
+                </span>
+              </h1>
+            </div>
+          </div>
+          :
+          <div className="mb-5">
+            <CustomBreadcrumb 
+            title = {'Past Due Task(s)'}
+            breadcrumb={
+                [
+                { link: "/", title: "Home" },
+                { link: "/pastdue", title: "Past Due", active: true},
+                ]
+            }
+            />
+          </div>
+          }
+          {props.loading ?
+          <div className="w-full flex justify-center items-center bg-white rounded-2xl">
+            <LoadingSpinner size='10' color='sky-blue' height='h-[20rem]' />
+          </div>
+          :
+          <MyPastDueTaskTable MyJobList={props.MyJobList} />
+          }
+        </div>
+      </div>
+    </Layout>
+  );
+}