feat: versão 1.5 - CRM Beta com leads, funis, campanhas e portal do cliente

This commit is contained in:
Erik Silva
2025-12-24 17:36:52 -03:00
parent 99d828869a
commit dfb91c8ba5
98 changed files with 18255 additions and 1465 deletions

View File

@@ -1,51 +1,93 @@
'use client';
import React, { useState } from 'react';
import React from 'react';
import Link from 'next/link';
import { usePathname } from 'next/navigation';
import {
HomeIcon,
RocketLaunchIcon,
Squares2X2Icon
UserPlusIcon,
RectangleStackIcon,
UsersIcon,
ListBulletIcon
} from '@heroicons/react/24/outline';
import {
HomeIcon as HomeIconSolid,
RocketLaunchIcon as RocketIconSolid,
Squares2X2Icon as GridIconSolid
UserPlusIcon as UserPlusIconSolid,
RectangleStackIcon as RectangleStackIconSolid,
UsersIcon as UsersIconSolid,
ListBulletIcon as ListBulletIconSolid
} from '@heroicons/react/24/solid';
import { MenuItem } from './SidebarRail';
export const MobileBottomBar: React.FC = () => {
interface MobileBottomBarProps {
menuItems?: MenuItem[];
}
export const MobileBottomBar: React.FC<MobileBottomBarProps> = ({ menuItems }) => {
const pathname = usePathname();
const [showMoreMenu, setShowMoreMenu] = useState(false);
const isActive = (path: string) => {
if (path === '/dashboard') {
return pathname === '/dashboard';
if (path === '/dashboard' || path === '/cliente/dashboard') {
return pathname === path;
}
return pathname.startsWith(path);
};
const navItems = [
{
label: 'Início',
path: '/dashboard',
icon: HomeIcon,
iconSolid: HomeIconSolid
},
{
label: 'CRM',
path: '/crm',
icon: RocketLaunchIcon,
iconSolid: RocketIconSolid
},
{
label: 'Mais',
path: '#',
icon: Squares2X2Icon,
iconSolid: GridIconSolid,
onClick: () => setShowMoreMenu(true)
}
];
// Mapeamento de ícones sólidos para os itens do menu
const getSolidIcon = (label: string, defaultIcon: any) => {
const map: Record<string, any> = {
'Dashboard': HomeIconSolid,
'Leads': UserPlusIconSolid,
'Listas': RectangleStackIconSolid,
'CRM': UsersIconSolid,
'Meus Leads': UserPlusIconSolid,
'Meu Perfil': UserPlusIconSolid,
};
return map[label] || defaultIcon;
};
const navItems = menuItems
? menuItems.reduce((acc: any[], item) => {
if (item.href !== '#') {
acc.push({
label: item.label,
path: item.href,
icon: item.icon,
iconSolid: getSolidIcon(item.label, item.icon)
});
} else if (item.subItems) {
// Adiciona subitens importantes se o item pai for '#'
item.subItems.forEach(sub => {
acc.push({
label: sub.label,
path: sub.href,
icon: item.icon, // Usa o ícone do pai
iconSolid: getSolidIcon(sub.label, item.icon)
});
});
}
return acc;
}, []).slice(0, 4) // Limita a 4 itens no mobile
: [
{
label: 'Dashboard',
path: '/dashboard',
icon: HomeIcon,
iconSolid: HomeIconSolid
},
{
label: 'Leads',
path: '/crm/leads',
icon: UserPlusIcon,
iconSolid: UserPlusIconSolid
},
{
label: 'Listas',
path: '/crm/listas',
icon: RectangleStackIcon,
iconSolid: RectangleStackIconSolid
}
];
return (
<>
@@ -56,21 +98,6 @@ export const MobileBottomBar: React.FC = () => {
const active = isActive(item.path);
const Icon = active ? item.iconSolid : item.icon;
if (item.onClick) {
return (
<button
key={item.label}
onClick={item.onClick}
className="flex flex-col items-center justify-center min-w-[70px] h-full gap-1"
>
<Icon className={`w-6 h-6 ${active ? 'text-[var(--brand-color)]' : 'text-gray-500 dark:text-gray-400'}`} />
<span className={`text-xs font-medium ${active ? 'text-[var(--brand-color)]' : 'text-gray-500 dark:text-gray-400'}`}>
{item.label}
</span>
</button>
);
}
return (
<Link
key={item.label}
@@ -86,44 +113,6 @@ export const MobileBottomBar: React.FC = () => {
})}
</div>
</nav>
{/* More Menu Modal */}
{showMoreMenu && (
<div className="md:hidden fixed inset-0 z-[100] bg-black/50 backdrop-blur-sm" onClick={() => setShowMoreMenu(false)}>
<div
className="absolute bottom-0 left-0 right-0 bg-white dark:bg-zinc-900 rounded-t-3xl shadow-2xl max-h-[70vh] overflow-y-auto"
onClick={(e) => e.stopPropagation()}
>
<div className="p-6">
{/* Handle bar */}
<div className="w-12 h-1.5 bg-gray-300 dark:bg-zinc-700 rounded-full mx-auto mb-6" />
<h2 className="text-xl font-bold text-gray-900 dark:text-white mb-6">
Todos os Módulos
</h2>
<div className="grid grid-cols-3 gap-4">
<Link
href="/erp"
onClick={() => setShowMoreMenu(false)}
className="flex flex-col items-center gap-3 p-4 rounded-2xl hover:bg-gray-50 dark:hover:bg-zinc-800 transition-colors"
>
<div className="w-14 h-14 rounded-2xl bg-gradient-to-br from-blue-500 to-blue-600 flex items-center justify-center text-white shadow-lg">
<svg className="w-7 h-7" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
<path strokeLinecap="round" strokeLinejoin="round" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" />
</svg>
</div>
<span className="text-sm font-medium text-gray-900 dark:text-white text-center">
ERP
</span>
</Link>
{/* Add more modules here */}
</div>
</div>
</div>
</div>
)}
</>
);
};