Add src/app/salon-admin/page.tsx
This commit is contained in:
149
src/app/salon-admin/page.tsx
Normal file
149
src/app/salon-admin/page.tsx
Normal file
@@ -0,0 +1,149 @@
|
||||
"use client";
|
||||
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import HeroSplit from "@/components/sections/hero/HeroSplit";
|
||||
import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
|
||||
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
|
||||
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import { Settings, Users, Calendar, User, Boxes, CreditCard, Gift, BarChart3, Activity, FileText, Bot } from "lucide-react";
|
||||
|
||||
export default function SalonAdminPanelPage() {
|
||||
const navItems = [
|
||||
{ name: "Admin Panel", id: "/salon-admin" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Docs", id: "docs" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
];
|
||||
|
||||
const featureCards = [
|
||||
{
|
||||
title: "Staff Management", description: "Efficiently manage your team members, roles, and schedules.", icon: Users,
|
||||
},
|
||||
{
|
||||
title: "Appointment Management", description: "Streamline booking, rescheduling, and cancellation of appointments.", icon: Calendar,
|
||||
},
|
||||
{
|
||||
title: "Customer Management", description: "Maintain detailed customer profiles, history, and preferences.", icon: User,
|
||||
},
|
||||
{
|
||||
title: "Inventory Management", description: "Track and manage product stock, supplies, and orders.", icon: Boxes,
|
||||
},
|
||||
{
|
||||
title: "Payroll Management", description: "Automate payroll processing, commission, and staff payments.", icon: CreditCard,
|
||||
},
|
||||
{
|
||||
title: "Coupons & Promotions", description: "Create and manage discounts, loyalty programs, and marketing campaigns.", icon: Gift,
|
||||
},
|
||||
].map(feature => ({
|
||||
...feature,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/ai-agents/image1.webp", imageAlt: feature.title
|
||||
})); // Add placeholder image to satisfy propsSchema
|
||||
|
||||
const metrics = [
|
||||
{ id: "1", value: "$12,345", title: "Revenue This Month", description: "Total earnings from services and products.", icon: BarChart3 },
|
||||
{ id: "2", value: "+15%", title: "Growth Rate", description: "Month-over-month revenue increase.", icon: Activity },
|
||||
{ id: "3", value: "180", title: "Appointments Booked", description: "Number of client appointments this week.", icon: Calendar },
|
||||
{ id: "4", value: "32", title: "New Customers", description: "New clients acquired in the last 30 days.", icon: Users },
|
||||
{ id: "5", value: "$2,500", title: "Inventory Value", description: "Current value of salon product stock.", icon: Boxes },
|
||||
{ id: "6", value: "85%", title: "Staff Utilization", description: "Average booking rate for salon staff.", icon: Settings }
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Product", items: [
|
||||
{ label: "Features", href: "#features" },
|
||||
{ label: "Pricing", href: "#pricing" },
|
||||
{ label: "Integrations", href: "#" },
|
||||
{ label: "Changelog", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources", items: [
|
||||
{ label: "Documentation", href: "#" },
|
||||
{ label: "API Reference", href: "#" },
|
||||
{ label: "Tutorials", href: "#" },
|
||||
{ label: "Blog", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "#" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Press", href: "#" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="none"
|
||||
cardStyle="gradient-bordered"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
brandName="AgentFlow"
|
||||
bottomLeftText="Build Smarter"
|
||||
bottomRightText="hello@agentflow.ai"
|
||||
/>
|
||||
<div id="hero">
|
||||
<HeroSplit
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Salon Administration"
|
||||
tagIcon={Settings}
|
||||
title="Empower Your Salon Operations with Smart Management"
|
||||
description="A comprehensive admin panel to manage staff, appointments, customers, and finances with ease. Take control of your salon's success."
|
||||
buttons={[
|
||||
{ text: "Get Started", href: "#" },
|
||||
{ text: "Learn More", href: "#features" },
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/ai-agents/image1.webp"
|
||||
imageAlt="Salon Admin Panel Dashboard"
|
||||
mediaAnimation="slide-up"
|
||||
imagePosition="right"
|
||||
/>
|
||||
</div>
|
||||
<div id="features">
|
||||
<FeatureCardOne
|
||||
features={featureCards}
|
||||
animationType="slide-up"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
tag="Key Features"
|
||||
tagIcon={Bot}
|
||||
title="All-in-One Salon Management Solution"
|
||||
description="From staff coordination to client relationships, our platform handles every aspect of your salon operations."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<div id="analytics">
|
||||
<MetricCardOne
|
||||
metrics={metrics}
|
||||
animationType="slide-up"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
tag="Performance Insights"
|
||||
tagIcon={BarChart3}
|
||||
title="Unlock Your Salon's Growth Potential"
|
||||
description="Gain real-time insights into your revenue, appointments, and customer base with advanced analytics."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<FooterBaseCard
|
||||
logoText="AgentFlow"
|
||||
columns={footerColumns}
|
||||
copyrightText="© 2025 AgentFlow. All rights reserved."
|
||||
/>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user