.font-jakarta { font-family: 'Plus Jakarta Sans', sans-serif; }
.border-success { border-color: #10b981 !important; background-color: #ecfdf5 !important; }
.text-success { color: #059669 !important; font-weight: 700 !important; }
.input-field { width: 100%; padding: 0.75rem; background-color: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.75rem; outline: none; transition: all 0.2s; font-size: 0.875rem; color: #334155; }
.input-field:focus { border-color: #6366f1; box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2); }
.label-field { display: block; font-size: 0.75rem; font-weight: 700; color: #64748b; margin-bottom: 0.25rem; text-transform: uppercase; letter-spacing: 0.05em; }
/* Animação de Loading */
.loader { border: 3px solid #f3f3f3; border-top: 3px solid #6366f1; border-radius: 50%; width: 20px; height: 20px; animation: spin 1s linear infinite; display: inline-block; vertical-align: middle; margin-right: 8px; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
Formatador mLabs Pro
Extração automática ao carregar imagem
(function() {
// === CONFIGURAÇÕES ===
var API_KEY = "SUA_CHAVE_AQUI";
var URL_PAGINA_DESTINO = "https://agenciazin.com.br/aprovacao-zin-cliente/";
// =====================
var fileInput = document.getElementById('mlabs_screenshot');
var btnGerar = document.getElementById('btn-gerar');
var btnCopiar = document.getElementById('btn-copiar');
var linkInput = document.getElementById('link-final');
var btnVer = document.getElementById('btn-ver-pagina');
var aiLoading = document.getElementById('ai-loading');
// Inputs
var inCliente = document.getElementById('input_cliente');
var inCodigo = document.getElementById('input_codigo');
var inData = document.getElementById('input_data');
var inCanais = document.getElementById('input_canais');
var inObs = document.getElementById('input_obs');
var inDesc = document.getElementById('input_desc');
// 1. AUTO-PREENCHIMENTO AO SUBIR IMAGEM
if(fileInput) {
fileInput.onchange = async function() {
if (this.files[0]) {
// UI Feedback
document.getElementById('texto-upload').innerHTML = '
✓ Imagem Carregada';
document.getElementById('area-upload').classList.add('border-success');
aiLoading.classList.remove('hidden'); // Mostra loading
try {
// Base64
var base64 = await new Promise(r => {
var reader = new FileReader();
reader.onloadend = () => r(reader.result.split(',')[1]);
reader.readAsDataURL(fileInput.files[0]);
});
// Gemini Call
var prompt = `Analise a imagem do mLabs. Extraia e separe:
- Cliente (Ex: Vlad Lobato)
- Código/ID (Ex: VL14_RP01)
- Data e Hora completas
- LISTA de Canais (Instagram, Youtube, Facebook, TikTok - todos que aparecerem)
- Texto da Legenda (Descrição)
- Texto de Observação (Se houver algo escrito Obs:)
Retorne JSON válido: { "cliente": "...", "codigo": "...", "data": "...", "canais": "...", "descricao": "...", "observacao": "..." }`;
var urlGemini = "https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent?key=" + API_KEY;
var resAI = await fetch(urlGemini, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ contents: [{ parts: [{ text: prompt }, { inlineData: { mimeType: fileInput.files[0].type, data: base64 } }] }] })
});
var dataAI = await resAI.json();
if(dataAI.error) {
// Tratamento para Quota Exceeded (429)
if(dataAI.error.code === 429 || dataAI.error.message.includes("quota")) {
alert("⚠️ Limite de velocidade da IA atingido. Aguarde 30 segundos e tente subir a imagem novamente.");
} else {
throw new Error(dataAI.error.message);
}
aiLoading.classList.add('hidden');
return;
}
var jsonTxt = dataAI.candidates[0].content.parts[0].text.replace(/```json|```/g, '').trim();
var dadosIA = JSON.parse(jsonTxt);
// Preencher campos
inCliente.value = dadosIA.cliente || "";
inCodigo.value = dadosIA.codigo || "";
inData.value = dadosIA.data || "";
inCanais.value = dadosIA.canais || "";
inDesc.value = dadosIA.descricao || "";
inObs.value = dadosIA.observacao || "";
} catch (error) {
console.error(error);
alert("Erro ao ler imagem: " + error.message);
} finally {
aiLoading.classList.add('hidden');
}
}
};
}
// 2. GERAR LINK
if(btnGerar) {
btnGerar.onclick = async function() {
if(btnGerar.disabled) return;
if (!fileInput.files[0] && inCliente.value === "") return alert("Preencha os dados ou suba uma imagem!");
// UI Changes
var textoOriginal = btnGerar.innerText;
btnGerar.disabled = true;
btnGerar.innerHTML = '
Gerando link...';
var payload = {
cliente: inCliente.value,
codigo: inCodigo.value,
data: inData.value,
canais: inCanais.value,
obs: inObs.value,
descricao: inDesc.value,
link_mlabs: document.getElementById('mlabs_link').value,
link_conteudo: document.getElementById('content_link').value
};
try {
var resWP = await fetch('/wp-json/aprovacao/v1/salvar', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(payload)
});
if(!resWP.ok) throw new Error("Erro ao salvar no site.");
var dataWP = await resWP.json();
var finalUrl = URL_PAGINA_DESTINO + "?id=" + dataWP.id;
linkInput.value = finalUrl;
btnVer.href = finalUrl;
// Sucesso
document.getElementById('resultado-container').classList.remove('hidden');
btnGerar.classList.remove('bg-indigo-600', 'hover:bg-indigo-700');
btnGerar.classList.add('bg-emerald-500');
btnGerar.innerHTML = '
Link gerado com sucesso!';
} catch(e) {
alert("Erro ao gerar link: " + e.message);
btnGerar.disabled = false;
btnGerar.innerText = textoOriginal;
}
};
}
if(btnCopiar) {
btnCopiar.onclick = function() {
linkInput.select();
document.execCommand("copy");
alert("Copiado!");
};
}
})();