[V0_FILE]typescript:file="lib/storage.ts" isMerged="true" import type { Cliente, Fatura, EmpresaConfig, AppConfig } from "@/types" const STORAGE_KEYS = { CLIENTES: "invoicex_clientes", FATURAS: "invoicex_faturas", EMPRESA: "invoicex_empresa", CONFIG: "invoicex_config", } // Clientes export const getClientes = (): Cliente[] => { if (typeof window === "undefined") return [] const data = localStorage.getItem(STORAGE_KEYS.CLIENTES) return data ? JSON.parse(data) : [] } export const saveCliente = (cliente: Cliente) => { const clientes = getClientes() const index = clientes.findIndex((c) => c.id === cliente.id) if (index >= 0) { clientes[index] = cliente } else { clientes.push(cliente) } localStorage.setItem(STORAGE_KEYS.CLIENTES, JSON.stringify(clientes)) } export const deleteCliente = (id: string) => { const clientes = getClientes().filter((c) => c.id !== id) localStorage.setItem(STORAGE_KEYS.CLIENTES, JSON.stringify(clientes)) } // Faturas export const getFaturas = (): Fatura[] => { if (typeof window === "undefined") return [] const data = localStorage.getItem(STORAGE_KEYS.FATURAS) return data ? JSON.parse(data) : [] } export const saveFatura = (fatura: Fatura) => { const faturas = getFaturas() const index = faturas.findIndex((f) => f.id === fatura.id) if (index >= 0) { faturas[index] = fatura } else { faturas.push(fatura) } localStorage.setItem(STORAGE_KEYS.FATURAS, JSON.stringify(faturas)) } export const deleteFatura = (id: string) => { const faturas = getFaturas().filter((f) => f.id !== id) localStorage.setItem(STORAGE_KEYS.FATURAS, JSON.stringify(faturas)) } // Empresa export const getEmpresa = (): EmpresaConfig => { if (typeof window === "undefined") return getDefaultEmpresa() const data = localStorage.getItem(STORAGE_KEYS.EMPRESA) return data ? JSON.parse(data) : getDefaultEmpresa() } export const saveEmpresa = (empresa: EmpresaConfig) => { localStorage.setItem(STORAGE_KEYS.EMPRESA, JSON.stringify(empresa)) } const getDefaultEmpresa = (): EmpresaConfig => ({ nome: "Invoicex", email: "invoicex@gmail.com", telefone: "33998602088", endereco: "Av Minas Gerais", cnpj: "GB123456789", }) // Config export const getConfig = (): AppConfig => { if (typeof window === "undefined") return getDefaultConfig() const data = localStorage.getItem(STORAGE_KEYS.CONFIG) return data ? JSON.parse(data) : getDefaultConfig() } export const saveConfig = (config: AppConfig) => { localStorage.setItem(STORAGE_KEYS.CONFIG, JSON.stringify(config)) } const getDefaultConfig = (): AppConfig => ({ idioma: "pt-BR", moeda: "BRL", modeloPdf: "padrao", corPrimaria: "#60a5fa", corSecundaria: "#1e3a5f", }) // Backup export const exportBackup = () => { const backup = { clientes: getClientes(), faturas: getFaturas(), empresa: getEmpresa(), config: getConfig(), exportDate: new Date().toISOString(), } const blob = new Blob([JSON.stringify(backup, null, 2)], { type: "application/json" }) const url = URL.createObjectURL(blob) const a = document.createElement("a") a.href = url a.download = `invoicex-backup-${new Date().toISOString().split("T")[0]}.json` a.click() URL.revokeObjectURL(url) } export const importBackup = (file: File): Promise => { return new Promise((resolve, reject) => { const reader = new FileReader() reader.onload = (e) => { try { const backup = JSON.parse(e.target?.result as string) if (backup.clientes) localStorage.setItem(STORAGE_KEYS.CLIENTES, JSON.stringify(backup.clientes)) if (backup.faturas) localStorage.setItem(STORAGE_KEYS.FATURAS, JSON.stringify(backup.faturas)) if (backup.empresa) localStorage.setItem(STORAGE_KEYS.EMPRESA, JSON.stringify(backup.empresa)) if (backup.config) localStorage.setItem(STORAGE_KEYS.CONFIG, JSON.stringify(backup.config)) resolve() } catch (error) { reject(error) } } reader.onerror = reject reader.readAsText(file) }) } [V0_FILE]typescriptreact:file="components/mobile-nav.tsx" isEdit="true" isMerged="true" "use client" import Link from "next/link" import { usePathname } from "next/navigation" import { Home, Users, FileText, User, Settings } from "lucide-react" import { cn } from "@/lib/utils" import { useTranslations } from "@/hooks/use-translations" export function MobileNav() { const pathname = usePathname() const { t } = useTranslations() const navItems = [ { href: "/", icon: Home, label: t("home") }, { href: "/clientes", icon: Users, label: t("clients") }, { href: "/documentos", icon: FileText, label: t("documents") }, { href: "/perfil", icon: User, label: t("profile") }, { href: "/settings", icon: Settings, label: t("settings") }, ] return ( ) } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" isMerged="true" "use client" import { useEffect, useState } from "react" import { FileText, Users, Receipt } from "lucide-react" import Link from "next/link" import { getFaturas, getEmpresa } from "@/lib/storage" import type { Fatura } from "@/types" import { useTranslations } from "@/hooks/use-translations" import { useSettings } from "@/contexts/settings-context" export default function HomePage() { const { t } = useTranslations() const { settings } = useSettings() const [faturas, setFaturas] = useState([]) const [empresa, setEmpresa] = useState(null) useEffect(() => { setFaturas(getFaturas()) setEmpresa(getEmpresa()) }, []) const totalFaturas = faturas.filter((f) => f.tipo === "fatura").length const totalOrcamentos = faturas.filter((f) => f.tipo === "orcamento").length const currencySymbol = settings.currency === "BRL" ? "R$" : "£" const altCurrencySymbol = settings.currency === "BRL" ? "£" : "R$" const totalReceitaPrimaria = faturas .filter((f) => f.tipo === "fatura" && f.moeda === settings.currency && f.status === "pago") .reduce((sum, f) => sum + f.total, 0) const totalReceitaSecundaria = faturas .filter((f) => f.tipo === "fatura" && f.moeda !== settings.currency && f.status === "pago") .reduce((sum, f) => sum + f.total, 0) const pendentesPrimaria = faturas .filter((f) => f.tipo === "fatura" && f.moeda === settings.currency && f.status === "pendente") .reduce((sum, f) => sum + f.total, 0) const pendentesSecundaria = faturas .filter((f) => f.tipo === "fatura" && f.moeda !== settings.currency && f.status === "pendente") .reduce((sum, f) => sum + f.total, 0) return (

{/* Header */}

{empresa?.nome || "Invoicex"}

{t("profile")}

{/* Revenue Card */}

{t("totalRevenue")}

{settings.currency}: {currencySymbol} {totalReceitaPrimaria.toFixed(2)}

{settings.currency === "BRL" ? "GBP" : "BRL"}: {altCurrencySymbol} {totalReceitaSecundaria.toFixed(2)}

{t("pendingPayments")}

{settings.currency}: {currencySymbol} {pendentesPrimaria.toFixed(2)}

{settings.currency === "BRL" ? "GBP" : "BRL"}: {altCurrencySymbol} {pendentesSecundaria.toFixed(2)}

{/* Stats Grid */}

{totalFaturas}

{t("invoices")}

{totalOrcamentos}

{t("estimates")}

{/* Quick Actions */}

{t("quickActions")}

{t("createInvoice")}

{t("newInvoice")}

{t("createEstimate")}

{t("sendEstimate")}

{t("addClient")}

{t("newClientDetails")}

{t("documents")}

