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

placed settings page elements into a table

Browse source
This commit is contained in:
StefanWout 2024-10-10 17:10:14 +01:00
parent ac82d09024
commit dd516b80d1
1 changed files with 66 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
src/app/portfolio/[slug]/(portfolio)/settings/PortfolioSettings.tsx
View file

@ -6,6 +6,7 @@ import { Button } from "@/app/shadcn_components/ui/button";
import { Input } from "@/app/shadcn_components/ui/input";
import { useRouter } from "next/navigation";
import { handleNumericKeyDown } from "@/app/utils";
import { DropdownMenu } from "@/app/shadcn_components/ui/dropdown-menu";
export default function PortfolioSettings({
@ -56,27 +57,83 @@ export default function PortfolioSettings({
return (
<>
<div className="flex justify-center max-w-8xl w-8xl">
<ul>
<li>
Name:
<div className="flex justify-center max-w-8xl w-8xl pt-5">
<ul className="grid grid-cols-3 gap-x-[5px] gap-y-4">
{/* Row 1: Name */}
<li className="flex items-center">
<span>Name:</span>
</li>
<li className="flex items-center">
<Input value={portfolioName} onChange={handlePortfolioNameChange} />
</li>
<li className="flex items-center">
<Button onClick={handleRename}>Rename</Button>
</li>
<li>
Budget:
{/* Row 2: Budget */}
<li className="flex items-center">
<span>Budget:</span>
</li>
<li className="flex items-center">
<Input
type="number"
value={portfolioBudget ?? undefined}
onChange={handlePortfolioBudgetUpdate}
onKeyDown={(e) => {handleNumericKeyDown(e)}}
onKeyDown={(e) => handleNumericKeyDown(e)}
/>
</li>
<li className="flex items-center">
<Button onClick={handleBudgetUpdate}>Update</Button>
</li>
<li>Goal: {portfolioSettingsData.goal}</li>
<li>Status: {portfolioSettingsData.status}</li>
{/* Row 3: Goal */}
<li className="flex items-center">
<span>Goal:</span>
</li>
<li className="flex items-center">
{portfolioSettingsData.goal}
</li>
<li className="flex items-center">
<DropdownMenu />
</li>
{/* Row 4: Status */}
<li className="flex items-center">
<span>Status:</span>
</li>
<li className="flex items-center">
{portfolioSettingsData.status}
</li>
<li className="flex items-center">
<DropdownMenu />
</li>
</ul>
</div>
</>
);
// return (
// <>
// <div className="flex justify-center max-w-8xl w-8xl pt-5">
// <ul className="grid grid-cols-3 gap-x-[5px]">
// <li className="flex items-center">
// <span>Name: </span>
// <Input value={portfolioName} onChange={handlePortfolioNameChange} />
// <Button onClick={handleRename}>Rename</Button>
// </li>
// <li className="flex items-center">
// <span>Budget: </span>
// <Input
// type="number"
// value={portfolioBudget ?? undefined}
// onChange={handlePortfolioBudgetUpdate}
// onKeyDown={(e) => {handleNumericKeyDown(e)}}
// />
// <Button onClick={handleBudgetUpdate}>Update</Button>
// </li>
// <li className="flex items-center">Goal: {portfolioSettingsData.goal} <DropdownMenu></DropdownMenu> </li>
// <li className="flex items-center">Status: {portfolioSettingsData.status} <DropdownMenu></DropdownMenu></li>
// </ul>
// </div>
// </>
// );
}