inmake/irth-new-client
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'main' of http://192.168.1.163:3000/inmake/irth-new-client

Browse Source
This commit is contained in:
Lanskikh
2025-05-27 16:44:02 +05:00
parent 4d0391f4b5 83d2663dc2
commit 75e087c6b2
17 changed files with 407 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env
+2 -2
View File
@@ -1,2 +1,2 @@
VITE_API_URL=http://localhost:4002
# VITE_API_URL=http://194.26.138.94:4002
# VITE_API_URL=http://localhost:4002
VITE_API_URL=http://194.26.138.94:4002
public/images/test.png → public/images/floor-plans/dubai-marina/floor-plan_7-38.png
View File
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 453 KiB

After

Width:  |  Height:  |  Size: 453 KiB

public/images/floor-plans/marasi-drive/sky-garden.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 155 KiB

src/components/FloorPlanDubaiMarina.tsx
+10 -10
View File
@@ -1,4 +1,4 @@
import { rooms } from "../data/room-masks/dubai-marina";
import { floorPlanMasksDubaiMarina } from "../data/floor-plan-masks/dubai-marina";
interface FloorPlanDubaiMarinaProps {
selectedFloor: string | null;
@@ -20,29 +20,29 @@ function FloorPlanDubaiMarina({
// width={1264}
// height={935}
transform="scale(.5)"
xlinkHref="/images/test.png"
xlinkHref="/images/floor-plans/dubai-marina/floor-plan_7-38.png"
/>
{rooms.map((room) => (
{floorPlanMasksDubaiMarina.map((mask) => (
<g
key={room.id}
data-name={room.id}
key={mask.id}
data-name={mask.id}
className="fill-transparent hover:fill-[#00BED7]/40 isolate cursor-pointer transition-colors"
onClick={() => {
console.log(room.text.unitNumber);
console.log(mask.text.unitNumber);
}}
>
<path d={room.path} />
<path d={mask.path} />
<text
transform={`translate(${room.text.x} ${room.text.y})`}
transform={`translate(${mask.text.x} ${mask.text.y})`}
className="fill-white text-[9px] select-none"
textAnchor="middle"
>
<tspan x={0} y={0}>
{selectedFloor}
{room.text.unitNumber.padStart(2, "0")}
{mask.text.unitNumber.padStart(2, "0")}
</tspan>
<tspan x={0} y={15}>
{room.text.unitType}
{mask.text.unitType}
</tspan>
</text>
</g>
src/components/FloorPlanMarasiDrive.tsx
+54
View File
@@ -0,0 +1,54 @@
import { floorPlanMasksMarasiDrive } from "../data/floor-plan-masks/marasi-drive";
interface FloorPlanMarasiDriveProps {
selectedFloor: string | null;
}
function FloorPlanMarasiDrive({
selectedFloor,
...props
}: FloorPlanMarasiDriveProps & React.SVGProps<SVGSVGElement>) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 632 467.5"
className="w-full h-full"
{...props}
>
<image
// width={1264}
// height={935}
transform="scale(.5)"
xlinkHref="/images/floor-plans/marasi-drive.png"
/>
{floorPlanMasksMarasiDrive.map((mask) => (
<g
key={mask.id}
data-name={mask.id}
className="fill-transparent hover:fill-[#00BED7]/40 isolate cursor-pointer transition-colors"
onClick={() => {
console.log(mask.text.unitNumber);
}}
>
<path d={mask.path} />
<text
transform={`translate(${mask.text.x} ${mask.text.y})`}
className="fill-white text-[9px] select-none"
textAnchor="middle"
>
<tspan x={0} y={0}>
{selectedFloor}
{mask.text.unitNumber.padStart(2, "0")}
</tspan>
<tspan x={0} y={15}>
{mask.text.unitType}
</tspan>
</text>
</g>
))}
</svg>
);
}
export default FloorPlanMarasiDrive;
src/components/FloorSelect.tsx
+16 -2
View File
@@ -78,7 +78,13 @@ function FloorSelect({
});
function handleFloorClick(floor: string) {
onSelect(floor.split(" ").at(-1)!);
if (
["Rooftop", "Ground Level", "Podium Level", "Sky Garden"].includes(floor)
) {
onSelect(floor);
} else {
onSelect(floor.split(" ").at(-1)!);
}
}
return (
@@ -112,7 +118,15 @@ function FloorSelect({
d={d}
className={clsx(
"fill-[#00BED7] cursor-pointer transition-opacity duration-300 hover:opacity-60 peer",
selectedFloor === floorTitle.split(" ").at(-1)
selectedFloor ===
([
"Rooftop",
"Ground Level",
"Podium Level",
"Sky Garden",
].includes(floorTitle)
? floorTitle
: floorTitle.split(" ").at(-1)!)
? "opacity-60"
: "opacity-20"
)}
src/components/FloorSidebar.tsx
+1 -1
View File
@@ -26,7 +26,7 @@ function FloorSidebar({
className="absolute top-[1.667vw] right-[1.667vw]"
onClick={onClose}
>
<span className="w-[1.667vw] h-[1.667vw]">
<span className="w-[1.389vw] h-[1.389vw]">
<CloseIcon />
</span>
</Button>
src/components/floor-plans/marasi-drive/GroundMarasiDrive.tsx
+5
View File
@@ -0,0 +1,5 @@
function GroundMarasiDrive() {
return <div>Ground</div>;
}
export default GroundMarasiDrive;
src/components/floor-plans/marasi-drive/PodiumMarasiDrive.tsx
+5
View File
@@ -0,0 +1,5 @@
function PodiumMarasiDrive() {
return <div>Podium</div>;
}
export default PodiumMarasiDrive;
src/components/floor-plans/marasi-drive/RooftopMarasiDrive.tsx
+5
View File
@@ -0,0 +1,5 @@
function RooftopMarasiDrive() {
return <div>Rooftop</div>;
}
export default RooftopMarasiDrive;
src/components/floor-plans/marasi-drive/SkyGardenMarasiDrive.tsx
+26
View File
@@ -0,0 +1,26 @@
import AmenitiesBadge from "../../icons/AmenitiesBadge";
import Badge from "../../ui/Badge";
function SkyGardenMarasiDrive() {
return (
<div className="space-y-[1.667vw]">
<div className="space-y-[0.556vw] border-b border-[#E2E2DC] pb-[1.667vw]">
<p className="text-h4 font-medium">Sky Garden</p>
<Badge variant="secondary" text="15 Amenties" />
</div>
<div className="flex items-center gap-[1.667vw]">
<AmenitiesBadge count={3} type="Indoor" />
<AmenitiesBadge count={12} type="Outdoor" />
</div>
<div className="bg-[#F3F3F2] rounded-[1.111vw] p-[1.111vw]">
<img
src="/images/floor-plans/marasi-drive/sky-garden.png"
alt="sky-garden"
className="w-full"
/>
</div>
</div>
);
}
export default SkyGardenMarasiDrive;
src/components/icons/AmenitiesBadge.tsx
+17
View File
@@ -0,0 +1,17 @@
interface AmenitiesBadgeProps {
count: number;
type: "Indoor" | "Outdoor";
}
function AmenitiesBadge({ count, type }: AmenitiesBadgeProps) {
return (
<div className="flex items-center gap-[0.556vw]">
<div className="bg-[#00BED7] rounded-full flex items-center justify-center w-[1.389vw] h-[1.389vw]">
<p className="text-caption-m font-mono text-white">{count}</p>
</div>
<p className="text-caption-m opacity-70">{type} Amenities</p>
</div>
);
}
export default AmenitiesBadge;
src/components/ui/Badge.tsx
+23
View File
@@ -0,0 +1,23 @@
import clsx from "clsx";
interface BadgeProps {
variant: "primary" | "secondary";
text: string;
className?: string;
}
function Badge({ variant, text, className }: BadgeProps) {
return (
<div
className={clsx(
"rounded-[0.278vw] px-[0.556vw] py-[0.139vw] w-fit",
variant === "primary" && "bg-[#00BED7] text-white",
variant === "secondary" && "bg-[#F3F3F2] text-[#0D1922]/70",
className
)}
>
<p className="text-caption-s">{text}</p>
</div>
);
}
export default Badge;
src/components/ui/Button.tsx
+2 -2
View File
@@ -38,8 +38,8 @@ function Button({
: "2xl:px-[0.972vw] 2xl:py-[0.694vw] 2xl:gap-[0.278vw] px-3 py-2.5 gap-1"),
size === "small" &&
(onlyIcon
? "2xl:p-[0.694vw] p-2.5"
: "2xl:px-[0.972vw] 2xl:py-[0.694vw] 2xl:gap-[0.278vw] 2xl:text-[0.833vw] px-3 py-2.5 gap-1 text-xs"),
? "2xl:p-[0.556vw] p-2"
: "2xl:px-[0.889vw] 2xl:py-[0.556vw] 2xl:gap-[0.278vw] 2xl:text-[0.833vw] px-3 py-2 gap-1 text-btn-s"),
],
variant === "link" && "text-sm text-black/50 w-fit",
variant === "primary" &&
src/data/room-masks/dubai-marina.ts → src/data/floor-plan-masks/dubai-marina.ts
+1 -1
View File
@@ -1,4 +1,4 @@
export const rooms = [
export const floorPlanMasksDubaiMarina = [
{
id: 1,
path: "M40.81 288.95h-16.7c-.55 0-1-.45-1-1v-6.52c0-.55-.45-1-1-1h-5.74c-.55 0-1-.45-1-1v-92.56c0-.55.45-1 1-1h5.78c.55 0 1-.45 1-1v-8.31c0-.55.45-1 1-1h17.34c.55 0 1 .45 1 1v2.5c0 .55.45 1 1 1h46.35c.55 0 1-.45 1-1v-3.38c0-.55.45-1 1-1h34.77c.55 0 1 .45 1 1v45.53c0 .55.45 1 1 1h7.35c.55 0 1 .45 1 1v17.28c0 .55.45 1 1 1h15.5c.55 0 1 .45 1 1v43.27c0 .55-.45 1-1 1h-5.21c-.55 0-1 .45-1 1v7.83c0 .55-.45 1-1 1h-20.77c-.55 0-1-.45-1-1v-3.39c0-.55-.45-1-1-1H91.79c-.55 0-1-.45-1-1v-3.85c0-.55-.45-1-1-1H42.81c-.55 0-1 .45-1 1v1.61c0 .55-.45 1-1 1Z",
src/data/floor-plan-masks/marasi-drive.ts
+212
View File
@@ -0,0 +1,212 @@
export const floorPlanMasksMarasiDrive = [
{
id: 1,
path: "M40.81 288.95h-16.7c-.55 0-1-.45-1-1v-6.52c0-.55-.45-1-1-1h-5.74c-.55 0-1-.45-1-1v-92.56c0-.55.45-1 1-1h5.78c.55 0 1-.45 1-1v-8.31c0-.55.45-1 1-1h17.34c.55 0 1 .45 1 1v2.5c0 .55.45 1 1 1h46.35c.55 0 1-.45 1-1v-3.38c0-.55.45-1 1-1h34.77c.55 0 1 .45 1 1v45.53c0 .55.45 1 1 1h7.35c.55 0 1 .45 1 1v17.28c0 .55.45 1 1 1h15.5c.55 0 1 .45 1 1v43.27c0 .55-.45 1-1 1h-5.21c-.55 0-1 .45-1 1v7.83c0 .55-.45 1-1 1h-20.77c-.55 0-1-.45-1-1v-3.39c0-.55-.45-1-1-1H91.79c-.55 0-1-.45-1-1v-3.85c0-.55-.45-1-1-1H42.81c-.55 0-1 .45-1 1v1.61c0 .55-.45 1-1 1Z",
text: {
x: 85,
y: 232,
unitNumber: "1",
unitType: "qwe",
},
},
{
id: 2,
path: "M55.26 380.44H5.31c-.55 0-1-.45-1-1v-84.9c0-.55.45-1 1-1h106.12c.55 0 1 .45 1 1v7.76c0 .55.45 1 1 1h7.72c.55 0 1 .45 1 1v20.02c0 .55-.45 1-1 1h-15.92c-.55 0-1 .45-1 1v10.4c0 .55-.45 1-1 1h-8.72c-.55 0-1 .45-1 1v8.03c0 .55-.45 1-1 1H57.26c-.55 0-1 .45-1 1v30.68c0 .55-.45 1-1 1Z",
text: {
x: 56,
y: 315,
unitNumber: "2",
unitType: "1 BR² — B",
},
},
{
id: 3,
path: "M58.6 381.25v-21.73c0-.55.45-1 1-1h15.96c.55 0 1-.45 1-1v-6.04c0-.55.45-1 1-1h27.58c.55 0 1-.45 1-1v-20.43c0-.55.45-1 1-1h40.56c.55 0 1 .45 1 1v7.82c0 .55.45 1 1 1h3.76c.55 0 1 .45 1 1v42.39c0 .55-.45 1-1 1h-2.44c-.55 0-1 .45-1 1v47.49c0 .5.4.9.9.9s.9.4.9.9v19.71c0 .27-.11.54-.31.72l-9.29 8.85a9 9 0 0 1-8.53 2.18l-52.8-14.11a1 1 0 0 0-.26-.03H60.46c-.55 0-1-.45-1-1v-16.29c0-.55.45-1 1-1h1.59c.55 0 1-.45 1-1v-47.34c0-.55-.45-1-1-1h-2.44c-.55 0-1-.45-1-1Z",
text: {
x: 107,
y: 390,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 4,
path: "M161.1 338.37h-3.25c-.55 0-1 .45-1 1v92.26h-1.17c-.41 0-.74.33-.74.74v17.24c0 .55.45 1 1 1h6.3c.17 0 .34.04.49.13l24.9 13.9a8.01 8.01 0 0 0 9.56-1.33l13.06-12.4a1 1 0 0 0 .29-.71V339.37c0-.55-.45-1-1-1h-6.55c-.55 0-1-.45-1-1v-8.3c0-.55-.45-1-1-1h-37.88c-.55 0-1 .45-1 1v8.31c0 .55-.45 1-1 1Z",
text: {
x: 183,
y: 390,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 5,
path: "M213.32 338.37h3.38c.55 0 1-.45 1-1v-8.31c0-.55.45-1 1-1h38.33c.55 0 1 .45 1 1v8.3c0 .55.45 1 1 1h6.08c.55 0 1 .45 1 1v92.25h1.8v18.73s.11 3.35 0 3.46l-10.27 9.5a8.01 8.01 0 0 1-9.56 1.33l-24.9-13.9c-.15-.08-.32-.13-.49-.13h-9.38c-.55 0-1-.45-1-1V339.36c0-.55.45-1 1-1Z",
text: {
x: 239,
y: 390,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 6,
path: "M268.37 381.25v-21.73c0-.55.45-1 1-1h15.52c.55 0 1-.45 1-1v-6.04c0-.55.45-1 1-1h28.02c.55 0 1-.45 1-1v-20.43c0-.55.45-1 1-1h40.56c.55 0 1 .45 1 1v7.82c0 .55.45 1 1 1h3.76c.55 0 1 .45 1 1v42.39c0 .55-.45 1-1 1h-2.44c-.55 0-1 .45-1 1v47.49c0 .5-.04.9.46.9s.9.4.9.9v19.71c0 .27-.11.54-.31.72l-8.85 8.85a9 9 0 0 1-8.53 2.18l-52.8-14.11a1 1 0 0 0-.26-.03h-18.33c-.55 0-1-.45-1-1v-16.29c0-.55.45-1 1-1s.75-.45.75-1v-47.34c0-.55-.45-1-1-1h-2.44c-.55 0-1-.45-1-1Z",
text: {
x: 316,
y: 390,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 7,
path: "M371.29 338.37h-3.25c-.55 0-1 .45-1 1v92.26h-1.17c-.41 0-.74.33-.74.74v17.24c0 .55.45 1 1 1h6.3c.17 0 .34.04.49.13l24.9 13.9a8.01 8.01 0 0 0 9.56-1.33l13.06-12.4a1 1 0 0 0 .29-.71V339.37c0-.55-.45-1-1-1h-6.55c-.55 0-1-.45-1-1v-8.3c0-.55-.45-1-1-1H373.3c-.55 0-1 .45-1 1v8.31c0 .55-.45 1-1 1Z",
text: {
x: 393,
y: 390,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 8,
path: "M423.5 338.37h3.38c.55 0 1-.45 1-1v-8.31c0-.55.45-1 1-1h38.33c.55 0 1 .45 1 1v8.3c0 .55.45 1 1 1h6.08c.55 0 1 .45 1 1v92.25h1.8v18.73s.11 3.35 0 3.46l-10.27 9.5a8.01 8.01 0 0 1-9.56 1.33l-24.9-13.9c-.15-.08-.32-.13-.49-.13h-9.38c-.55 0-1-.45-1-1V339.36c0-.55.45-1 1-1Z",
text: {
x: 451,
y: 397,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 9,
path: "M483.58 337.26v-9.76h42.64v22.41h30V358h17.46v24.14h-4.02v48.93h4.12v18.59l-11.74 12.61a8.01 8.01 0 0 1-7.98 2.26l-53.9-14.87h-19.7v-18.59h1.67v-49h-3.95v-44.79h5.4Z",
text: {
x: 500,
y: 390,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 10,
path: "M576.92 380.43h51.77c.55 0 1-.45 1-1v-85c0-.55-.45-1-1-1H520.87c-.55 0-1 .45-1 1v7.87c0 .55-.45 1-1 1h-7.41c-.55 0-1 .45-1 1v20.02c0 .55.45 1 1 1h15.92c.55 0 1 .45 1 1v10.5c0 .55.45 1 1 1h8.72c.55 0 1 .45 1 1v7.94c0 .55.45 1 1 1h34.82c.55 0 1 .45 1 1v30.68c0 .55.45 1 1 1Z",
text: {
x: 570,
y: 316,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 11,
path: "M495.64 241.6h-17.41v45.48h7.19v10.13h22.29v-4.45h12.26v-1.33h22.81v-6.06h47.75v4.76h18.55v-9.82h8.52v-46.33H495.63v7.62Z",
text: {
x: 495,
y: 260,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 12,
path: "M495.64 223.94h-17.41v-44.9h7.19v-10.13h22.29v4.45h12.26v1.33h22.81v6.06h47.75v-4.76h18.55v9.82h8.52v45.75H495.63v-7.62Z",
text: {
x: 495,
y: 200,
unitNumber: "####",
unitType: "##########",
},
},
{
id: 13,
path: "M576.92 85.4h51.77c.55 0 1 .45 1 1v84.99c0 .55-.45 1-1 1h-107.5c-.55 0-1-.45-1-1v-7.86c0-.55-.45-1-1-1h-7.73c-.55 0-1-.45-1-1v-20.02c0-.55.45-1 1-1h15.92c.55 0 1-.45 1-1l-.04-10.95c0-.55.45-1 1-1h8.37c.55 0 1-.44 1-1l.04-7.86c0-.55.45-.99 1-.99h35.18c.55 0 1-.45 1-1V86.4c0-.55.45-1 1-1Z",
text: {
x: 555,
y: 85,
unitNumber: "709",
unitType: "1 BR",
},
},
{
id: 14,
path: "M483.58 128.54v9.76h42.64v-22.41h30v-8.08h17.46V83.67h-4.02V34.74h4.12V16.15L562.04 3.54a8.01 8.01 0 0 0-7.98-2.26l-53.9 14.87h-19.7v18.59h1.67v49h-3.95v44.79h5.4Z",
text: {
x: 500,
y: 85,
unitNumber: "708",
unitType: "1 BR",
},
},
{
id: 15,
path: "M423.5 128.98h3.38c.55 0 1 .45 1 1v8.31c0 .55.45 1 1 1h38.33c.55 0 1-.45 1-1v-8.3c0-.55.45-1 1-1h6.08c.55 0 1-.45 1-1V35.73h1.8V17s.11-3.35 0-3.46l-10.27-9.5a8.01 8.01 0 0 0-9.56-1.33l-24.9 13.9c-.15.08-.32.13-.49.13h-9.38c-.55 0-1 .45-1 1v110.24c0 .55.45 1 1 1Z",
text: {
x: 445,
y: 85,
unitNumber: "707",
unitType: "1 BR",
},
},
{
id: 16,
path: "M371.29 128.98h-3.25c-.55 0-1-.45-1-1V35.73h-1.17c-.41 0-.74-.33-.74-.74V17.75c0-.55.45-1 1-1h6.3c.17 0 .34-.04.49-.13l24.9-13.9a8.01 8.01 0 0 1 9.56 1.33l13.06 12.4c.19.19.29.44.29.71v110.83c0 .55-.45 1-1 1h-6.55c-.55 0-1 .45-1 1v8.3c0 .55-.45 1-1 1H373.3c-.55 0-1-.45-1-1v-8.31c0-.55-.45-1-1-1Z",
text: {
x: 390,
y: 85,
unitNumber: "706",
unitType: "1 BR",
},
},
{
id: 17,
path: "M268.37 85.09v21.73c0 .55.45 1 1 1h15.52c.55 0 1 .45 1 1v6.04c0 .55.45 1 1 1h28.02c.55 0 1 .45 1 1v20.43c0 .55.45 1 1 1h40.56c.55 0 1-.45 1-1v-7.82c0-.55.45-1 1-1h3.76c.55 0 1-.45 1-1V85.08c0-.55-.45-1-1-1h-2.44c-.55 0-1-.45-1-1V35.59c0-.5-.04-.9.46-.9s.9-.4.9-.9V14.08c0-.27-.11-.54-.31-.72l-8.85-8.85a9 9 0 0 0-8.53-2.18l-52.8 14.11c-.08.02-.17.03-.26.03h-18.33c-.55 0-1 .45-1 1v16.29c0 .55.45 1 1 1s.75.45.75 1V83.1c0 .55-.45 1-1 1h-2.44c-.55 0-1 .45-1 1Z",
text: {
x: 290,
y: 85,
unitNumber: "705",
unitType: "1 BR",
},
},
{
id: 18,
path: "M213.32 128.98h3.38c.55 0 1 .45 1 1v8.31c0 .55.45 1 1 1h38.33c.55 0 1-.45 1-1v-8.3c0-.55.45-1 1-1h6.08c.55 0 1-.45 1-1V35.73h1.8V17s.11-3.35 0-3.46l-10.27-9.5a8.01 8.01 0 0 0-9.56-1.33l-24.9 13.9c-.15.08-.32.13-.49.13h-9.38c-.55 0-1 .45-1 1v110.24c0 .55.45 1 1 1Z",
text: {
x: 235,
y: 85,
unitNumber: "704",
unitType: "1 BR",
},
},
{
id: 19,
path: "M161.1 128.98h-3.25c-.55 0-1-.45-1-1V35.73h-1.17c-.41 0-.74-.33-.74-.74V17.75c0-.55.45-1 1-1h6.3c.17 0 .34-.04.49-.13l24.9-13.9a8.01 8.01 0 0 1 9.56 1.33l13.06 12.4c.19.19.29.44.29.71v110.83c0 .55-.45 1-1 1h-6.55c-.55 0-1 .45-1 1v8.3c0 .55-.45 1-1 1h-37.88c-.55 0-1-.45-1-1v-8.31c0-.55-.45-1-1-1Z",
text: {
x: 180,
y: 85,
unitNumber: "703",
unitType: "1 BR",
},
},
{
id: 20,
path: "M58.6 85.09v21.73c0 .55.45 1 1 1h15.96c.55 0 1 .45 1 1v6.04c0 .55.45 1 1 1h27.58c.55 0 1 .45 1 1v20.43c0 .55.45 1 1 1h40.56c.55 0 1-.45 1-1v-7.82c0-.55.45-1 1-1h3.76c.55 0 1-.45 1-1V85.08c0-.55-.45-1-1-1h-2.44c-.55 0-1-.45-1-1V35.59c0-.5.4-.9.9-.9s.9-.4.9-.9V14.08c0-.27-.11-.54-.31-.72l-9.29-8.85a9 9 0 0 0-8.53-2.18l-52.8 14.11c-.08.02-.17.03-.26.03H60.46c-.55 0-1 .45-1 1v16.29c0 .55.45 1 1 1h1.59c.55 0 1 .45 1 1V83.1c0 .55-.45 1-1 1h-2.44c-.55 0-1 .45-1 1Z",
text: {
x: 85,
y: 85,
unitNumber: "702",
unitType: "1 BR",
},
},
{
id: 21,
path: "M55.26 85.4H5.31c-.55 0-1 .45-1 1v84.99c0 .55.45 1 1 1h106.12c.55 0 1-.45 1-1v-7.86c0-.55.45-1 1-1h7.72c.55 0 1-.45 1-1v-20.02c0-.55-.45-1-1-1h-15.92c-.55 0-1-.45-1-1v-10.77c0-.55-.45-1-1-1h-8.72c-.55 0-1-.45-1-1v-8.03c0-.55-.45-1-1-1H57.26c-.55 0-1-.45-1-1V86.4c0-.55-.45-1-1-1",
text: {
x: 85,
y: 85,
unitNumber: "701",
unitType: "1 BR² — B",
},
},
];
src/pages/FloorsPage.tsx
+28 -2
View File
@@ -7,6 +7,12 @@ import Select from "../components/ui/Select";
import { useQuery } from "@tanstack/react-query";
import { api } from "../api/ky";
import UnitTypeBadge from "../components/UnitTypeBadge";
import FloorPlanMarasiDrive from "../components/FloorPlanMarasiDrive";
import RooftopMarasiDrive from "../components/floor-plans/marasi-drive/RooftopMarasiDrive";
import GroundMarasiDrive from "../components/floor-plans/marasi-drive/GroundMarasiDrive";
import PodiumMarasiDrive from "../components/floor-plans/marasi-drive/PodiumMarasiDrive";
import SkyGardenMarasiDrive from "../components/floor-plans/marasi-drive/SkyGardenMarasiDrive";
import Badge from "../components/ui/Badge";
function FloorsPage() {
const { complexName } = useParams();
@@ -45,12 +51,14 @@ function FloorsPage() {
<div className="space-y-[0.556vw] border-b border-[#E2E2DC] pb-[1.667vw]">
<p className="text-h4 font-medium">{selectedFloor} floor</p>
<div className="flex items-center gap-[0.278vw]">
<div className="px-[0.556vw] py-[0.139vw] bg-[#F3F3F2] rounded-[0.278vw]">
{/* <div className="px-[0.556vw] py-[0.139vw] bg-[#F3F3F2] rounded-[0.278vw]">
<p className="text-caption-s opacity-70">16 Apartments</p>
</div>
<div className="px-[0.556vw] py-[0.139vw] bg-[#00BED7] rounded-[0.278vw]">
<p className="text-caption-s text-white">Combinable</p>
</div>
</div> */}
<Badge variant="secondary" text="16 Apartments" />
<Badge variant="primary" text="Combinable" />
</div>
</div>
@@ -78,6 +86,24 @@ function FloorsPage() {
</div>
</div>
)}
{complexName === "marasi-drive" && (
<>
{selectedFloor === "Rooftop" && <RooftopMarasiDrive />}
{selectedFloor === "Ground Level" && <GroundMarasiDrive />}
{selectedFloor === "Podium Level" && <PodiumMarasiDrive />}
{selectedFloor === "Sky Garden" && <SkyGardenMarasiDrive />}
{!!parseInt(selectedFloor!) && (
<div className="space-y-[1.111vw]">
<div className="space-y-[0.556vw] border-b border-[#E2E2DC] pb-[1.667vw]">
<p className="text-h4 font-medium">{selectedFloor} floor</p>
</div>
<div className="p-[1.111vw] bg-[#F3F3F2] rounded-[0.833vw]">
<FloorPlanMarasiDrive selectedFloor={selectedFloor} />
</div>
</div>
)}
</>
)}
</FloorSidebar>
</div>
);