85 lines
2.9 KiB
JavaScript
85 lines
2.9 KiB
JavaScript
import React from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
import AdminHeader from '@/components/admin/AdminHeader';
|
|
import QuarterlyWindows from '@/pages/Admin/configuration/QuarterlyWindows';
|
|
import IsicHsCodes from '@/pages/Admin/configuration/IsicHsCodes';
|
|
import UnitMaster from '@/pages/Admin/configuration/UnitMaster';
|
|
import AdminUsers from '@/pages/Admin/configuration/AdminUsers';
|
|
import CompanyProfile from '@/pages/Admin/configuration/CompanyProfile';
|
|
import CaretUp from '@/assets/images/caret-up.svg';
|
|
|
|
const Configuration = () => {
|
|
const tabs = ['Quarterly Windows', 'HS Codes', 'Unit Master', 'Admin Users', 'Company Profile'];
|
|
const [active, setActive] = React.useState(tabs[0]);
|
|
|
|
const Breadcrumbs = (
|
|
<nav className="mb-6 text-sm text-[#8F9299] flex items-center gap-3">
|
|
<Link to="/admin/dashboard" className="flex items-center gap-1 text-[#232528] hover:underline">
|
|
Dashboard
|
|
<img src={CaretUp} alt="Dashboard" className="h-3 w-3" />
|
|
</Link>
|
|
<span className="flex items-center gap-1 text-[#92722A] font-medium">
|
|
Configuration
|
|
<img src={CaretUp} alt="Configuration" className="h-3 w-3" />
|
|
</span>
|
|
</nav>
|
|
);
|
|
|
|
const PageHeader = (
|
|
<div className="w-full mb-6">
|
|
<div className="h-14 w-full border-b border-[#E5E7EB] flex items-end">
|
|
<div className="flex h-full items-end gap-6 overflow-x-auto">
|
|
{tabs.map((t) => (
|
|
<button
|
|
key={t}
|
|
type="button"
|
|
onClick={() => setActive(t)}
|
|
className={`pb-3 text-sm whitespace-nowrap border-b-2 cursor-pointer transition-colors ${
|
|
active === t
|
|
? 'text-[#92722A] border-[#92722A] font-medium'
|
|
: 'text-[#232528] border-transparent hover:text-[#92722A]'
|
|
}`}
|
|
>
|
|
{t}
|
|
</button>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
const isQuarterTab = active === 'Quarterly Windows';
|
|
const isIsicTab = active === 'HS Codes';
|
|
const isUnitMasterTab = active === 'Unit Master';
|
|
const isAdminTab = active === 'Admin Users';
|
|
const isCompanyProfileTab = active === 'Company Profile';
|
|
|
|
return (
|
|
<div className="min-h-screen bg-[#F7F7F7]">
|
|
<AdminHeader />
|
|
<div className="max-w-[1280px] mx-auto px-4 py-6">
|
|
{Breadcrumbs}
|
|
{PageHeader}
|
|
|
|
{isQuarterTab && <QuarterlyWindows />}
|
|
|
|
{isIsicTab && <IsicHsCodes />}
|
|
|
|
{isUnitMasterTab && <UnitMaster />}
|
|
|
|
{isAdminTab && <AdminUsers />}
|
|
|
|
{isCompanyProfileTab && <CompanyProfile />}
|
|
|
|
{!isQuarterTab && !isIsicTab && !isUnitMasterTab && !isAdminTab && !isCompanyProfileTab && (
|
|
<div className="bg-white w-full rounded-lg shadow-sm ring-1 ring-gray-200">
|
|
<div className="px-6 py-10 text-sm text-[#5F646D]">{active} content coming soon…</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Configuration;
|