{t("allDocuments")}

) } [V0_FILE]typescriptreact:file="app/clientes/loading.tsx" isFixed="true" isEdit="true" isMerged="true" export default function Loading() { return null } [V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" isQuickEdit="true" isMerged="true" import type React from "react" import type { Metadata } from "next" import { Geist, Geist_Mono } from "next/font/google" import { Analytics } from "@vercel/analytics/next" import "./globals.css" import { MobileNav } from "@/components/mobile-nav" import { SettingsProvider } from "@/contexts/settings-context" const _geist = Geist({ subsets: ["latin"] }) const _geistMono = Geist_Mono({ subsets: ["latin"] }) export const metadata: Metadata = { title: "InvoiceX - Gerenciamento de Faturas", description: "Aplicativo de gerenciamento de faturas e orçamentos", generator: "v0.app", icons: { icon: [ { url: "/icon-light-32x32.png", media: "(prefers-color-scheme: light)", }, { url: "/icon-dark-32x32.png", media: "(prefers-color-scheme: dark)", }, { url: "/icon.svg", type: "image/svg+xml", }, ], apple: "/apple-icon.png", }, } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "eslint ." }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "16.0.10", "next-themes": "^0.4.6", "react": "19.2.0", "react-day-picker": "9.8.0", "react-dom": "19.2.0", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^1.1.2", "zod": "3.25.76", "jspdf": "3.0.4" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescript:file="app/criar-fatura/loading.tsx" isMerged="true" export default function Loading() { return null } [V0_FILE]typescript:file="app/criar-orcamento/loading.tsx" isMerged="true" export default function Loading() { return null } [V0_FILE]typescript:file="app/documentos/loading.tsx" isMerged="true" export default function Loading() { return null } [V0_FILE]typescript:file="app/perfil/loading.tsx" isMerged="true" export default function Loading() { return null } [V0_FILE]typescript:file="app/settings/loading.tsx" isMerged="true" export default function Loading() { return null } [V0_FILE]css:file="app/globals.css" isEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); --invoicex-bg: 15 27 46; --invoicex-card: 20 32 54; } .dark { --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { --font-sans: "Geist", "Geist Fallback"; --font-mono: "Geist Mono", "Geist Mono Fallback"; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); --color-invoicex-bg: var(--invoicex-bg); --color-invoicex-card: var(--invoicex-card); } @layer base { * { @apply border-border; } body { font-family: var(--font-sans); background: rgb(15 27 46); color: rgb(255 255 255 / 0.95); min-height: 100vh; } } [V0_FILE]typescript:file="types/index.ts" isEdit="true" isQuickEdit="true" isMerged="true" export interface Cliente { id: string nome: string email: string telefone: string endereco?: string avatar?: string createdAt: string } export interface ItemFatura { id: string descricao: string quantidade: number preco: number } export interface Fatura { id: string numero: string clienteId: string cliente?: Cliente items: ItemFatura[] moeda: "BRL" | "GBP" taxaImposto: number // porcentagem taxaDesconto: number // porcentagem observacoes?: string tipo: "fatura" | "orcamento" status: "pago" | "pendente" | "vencido" | "rascunho" dataEmissao: string dataVencimento?: string subtotal: number valorImposto: number valorDesconto: number total: number fotos?: string[] // URLs das fotos } export interface EmpresaConfig { nome: string email: string telefone: string endereco: string cnpj: string logo?: string } export interface AppConfig { idioma: "pt-BR" | "en-US" moeda: "BRL" | "GBP" modeloPdf: "padrao" | "moderno" | "minimalista" corPrimaria: string corSecundaria: string } [V0_FILE]typescriptreact:file="app/documentos/[id]/loading.tsx" isMerged="true" export default function Loading() { return (

Carregando...

) } [V0_FILE]typescript:file="contexts/settings-context.tsx" isMerged="true" "use client" import type React from "react" import { createContext, useContext, useEffect, useState } from "react" import type { Language } from "@/lib/translations" interface Settings { language: Language currency: "BRL" | "GBP" pdfTemplate: "standard" | "modern" | "minimalist" primaryColor: string secondaryColor: string } interface SettingsContextType { settings: Settings updateSettings: (newSettings: Partial) => void } const defaultSettings: Settings = { language: "pt-BR", currency: "BRL", pdfTemplate: "standard", primaryColor: "#3b82f6", secondaryColor: "#1e40af", } const SettingsContext = createContext(undefined) export function SettingsProvider({ children }: { children: React.ReactNode }) { const [settings, setSettings] = useState(defaultSettings) const [mounted, setMounted] = useState(false) useEffect(() => { const stored = localStorage.getItem("app_settings") if (stored) { try { setSettings(JSON.parse(stored)) } catch (e) { console.error("Failed to parse settings:", e) } } setMounted(true) }, []) const updateSettings = (newSettings: Partial) => { setSettings((prev) => { const updated = { ...prev, ...newSettings } localStorage.setItem("app_settings", JSON.stringify(updated)) return updated }) } if (!mounted) { return null } return {children} } export function useSettings() { const context = useContext(SettingsContext) if (!context) { throw new Error("useSettings must be used within SettingsProvider") } return context } [V0_FILE]typescript:file="hooks/use-translations.ts" isMerged="true" "use client" import { useSettings } from "@/contexts/settings-context" import { translations, type TranslationKey } from "@/lib/translations" export function useTranslations() { const { settings } = useSettings() const t = (key: TranslationKey): string => { return translations[settings.language][key] || key } return { t, language: settings.language } } [V0_FILE]typescriptreact:file="app/settings/page.tsx" isEdit="true" isMerged="true" "use client" import { useState } from "react" import { Globe, DollarSign, FileText, Palette, Download, Upload, ChevronRight } from "lucide-react" import { exportBackup, importBackup } from "@/lib/storage" import { SettingsIcon } from "lucide-react" import { useSettings } from "@/contexts/settings-context" import { useTranslations } from "@/hooks/use-translations" export default function SettingsPage() { const { settings, updateSettings } = useSettings() const { t } = useTranslations() const [showColorPicker, setShowColorPicker] = useState<"primaria" | "secundaria" | null>(null) const handleExport = () => { exportBackup() } const handleImport = () => { const input = document.createElement("input") input.type = "file" input.accept = ".json" input.onchange = async (e) => { const file = (e.target as HTMLInputElement).files?.[0] if (file) { try { await importBackup(file) alert("Backup importado com sucesso!") window.location.reload() } catch (error) { alert("Erro ao importar backup") } } } input.click() } return (

{t("settingsTitle")}

{t("language")}

{t("chooseLanguage")}

{t("currency")}

{t("chooseCurrency")}

{t("pdfTemplate")}

{t("choosePdfStyle")}

{t("customization")}

{t("customizeColors")}

{/* Cor Primária */} {/* Cor Secundária */}

{/* Backup */}

) } [V0_FILE]typescriptreact:file="app/clientes/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import type React from "react" import { useEffect, useState } from "react" import { Search, Plus, Mail, Phone, Trash2, Edit, Users } from "lucide-react" import { getClientes, saveCliente, deleteCliente } from "@/lib/storage" import type { Cliente } from "@/types" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { useTranslations } from "@/hooks/use-translations" export default function ClientesPage() { const { t } = useTranslations() const [clientes, setClientes] = useState([]) const [search, setSearch] = useState("") const [showForm, setShowForm] = useState(false) const [editingCliente, setEditingCliente] = useState(null) useEffect(() => { setClientes(getClientes()) }, []) const filteredClientes = clientes.filter( (c) => c.nome.toLowerCase().includes(search.toLowerCase()) || c.email.toLowerCase().includes(search.toLowerCase()) || c.telefone.includes(search), ) const handleSave = (e: React.FormEvent) => { e.preventDefault() const formData = new FormData(e.currentTarget) const cliente: Cliente = { id: editingCliente?.id || Date.now().toString(), nome: formData.get("nome") as string, email: formData.get("email") as string, telefone: formData.get("telefone") as string, endereco: formData.get("endereco") as string, createdAt: editingCliente?.createdAt || new Date().toISOString(), } saveCliente(cliente) setClientes(getClientes()) setShowForm(false) setEditingCliente(null) } const handleDelete = (id: string) => { if (confirm("Deseja realmente excluir este cliente?")) { deleteCliente(id) setClientes(getClientes()) } } return (

{/* Header */}

{t("clients")}

{/* Search */}

setSearch(e.target.value)} className="w-full bg-black rounded-2xl pl-12 pr-4 py-4 text-white placeholder:text-slate-500 focus:outline-none focus:ring-2 focus:ring-blue-500" />

{/* Cliente List */}

{filteredClientes.map((cliente) => (

{cliente.nome.charAt(0).toUpperCase()}

{cliente.nome}

{cliente.email}

{cliente.telefone}

))} {filteredClientes.length === 0 && (

{t("noClientsFound")}

)}

