826 lines
18 KiB
JavaScript
826 lines
18 KiB
JavaScript
import React, { useEffect, useRef } from "react";
|
|
import { PmsGrid } from "./index";
|
|
import { initPopover } from "./GridService";
|
|
import PmsHeaderOption from "./PmsHeaderOption";
|
|
|
|
/**
|
|
* CIVIL BOQ / INVENTORY DEMO DATA
|
|
* Each row = BOQ item, grouped by "Category"
|
|
*/
|
|
const boqData = [
|
|
{
|
|
id: 1,
|
|
category: "Concrete Works",
|
|
itemCode: "C-001",
|
|
description: "M20 Concrete for foundation",
|
|
unit: "Cum",
|
|
quantity: 120,
|
|
rate: 5200,
|
|
site: "Green City - Tower A",
|
|
vendor: "UltraTech",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 2,
|
|
category: "Concrete Works",
|
|
itemCode: "C-002",
|
|
description: "M25 Concrete for columns",
|
|
unit: "Cum",
|
|
quantity: 80,
|
|
rate: 5600,
|
|
site: "Green City - Tower B",
|
|
vendor: "ACC",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 3,
|
|
category: "Steel Reinforcement",
|
|
itemCode: "S-101",
|
|
description: "TMT Bars Fe500 (10mm)",
|
|
unit: "MT",
|
|
quantity: 15,
|
|
rate: 64000,
|
|
site: "Skyline Heights - Wing C",
|
|
vendor: "JSW Steel",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 4,
|
|
category: "Steel Reinforcement",
|
|
itemCode: "S-102",
|
|
description: "TMT Bars Fe500 (16mm)",
|
|
unit: "MT",
|
|
quantity: 25,
|
|
rate: 64500,
|
|
site: "Skyline Heights - Wing D",
|
|
vendor: "TATA Steel",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 5,
|
|
category: "Masonry Works",
|
|
itemCode: "M-001",
|
|
description: "Brick Masonry 230mm thick wall",
|
|
unit: "Sqm",
|
|
quantity: 280,
|
|
rate: 900,
|
|
site: "Sunshine Plaza",
|
|
vendor: "Shree Bricks",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 6,
|
|
category: "Masonry Works",
|
|
itemCode: "M-002",
|
|
description: "Block Masonry AAC 200mm wall",
|
|
unit: "Sqm",
|
|
quantity: 240,
|
|
rate: 1100,
|
|
site: "Green City",
|
|
vendor: "Ambuja Blocks",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 7,
|
|
category: "Plastering Works",
|
|
itemCode: "P-001",
|
|
description: "Internal Plaster 12mm thick",
|
|
unit: "Sqm",
|
|
quantity: 1200,
|
|
rate: 250,
|
|
site: "Skyline Heights",
|
|
vendor: "L&T Finishes",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 8,
|
|
category: "Plastering Works",
|
|
itemCode: "P-002",
|
|
description: "External Plaster 20mm thick",
|
|
unit: "Sqm",
|
|
quantity: 800,
|
|
rate: 320,
|
|
site: "Sunshine Plaza",
|
|
vendor: "Hindustan Plaster",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 9,
|
|
category: "Flooring Works",
|
|
itemCode: "F-001",
|
|
description: "Vitrified Tiles 600x600mm",
|
|
unit: "Sqm",
|
|
quantity: 600,
|
|
rate: 650,
|
|
site: "Green City - Clubhouse",
|
|
vendor: "Kajaria",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 10,
|
|
category: "Flooring Works",
|
|
itemCode: "F-002",
|
|
description: "Granite Flooring 20mm thick",
|
|
unit: "Sqm",
|
|
quantity: 300,
|
|
rate: 1250,
|
|
site: "Skyline Heights - Lobby",
|
|
vendor: "Classic Stone",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 11,
|
|
category: "Electrical Works",
|
|
itemCode: "E-001",
|
|
description: "PVC Conduit 25mm dia",
|
|
unit: "Mtr",
|
|
quantity: 1500,
|
|
rate: 45,
|
|
site: "Eco Towers",
|
|
vendor: "Finolex",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 12,
|
|
category: "Electrical Works",
|
|
itemCode: "E-002",
|
|
description: "Copper Wire 4 sqmm",
|
|
unit: "Mtr",
|
|
quantity: 2000,
|
|
rate: 65,
|
|
site: "Skyline Heights",
|
|
vendor: "Polycab",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 13,
|
|
category: "Plumbing Works",
|
|
itemCode: "PL-001",
|
|
description: "CPVC Pipe 25mm dia",
|
|
unit: "Mtr",
|
|
quantity: 1000,
|
|
rate: 120,
|
|
site: "Green City - Tower C",
|
|
vendor: "Astral Pipes",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 14,
|
|
category: "Plumbing Works",
|
|
itemCode: "PL-002",
|
|
description: "UPVC Pipe 40mm dia",
|
|
unit: "Mtr",
|
|
quantity: 800,
|
|
rate: 100,
|
|
site: "Sunshine Plaza",
|
|
vendor: "Supreme Industries",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 15,
|
|
category: "Painting Works",
|
|
itemCode: "PA-001",
|
|
description: "Interior Emulsion Paint",
|
|
unit: "Ltr",
|
|
quantity: 500,
|
|
rate: 180,
|
|
site: "Skyline Heights",
|
|
vendor: "Asian Paints",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 16,
|
|
category: "Painting Works",
|
|
itemCode: "PA-002",
|
|
description: "Exterior Weatherproof Paint",
|
|
unit: "Ltr",
|
|
quantity: 400,
|
|
rate: 220,
|
|
site: "Green City - Tower D",
|
|
vendor: "Berger Paints",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 17,
|
|
category: "Waterproofing Works",
|
|
itemCode: "W-001",
|
|
description: "Cementitious Coating 2 layers",
|
|
unit: "Sqm",
|
|
quantity: 350,
|
|
rate: 480,
|
|
site: "Sunshine Plaza",
|
|
vendor: "Dr. Fixit",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 18,
|
|
category: "Waterproofing Works",
|
|
itemCode: "W-002",
|
|
description:
|
|
"Polyurethane Waterproofing Membrane Polyurethane Waterproofing Membrane",
|
|
unit: "Sqm",
|
|
quantity: 200,
|
|
rate: 850,
|
|
site: "Green City - Podium",
|
|
vendor: "Pidilite",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 19,
|
|
category: "HVAC Works",
|
|
itemCode: "H-001",
|
|
description: "Ducting for AHU system",
|
|
unit: "Sqm",
|
|
quantity: 250,
|
|
rate: 2100,
|
|
site: "Skyline Heights - Basement",
|
|
vendor: "Blue Star",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 20,
|
|
category: "HVAC Works",
|
|
itemCode: "H-002",
|
|
description: "VRF Indoor Unit Installation",
|
|
unit: "Nos",
|
|
quantity: 30,
|
|
rate: 42000,
|
|
site: "Eco Towers",
|
|
vendor: "Daikin",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 21,
|
|
category: "Plumbing Works",
|
|
itemCode: "PL-003",
|
|
description: "CP Fittings - Wash Basin Mixer",
|
|
unit: "Nos",
|
|
quantity: 50,
|
|
rate: 950,
|
|
site: "Skyline Heights",
|
|
vendor: "Jaquar",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 22,
|
|
category: "Electrical Works",
|
|
itemCode: "E-003",
|
|
description: "LED Downlight 12W",
|
|
unit: "Nos",
|
|
quantity: 120,
|
|
rate: 750,
|
|
site: "Green City - Tower B",
|
|
vendor: "Philips",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 23,
|
|
category: "Flooring Works",
|
|
itemCode: "F-003",
|
|
description: "Wooden Flooring 12mm laminate",
|
|
unit: "Sqm",
|
|
quantity: 150,
|
|
rate: 1450,
|
|
site: "Sunshine Plaza - Office",
|
|
vendor: "Pergo",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 24,
|
|
category: "Concrete Works",
|
|
itemCode: "C-003",
|
|
description: "PCC 1:4:8 flooring",
|
|
unit: "Cum",
|
|
quantity: 60,
|
|
rate: 4800,
|
|
site: "Eco Towers",
|
|
vendor: "RMC Readymix",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 25,
|
|
category: "Masonry Works",
|
|
itemCode: "M-003",
|
|
description: "Stone masonry in foundation",
|
|
unit: "Cum",
|
|
quantity: 45,
|
|
rate: 3500,
|
|
site: "Green City - Tower C",
|
|
vendor: "Shree Bricks",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 26,
|
|
category: "Carpentry Works",
|
|
itemCode: "CP-001",
|
|
description: "Flush Door with Laminate Finish",
|
|
unit: "Nos",
|
|
quantity: 80,
|
|
rate: 6500,
|
|
site: "Skyline Heights",
|
|
vendor: "Greenply",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 27,
|
|
category: "Carpentry Works",
|
|
itemCode: "CP-002",
|
|
description: "Modular Kitchen Cabinets",
|
|
unit: "Set",
|
|
quantity: 25,
|
|
rate: 42000,
|
|
site: "Sunshine Plaza",
|
|
vendor: "Godrej Interio",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 28,
|
|
category: "Glazing Works",
|
|
itemCode: "G-001",
|
|
description: "Aluminium Window Frame with Glass",
|
|
unit: "Sqm",
|
|
quantity: 180,
|
|
rate: 1850,
|
|
site: "Green City - Tower D",
|
|
vendor: "Saint Gobain",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 29,
|
|
category: "Glazing Works",
|
|
itemCode: "G-002",
|
|
description: "Toughened Glass Door 12mm",
|
|
unit: "Sqm",
|
|
quantity: 60,
|
|
rate: 2750,
|
|
site: "Skyline Heights - Lobby",
|
|
vendor: "Modiguard",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 30,
|
|
category: "External Development",
|
|
itemCode: "ED-001",
|
|
description: "Paver Block 60mm thick",
|
|
unit: "Sqm",
|
|
quantity: 950,
|
|
rate: 380,
|
|
site: "Sunshine Plaza",
|
|
vendor: "Ultra Pavers",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 31,
|
|
category: "External Development",
|
|
itemCode: "ED-002",
|
|
description: "Kerb Stone 300x300mm",
|
|
unit: "Rm",
|
|
quantity: 200,
|
|
rate: 240,
|
|
site: "Green City - Parking Area",
|
|
vendor: "L&T Infra",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 32,
|
|
category: "Electrical Works",
|
|
itemCode: "E-004",
|
|
description: "Distribution Board with MCB",
|
|
unit: "Nos",
|
|
quantity: 25,
|
|
rate: 6200,
|
|
site: "Skyline Heights",
|
|
vendor: "Legrand",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 33,
|
|
category: "Plastering Works",
|
|
itemCode: "P-003",
|
|
description: "Ceiling POP Finish",
|
|
unit: "Sqm",
|
|
quantity: 950,
|
|
rate: 210,
|
|
site: "Green City - Tower A",
|
|
vendor: "L&T Finishes",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 34,
|
|
category: "Painting Works",
|
|
itemCode: "PA-003",
|
|
description: "Metal Primer + Enamel Paint",
|
|
unit: "Ltr",
|
|
quantity: 350,
|
|
rate: 160,
|
|
site: "Sunshine Plaza - Basement",
|
|
vendor: "Nerolac Paints",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 35,
|
|
category: "HVAC Works",
|
|
itemCode: "H-003",
|
|
description: "Duct Insulation 50mm thick",
|
|
unit: "Sqm",
|
|
quantity: 120,
|
|
rate: 540,
|
|
site: "Eco Towers",
|
|
vendor: "Blue Star",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 36,
|
|
category: "Plumbing Works",
|
|
itemCode: "PL-004",
|
|
description: "Overhead Water Tank Installation",
|
|
unit: "Nos",
|
|
quantity: 3,
|
|
rate: 45000,
|
|
site: "Green City - Tower B",
|
|
vendor: "Sintex",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 37,
|
|
category: "Electrical Works",
|
|
itemCode: "E-005",
|
|
description: "Earthing Pit with GI Plate",
|
|
unit: "Nos",
|
|
quantity: 6,
|
|
rate: 9500,
|
|
site: "Skyline Heights",
|
|
vendor: "KEI",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 38,
|
|
category: "Concrete Works",
|
|
itemCode: "C-004",
|
|
description: "M30 Concrete for beams",
|
|
unit: "Cum",
|
|
quantity: 95,
|
|
rate: 5800,
|
|
site: "Eco Towers - Basement",
|
|
vendor: "RMC Readymix",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 39,
|
|
category: "Masonry Works",
|
|
itemCode: "M-004",
|
|
description: "Cement Mortar 1:4 plaster backing",
|
|
unit: "Sqm",
|
|
quantity: 700,
|
|
rate: 180,
|
|
site: "Skyline Heights - Wing E",
|
|
vendor: "Ambuja Blocks",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 40,
|
|
category: "Flooring Works",
|
|
itemCode: "F-004",
|
|
description: "Marble Flooring 20mm thick",
|
|
unit: "Sqm",
|
|
quantity: 260,
|
|
rate: 2100,
|
|
site: "Green City - Tower D",
|
|
vendor: "Classic Stone",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 41,
|
|
category: "Carpentry Works",
|
|
itemCode: "CP-003",
|
|
description: "Wardrobe with Laminate Finish",
|
|
unit: "Nos",
|
|
quantity: 40,
|
|
rate: 18500,
|
|
site: "Sunshine Plaza",
|
|
vendor: "Durian",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 42,
|
|
category: "Glazing Works",
|
|
itemCode: "G-003",
|
|
description: "Spider Glass Façade System",
|
|
unit: "Sqm",
|
|
quantity: 150,
|
|
rate: 3550,
|
|
site: "Eco Towers",
|
|
vendor: "Saint Gobain",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 43,
|
|
category: "Waterproofing Works",
|
|
itemCode: "W-003",
|
|
description: "Bituminous Membrane Layer 3mm",
|
|
unit: "Sqm",
|
|
quantity: 400,
|
|
rate: 620,
|
|
site: "Skyline Heights - Terrace",
|
|
vendor: "Dr. Fixit",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 44,
|
|
category: "External Development",
|
|
itemCode: "ED-003",
|
|
description: "RCC Drain Construction",
|
|
unit: "Rm",
|
|
quantity: 180,
|
|
rate: 950,
|
|
site: "Green City - Service Road",
|
|
vendor: "L&T Infra",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 45,
|
|
category: "Electrical Works",
|
|
itemCode: "E-006",
|
|
description: "Street Light Pole 9m",
|
|
unit: "Nos",
|
|
quantity: 25,
|
|
rate: 18500,
|
|
site: "Sunshine Plaza - Entry Road",
|
|
vendor: "Polycab",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 46,
|
|
category: "Painting Works",
|
|
itemCode: "PA-004",
|
|
description: "Texture Finish Coating",
|
|
unit: "Sqm",
|
|
quantity: 320,
|
|
rate: 480,
|
|
site: "Green City - Clubhouse",
|
|
vendor: "Asian Paints",
|
|
status: "In Progress",
|
|
},
|
|
{
|
|
id: 47,
|
|
category: "Flooring Works",
|
|
itemCode: "F-005",
|
|
description: "Epoxy Flooring 3mm thick",
|
|
unit: "Sqm",
|
|
quantity: 150,
|
|
rate: 850,
|
|
site: "Skyline Heights - Basement",
|
|
vendor: "Pidilite",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 48,
|
|
category: "Plumbing Works",
|
|
itemCode: "PL-005",
|
|
description: "Bathroom CP fittings set",
|
|
unit: "Set",
|
|
quantity: 40,
|
|
rate: 5400,
|
|
site: "Eco Towers",
|
|
vendor: "Hindware",
|
|
status: "Completed",
|
|
},
|
|
{
|
|
id: 49,
|
|
category: "Concrete Works",
|
|
itemCode: "C-005",
|
|
description: "Ready Mix M40 Concrete",
|
|
unit: "Cum",
|
|
quantity: 60,
|
|
rate: 6100,
|
|
site: "Green City - Tower E",
|
|
vendor: "ACC",
|
|
status: "Pending",
|
|
},
|
|
{
|
|
id: 50,
|
|
category: "External Development",
|
|
itemCode: "ED-004",
|
|
description: "Compound Wall RCC Precast",
|
|
unit: "Rm",
|
|
quantity: 300,
|
|
rate: 1750,
|
|
site: "Sunshine Plaza - Boundary",
|
|
vendor: "UltraTech",
|
|
status: "Completed",
|
|
},
|
|
];
|
|
|
|
/**
|
|
* COLUMN DEFINITIONS
|
|
*/
|
|
const boqColumns = [
|
|
{
|
|
key: "itemCode",
|
|
title: "Item Code",
|
|
sortable: true,
|
|
pinned: "left",
|
|
className: "text-start",
|
|
},
|
|
{
|
|
key: "description",
|
|
title: "Description",
|
|
sortable: true,
|
|
width: 300,
|
|
className: "text-start",
|
|
},
|
|
{
|
|
key: "category",
|
|
title: "Category",
|
|
sortable: true,
|
|
className: "text-start",
|
|
},
|
|
{ key: "unit", title: "Unit", width: 80, className: "text-ceter" },
|
|
{
|
|
key: "quantity",
|
|
title: "Qty",
|
|
sortable: true,
|
|
width: 100,
|
|
className: "text-cnter px-2",
|
|
},
|
|
{
|
|
key: "rate",
|
|
title: "Rate (₹)",
|
|
sortable: true,
|
|
width: 120,
|
|
className: "text-end",
|
|
render: (r) => <span>₹{r.rate.toLocaleString()}</span>,
|
|
},
|
|
{
|
|
key: "amount",
|
|
title: "Amount (₹)",
|
|
sortable: true,
|
|
width: 130,
|
|
className: "text-end",
|
|
render: (r) => (
|
|
<span className="fw-semibold text-end px-2 py-12">
|
|
₹{(r.quantity * r.rate).toLocaleString()}
|
|
</span>
|
|
),
|
|
aggregate: (vals) =>
|
|
"₹" + vals.reduce((sum, val) => sum + val, 0).toLocaleString(),
|
|
},
|
|
{
|
|
key: "vendor",
|
|
title: "Vendor",
|
|
sortable: true,
|
|
width: 180,
|
|
className: "text-start",
|
|
},
|
|
{
|
|
key: "site",
|
|
title: "Site Location",
|
|
sortable: true,
|
|
width: 200,
|
|
className: "text-start",
|
|
},
|
|
{
|
|
key: "status",
|
|
title: "Status",
|
|
sortable: true,
|
|
width: 120,
|
|
className: "text-center",
|
|
render: (r) => (
|
|
<span
|
|
className={`badge bg-label-${
|
|
r.status === "Completed"
|
|
? "success"
|
|
: r.status === "Pending"
|
|
? "warning"
|
|
: "info"
|
|
}`}
|
|
>
|
|
{r.status}
|
|
</span>
|
|
),
|
|
},
|
|
];
|
|
|
|
/**
|
|
* DEMO COMPONENT
|
|
*/
|
|
export default function DemoBOQGrid() {
|
|
useEffect(() => {
|
|
initPopover();
|
|
}, []);
|
|
const wrapperRef = useRef();
|
|
useEffect(() => {
|
|
if (!wrapperRef.current) return;
|
|
const ps = new PerfectScrollbar(wrapperRef.current, {
|
|
wheelPropagation: false,
|
|
suppressScrollX: false,
|
|
});
|
|
return () => ps.destroy();
|
|
}, []);
|
|
|
|
const container = document.getElementById("mainContainer");
|
|
const trigger = document.getElementById("dropdownBtn");
|
|
const dropdown = document.getElementById("dropdownMenu");
|
|
|
|
return (
|
|
<div className="container-fluid py-3">
|
|
<div className="card p-3">
|
|
<div id="mainContainer" class="container-box">
|
|
<button id="dropdownBtn" class="btn">
|
|
Open Dropdown
|
|
</button>
|
|
|
|
<div id="dropdownMenu" class="dropdown-menu">
|
|
<div>Option 1</div>
|
|
<div>Option 2</div>
|
|
<div>Option 3</div>
|
|
</div>
|
|
</div>
|
|
|
|
<PmsGrid
|
|
data={boqData.map((r) => ({
|
|
...r,
|
|
amount: r.quantity * r.rate,
|
|
}))}
|
|
columns={boqColumns}
|
|
features={{
|
|
search: true,
|
|
selection: true,
|
|
pagination: true,
|
|
export: true,
|
|
pinning: true,
|
|
resizing: true,
|
|
reorder: true,
|
|
columnVisibility: true,
|
|
pageSizeSelector: true,
|
|
groupByKey: "status",
|
|
aggregation: true,
|
|
expand: true,
|
|
maxHeight: "70vh",
|
|
actions: [
|
|
{
|
|
label: "Edit",
|
|
icon: "bx-edit ",
|
|
onClick: (row,ind,column) => console.log("Edit", row,ind,column),
|
|
},
|
|
{
|
|
label: "Delete",
|
|
icon: "bx-trash text-danger",
|
|
onClick: (row) => console.log("Delete", row),
|
|
},
|
|
],
|
|
}}
|
|
renderExpanded={(row) => (
|
|
<div className="p-3 bg-light border rounded">
|
|
<h6 className="fw-semibold mb-2">Item Details</h6>
|
|
<div className="row small">
|
|
<div className="col-md-4 mb-2">
|
|
<strong>Item Code:</strong> {row.itemCode}
|
|
</div>
|
|
<div className="col-md-4 mb-2">
|
|
<strong>Category:</strong> {row.category}
|
|
</div>
|
|
<div className="col-md-4 mb-2">
|
|
<strong>Unit:</strong> {row.unit}
|
|
</div>
|
|
<div className="col-md-4 mb-2">
|
|
<strong>Quantity:</strong> {row.quantity}
|
|
</div>
|
|
<div className="col-md-4 mb-2">
|
|
<strong>Rate:</strong> ₹{row.rate.toLocaleString()}
|
|
</div>
|
|
<div className="col-md-4 mb-2">
|
|
<strong>Total Amount:</strong>{" "}
|
|
<span className="text-success fw-semibold">
|
|
₹{(row.quantity * row.rate).toLocaleString()}
|
|
</span>
|
|
</div>
|
|
<div className="col-md-6 mb-2">
|
|
<strong>Vendor:</strong> {row.vendor}
|
|
</div>
|
|
<div className="col-md-6 mb-2">
|
|
<strong>Site Location:</strong> {row.site}
|
|
</div>
|
|
<div className="col-md-12">
|
|
<strong>Status:</strong>{" "}
|
|
<span
|
|
className={`badge bg-${
|
|
row.status === "Completed"
|
|
? "success"
|
|
: row.status === "Pending"
|
|
? "warning"
|
|
: "info"
|
|
}`}
|
|
>
|
|
{row.status}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|