2025-06-03 16:56:25 +08:00

48 lines
1.4 KiB
TypeScript

'use client'
import { Metadata } from 'next';
import React, { useState } from 'react';
const Sales = () => {
const [selectedSite, setSelectedSite] = useState('');
const sites = ['Site A', 'Site B', 'Site C']; // replace with your actual site list
return (
<div className="min-h-screen flex flex-col items-center justify-center p-4 bg-gray-50">
<h1 className="text-3xl font-bold mb-4 text-gray-800">
Welcome to Rooftop Dashboard !
</h1>
<h2 className="text-2xl font-bold mb-4 text-gray-800">
Select a site to get started.
</h2>
<div className="w-full max-w-sm">
<label className="block text-gray-700 mb-2">Select Site:</label>
<select
value={selectedSite}
onChange={(e) => setSelectedSite(e.target.value)}
className="w-full p-2 border-2 border-yellow-300 rounded-md"
>
<option value="" disabled>
-- Choose a site --
</option>
{sites.map((site) => (
<option key={site} value={site}>
{site}
</option>
))}
</select>
{selectedSite && (
<div className="flex flex-col space-y-2">
<p className="mt-4 text-green-700">You selected: {selectedSite}</p>
<button className="btn-primary">Go to Dashboard</button>
</div>
)}
</div>
</div>
);
};
export default Sales;