{/* Form Modal */} {showForm && (

{editingCliente ? "Editar Cliente" : t("addClient")}

)}

) } [V0_FILE]typescriptreact:file="app/documentos/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { useEffect, useState } from "react" import { FileText, Receipt, Trash2 } from "lucide-react" import { getFaturas, getClientes, deleteFatura } from "@/lib/storage" import type { Fatura, Cliente } from "@/types" import Link from "next/link" import { useTranslations } from "@/hooks/use-translations" export default function DocumentosPage() { const { t } = useTranslations() const [faturas, setFaturas] = useState([]) const [clientes, setClientes] = useState([]) const [filter, setFilter] = useState<"all" | "fatura" | "orcamento">("all") useEffect(() => { const loadedFaturas = getFaturas() const loadedClientes = getClientes() const faturasComClientes = loadedFaturas.map((fatura) => ({ ...fatura, cliente: loadedClientes.find((c) => c.id === fatura.clienteId), })) setFaturas(faturasComClientes) setClientes(loadedClientes) }, []) const filteredFaturas = faturas.filter((f) => (filter === "all" ? true : f.tipo === filter)) const handleDelete = (id: string) => { if (confirm("Deseja realmente excluir este documento?")) { deleteFatura(id) setFaturas(getFaturas()) } } return (

{t("documents")}

{/* Documents List */}

{filteredFaturas.map((fatura) => (

{fatura.tipo === "fatura" ? ( ) : ( )}

{fatura.numero}

{fatura.cliente?.nome || "Cliente não encontrado"}

{fatura.moeda === "BRL" ? "R$" : "£"} {fatura.total.toFixed(2)}

{fatura.status}

{new Date(fatura.dataEmissao).toLocaleDateString("pt-BR")}

))} {filteredFaturas.length === 0 && (

{t("noDocumentsFound")}

)}

) } [V0_FILE]typescriptreact:file="app/documentos/[id]/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { useEffect, useState } from "react" import { useParams, useRouter } from "next/navigation" import { ChevronLeft, Share2, FileDown, Trash2, CheckCircle } from "lucide-react" import { getFaturas, getClientes, saveFatura, deleteFatura, getEmpresa } from "@/lib/storage" import type { Fatura, Cliente } from "@/types" import { Button } from "@/components/ui/button" import { jsPDF } from "jspdf" import { useTranslations } from "@/hooks/use-translations" export default function DetalhesDocumentoPage() { const { t } = useTranslations() const params = useParams() const router = useRouter() const [documento, setDocumento] = useState(null) const [cliente, setCliente] = useState(null) useEffect(() => { const faturas = getFaturas() const doc = faturas.find((f) => f.id === params.id) if (doc) { setDocumento(doc) const clientes = getClientes() const cli = clientes.find((c) => c.id === doc.clienteId) if (cli) setCliente(cli) } }, [params.id]) const handleMarcarComoPago = () => { if (!documento) return const atualizado = { ...documento, status: "pago" as const } saveFatura(atualizado) setDocumento(atualizado) } const handleExcluir = () => { if (!documento) return if (confirm("Tem certeza que deseja excluir este documento?")) { deleteFatura(documento.id) router.push("/documentos") } } const handleCompartilhar = async () => { if (!documento || !cliente) return const titulo = `${documento.tipo === "fatura" ? t("invoice") : t("estimate")} ${documento.numero}` const texto = `*${titulo}*\n\n${t("client")}: ${cliente.nome}\n${t("date")}: ${new Date(documento.dataEmissao).toLocaleDateString("pt-BR")}\n\n*${t("lineItems")}:*\n${documento.items.map((item) => `• ${item.descricao}\n ${item.quantidade}x ${documento.moeda === "BRL" ? "R$" : "£"}${item.preco.toFixed(2)} = ${documento.moeda === "BRL" ? "R$" : "£"}${(item.quantidade * item.preco).toFixed(2)}`).join("\n\n")}\n\n*${t("subtotal")}:* ${documento.moeda === "BRL" ? "R$" : "£"}${documento.subtotal.toFixed(2)}\n*${t("taxRate")} (${documento.taxaImposto}%):* ${documento.moeda === "BRL" ? "R$" : "£"}${documento.valorImposto.toFixed(2)}\n${documento.taxaDesconto > 0 ? `*${t("discount")} (${documento.taxaDesconto}%):* -${documento.moeda === "BRL" ? "R$" : "£"}${documento.valorDesconto.toFixed(2)}\n` : ""}\n*${t("total")}:* ${documento.moeda === "BRL" ? "R$" : "£"}${documento.total.toFixed(2)}\n\n${documento.observacoes ? `${t("observations")}: ${documento.observacoes}\n\n` : ""}${t("generatedBy")} InvoiceX` if (navigator.share) { try { await navigator.share({ title: titulo, text: texto, }) return } catch (err) { // Silenciosamente ignora se o usuário cancelar } } // Fallback: mostrar opções de compartilhamento const opcoes = [ { nome: "WhatsApp", acao: () => { const textoEncoded = encodeURIComponent(texto) const telefone = cliente.telefone?.replace(/\D/g, "") || "" window.open(`https://wa.me/${telefone}?text=${textoEncoded}`, "_blank") }, }, { nome: "E-mail", acao: () => { const assunto = encodeURIComponent(titulo) const corpo = encodeURIComponent(texto.replace(/\*/g, "")) window.open(`mailto:${cliente.email}?subject=${assunto}&body=${corpo}`, "_blank") }, }, { nome: "Copiar Texto", acao: () => { navigator.clipboard.writeText(texto.replace(/\*/g, "")) alert("Detalhes copiados para a área de transferência!") }, }, ] // Criar um menu de opções simples const escolha = prompt( `${t("howToShare")}\n\n1 - WhatsApp\n2 - E-mail\n3 - ${t("copyText")}\n\n${t("enterNumber")}:`, ) if (escolha === "1") opcoes[0].acao() else if (escolha === "2") opcoes[1].acao() else if (escolha === "3") opcoes[2].acao() } const handleExportarPDF = async () => { if (!documento || !cliente) return try { const empresa = getEmpresa() const pdf = new jsPDF() // Configurações de cores const azulEscuro = [31, 56, 100] // Cor azul do logo const cinzaTexto = [100, 116, 139] // Cor do texto secundário if (empresa.logo) { try { // Adicionar a logo no PDF pdf.addImage(empresa.logo, "PNG", 20, 15, 30, 30) // Ajustar posição do texto para dar espaço à logo pdf.setFontSize(24) pdf.setTextColor(azulEscuro[0], azulEscuro[1], azulEscuro[2]) pdf.setFont("helvetica", "bold") pdf.text(empresa.nome || "Invoicex", 55, 25) pdf.setFontSize(10) pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.setFont("helvetica", "normal") pdf.text(empresa.endereco || "Av Minas Gerais", 55, 32) pdf.text(empresa.email || "invoicex@gmail.com", 55, 37) pdf.text(empresa.telefone || "33998602088", 55, 42) } catch (err) { // Se houver erro ao adicionar a logo, continuar sem ela console.error("Erro ao adicionar logo ao PDF:", err) // Posições originais sem logo pdf.setFontSize(24) pdf.setTextColor(azulEscuro[0], azulEscuro[1], azulEscuro[2]) pdf.setFont("helvetica", "bold") pdf.text(empresa.nome || "Invoicex", 20, 25) pdf.setFontSize(10) pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.setFont("helvetica", "normal") pdf.text(empresa.endereco || "Av Minas Gerais", 20, 32) pdf.text(empresa.email || "invoicex@gmail.com", 20, 37) pdf.text(empresa.telefone || "33998602088", 20, 42) } } else { // Sem logo - usar layout original pdf.setFontSize(24) pdf.setTextColor(azulEscuro[0], azulEscuro[1], azulEscuro[2]) pdf.setFont("helvetica", "bold") pdf.text(empresa.nome || "Invoicex", 20, 25) pdf.setFontSize(10) pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.setFont("helvetica", "normal") pdf.text(empresa.endereco || "Av Minas Gerais", 20, 32) pdf.text(empresa.email || "invoicex@gmail.com", 20, 37) pdf.text(empresa.telefone || "33998602088", 20, 42) } // Título do documento pdf.setFontSize(28) pdf.setTextColor(0, 0, 0) pdf.setFont("helvetica", "bold") pdf.text(documento.tipo === "fatura" ? t("invoice") : t("estimate"), 20, 60) // Número e data pdf.setFontSize(11) pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.setFont("helvetica", "normal") pdf.text(documento.numero, 20, 68) pdf.text(`${t("date")}: ${new Date(documento.dataEmissao).toLocaleDateString("pt-BR")}`, 20, 74) // Cliente pdf.setFontSize(12) pdf.setTextColor(azulEscuro[0], azulEscuro[1], azulEscuro[2]) pdf.setFont("helvetica", "bold") pdf.text(t("client"), 20, 90) pdf.setFontSize(11) pdf.setTextColor(0, 0, 0) pdf.setFont("helvetica", "bold") pdf.text(cliente.nome, 20, 98) pdf.setFont("helvetica", "normal") pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.text(cliente.email, 20, 104) if (cliente.endereco) { pdf.text(cliente.endereco, 20, 110) } // Tabela de itens const startY = cliente.endereco ? 125 : 120 // Cabeçalho da tabela pdf.setFontSize(10) pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.setFont("helvetica", "bold") pdf.text(t("description"), 20, startY) pdf.text(t("quantity"), 120, startY, { align: "center" }) pdf.text(t("price"), 145, startY, { align: "right" }) pdf.text(t("total"), 185, startY, { align: "right" }) // Linha do cabeçalho pdf.setDrawColor(200, 200, 200) pdf.line(20, startY + 2, 190, startY + 2) // Itens let currentY = startY + 10 pdf.setFont("helvetica", "normal") pdf.setTextColor(0, 0, 0) documento.items.forEach((item) => { pdf.text(item.descricao, 20, currentY) pdf.text(String(item.quantidade), 120, currentY, { align: "center" }) pdf.text(`${documento.moeda === "BRL" ? "R$" : "£"} ${item.preco.toFixed(2)}`, 145, currentY, { align: "right", }) pdf.text( `${documento.moeda === "BRL" ? "R$" : "£"} ${(item.quantidade * item.preco).toFixed(2)}`, 185, currentY, { align: "right" }, ) currentY += 8 }) // Linha antes dos totais currentY += 5 pdf.setDrawColor(200, 200, 200) pdf.line(20, currentY, 190, currentY) // Totais currentY += 10 pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.text(t("subtotal"), 120, currentY) pdf.setTextColor(0, 0, 0) pdf.text(`${documento.moeda === "BRL" ? "R$" : "£"} ${documento.subtotal.toFixed(2)}`, 185, currentY, { align: "right", }) currentY += 7 pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.text(`${t("taxRate")} (${documento.taxaImposto}%)`, 120, currentY) pdf.setTextColor(0, 0, 0) pdf.text(`${documento.moeda === "BRL" ? "R$" : "£"} ${documento.valorImposto.toFixed(2)}`, 185, currentY, { align: "right", }) if (documento.taxaDesconto > 0) { currentY += 7 pdf.setTextColor(cinzaTexto[0], cinzaTexto[1], cinzaTexto[2]) pdf.text(`${t("discount")} (${documento.taxaDesconto}%)`, 120, currentY) pdf.setTextColor(0, 0, 0) pdf.text(`-${documento.moeda === "BRL" ? "R$" : "£"} ${documento.valorDesconto.toFixed(2)}`, 185, currentY, { align: "right", }) } // Linha antes do total currentY += 5 pdf.setDrawColor(azulEscuro[0], azulEscuro[1], azulEscuro[2]) pdf.setLineWidth(1) pdf.line(20, currentY, 190, currentY) // Total currentY += 10 pdf.setFontSize(12) pdf.setFont("helvetica", "bold") pdf.setTextColor(0, 0, 0) pdf.text(t("total"), 20, currentY) pdf.setFontSize(18) pdf.setTextColor(azulEscuro[0], azulEscuro[1], azulEscuro[2]) pdf.text(`${documento.moeda === "BRL" ? "R$" : "£"} ${documento.total.toFixed(2)}`, 185, currentY, { align: "right", }) // Salvar PDF pdf.save(`${documento.numero}.pdf`) } catch (error) { console.error("Erro ao gerar PDF:", error) alert(t("errorGeneratingPdf") || "Erro ao gerar PDF. Por favor, tente novamente.") } } if (!documento || !cliente) { return (

