shaily/KAFM-Project
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tab Constant is added

Browse Source
This commit is contained in:
Shaily Mishra
2026-07-29 14:39:55 +05:30
parent 7ce1f2705e
commit f9c3e7968b
28 changed files with 1299 additions and 1093 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
components/dashboard/intelligence/aiAndPredictive.tsx
View File

@@ -1,4 +1,4 @@
import { useState } from 'react';
import {
Zap,
AlertTriangle,
@@ -6,7 +6,7 @@ import {
Plus,
Sparkles,
ShieldAlert,
IndianRupee
} from "lucide-react";
import Button from "@/components/common/button";
import StatCard from "@/components/common/dashStatCard";
@@ -20,12 +20,12 @@ export default function AiPredictivePortal() {
{/* --- HEADER SECTION --- */}
<div className="flex flex-col md:flex-row md:items-start md:justify-between gap-4 mb-6">
<div>
<div className="flex items-center gap-2 text-[10px] font-bold tracking-widest uppercase font-mono">
<div className="flex items-center gap-2 text-[12px] font-bold tracking-widest uppercase font-mono">
<span className="text-teal-400">Apple One — HQ Tower</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">INTELLIGENCE</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">AI</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">INTELLIGENCE</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">AI</span>
</div>
<h1 className="text-2xl font-bold text-white tracking-tight mt-2">
AI & predictive intelligence

15
components/dashboard/intelligence/aiHelpDesk.tsx
View File

@@ -6,7 +6,7 @@ import {
ReceiptIndianRupee,
} from "lucide-react";
import InfoBanner from "@/components/common/infoBanner";
import Button from "@/components/common/button";
import NavigationTabs from "@/components/common/tabs";
@@ -15,7 +15,8 @@ import { useState } from "react";
import StatCard from "@/components/common/dashStatCard";
import { Card } from "@/components/common/cardWrapper";
import { CardHeader } from "@/components/common/cardHeader";
import { aiHelpdeskTabs, HANDLES_DATA, LIVE_ACTIVITIES } from "@/constants/constant";
import { HANDLES_DATA, LIVE_ACTIVITIES } from "@/constants/constant";
import { aiHelpdeskTabs } from "@/constants/tabConstant";
// Sample mock data for Agent Activity
@@ -27,12 +28,12 @@ export default function AiHelpdeskPortal() {
{/* --- HEADER SECTION WITH BUTTONS --- */}
<div className="flex flex-col md:flex-row md:items-start md:justify-between gap-4 mb-6">
<div>
<div className="flex items-center gap-2 text-[10px] font-bold tracking-widest text-slate-500 uppercase font-mono">
<div className="flex items-center gap-2 text-[12px] font-bold tracking-widest text-slate-500 uppercase font-mono">
<span className="text-teal-400">Apple One — HQ Tower</span>
<span>•</span>
<span className="text-slate-500">INTELLIGENCE</span>
<span>•</span>
<span className="text-slate-500">AI HELPDESK</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">INTELLIGENCE</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">AI HELPDESK</span>
</div>
<h1 className="text-2xl font-bold text-white tracking-tight mt-2">

16
components/dashboard/intelligence/assetHealth.tsx
View File

@@ -4,17 +4,13 @@ import {
AlertTriangle,
Activity,
Plus,
Sparkles,
ShieldAlert,
IndianRupee,
Clock,
ShieldCheck
} from "lucide-react";
import Button from "@/components/common/button";
import StatCard from "@/components/common/dashStatCard";
import InfoBanner from '@/components/common/infoBanner';
import { Card } from '@/components/common/cardWrapper'; // Assuming Card wrapper location
import { CardHeader } from '@/components/common/cardHeader'; // Assuming CardHeader location
import Table from '@/components/common/dataTable';
import { assetHealthheaders, assetHealthrows } from '@/constants/tabledata';
@@ -24,12 +20,12 @@ export default function AssetHealthPortal() {
{/* --- HEADER SECTION --- */}
<div className="flex flex-col md:flex-row md:items-start md:justify-between gap-4 mb-6">
<div>
<div className="flex items-center gap-2 text-[10px] font-bold tracking-widest uppercase font-mono">
<div className="flex items-center gap-2 text-[12px] font-bold tracking-widest uppercase font-mono">
<span className="text-teal-400">Apple One — HQ Tower</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">INTELLIGENCE</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">ASSET HEALTH</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">INTELLIGENCE</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">ASSET HEALTH</span>
</div>
<h1 className="text-2xl font-bold text-white tracking-tight mt-2">
Asset health & reliability

13
components/dashboard/intelligence/connectedAssets.tsx
View File

@@ -12,8 +12,7 @@ import StatCard from "@/components/common/dashStatCard";
import Table from '@/components/common/dataTable';
import NavigationTabs from '@/components/common/tabs';
import InfoBanner from '@/components/common/infoBanner';
import { connectedassettabs } from '@/constants/constant';
import { connectedassettabs } from '@/constants/tabConstant';
import { connectedassetheaders, connectedassetrows } from '@/constants/tabledata';
export default function ConnectedAssetPortal() {
@@ -24,12 +23,12 @@ export default function ConnectedAssetPortal() {
{/* --- HEADER SECTION --- */}
<div className="flex flex-col md:flex-row md:items-start md:justify-between gap-4 mb-6">
<div>
<div className="flex items-center gap-2 text-[10px] font-bold tracking-widest uppercase font-mono">
<div className="flex items-center gap-2 text-[12px] font-bold tracking-widest uppercase font-mono">
<span className="text-teal-400">Apple One — HQ Tower</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">INTELLIGENCE</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">CONNECTED ASSETS</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">INTELLIGENCE</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">CONNECTED ASSETS</span>
</div>
<h1 className="text-2xl font-bold text-white tracking-tight mt-2">
Connected refrigeration & HVAC

101
components/dashboard/intelligence/connectedOps.tsx
View File

@@ -4,7 +4,7 @@ import {
Globe
} from "lucide-react";
import { SATISFACTION_DRIVERS, TICKETS_DATA } from "@/constants/constant";
import Button from "@/components/common/button";
import InfoBanner from "@/components/common/infoBanner";
@@ -13,95 +13,10 @@ import { Card } from "@/components/common/cardWrapper";
import { CardHeader } from "@/components/common/cardHeader";
import Table from "@/components/common/dataTable";
import { connectedheaders, connectedrows } from "@/constants/tabledata";
import { LIVE_FEED, RISK_RADAR_ITEMS, STAT_CARDS_DATA, VENDOR_PERFORMANCE } from "@/constants/constant";
// Custom Stat Card Data matching the UI image exactly
const STAT_CARDS_DATA = [
{
title: "SLA ADHERENCE",
value: "90%",
subtext: "target 90% · automated tracking",
progress: 90,
color: "bg-[#00c985]", // Vibrant emerald green
valueColor: "text-[#00c985]",
},
{
title: "AVG WO RESOLUTION",
value: "22.4 h",
subtext: "target < 24 h · portfolio median",
progress: 93,
color: "bg-[#2dd4bf]", // Mint / Teal
valueColor: "text-white",
},
{
title: "MANUAL DATA ENTRY",
value: "-80%",
subtext: "agent-captured requests & readings",
progress: 80,
color: "bg-[#2dd4bf]", // Mint / Teal
valueColor: "text-[#2dd4bf]",
},
{
title: "REPORTING EFFORT",
value: "-75%",
subtext: "metrics ready for review — no compiling",
progress: 75,
color: "bg-[#2dd4bf]", // Mint / Teal
valueColor: "text-[#2dd4bf]",
},
];
// Data for Risk Radar
const RISK_RADAR_ITEMS = [
{
title: "Coastal One · vendor gap",
desc: "HVAC vendor completion rate fell to 61% — 8 PPMs at risk of slipping this month. Backup vendor suggested.",
tag: "Escalates in ~6 days",
tagColor: "text-rose-400",
dotColor: "bg-rose-500",
action: "Assign backup",
},
{
title: "Lakeside · SLA drift",
desc: "P2 response times trending +18% over 3 weeks; correlated with night-shift staffing.",
tag: "Breach risk · next week",
tagColor: "text-amber-400",
dotColor: "bg-amber-400",
action: "Adjust roster",
},
{
title: "Monsoon readiness",
desc: "4 of 11 waterproofing checks pending across portfolio with rains forecast in 10 days.",
tag: "Window closing",
tagColor: "text-amber-400",
dotColor: "bg-amber-400",
action: "Schedule now",
},
{
title: "Spares shortfall",
desc: "AHU belt stock below reorder level at 2 sites; next PPM cycle consumes remaining stock.",
tag: "3 weeks of stock left",
tagColor: "text-sky-400",
dotColor: "bg-sky-400",
action: "Raise PO",
},
];
// Data for Vendor Performance
const VENDOR_PERFORMANCE = [
{ name: "CoolServ HVAC", score: 94, barColor: "bg-emerald-400" },
{ name: "Apex Elevators", score: 91, barColor: "bg-emerald-400" },
{ name: "SecureWatch", score: 86, barColor: "bg-emerald-400" },
{ name: "AquaPure", score: 82, barColor: "bg-amber-400" },
{ name: "GreenScape", score: 61, barColor: "bg-rose-400" },
];
// Data for Live Context Feed
const LIVE_FEED = [
{ time: "now", text: "Vendor CoolServ acknowledged P1 · Chiller-02 — tenant portal updated" },
{ time: "4 min", text: "Energy spike at Lakeside auto-linked to AHU-07 alert" },
{ time: "11 min", text: "Coastal One WO-1221 completed · SLA met · invoice draft created" },
{ time: "26 min", text: "Tenant satisfaction pulse: 4.4 ★ this week (+0.2)" },
];
export default function ConnectedOpsPortal() {
return (
@@ -110,15 +25,15 @@ export default function ConnectedOpsPortal() {
{/* Page Header Section */}
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4">
<div>
<div className="flex items-center gap-2 text-[11px] font-medium tracking-wider text-[#3de0c4]">
<div className="flex items-center gap-2 text-[12px] font-medium tracking-wider text-[#3de0c4]">
<span>APPLE ONE — HQ TOWER</span>
<span className="text-[#3a495e]">•</span>
<span className="text-[#596980]">INTELLIGENCE</span>
<span className="text-[#3a495e]">•</span>
<span className="text-[#596980]">CONNECTED OPS</span>
<span className="text-gray-600">•</span>
<span className="text-gray-400">INTELLIGENCE</span>
<span className="text-gray-600">•</span>
<span className="text-gray-400">CONNECTED OPS</span>
</div>
<h1 className="text-3xl font-bold text-white tracking-tight mt-1.5">Connected operations</h1>
<p className="mt-2 text-sm text-[#7e8c9f] max-w-2xl leading-relaxed">
<p className="mt-2 text-sm text-[#7e8c9f] font-medium max-w-2xl leading-relaxed">
Every team, vendor and system on the same live context — portfolio-wide work orders, costs, SLAs and vendor performance in one place, with risks flagged before they escalate.
</p>
</div>

12
components/dashboard/intelligence/energybenchmarking.tsx
View File

@@ -6,10 +6,8 @@ import {
Database,
Sliders,
Download,
Sparkles
} from "lucide-react";
import { SATISFACTION_DRIVERS, TICKETS_DATA } from "@/constants/constant";
import StatCard from "../../common/dashStatCard";
import Button from "@/components/common/button";
import InfoBanner from "@/components/common/infoBanner";
@@ -27,12 +25,12 @@ export default function EnergyBenchmarkingPortal() {
{/* Page Header Section */}
<div className="flex flex-col md:flex-row md:items-center justify-between gap-4">
<div>
<div className="flex items-center gap-2 text-[11px] font-medium tracking-wider text-[#3de0c4]">
<div className="flex items-center gap-2 text-[12px] font-medium tracking-wider text-[#3de0c4]">
<span>APPLE ONE — HQ TOWER</span>
<span className="text-[#3a495e]">•</span>
<span className="text-[#596980]">INTELLIGENCE</span>
<span className="text-[#3a495e]">•</span>
<span className="text-[#596980]">BENCHMARKING</span>
<span className="text-gray-600">•</span>
<span className="text-gray-400">INTELLIGENCE</span>
<span className="text-gray-600">•</span>
<span className="text-gray-400">BENCHMARKING</span>
</div>
<h1 className="text-3xl font-bold text-white tracking-tight mt-1.5">Portfolio energy benchmarking</h1>
<p className="mt-2 text-sm text-[#7e8c9f] max-w-2xl leading-relaxed">

23
components/dashboard/intelligence/gpsTracking.tsx
View File

@@ -16,17 +16,10 @@ import { Card } from "@/components/common/cardWrapper";
import { CardHeader } from "@/components/common/cardHeader";
import InfoBanner from '@/components/common/infoBanner';
import { gpsTrackingtabs } from '@/constants/constant';
import { STAFF_DATA } from '@/constants/constant';
import { gpsTrackingtabs } from '@/constants/tabConstant';
// Staff Table Data
const STAFF_DATA = [
{ name: "Ravi Kumar", role: "M&E Technician", zone: "Chiller plant", inTime: "08:02", hrs: "6.4", status: "ON-SITE", statusType: "success" },
{ name: "Sana Iqbal", role: "HVAC Engineer", zone: "AHU room L7", inTime: "08:15", hrs: "6.1", status: "ON-SITE", statusType: "success" },
{ name: "Mohan D.", role: "Electrician", zone: "En route", inTime: "—", hrs: "0", status: "EN-ROUTE", statusType: "warning" },
{ name: "Lakshmi N.", role: "Housekeeping Lead", zone: "Lobby + L2", inTime: "07:48", hrs: "6.7", status: "ON-SITE", statusType: "success" },
{ name: "Arjun P.", role: "Plumber", zone: "Off-site", inTime: "—", hrs: "0", status: "OFF-SITE", statusType: "neutral" },
{ name: "Fatima R.", role: "BMS Operator", zone: "Control room", inTime: "06:55", hrs: "7.6", status: "ON-SITE", statusType: "success" },
];
export default function GpsTrackingPortal() {
const [activeTab, setActiveTab] = useState<string>('Live tracking');
@@ -36,12 +29,12 @@ export default function GpsTrackingPortal() {
{/* --- HEADER SECTION --- */}
<div className="flex flex-col md:flex-row md:items-start md:justify-between gap-4 mb-6">
<div>
<div className="flex items-center gap-2 text-[10px] font-bold tracking-widest uppercase font-mono">
<div className="flex items-center gap-2 text-[12px] font-bold tracking-widest uppercase font-mono">
<span className="text-teal-400">Apple One — HQ Tower</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">INTELLIGENCE</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">GPS TRACKING</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">INTELLIGENCE</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">GPS TRACKING</span>
</div>
<h1 className="text-2xl font-bold text-white tracking-tight mt-2">
GPS staff tracking & geo-fencing

44
components/dashboard/intelligence/sustainability.tsx
View File

@@ -6,8 +6,6 @@ import {
Star,
BarChart2,
Plus,
ShieldCheck,
Clock
} from "lucide-react";
import Button from "@/components/common/button";
import StatCard from "@/components/common/dashStatCard";
@@ -21,25 +19,11 @@ import { CardHeader } from "@/components/common/cardHeader";
import BarChart from "@/components/charts/barchart";
import InfoBanner from '@/components/common/infoBanner';
import { sustainabilitytabs } from '@/constants/constant';
import { EMISSION_SOURCES, energyData, } from '@/constants/constant';
import { sustainabilitytabs } from '@/constants/tabConstant';
// Sample Bar Chart Data for Carbon Emissions
const CARBON_EMISSIONS_DATA = [
{ month: 'Jan', height: 'h-32' },
{ month: 'Feb', height: 'h-32' },
{ month: 'Mar', height: 'h-32' },
{ month: 'Apr', height: 'h-32' },
{ month: 'May', height: 'h-32' },
{ month: 'Jun', height: 'h-28' },
];
// Emission Sources Progress Data
const EMISSION_SOURCES = [
{ name: "Purchased electricity", percentage: "58%", width: "w-[58%]", color: "bg-sky-400" },
{ name: "DG / fuel combustion", percentage: "21%", width: "w-[21%]", color: "bg-amber-400" },
{ name: "Refrigerants (fugitive)", percentage: "12%", width: "w-[12%]", color: "bg-rose-400" },
{ name: "Water & waste", percentage: "9%", width: "w-[9%]", color: "bg-slate-400" },
];
export default function SustainabilityPortal() {
const [activeTab, setActiveTab] = useState<string>('ESG Data Hub');
@@ -49,12 +33,12 @@ export default function SustainabilityPortal() {
{/* --- HEADER SECTION --- */}
<div className="flex flex-col md:flex-row md:items-start md:justify-between gap-4 mb-6">
<div>
<div className="flex items-center gap-2 text-[10px] font-bold tracking-widest uppercase font-mono">
<div className="flex items-center gap-2 text-[12px] font-bold tracking-widest uppercase font-mono">
<span className="text-teal-400">Apple One — HQ Tower</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">INTELLIGENCE</span>
<span className="text-slate-500">•</span>
<span className="text-slate-500">SUSTAINABILITY</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">INTELLIGENCE</span>
<span className="text-slate-600">•</span>
<span className="text-slate-400">SUSTAINABILITY</span>
</div>
<h1 className="text-2xl font-bold text-white tracking-tight mt-2">
ESG One — sustainability platform
@@ -140,7 +124,7 @@ export default function SustainabilityPortal() {
{/* --- ESG CARDS SECTION BELOW TABS --- */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
{/* Environmental Card */}
<Card className="bg-[#08121e] border-[#132235] p-5 rounded-xl">
<Card className=" p-5 ">
<CardHeader title="Environmental" subtitle="metered · live" />
<div className="mt-4 space-y-3.5 text-xs">
<div className="flex items-center justify-between">
@@ -175,7 +159,7 @@ export default function SustainabilityPortal() {
</Card>
{/* Social Card */}
<Card className="bg-[#08121e] border-[#132235] p-5 rounded-xl">
<Card className="p-5">
<CardHeader title="Social" subtitle="people & occupants" />
<div className="mt-4 space-y-3.5 text-xs">
<div className="flex items-center justify-between">
@@ -210,7 +194,7 @@ export default function SustainabilityPortal() {
</Card>
{/* Governance Card */}
<Card className="bg-[#08121e] border-[#132235] p-5 rounded-xl">
<Card className=" p-5 ">
<CardHeader title="Governance" subtitle="compliance & ethics" />
<div className="mt-4 space-y-3.5 text-xs">
<div className="flex items-center justify-between">
@@ -249,17 +233,17 @@ export default function SustainabilityPortal() {
<div className="grid grid-cols-1 lg:grid-cols-12 gap-4 mb-6">
{/* Left: Carbon Emissions BarChart */}
<div className="lg:col-span-7">
<Card className="bg-[#08121e] border-[#132235] p-5 rounded-xl h-full flex flex-col justify-between">
<Card className="p-5 h-full flex flex-col justify-between">
<CardHeader title="Carbon emissions · tCO₂e" subtitle="2026 · trending down" />
<div className="mt-6">
<BarChart data={CARBON_EMISSIONS_DATA} />
<BarChart data={energyData} />
</div>
</Card>
</div>
{/* Right: Emission Sources */}
<div className="lg:col-span-5">
<Card className="bg-[#08121e] border-[#132235] p-5 rounded-xl h-full flex flex-col justify-between">
<Card className=" h-full flex flex-col justify-between">
<CardHeader title="Emission sources" subtitle="drill down by site / meter" />
<div className="mt-5 space-y-4">
{EMISSION_SOURCES.map((source, idx) => (