connect deal data of detail page to database

This commit is contained in:
Naytitorn Chaovirachot 2024-11-01 22:28:01 +07:00
parent c15e451912
commit 71d1d3c1fc
3 changed files with 24 additions and 19 deletions

View File

@ -14,6 +14,7 @@ import FollowShareButtons from "./followShareButton";
import { getProjectData } from "@/lib/data/projectQuery"; import { getProjectData } from "@/lib/data/projectQuery";
import { getDealList } from "@/app/api/dealApi"; import { getDealList } from "@/app/api/dealApi";
import { sumByKey, toPercentage } from "@/lib/utils";
export default async function ProjectDealPage({ params }: { params: { id: number } }) { export default async function ProjectDealPage({ params }: { params: { id: number } }) {
const supabase = createSupabaseClient(); const supabase = createSupabaseClient();
@ -28,13 +29,13 @@ export default async function ProjectDealPage({ params }: { params: { id: number
return <div>Error</div>; return <div>Error</div>;
} }
console.log(projectData);
const projectBusinessOwnerId = projectData.user_id; const projectBusinessOwnerId = projectData.user_id;
// console.log(projectBusinessOwnerId); const dealList = await getDealList(projectBusinessOwnerId);
const dealData = await getDealList(projectBusinessOwnerId); const totalDealAmount = sumByKey(dealList, "deal_amount");
// console.log(dealData); // timeDiff, if negative convert to zero
const timeDiff = Math.max((new Date(projectData.investment_deadline)).getTime() - new Date().getTime(), 0)
const hourLeft = Math.floor(timeDiff / (1000 * 60 * 60));
console.log(hourLeft)
const carouselData = [ const carouselData = [
{ src: "/boiler1.jpg", alt: "Boiler 1" }, { src: "/boiler1.jpg", alt: "Boiler 1" },
{ src: "/boiler1.jpg", alt: "Boiler 1" }, { src: "/boiler1.jpg", alt: "Boiler 1" },
@ -95,27 +96,33 @@ export default async function ProjectDealPage({ params }: { params: { id: number
<div className="pl-5"> <div className="pl-5">
<span> <span>
{/* #TODO use sum() instead of storing total in database */} {/* #TODO use sum() instead of storing total in database */}
<h1 className="font-semibold text-xl md:text-4xl mt-8">${projectData?.total_investment}</h1> <h1 className="font-semibold text-xl md:text-4xl mt-8">${totalDealAmount}</h1>
<p className="text-sm md:text-lg"> <p className="text-sm md:text-lg">
{projectData?.total_investment / projectData?.target_investment}% {toPercentage(totalDealAmount, projectData?.target_investment)}%
raised of ${projectData?.target_investment} max goal raised of ${projectData?.target_investment} max goal
</p> </p>
<Progress <Progress
value={projectData?.total_investment / projectData?.target_investment} value={toPercentage(totalDealAmount, projectData?.target_investment)}
className="w-[60%] h-3 mt-3" className="w-[60%] h-3 mt-3"
/> />
</span> </span>
<span> <span>
<h1 className="font-semibold text-4xl md:mt-8"> <h1 className="font-semibold text-4xl md:mt-8">
<p className="text-xl md:text-4xl">{dealData ? dealData.length: 0}</p> <p className="text-xl md:text-4xl">{dealList.length}</p>
</h1> </h1>
<p className="text-sm md:text-lg">Investors</p> <p className="text-sm md:text-lg">Investors</p>
</span> </span>
<Separator decorative className="mt-3 w-3/4 ml-5" /> <Separator decorative className="mt-3 w-3/4 ml-5" />
<span> <span>
<h1 className="font-semibold text-xl md:text-4xl mt-8 ml-5"></h1> <h1 className="font-semibold text-xl md:text-4xl mt-8 ml-5"></h1>
<p className="text-xl md:text-4xl">1 hours</p> {projectData?.investment_deadline ? (
<p>Left to invest</p> <>
<p className="text-xl md:text-4xl">{Math.floor(hourLeft)} hours</p>
<p>Left to invest</p>
</>
) : (
<p className="text-xl md:text-4xl">No deadline</p>
)}
</span> </span>
<Button className="mt-5 w-3/4 h-12"> <Button className="mt-5 w-3/4 h-12">
<Link href={`/invest/${params.id}`}>Invest in {projectData?.project_name}</Link> <Link href={`/invest/${params.id}`}>Invest in {projectData?.project_name}</Link>

View File

@ -24,13 +24,6 @@ export default function Dashboard() {
return ( return (
<> <>
{/* {dealList?.map((deal, index) => (
<div key={index} className="deal-item">
<p>Deal Amount: {deal.deal_amount}</p>
<p>Created Time: {new Date(deal.created_time).toUTCString()}</p>
<p>Investor ID: {deal.investor_id}</p>
</div>
))} */}
<div className="md:hidden"> <div className="md:hidden">
<Image <Image
src="/examples/dashboard-light.png" src="/examples/dashboard-light.png"

View File

@ -26,3 +26,8 @@ export function sumByKey(list: any[], key: string) {
// console.log(totalAmount); // Output: 100 // console.log(totalAmount); // Output: 100
return list.reduce((total, obj) => total + (obj[key] || 0), 0); return list.reduce((total, obj) => total + (obj[key] || 0), 0);
} }
export function toPercentage(part: number, total: number): number {
if (total === 0) return 0; // Prevent division by zero
return Number(((part * 100) / total).toFixed(2));
}