Carregando...

) } const statusBadgeColor = documento.status === "pago" ? "bg-green-500/20 text-green-400" : documento.status === "rascunho" ? "bg-slate-500/20 text-slate-400" : "bg-yellow-500/20 text-yellow-400" const statusLabel = documento.status === "pago" ? t("paid") : documento.status === "rascunho" ? t("draft") : t("pending") return (

{/* Header */}

{documento.tipo === "fatura" ? t("invoiceDetails") : t("estimateDetails")}

{/* Número e Status */}

{documento.numero}

{statusLabel}

{new Date(documento.dataEmissao).toLocaleDateString("pt-BR", { day: "numeric", month: "long", year: "numeric", })}

{/* Customer Details */}

{t("customerDetails")}

{cliente.nome}

{cliente.email}

{cliente.endereco &&

{cliente.endereco}

}

{/* Line Items */}

{t("lineItems")}

{documento.items.map((item) => (

{item.descricao}

{item.quantidade} × {documento.moeda === "BRL" ? "R$" : "£"} {item.preco.toFixed(2)} {documento.moeda === "BRL" ? "R$" : "£"} {(item.quantidade * item.preco).toFixed(2)}

))}

{/* Cálculos */}

{t("subtotal")} {documento.moeda === "BRL" ? "R$" : "£"} {documento.subtotal.toFixed(2)}

{t("taxRate")} (${documento.taxaImposto}%) {documento.moeda === "BRL" ? "R$" : "£"} {documento.valorImposto.toFixed(2)}

{documento.taxaDesconto > 0 && (

{t("discount")} (${documento.taxaDesconto}%) -{documento.moeda === "BRL" ? "R$" : "£"} {documento.valorDesconto.toFixed(2)}

)}

{t("total")} {documento.moeda === "BRL" ? "R$" : "£"} {documento.total.toFixed(2)}

{/* Fotos */} {documento.fotos && documento.fotos.length > 0 && (

{t("servicePhotos")}

{documento.fotos.map((foto, index) => (

))}

)} {/* Observações */} {documento.observacoes && (

{t("observations")}

{documento.observacoes}

)} {/* Ações */}

{documento.status !== "pago" && ( )}

) } [V0_FILE]typescriptreact:file="app/perfil/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import type React from "react" import { useEffect, useState } from "react" import { Camera } from "lucide-react" import { getEmpresa, saveEmpresa } from "@/lib/storage" import type { EmpresaConfig } from "@/types" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { useTranslations } from "@/hooks/use-translations" export default function PerfilPage() { const { t } = useTranslations() const [empresa, setEmpresa] = useState(null) useEffect(() => { setEmpresa(getEmpresa()) }, []) const handleLogoChange = (e: React.ChangeEvent) => { const file = e.target.files?.[0] if (file) { const reader = new FileReader() reader.onloadend = () => { const logoDataUrl = reader.result as string setEmpresa((prev) => (prev ? { ...prev, logo: logoDataUrl } : prev)) } reader.readAsDataURL(file) } } const handleSubmit = (e: React.FormEvent) => { e.preventDefault() const formData = new FormData(e.currentTarget) const novaEmpresa: EmpresaConfig = { nome: formData.get("nome") as string, email: formData.get("email") as string, telefone: formData.get("telefone") as string, endereco: formData.get("endereco") as string, cnpj: formData.get("cnpj") as string, logo: empresa?.logo, } saveEmpresa(novaEmpresa) alert("Perfil atualizado com sucesso!") } if (!empresa) return null return (

{t("profile")}

{empresa.logo ? (

) : ( IX )}

{t("companyLogo")}

{t("tapToChange")}

{t("companyName")} *

{t("email")} *

{t("phone")} *

{t("address")} *

