Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 93a3bc9ea7 | |||
| 5b6f340418 | |||
| 99a92b14bd | |||
| 23f2f53c7a | |||
| 88d49b96b9 | |||
| d7965129f5 | |||
| 31e586dbc9 |
@@ -1,103 +1,76 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import { CalendarDays, Clock } from "lucide-react";
|
||||
import { useState } from "react";
|
||||
|
||||
export default function AdminPage() {
|
||||
const [isAuthenticated, setIsAuthenticated] = useState(false);
|
||||
const [password, setPassword] = useState("");
|
||||
|
||||
if (!isAuthenticated) {
|
||||
return (
|
||||
<div className="flex min-h-screen items-center justify-center p-4">
|
||||
<div className="w-full max-w-sm space-y-4 rounded-xl border p-8 shadow-lg">
|
||||
<h1 className="text-center text-2xl font-bold">Acesso Barbeiro</h1>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Senha de acesso"
|
||||
className="w-full rounded-md border p-2"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
/>
|
||||
<button
|
||||
onClick={() => password === "barber123" && setIsAuthenticated(true)}
|
||||
className="w-full rounded-md bg-primary p-2 text-white"
|
||||
>
|
||||
Entrar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="mediumLarge"
|
||||
background="fluid"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="diagonal-gradient"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="bold"
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Início", id: "/"},
|
||||
{
|
||||
name: "Agenda Admin", id: "/admin"},
|
||||
]}
|
||||
brandName="BarberSchedule"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="admin-agenda" data-section="admin-agenda">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={true}
|
||||
tag="Painel de Controle"
|
||||
title="Agenda Interativa do Barbeiro"
|
||||
description="Gerencie seus horários manualmente com total controle e organização em tempo real."
|
||||
subdescription="Interface pensada para alta performance."
|
||||
icon={CalendarDays}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-bearded-man-getting-haircut-by-hairdresser-while-sitting-chair-barbershop-barber-soul_627829-6340.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="admin-tasks" data-section="admin-tasks">
|
||||
<FeatureBento
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Tarefas Diárias", description: "Visualização clara dos atendimentos.", bentoComponent: "3d-task-list", items: [
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Corte Executivo", time: "09:00"},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Barba Completa", time: "10:30"},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Degradê", time: "11:45"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Ferramentas do Barbeiro"
|
||||
description="Organize seu dia, acompanhe atendimentos e mantenha sua produtividade em alta."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-man-barber-s-shop-getting-his-beard-trimmed_23-2149186494.jpg?_wi=2"
|
||||
logoText="BarberSchedule"
|
||||
columns={[
|
||||
{
|
||||
title: "Navegação", items: [
|
||||
{
|
||||
label: "Início", href: "/"},
|
||||
{
|
||||
label: "Agenda Admin", href: "/admin"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contato", items: [
|
||||
{
|
||||
label: "WhatsApp", href: "#"},
|
||||
{
|
||||
label: "Instagram", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<div className="container mx-auto p-8">
|
||||
<h1 className="mb-8 text-3xl font-bold">Agenda Administrativa</h1>
|
||||
<div className="grid gap-8">
|
||||
<div className="rounded-xl border p-6">
|
||||
<h2 className="mb-4 text-xl font-semibold">Digital Calendar</h2>
|
||||
<div className="grid grid-cols-7 gap-2">
|
||||
{Array.from({ length: 30 }).map((_, i) => (
|
||||
<div key={i} className="aspect-square border p-2">
|
||||
{i + 1}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div className="rounded-xl border p-6">
|
||||
<h2 className="mb-4 text-xl font-semibold">Agenda Diária</h2>
|
||||
<div className="space-y-4">
|
||||
<div className="flex justify-between border-b pb-2">
|
||||
<span>09:00 - Cliente A</span>
|
||||
<span className="text-green-500">Confirmado</span>
|
||||
</div>
|
||||
<div className="flex justify-between border-b pb-2">
|
||||
<span>10:30 - Cliente B</span>
|
||||
<span className="text-blue-500">Pendente</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user