add ComingSoonPage component and integrate it into EmployeeProfile for placeholder content
This commit is contained in:
parent
0e7088b4d4
commit
1019e9a32f
24
src/pages/Misc/ComingSoonPage.jsx
Normal file
24
src/pages/Misc/ComingSoonPage.jsx
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import { Link } from 'react-router-dom'
|
||||||
|
|
||||||
|
export const ComingSoonPage = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="misc-wrapper">
|
||||||
|
<h2 className="mb-2 mx-2">Coming Soon!</h2>
|
||||||
|
<p className="mb-4 mx-2">We're currently working on this feature and will have it ready shortly.
|
||||||
|
Thank you for your patience!</p>
|
||||||
|
<div className="mt-4">
|
||||||
|
<img
|
||||||
|
src="../assets/img/illustrations/girl-doing-yoga-light.png"
|
||||||
|
alt="girl-doing-yoga-light"
|
||||||
|
aria-label="Girl doing yoga light"
|
||||||
|
width="500"
|
||||||
|
className="img-fluid"
|
||||||
|
data-app-dark-img="illustrations/girl-doing-yoga-dark.png"
|
||||||
|
data-app-light-img="illustrations/girl-doing-yoga-light.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
@ -8,7 +8,7 @@ import { getCachedData } from "../../slices/apiDataManager";
|
|||||||
import { useEmployeeProfile, useEmployees, useEmployeesByProject } from "../../hooks/useEmployees";
|
import { useEmployeeProfile, useEmployees, useEmployeesByProject } from "../../hooks/useEmployees";
|
||||||
import { useSelector } from "react-redux";
|
import { useSelector } from "react-redux";
|
||||||
import EmployeeRepository from "../../repositories/EmployeeRepository";
|
import EmployeeRepository from "../../repositories/EmployeeRepository";
|
||||||
|
import { ComingSoonPage } from "../Misc/ComingSoonPage";
|
||||||
|
|
||||||
const EmployeeProfile = () => {
|
const EmployeeProfile = () => {
|
||||||
|
|
||||||
@ -56,49 +56,32 @@ const EmployeeProfile = () => {
|
|||||||
switch (activePill) {
|
switch (activePill) {
|
||||||
case "account": {
|
case "account": {
|
||||||
return (
|
return (
|
||||||
<div className="row">
|
<>
|
||||||
{/* <div className="col-xl-4 col-lg-5 col-md-5"> */}
|
<ComingSoonPage/>
|
||||||
<p>Account</p>
|
</>
|
||||||
{/* </div> */}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
case "attendance": {
|
case "attendance": {
|
||||||
return (
|
return (
|
||||||
<div className="row">
|
<>
|
||||||
<div className="col-lg-12 col-xl-12">
|
<ComingSoonPage/>
|
||||||
{/* Teams */}
|
</>
|
||||||
<p>attendance component</p>
|
|
||||||
{/* Teams */}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "activities": {
|
case "activities": {
|
||||||
return (
|
return (
|
||||||
<p>activites components</p>
|
<>
|
||||||
|
<ComingSoonPage/>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
default:
|
default:
|
||||||
return <div className="misc-wrapper">
|
return <>
|
||||||
<h2 className="mb-2 mx-2">Coming Soon!</h2>
|
<ComingSoonPage/>
|
||||||
<p className="mb-4 mx-2">We're currently working on this feature and will have it ready shortly.
|
</>;
|
||||||
Thank you for your patience!</p>
|
|
||||||
<div className="mt-4">
|
|
||||||
<img
|
|
||||||
src="../assets/img/illustrations/girl-doing-yoga-light.png"
|
|
||||||
alt="girl-doing-yoga-light"
|
|
||||||
aria-label="Girl doing yoga light"
|
|
||||||
width="500"
|
|
||||||
className="img-fluid"
|
|
||||||
data-app-dark-img="illustrations/girl-doing-yoga-dark.png"
|
|
||||||
data-app-light-img="illustrations/girl-doing-yoga-light.png" />
|
|
||||||
</div>
|
|
||||||
</div>;
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user