{t("cnpj")} *

) } [V0_FILE]typescriptreact:file="app/criar-fatura/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import type React from "react" import { useEffect, useState } from "react" import { useRouter } from "next/navigation" import { Plus, Trash2, ChevronDown, Camera, X } from "lucide-react" import { getClientes, saveFatura, getFaturas } from "@/lib/storage" import type { Cliente, Fatura, ItemFatura } from "@/types" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { useTranslations } from "@/hooks/use-translations" export default function CriarFaturaPage() { const { t } = useTranslations() const router = useRouter() const [clientes, setClientes] = useState([]) const [selectedCliente, setSelectedCliente] = useState("") const [moeda, setMoeda] = useState<"BRL" | "GBP">("BRL") const [tipoDoc, setTipoDoc] = useState<"items" | "trabalho">("items") const [items, setItems] = useState([{ id: "1", descricao: "", quantidade: 1, preco: 0 }]) const [trabalhoDescricao, setTrabalhoDescricao] = useState("") const [trabalhoValor, setTrabalhoValor] = useState(0) const [observacoes, setObservacoes] = useState("") const [taxaImposto, setTaxaImposto] = useState(20) const [taxaDesconto, setTaxaDesconto] = useState(0) const [fotos, setFotos] = useState([]) useEffect(() => { setClientes(getClientes()) }, []) const addItem = () => { setItems([ ...items, { id: Date.now().toString(), descricao: "", quantidade: 1, preco: 0, }, ]) } const removeItem = (id: string) => { if (items.length > 1) { setItems(items.filter((item) => item.id !== id)) } } const updateItem = (id: string, field: keyof ItemFatura, value: any) => { setItems(items.map((item) => (item.id === id ? { ...item, [field]: value } : item))) } const calculateSubtotal = () => { if (tipoDoc === "trabalho") { return trabalhoValor } return items.reduce((sum, item) => sum + item.quantidade * item.preco, 0) } const subtotal = calculateSubtotal() const valorImposto = (subtotal * taxaImposto) / 100 const valorDesconto = (subtotal * taxaDesconto) / 100 const total = subtotal + valorImposto - valorDesconto const handleFotoUpload = (e: React.ChangeEvent) => { const files = e.target.files if (files) { Array.from(files).forEach((file) => { const reader = new FileReader() reader.onloadend = () => { setFotos((prev) => [...prev, reader.result as string]) } reader.readAsDataURL(file) }) } } const removeFoto = (index: number) => { setFotos((prev) => prev.filter((_, i) => i !== index)) } const handleSubmit = (e: React.FormEvent) => { e.preventDefault() if (!selectedCliente) { alert("Por favor, selecione um cliente") return } if (tipoDoc === "trabalho" && (!trabalhoDescricao || trabalhoValor <= 0)) { alert("Por favor, preencha a descrição e valor do trabalho") return } const faturas = getFaturas() const numero = `INV-${(faturas.filter((f) => f.tipo === "fatura").length + 1).toString().padStart(5, "0")}` const finalItems = tipoDoc === "trabalho" ? [{ id: "1", descricao: trabalhoDescricao, quantidade: 1, preco: trabalhoValor }] : items const fatura: Fatura = { id: Date.now().toString(), numero, clienteId: selectedCliente, items: finalItems, moeda, taxaImposto, taxaDesconto, observacoes, tipo: "fatura", status: "rascunho", dataEmissao: new Date().toISOString(), subtotal, valorImposto, valorDesconto, total, fotos, } saveFatura(fatura) router.push("/documentos") } return (

{/* Header */}

{t("createInvoiceTitle")}

{t("createInvoice")}

{/* Cliente */}

{t("client")}

{/* Moeda */}

{t("currency")}

{/* Tipo */}

{tipoDoc === "items" ? ( /* Items */

{t("items")}

{items.map((item, index) => (

{t("item")} {index + 1} {items.length > 1 && ( )}

updateItem(item.id, "descricao", e.target.value)} className="bg-[#0f1c2e] border-slate-700 text-white mb-3" required />

{t("quantity")} updateItem(item.id, "quantidade", Number.parseInt(e.target.value) || 1)} className="bg-[#0f1c2e] border-slate-700 text-white" />

{t("price")} ({moeda === "BRL" ? "R$" : "£"}) updateItem(item.id, "preco", Number.parseFloat(e.target.value) || 0)} className="bg-[#0f1c2e] border-slate-700 text-white" />

{t("total")}: {moeda === "BRL" ? "R$" : "£"} {(item.quantidade * item.preco).toFixed(2)}

))}

) : ( /* Trabalho Feito */

{t("workDone")}

{t("workDescription")}

setTrabalhoDescricao(e.target.value)}
                    placeholder={t("workDescriptionPlaceholder")}
                    rows={4}
                    className="w-full bg-[#0f1c2e] text-white rounded-xl px-4 py-3 focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
                    required
                  />
                </div>
                <div>
                  <label className="block text-sm text-slate-400 mb-2">
                    {t("totalValue")} ({moeda === "BRL" ? "R$" : "£"})
                  </label>
                  <Input
                    type="number"
                    step="0.01"
                    min="0"
                    value={trabalhoValor}
                    onChange={(e) => setTrabalhoValor(Number.parseFloat(e.target.value) || 0)}
                    className="bg-[#0f1c2e] border-slate-700 text-white"
                    placeholder="0.00"
                    required
                  />
                </div>
              </div>
            </div>
          )}

<div className="bg-[#1a2738] rounded-2xl p-6 space-y-4">
            <div className="flex items-center justify-between">
              <span className="text-slate-400">{t("subtotal")}</span>
              <span className="text-white text-xl font-semibold">
                {moeda === "BRL" ? "R$" : "£"} {subtotal.toFixed(2)}
              </span>
            </div>

<div className="bg-[#0f1c2e] rounded-xl p-4">
              <div className="flex items-center gap-3 mb-2">
                <span className="text-blue-400 text-sm">$ {t("taxRate")}</span>
                <div className="flex-1 flex items-center gap-2">
                  <Input
                    type="number"
                    min="0"
                    max="100"
                    step="0.01"
                    value={taxaImposto}
                    onChange={(e) => setTaxaImposto(Number.parseFloat(e.target.value) || 0)}
                    className="w-20 bg-[#1a2738] border-slate-700 text-white text-center"
                  />
                  <span className="text-white">%</span>
                </div>
              </div>
              <div className="text-right">
                <span className="text-slate-400 text-sm">{t("taxValue")}: </span>
                <span className="text-white font-semibold">
                  {moeda === "BRL" ? "R$" : "£"} {valorImposto.toFixed(2)}
                </span>
              </div>
            </div>

<div className="bg-[#0f1c2e] rounded-xl p-4">
              <div className="flex items-center gap-3 mb-2">
                <span className="text-green-400 text-sm">$ {t("discount")}</span>
                <div className="flex-1 flex items-center gap-2">
                  <Input
                    type="number"
                    min="0"
                    max="100"
                    step="0.01"
                    value={taxaDesconto}
                    onChange={(e) => setTaxaDesconto(Number.parseFloat(e.target.value) || 0)}
                    className="w-20 bg-[#1a2738] border-slate-700 text-white text-center"
                  />
                  <span className="text-white">%</span>
                </div>
              </div>
              <div className="text-right">
                <span className="text-slate-400 text-sm">{t("discountValue")}: </span>
                <span className="text-green-400 font-semibold">
                  -{moeda === "BRL" ? "R$" : "£"} {valorDesconto.toFixed(2)}
                </span>
              </div>
            </div>

<div className="flex items-center justify-between">
              <span className="text-white text-lg font-semibold">{t("total")}</span>
              <span className="text-blue-400 text-3xl font-bold">
                {moeda === "BRL" ? "R$" : "£"} {total.toFixed(2)}
              </span>
            </div>
          </div>

<div>
            <div className="flex items-center justify-between mb-2">
              <label className="text-white font-medium">{t("photos")}</label>
              <label className="w-12 h-12 rounded-xl bg-blue-500 flex items-center justify-center cursor-pointer hover:bg-blue-600">
                <Camera className="w-6 h-6 text-white" />
                <input type="file" accept="image/*" multiple onChange={handleFotoUpload} className="hidden" />
              </label>
            </div>
            <p className="text-slate-400 text-sm mb-4">{t("photosDescription")}</p>
            {fotos.length > 0 && (
              <div className="grid grid-cols-3 gap-3">
                {fotos.map((foto, index) => (
                  <div key={index} className="relative aspect-square rounded-xl overflow-hidden bg-slate-800">
                    <img
                      src={foto || "/placeholder.svg"}
                      alt={`Foto ${index + 1}`}
                      className="w-full h-full object-cover"
                    />
                    <button
                      type="button"
                      onClick={() => removeFoto(index)}
                      className="absolute top-2 right-2 w-6 h-6 rounded-full bg-red-500 flex items-center justify-center hover:bg-red-600"
                    >
                      <X className="w-4 h-4 text-white" />
                    </button>
                  </div>
                ))}
              </div>
            )}
          </div>

