Daily Tracker Pro
import React, { useState, useEffect } from 'react'; import { Calculator, TrendingUp, DollarSign } from 'lucide-react'; export default function MarketingCalculator() { const [values, setValues] = useState({ investimento: 10000, cpm: 20, impressoes: 500000, cpc: 1, ctr: 2, cliques: 10000, cpl: 10, txConvLeads: 10, leads: 1000, cpv: 200, txConvVendas: 5, vendas: 50, ticketMedio: 500, faturamento: 25000, roas: 2.5 }); const [editingField, setEditingField] = useState(null); const [tempValue, setTempValue] = useState(''); const calculate = (field, value) => { const newValues = { ...values, [field]: parseFloat(value) || 0 }; // Recalcula baseado no campo editado switch (field) { case 'investimento': newValues.impressoes = (newValues.investimento / newValues.cpm) * 1000; newValues.cliques = newValues.impressoes * (newValues.ctr / 100); newValues.cpc = newValues.cliques > 0 ? newValues.investimento / newValues.cliques : 0; newValues.leads = newValues.cliques * (newValues.txConvLeads / 100); newValues.cpl = newValues.leads > 0 ? newValues.investimento / newValues.leads : 0; newValues.vendas = newValues.leads * (newValues.txConvVendas / 100); newValues.cpv = newValues.vendas > 0 ? newValues.investimento / newValues.vendas : 0; newValues.faturamento = newValues.vendas * newValues.ticketMedio; newValues.roas = newValues.investimento > 0 ? newValues.faturamento / newValues.investimento : 0; break; case 'cpm': newValues.impressoes = (newValues.investimento / newValues.cpm) * 1000; newValues.cliques = newValues.impressoes * (newValues.ctr / 100); newValues.cpc = newValues.cliques > 0 ? newValues.investimento / newValues.cliques : 0; break; case 'impressoes': newValues.cpm = newValues.impressoes > 0 ? (newValues.investimento / newValues.impressoes) * 1000 : 0; newValues.cliques = newValues.impressoes * (newValues.ctr / 100); newValues.cpc = newValues.cliques > 0 ? newValues.investimento / newValues.cliques : 0; break; case 'ctr': newValues.cliques = newValues.impressoes * (newValues.ctr / 100); newValues.cpc = newValues.cliques > 0 ? newValues.investimento / newValues.cliques : 0; newValues.leads = newValues.cliques * (newValues.txConvLeads / 100); newValues.cpl = newValues.leads > 0 ? newValues.investimento / newValues.leads : 0; break; case 'cpc': newValues.cliques = newValues.cpc > 0 ? newValues.investimento / newValues.cpc : 0; newValues.ctr = newValues.impressoes > 0 ? (newValues.cliques / newValues.impressoes) * 100 : 0; newValues.leads = newValues.cliques * (newValues.txConvLeads / 100); newValues.cpl = newValues.leads > 0 ? newValues.investimento / newValues.leads : 0; break; case 'cliques': newValues.cpc = newValues.cliques > 0 ? newValues.investimento / newValues.cliques : 0; newValues.ctr = newValues.impressoes > 0 ? (newValues.cliques / newValues.impressoes) * 100 : 0; newValues.leads = newValues.cliques * (newValues.txConvLeads / 100); newValues.cpl = newValues.leads > 0 ? newValues.investimento / newValues.leads : 0; break; case 'txConvLeads': newValues.leads = newValues.cliques * (newValues.txConvLeads / 100); newValues.cpl = newValues.leads > 0 ? newValues.investimento / newValues.leads : 0; newValues.vendas = newValues.leads * (newValues.txConvVendas / 100); newValues.cpv = newValues.vendas > 0 ? newValues.investimento / newValues.vendas : 0; break; case 'cpl': newValues.leads = newValues.cpl > 0 ? newValues.investimento / newValues.cpl : 0; newValues.txConvLeads = newValues.cliques > 0 ? (newValues.leads / newValues.cliques) * 100 : 0; newValues.vendas = newValues.leads * (newValues.txConvVendas / 100); newValues.cpv = newValues.vendas > 0 ? newValues.investimento / newValues.vendas : 0; break; case 'leads': newValues.cpl = newValues.leads > 0 ? newValues.investimento / newValues.leads : 0; newValues.txConvLeads = newValues.cliques > 0 ? (newValues.leads / newValues.cliques) * 100 : 0; newValues.vendas = newValues.leads * (newValues.txConvVendas / 100); newValues.cpv = newValues.vendas > 0 ? newValues.investimento / newValues.vendas : 0; break; case 'txConvVendas': newValues.vendas = newValues.leads * (newValues.txConvVendas / 100); newValues.cpv = newValues.vendas > 0 ? newValues.investimento / newValues.vendas : 0; newValues.faturamento = newValues.vendas * newValues.ticketMedio; newValues.roas = newValues.investimento > 0 ? newValues.faturamento / newValues.investimento : 0; break; case 'cpv': newValues.vendas = newValues.cpv > 0 ? newValues.investimento / newValues.cpv : 0; newValues.txConvVendas = newValues.leads > 0 ? (newValues.vendas / newValues.leads) * 100 : 0; newValues.faturamento = newValues.vendas * newValues.ticketMedio; newValues.roas = newValues.investimento > 0 ? newValues.faturamento / newValues.investimento : 0; break; case 'vendas': newValues.cpv = newValues.vendas > 0 ? newValues.investimento / newValues.vendas : 0; newValues.txConvVendas = newValues.leads > 0 ? (newValues.vendas / newValues.leads) * 100 : 0; newValues.faturamento = newValues.vendas * newValues.ticketMedio; newValues.roas = newValues.investimento > 0 ? newValues.faturamento / newValues.investimento : 0; break; case 'ticketMedio': newValues.faturamento = newValues.vendas * newValues.ticketMedio; newValues.roas = newValues.investimento > 0 ? newValues.faturamento / newValues.investimento : 0; break; case 'faturamento': newValues.ticketMedio = newValues.vendas > 0 ? newValues.faturamento / newValues.vendas : 0; newValues.roas = newValues.investimento > 0 ? newValues.faturamento / newValues.investimento : 0; break; } setValues(newValues); }; const formatNumber = (num, decimals = 2) => { return num.toLocaleString('pt-BR', { minimumFractionDigits: decimals, maximumFractionDigits: decimals }); }; const formatCurrency = (num) => { return `R$ ${formatNumber(num, 2)}`; }; const InputField = ({ label, field, isCurrency = false, isPercentage = false, decimals = 2 }) => (
setTempValue(e.target.value)} onFocus={(e) => { setEditingField(field); setTempValue(''); }} onBlur={() => { if (tempValue !== '') { calculate(field, tempValue); } setEditingField(null); setTempValue(''); }} onKeyDown={(e) => { if (e.key === 'Enter') { if (tempValue !== '') { calculate(field, tempValue); } setEditingField(null); setTempValue(''); e.target.blur(); } }} className="w-full text-lg font-bold text-gray-800 bg-gray-50 border-2 border-gray-300 rounded px-3 py-2 focus:outline-none focus:border-blue-500" />
); return (

Calculadora de Marketing Digital

Altere qualquer valor e veja o impacto em toda a cadeia de métricas

{/* Linha 1: Topo do Funil */}

Topo do Funil - Awareness

{/* Linha 2: Engajamento */}

Engajamento Inicial

{/* Linha 3: Conversão em Leads */}

Conversão em Leads

{/* Linha 4: Conversão em Vendas */}

Conversão em Vendas

{/* Linha 5: Receita */}

Receita

{/* ROAS - Destaque */}

ROAS (Return on Ad Spend)

{formatNumber(values.roas, 2)}x

Para cada R$ 1 investido, você obtém R$ {formatNumber(values.roas, 2)} de retorno

{/* Resumo */}

Resumo do Funil

{formatNumber(values.impressoes, 0)}
Impressões
{formatNumber(values.cliques, 0)}
Cliques
{formatNumber(values.leads, 0)}
Leads
{formatNumber(values.vendas, 0)}
Vendas
); }