junte/assessment-model
1
0
Fork 0
mirror of https://github.com/Hestia-Homes/assessment-model.git synced 2026-06-08 11:37:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

basic UI for proprty information

Browse source
This commit is contained in:
Khalim Conn-Kowlessar 2023-07-25 14:02:24 +01:00
parent a00896881b
commit c572fe8a21
3 changed files with 91 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/app/db/schema/property.ts
View file

@ -5,4 +5,13 @@ export interface PropertyMeta {
postcode: string;
hasPreConditionReport: boolean;
hasRecommendations: boolean;
createdAt: string;
propertyType: string;
builtForm: string;
localAuthority: string;
constituency: string;
numberOfRooms: number;
yearBuilt: number;
tenure: string;
currentEpcRating: string;
}

11
src/app/portfolio/[slug]/building-passport/[propertyId]/layout.tsx
View file

@ -18,8 +18,16 @@ export default function DashboardLayout({
postcode: "AB1 2CD",
hasPreConditionReport: true,
hasRecommendations: true,
createdAt: "2023-07-12 11:51:31.000 +0100",
propertyType: "House",
builtForm: "Detached",
localAuthority: "Birmingham",
constituency: "Birmingham",
numberOfRooms: 5,
yearBuilt: 1990,
tenure: "Rented (social)",
currentEpcRating: "C",
};
if (!propertyId && propertyId !== 0) {
throw Error("Invalid propertyId");
}
@ -40,7 +48,6 @@ export default function DashboardLayout({
<div className="col-span-12 justify-center bg-gray-50 py-2 rounded-md">
<Toolbar propertyMeta={propertyMeta} portfolioId={portfolioId} />
</div>
{children}
</div>
</section>

78
src/app/portfolio/[slug]/building-passport/[propertyId]/page.tsx
View file

@ -1,10 +1,78 @@
import { Button } from "@/app/shadcn_components/ui/button";
import { Toolbar } from "@/app/components/building-passport/Toolbar";
import { PropertyMeta } from "@/app/db/schema/property";
import {
HomeIcon,
BuildingOfficeIcon,
CalendarIcon,
HomeModernIcon,
ClockIcon,
UserGroupIcon,
} from "@heroicons/react/24/solid";
export default function BuildingPassportHome() {
function EpcCard({ epcRating }: { epcRating: string }) {
return (
<div>
<div className="flex p-8">Basic information</div>
<div className="flex flex-col items-center p-8 shadow rounded-md max-w-xl mx-auto justify-start text-gray-100 bg-brandblue">
<div className="text-xl font-bold mb-4">Energy Rating</div>
<div className="text-6xl font-bold">{epcRating}</div>
</div>
);
}
export default function BuildingPassportHome() {
const propertyMeta: PropertyMeta = {
id: 1,
address: "123 Fake Street",
postcode: "AB1 2CD",
hasPreConditionReport: true,
hasRecommendations: true,
createdAt: "2023-07-12 11:51:31.000 +0100",
propertyType: "House",
builtForm: "Detached",
localAuthority: "Birmingham",
constituency: "Birmingham",
numberOfRooms: 5,
yearBuilt: 1990,
tenure: "Rented (social)",
currentEpcRating: "C",
};
return (
<div className="flex flex-col items-center mt-4">
<div className="flex justify-center mt-4 space-x-2">
<EpcCard epcRating={propertyMeta.currentEpcRating} />
<div className="flex flex-col p-8 bg-white shadow rounded-md max-w-2xl mx-auto justify-start text-gray-700">
<div className="text-2xl font-bold mb-4">Your property</div>
<div className="flex items-center space-x-2 mb-2">
<CalendarIcon className="h-5 w-5 text-gray-400" />
<div className="text-gray-500">Building Passport Created At:</div>
<div>{propertyMeta.createdAt}</div>
</div>
<div className="flex items-center space-x-2 mb-2">
<HomeIcon className="h-5 w-5 text-gray-400" />
<div className="text-gray-500">Property Type:</div>
<div className="text-gray-700">{propertyMeta.propertyType}</div>
</div>
<div className="flex items-center space-x-2 mb-2">
<BuildingOfficeIcon className="h-5 w-5 text-gray-400" />
<div className="text-gray-500">Built Form:</div>
<div className="text-gray-700">{propertyMeta.builtForm}</div>
</div>
<div className="flex items-center space-x-2 mb-2">
<ClockIcon className="h-5 w-5 text-gray-400" />
<div className="text-gray-500">Year Built:</div>
<div className="text-gray-700">{propertyMeta.yearBuilt}</div>
</div>
<div className="flex items-center space-x-2 mb-2">
<UserGroupIcon className="h-5 w-5 text-gray-400" />
<div className="text-gray-500">Tenure:</div>
<div className="text-gray-700">{propertyMeta.tenure}</div>
</div>
<div className="flex items-center space-x-2 mb-2">
<HomeModernIcon className="h-5 w-5 text-gray-400" />
<div className="text-gray-500">Number of Rooms:</div>
<div className="text-gray-700">{propertyMeta.numberOfRooms}</div>
</div>
</div>
</div>
</div>
);
}