{/* Observações */}
          <div>
            <label className="block text-white font-medium mb-2">{t("observations")}</label>
            <textarea
              value={observacoes}
              onChange={(e) => setObservacoes(e.target.value)}
              placeholder={t("observationsPlaceholder")}
              rows={3}
              className="w-full bg-[#1a2738] text-white rounded-2xl px-4 py-3 focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
            />
          </div>

{/* Submit */}
          <Button type="submit" className="w-full bg-blue-500 text-white hover:bg-blue-600 h-14 text-lg rounded-2xl">
            {t("createInvoice")}
          </Button>
        </form>
      </div>
    </div>
  )
}
[V0_FILE]typescriptreact:file="app/criar-orcamento/page.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import type React from "react"

import { useEffect, useState } from "react"
import { useRouter } from "next/navigation"
import { Plus, Trash2, ChevronDown, Camera, X } from "lucide-react"
import { getClientes, saveFatura, getFaturas } from "@/lib/storage"
import type { Cliente, Fatura, ItemFatura } from "@/types"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { useTranslations } from "@/hooks/use-translations"

export default function CriarOrcamentoPage() {
  const { t } = useTranslations()
  const router = useRouter()
  const [clientes, setClientes] = useState<Cliente[]>([])
  const [selectedCliente, setSelectedCliente] = useState<string>("")
  const [moeda, setMoeda] = useState<"BRL" | "GBP">("BRL")
  const [tipoDoc, setTipoDoc] = useState<"items" | "trabalho">("items")
  const [items, setItems] = useState<ItemFatura[]>([{ id: "1", descricao: "", quantidade: 1, preco: 0 }])
  const [trabalhoDescricao, setTrabalhoDescricao] = useState("")
  const [trabalhoValor, setTrabalhoValor] = useState(0)
  const [observacoes, setObservacoes] = useState("")
  const [taxaImposto, setTaxaImposto] = useState(20)
  const [taxaDesconto, setTaxaDesconto] = useState(0)
  const [fotos, setFotos] = useState<string[]>([])

useEffect(() => {
    setClientes(getClientes())
  }, [])

const addItem = () => {
    setItems([
      ...items,
      {
        id: Date.now().toString(),
        descricao: "",
        quantidade: 1,
        preco: 0,
      },
    ])
  }

const removeItem = (id: string) => {
    if (items.length > 1) {
      setItems(items.filter((item) => item.id !== id))
    }
  }

const updateItem = (id: string, field: keyof ItemFatura, value: any) => {
    setItems(items.map((item) => (item.id === id ? { ...item, [field]: value } : item)))
  }

const calculateSubtotal = () => {
    if (tipoDoc === "trabalho") {
      return trabalhoValor
    }
    return items.reduce((sum, item) => sum + item.quantidade * item.preco, 0)
  }

const subtotal = calculateSubtotal()
  const valorImposto = (subtotal * taxaImposto) / 100
  const valorDesconto = (subtotal * taxaDesconto) / 100
  const total = subtotal + valorImposto - valorDesconto

const handleFotoUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
    const files = e.target.files
    if (files) {
      Array.from(files).forEach((file) => {
        const reader = new FileReader()
        reader.onloadend = () => {
          setFotos((prev) => [...prev, reader.result as string])
        }
        reader.readAsDataURL(file)
      })
    }
  }

const removeFoto = (index: number) => {
    setFotos((prev) => prev.filter((_, i) => i !== index))
  }

const handleSubmit = (e: React.FormEvent) => {
    e.preventDefault()

if (!selectedCliente) {
      alert("Por favor, selecione um cliente")
      return
    }

if (tipoDoc === "trabalho" && (!trabalhoDescricao || trabalhoValor <= 0)) {
      alert("Por favor, preencha a descrição e valor do trabalho")
      return
    }

const faturas = getFaturas()
    const numero = `ORC-${(faturas.filter((f) => f.tipo === "orcamento").length + 1).toString().padStart(5, "0")}`

const finalItems =
      tipoDoc === "trabalho" ? [{ id: "1", descricao: trabalhoDescricao, quantidade: 1, preco: trabalhoValor }] : items

const orcamento: Fatura = {
      id: Date.now().toString(),
      numero,
      clienteId: selectedCliente,
      items: finalItems,
      moeda,
      taxaImposto,
      taxaDesconto,
      observacoes,
      tipo: "orcamento",
      status: "rascunho",
      dataEmissao: new Date().toISOString(),
      subtotal,
      valorImposto,
      valorDesconto,
      total,
      fotos,
    }

saveFatura(orcamento)
    router.push("/documentos")
  }

return (
    <div className="min-h-screen p-4 pb-24">
      <div className="max-w-2xl mx-auto">
        <div className="mb-6 text-center">
          <h1 className="text-2xl font-bold text-white mb-2">{t("createEstimateTitle")}</h1>
          <h2 className="text-3xl font-bold text-white">{t("createEstimate")}</h2>
        </div>

<form onSubmit={handleSubmit} className="space-y-6">
          <div>
            <label className="block text-white font-medium mb-2">{t("client")}</label>
            <div className="relative">
              <select
                value={selectedCliente}
                onChange={(e) => setSelectedCliente(e.target.value)}
                className="w-full bg-[#1a2738] text-white rounded-2xl px-4 py-4 pr-10 appearance-none focus:outline-none focus:ring-2 focus:ring-blue-500"
                required
              >
                <option value="">{t("selectClient")}</option>
                {clientes.map((cliente) => (
                  <option key={cliente.id} value={cliente.id}>
                    {cliente.nome}
                  </option>
                ))}
              </select>
              <ChevronDown className="absolute right-4 top-1/2 -translate-y-1/2 w-5 h-5 text-slate-400 pointer-events-none" />
            </div>
          </div>

<div>
            <label className="block text-white font-medium mb-2">{t("currency")}</label>
            <div className="relative">
              <select
                value={moeda}
                onChange={(e) => setMoeda(e.target.value as "BRL" | "GBP")}
                className="w-full bg-[#1a2738] text-white rounded-2xl px-4 py-4 pr-10 appearance-none focus:outline-none focus:ring-2 focus:ring-blue-500"
              >
                <option value="BRL">{t("brlCurrency")}</option>
                <option value="GBP">{t("gbpCurrency")}</option>
              </select>
              <ChevronDown className="absolute right-4 top-1/2 -translate-y-1/2 w-5 h-5 text-slate-400 pointer-events-none" />
            </div>
          </div>

<div className="flex gap-3">
            <button
              type="button"
              onClick={() => setTipoDoc("items")}
              className={`flex-1 py-3 rounded-2xl font-medium transition-colors ${
                tipoDoc === "items" ? "bg-blue-500 text-white" : "bg-[#1a2738] text-slate-400"
              }`}
            >
              {t("items")}
            </button>
            <button
              type="button"
              onClick={() => setTipoDoc("trabalho")}
              className={`flex-1 py-3 rounded-2xl font-medium transition-colors ${
                tipoDoc === "trabalho" ? "bg-blue-500 text-white" : "bg-[#1a2738] text-slate-400"
              }`}
            >
              {t("workDone")}
            </button>
          </div>

{tipoDoc === "items" ? (
            <div>
              <div className="flex items-center justify-between mb-4">
                <label className="text-white font-medium">{t("items")}</label>
                <button
                  type="button"
                  onClick={addItem}
                  className="w-10 h-10 rounded-xl bg-blue-500 flex items-center justify-center hover:bg-blue-600"
                >
                  <Plus className="w-5 h-5 text-white" />
                </button>
              </div>

<div className="space-y-4">
                {items.map((item, index) => (
                  <div key={item.id} className="bg-[#1a2738] rounded-2xl p-4">
                    <div className="flex items-center justify-between mb-3">
                      <span className="text-blue-400 font-medium">
                        {t("item")} {index + 1}
                      </span>
                      {items.length > 1 && (
                        <button
                          type="button"
                          onClick={() => removeItem(item.id)}
                          className="text-red-400 hover:text-red-300"
                        >
                          <Trash2 className="w-5 h-5" />
                        </button>
                      )}
                    </div>
                    <Input
                      placeholder={t("description")}
                      value={item.descricao}
                      onChange={(e) => updateItem(item.id, "descricao", e.target.value)}
                      className="bg-[#0f1c2e] border-slate-700 text-white mb-3"
                      required
                    />
                    <div className="grid grid-cols-2 gap-3">
                      <div>
                        <label className="block text-sm text-slate-400 mb-2">{t("quantity")}</label>
                        <Input
                          type="number"
                          min="1"
                          value={item.quantidade}
                          onChange={(e) => updateItem(item.id, "quantidade", Number.parseInt(e.target.value) || 1)}
                          className="bg-[#0f1c2e] border-slate-700 text-white"
                        />
                      </div>
                      <div>
                        <label className="block text-sm text-slate-400 mb-2">
                          {t("price")} ({moeda === "BRL" ? "R$" : "£"})
                        </label>
                        <Input
                          type="number"
                          step="0.01"
                          min="0"
                          value={item.preco}
                          onChange={(e) => updateItem(item.id, "preco", Number.parseFloat(e.target.value) || 0)}
                          className="bg-[#0f1c2e] border-slate-700 text-white"
                        />
                      </div>
                    </div>
                    <div className="mt-3 text-right">
                      <span className="text-slate-400 text-sm">{t("total")}: </span>
                      <span className="text-white font-semibold">
                        {moeda === "BRL" ? "R$" : "£"} {(item.quantidade * item.preco).toFixed(2)}
                      </span>
                    </div>
                  </div>
                ))}
              </div>
            </div>
          ) : (
            <div>
              <label className="block text-white font-medium mb-4">{t("workDone")}</label>
              <div className="bg-[#1a2738] rounded-2xl p-4 space-y-4">
                <div>
                  <label className="block text-sm text-slate-400 mb-2">{t("workDescription")}</label>
                  <textarea
                    value={trabalhoDescricao}
                    onChange={(e) => setTrabalhoDescricao(e.target.value)}
                    placeholder={t("describeWork")}
                    rows={4}
                    className="w-full bg-[#0f1c2e] text-white rounded-xl px-4 py-3 focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
                    required
                  />
                </div>
                <div>
                  <label className="block text-sm text-slate-400 mb-2">
                    {t("totalValue")} ({moeda === "BRL" ? "R$" : "£"})
                  </label>
                  <Input
                    type="number"
                    step="0.01"
                    min="0"
                    value={trabalhoValor}
                    onChange={(e) => setTrabalhoValor(Number.parseFloat(e.target.value) || 0)}
                    className="bg-[#0f1c2e] border-slate-700 text-white"
                    placeholder="0.00"
                    required
                  />
                </div>
              </div>
            </div>
          )}

<div className="bg-[#0f1c2e] rounded-xl p-4">
              <div className="flex items-center gap-3 mb-2">
                <span className="text-blue-400 text-sm">{t("taxRate")}</span>
                <div className="flex-1 flex items-center gap-2">
                  <Input
                    type="number"
                    min="0"
                    max="100"
                    step="0.01"
                    value={taxaImposto}
                    onChange={(e) => setTaxaImposto(Number.parseFloat(e.target.value) || 0)}
                    className="w-20 bg-[#1a2738] border-slate-700 text-white text-center"
                  />
                  <span className="text-white">%</span>
                </div>
              </div>
              <div className="text-right">
                <span className="text-slate-400 text-sm">{t("taxValue")}: </span>
                <span className="text-white font-semibold">
                  {moeda === "BRL" ? "R$" : "£"} {valorImposto.toFixed(2)}
                </span>
              </div>
            </div>

<div className="bg-[#0f1c2e] rounded-xl p-4">
              <div className="flex items-center gap-3 mb-2">
                <span className="text-green-400 text-sm">{t("discountRate")}</span>
                <div className="flex-1 flex items-center gap-2">
                  <Input
                    type="number"
                    min="0"
                    max="100"
                    step="0.01"
                    value={taxaDesconto}
                    onChange={(e) => setTaxaDesconto(Number.parseFloat(e.target.value) || 0)}
                    className="w-20 bg-[#1a2738] border-slate-700 text-white text-center"
                  />
                  <span className="text-white">%</span>
                </div>
              </div>
              <div className="text-right">
                <span className="text-slate-400 text-sm">{t("discountValue")}: </span>
                <span className="text-green-400 font-semibold">
                  -{moeda === "BRL" ? "R$" : "£"} {valorDesconto.toFixed(2)}
                </span>
              </div>
            </div>

<div>
            <div className="flex items-center justify-between mb-2">
              <label className="text-white font-medium">{t("photos")}</label>
              <label className="w-12 h-12 rounded-xl bg-blue-500 flex items-center justify-center cursor-pointer hover:bg-blue-600">
                <Camera className="w-6 h-6 text-white" />
                <input type="file" accept="image/*" multiple onChange={handleFotoUpload} className="hidden" />
              </label>
            </div>
            <p className="text-slate-400 text-sm mb-4">{t("takePhotos")}</p>
            {fotos.length > 0 && (
              <div className="grid grid-cols-3 gap-3">
                {fotos.map((foto, index) => (
                  <div key={index} className="relative aspect-square rounded-xl overflow-hidden bg-slate-800">
                    <img
                      src={foto || "/placeholder.svg"}
                      alt={`Foto ${index + 1}`}
                      className="w-full h-full object-cover"
                    />
                    <button
                      type="button"
                      onClick={() => removeFoto(index)}
                      className="absolute top-2 right-2 w-6 h-6 rounded-full bg-red-500 flex items-center justify-center hover:bg-red-600"
                    >
                      <X className="w-4 h-4 text-white" />
                    </button>
                  </div>
                ))}
              </div>
            )}
          </div>

<div>
            <label className="block text-white font-medium mb-2">{t("observations")}</label>
            <textarea
              value={observacoes}
              onChange={(e) => setObservacoes(e.target.value)}
              placeholder={t("additionalNotes")}
              rows={3}
              className="w-full bg-[#1a2738] text-white rounded-2xl px-4 py-3 focus:outline-none focus:ring-2 focus:ring-blue-500 resize-none"
            />
          </div>

<Button type="submit" className="w-full bg-blue-500 text-white hover:bg-blue-600 h-14 text-lg rounded-2xl">
            {t("createEstimate")}
          </Button>
        </form>
      </div>
    </div>
  )
}
[V0_FILE]typescript:file="lib/translations.ts" isEdit="true" isQuickEdit="true"
export const translations = {
  "pt-BR": {
    // Navegação
    home: "Início",
    clients: "Clientes",
    documents: "Documentos",
    profile: "Perfil",
    settings: "Configurações",

// Página Inicial
    totalRevenue: "RECEITA TOTAL",
    pendingPayments: "PAGAMENTOS PENDENTES",
    quickActions: "Ações Rápidas",
    invoices: "Faturas",
    estimates: "Orçamentos",
    createInvoice: "Criar Fatura",
    newInvoice: "Nova fatura para cliente",
    createEstimate: "Criar Orçamento",
    sendEstimate: "Enviar um orçamento",
    addClient: "Adicionar Cliente",
    newClientDetails: "Novos detalhes do cliente",
    allDocuments: "Todas as faturas e orçamentos",

// Clientes
    searchClients: "Buscar clientes...",
    addClientTitle: "Adicionar Cliente",
    name: "Nome",
    email: "E-mail",
    phone: "Telefone",
    address: "Endereço",
    save: "Salvar",
    cancel: "Cancelar",
    edit: "Editar",
    noClients: "Nenhum cliente encontrado",

// Documentos
    invoice: "Fatura",
    estimate: "Orçamento",
    paid: "Pago",
    pending: "Pendente",
    draft: "Rascunho",
    noDocuments: "Nenhum documento encontrado",
    filter: "Filtrar",
    all: "Todos",

// Criar Fatura/Orçamento
    createInvoiceTitle: "Criar Fatura",
    createEstimateTitle: "Criar Orçamento",
    client: "Cliente",
    selectClient: "Selecionar Cliente",
    currency: "Moeda",
    brlCurrency: "R$ BRL - Real Brasileiro",
    gbpCurrency: "£ GBP - Libra Esterlina",
    items: "Items",
    workDone: "Trabalho Feito",
    addItem: "Adicionar Item",
    item: "Item",
    description: "Descrição",
    quantity: "Qtd",
    price: "Preço",
    total: "Total",
    totalValue: "Valor Total",
    taxRate: "Taxa de Imposto",
    taxValue: "Valor do Imposto",
    discountRate: "Desconto",
    discount: "Desconto",
    discountValue: "Valor do Desconto",
    subtotal: "Subtotal",
    observations: "Observações",
    workDescription: "Descrição do Trabalho",
    workDescriptionPlaceholder: "Descreva o trabalho realizado...",
    describeWork: "Descreva o trabalho realizado...",
    observationsPlaceholder: "Adicione observações adicionais...",
    additionalNotes: "Adicione observações adicionais...",
    photos: "Fotos (Opcional)",
    photosDescription: "Tire fotos como comprovação do serviço",
    takePhotos: "Tire fotos como comprovação do serviço",
    removePhoto: "Remover foto",

// Detalhes do Documento
    invoiceDetails: "Detalhes da Fatura",
    estimateDetails: "Detalhes do Orçamento",
    back: "Voltar",
    customerDetails: "Detalhes do Cliente",
    lineItems: "Itens",
    markAsPaid: "Marcar como Pago",
    markAsPending: "Marcar como Pendente",
    share: "Compartilhar",
    exportPdf: "Exportar PDF",
    delete: "Excluir",
    servicePhotos: "Fotos do Serviço",
    date: "Data",
    generatedBy: "Gerado por",

// Perfil
    companyProfile: "Perfil da Empresa",
    companyLogo: "Logo da Empresa",
    clickToChange: "Toque para alterar o logo",
    companyName: "Nome da Empresa",
    taxId: "CNPJ",
    saveChanges: "Salvar Alterações",

// Configurações
    settingsTitle: "Configurações",
    language: "Idioma",
    chooseLanguage: "Escolha seu idioma preferido",
    portugueseBrazil: "Português (Brasil)",
    englishUS: "English (US)",
    chooseCurrency: "Escolha sua moeda preferida",
    pdfTemplate: "Modelo de PDF",
    choosePdfStyle: "Escolha o estilo do seu modelo de PDF",
    standardTemplate: "Modelo Padrão",
    modernTemplate: "Modelo Moderno",
    minimalistTemplate: "Modelo Minimalista",
    customization: "Personalização",
    customizeColors: "Personalize as cores do aplicativo",
    primaryBackground: "Cor de Fundo Primária",
    secondaryBackground: "Cor de Fundo Secundária",
    exportBackup: "Exportar Backup",
    exportBackupDesc: "Exporte todos os seus dados para um arquivo",
    importBackup: "Importar Backup",
    importBackupDesc: "Restaure dados de um arquivo de backup",

// Compartilhamento
    shareVia: "Compartilhar via",
    whatsapp: "WhatsApp",
    copyText: "Copiar Texto",
    textCopied: "Texto copiado!",
    howToShare: "Como deseja compartilhar?",
    enterNumber: "Digite o número",
    errorGeneratingPdf: "Erro ao gerar PDF. Por favor, tente novamente.",

// Ações
    confirm: "Confirmar",
    close: "Fechar",
    noClientsFound: "Nenhum cliente encontrado",
    noDocumentsFound: "Nenhum documento encontrado",
    cnpj: "CNPJ",
    tapToChange: "Toque para alterar",
  },
  "en-US": {
    // Navigation
    home: "Home",
    clients: "Clients",
    documents: "Documents",
    profile: "Profile",
    settings: "Settings",

// Home Page
    totalRevenue: "TOTAL REVENUE",
    pendingPayments: "PENDING PAYMENTS",
    quickActions: "Quick Actions",
    invoices: "Invoices",
    estimates: "Estimates",
    createInvoice: "Create Invoice",
    newInvoice: "New invoice for client",
    createEstimate: "Create Estimate",
    sendEstimate: "Send an estimate",
    addClient: "Add Client",
    newClientDetails: "New client details",
    allDocuments: "All invoices and estimates",

// Clients
    searchClients: "Search clients...",
    addClientTitle: "Add Client",
    name: "Name",
    email: "Email",
    phone: "Phone",
    address: "Address",
    save: "Save",
    cancel: "Cancel",
    edit: "Edit",
    noClients: "No clients found",

// Documents
    invoice: "Invoice",
    estimate: "Estimate",
    paid: "Paid",
    pending: "Pending",
    draft: "Draft",
    noDocuments: "No documents found",
    filter: "Filter",
    all: "All",

// Create Invoice/Estimate
    createInvoiceTitle: "Create Invoice",
    createEstimateTitle: "Create Estimate",
    client: "Client",
    selectClient: "Select Client",
    currency: "Currency",
    brlCurrency: "R$ BRL - Brazilian Real",
    gbpCurrency: "£ GBP - British Pound",
    items: "Items",
    workDone: "Work Done",
    addItem: "Add Item",
    item: "Item",
    description: "Description",
    quantity: "Qty",
    price: "Price",
    total: "Total",
    totalValue: "Total Value",
    taxRate: "Tax Rate",
    taxValue: "Tax Value",
    discountRate: "Discount",
    discount: "Discount",
    discountValue: "Discount Value",
    subtotal: "Subtotal",
    observations: "Observations",
    workDescription: "Work Description",
    workDescriptionPlaceholder: "Describe the work performed...",
    describeWork: "Describe the work performed...",
    observationsPlaceholder: "Add additional notes...",
    additionalNotes: "Add additional notes...",
    photos: "Photos (Optional)",
    photosDescription: "Take photos as proof of service",
    takePhotos: "Take photos as proof of service",
    removePhoto: "Remove photo",

// Document Details
    invoiceDetails: "Invoice Details",
    estimateDetails: "Estimate Details",
    back: "Back",
    customerDetails: "Customer Details",
    lineItems: "Line Items",
    markAsPaid: "Mark as Paid",
    markAsPending: "Mark as Pending",
    share: "Share",
    exportPdf: "Export PDF",
    delete: "Delete",
    servicePhotos: "Service Photos",
    date: "Date",
    generatedBy: "Generated by",

// Profile
    companyProfile: "Company Profile",
    companyLogo: "Company Logo",
    clickToChange: "Tap to change logo",
    companyName: "Company Name",
    taxId: "Tax ID",
    saveChanges: "Save Changes",

// Settings
    settingsTitle: "Settings",
    language: "Language",
    chooseLanguage: "Choose your preferred language",
    portugueseBrazil: "Português (Brasil)",
    englishUS: "English (US)",
    chooseCurrency: "Choose your preferred currency",
    pdfTemplate: "PDF Template",
    choosePdfStyle: "Choose your PDF template style",
    standardTemplate: "Standard Template",
    modernTemplate: "Modern Template",
    minimalistTemplate: "Minimalist Template",
    customization: "Customization",
    customizeColors: "Customize app colors",
    primaryBackground: "Primary Background Color",
    secondaryBackground: "Secondary Background Color",
    exportBackup: "Export Backup",
    exportBackupDesc: "Export all your data to a file",
    importBackup: "Import Backup",
    importBackupDesc: "Restore data from a backup file",

// Sharing
    shareVia: "Share via",
    whatsapp: "WhatsApp",
    copyText: "Copy Text",
    textCopied: "Text copied!",
    howToShare: "How would you like to share?",
    enterNumber: "Enter number",
    errorGeneratingPdf: "Error generating PDF. Please try again.",

// Actions
    confirm: "Confirm",
    close: "Close",
    noClientsFound: "No clients found",
    noDocumentsFound: "No documents found",
    cnpj: "Tax ID",
    tapToChange: "Tap to change",
  },
}

export type TranslationKey = keyof (typeof translations)["pt-BR"]
export type Language = keyof typeof translations</article></body></html>

{empresa?.nome || "Invoicex"}

{t("quickActions")}

{t("createInvoice")}

{t("createEstimate")}

{t("addClient")}

{t("documents")}

{t("settingsTitle")}

{t("language")}

{t("currency")}

{t("pdfTemplate")}

{t("customization")}

{t("exportBackup")}

{t("importBackup")}

{t("clients")}

{cliente.nome}

{editingCliente ? "Editar Cliente" : t("addClient")}

{t("documents")}

{fatura.numero}

{documento.tipo === "fatura" ? t("invoiceDetails") : t("estimateDetails")}

{documento.numero}

{t("customerDetails")}

{cliente.nome}

{t("lineItems")}

{item.descricao}

{t("servicePhotos")}

{t("observations")}

{t("profile")}

{t("createInvoiceTitle")}

{t("createInvoice")}