Color	Muestra	SKU	Stock

ADAPTADOR TRAVELER

Name: ADAPTADOR TRAVELER
SKU: ADC 008-
Availability: OutOfStock

CODIGO: ADC 008-

Adaptador universal con entrada USB

Ficha Tecnica

Descripcion	Adaptador universal con entrada USB
Material	Plástico
Medidas	9.2 x 6 cm
Peso Neto	14.6
Peso Bruto	17.0
Unidad Volumen	CM3
Tecnica Impresion	Serigrafia
Area Impresion	7 x 4 cm
Piezas Caja	100
Piezas Inner	10
Caja Individual	SI
Unidad Peso	KG

Peso y colores

Peso	17 kg
Dimensiones	0.34 × 0.595 × 0.235 cm
COLOR	BLANCO

// Widget de Chat CHANNEL (function() { // Cria o elemento do widget const widgetHTML = `

WEBChat

`; // Adiciona o widget ao documento document.body.insertAdjacentHTML('beforeend', widgetHTML); // Inicializa o widget const chatButton = document.getElementById('channel-chat-button'); const chatContainer = document.getElementById('channel-chat-container'); const chatClose = document.getElementById('channel-chat-close'); const chatClear = document.getElementById('channel-chat-clear'); const messagesDiv = document.getElementById('channel-chat-messages'); const messageInput = document.getElementById('channel-chat-input'); const sendButton = document.getElementById('channel-chat-send'); const sessionSpan = document.getElementById('channel-chat-session'); const widgetDiv = document.getElementById('channel-chat-widget'); // Variáveis globais para sessão e token let webchatId = null; let token = null; let ws = null; let chatLoaded = false; // Funções de controle do widget chatButton.addEventListener('click', async () => { chatContainer.classList.add('show'); if (!chatLoaded) { await loadMessageHistory(); connectWebSocket(); chatLoaded = true; } }); chatClose.addEventListener('click', () => { chatContainer.classList.remove('show'); }); // Função para gerar ID único de sessão function generateUniqueId() { const timestamp = Date.now().toString(36); const random = Math.random().toString(36).substring(2, 8); return `${timestamp}-${random}`; } function generateSessionId() { if (!sessionStorage.getItem('channelWebchatId')) { sessionStorage.setItem('channelWebchatId', generateUniqueId()); } return sessionStorage.getItem('channelWebchatId'); } // Função para registrar o usuário no backend async function registerWebchat() { webchatId = generateSessionId(); const name = 'WebChat ' + webchatId; const email = 'webchat@webchat.com'; const tenantId = '1'; const wabaId = 'a7709734-1d59-4415-8f1d-5c6bdd1bd2c3'; const websocketToken = '924c2431-ad94-4e36-8dea-77cf605b58f7'; console.log('[WebChat] Registrando sessão:', { webchatId, name, email, tenantId, wabaId }); const response = await fetch(`https://api.grafiart.net/webchat/register/${wabaId}`, { method: 'POST', headers: { 'Content-Type': 'application/json', 'x-websocket-token': websocketToken }, body: JSON.stringify({ webchatId, name, email, tenantId }) }); const data = await response.json(); token = data.token; console.log('[WebChat] Sessão registrada:', { webchatId, token }); return { webchatId, token }; } // Exibe o ID da sessão async function showSessionId() { const { webchatId } = await registerWebchat(); sessionSpan.textContent = `Sessão: ${webchatId}`; } showSessionId(); // Função para formatar hora function formatTime(dateString) { const date = new Date(dateString); return date.toLocaleTimeString('pt-BR', { hour: '2-digit', minute: '2-digit' }); } // Função para formatar texto estilo WhatsApp function formatWhatsapp(text) { return text.replace(/\*(.*?)\*/g, '$1'); } // Função para adicionar mensagem function appendMessage(text, type, time = '', ack = null, id = null) { const messageDiv = document.createElement('div'); if (id) messageDiv.id = 'msg-' + id; messageDiv.className = `channel-message ${type}`; let ackHtml = ''; if (type === 'channel-sent' && ack !== null && ack !== undefined) { ackHtml = `${getAckIcon(ack)}`; } messageDiv.innerHTML = `${formatWhatsapp(text)}
${time} ${ackHtml}`; messagesDiv.appendChild(messageDiv); messagesDiv.scrollTop = messagesDiv.scrollHeight; } // Função para atualizar o ack de uma mensagem function updateMessageAck(messageId, ack) { const msgDiv = document.getElementById('msg-' + messageId); if (msgDiv) { const ackSpan = msgDiv.querySelector('.channel-ack'); if (ackSpan) { ackSpan.innerHTML = getAckIcon(ack); } } } // Função para obter ícone do ack function getAckIcon(ack) { if (ack === 0) return '🕓'; if (ack === 1) return '✔️'; if (ack === 2) return '✔️'; if (ack === 3) return '✔️✔️'; if (ack === -1) return '❌'; return ''; } // Função para renderizar o histórico completo function renderHistory(messages) { messagesDiv.innerHTML = ''; messages.forEach(msg => { appendMessage( msg.body, msg.fromMe ? 'channel-received' : 'channel-sent', formatTime(msg.createdAt), msg.ack, msg.id ); }); } // Função para carregar histórico de mensagens async function loadMessageHistory() { try { const wabaId = 'a7709734-1d59-4415-8f1d-5c6bdd1bd2c3'; const websocketToken = '924c2431-ad94-4e36-8dea-77cf605b58f7'; const response = await fetch(`https://api.grafiart.net/webchat/messages/${wabaId}?from=${webchatId}&tenantId=1`, { headers: { 'x-websocket-token': websocketToken } }); const data = await response.json(); console.log('[WebChat] Histórico carregado:', data); if (Array.isArray(data)) { renderHistory(data); } else { console.warn('[WebChat] Resposta da API não é um array:', data); } } catch (error) { console.error('[WebChat] Erro ao carregar histórico:', error); } } // Função para gerar um ID temporário para mensagens enviadas function generateTempId() { return 'temp-' + Math.random().toString(36).substr(2, 9); } // Função para atualizar o ID de uma mensagem no DOM function updateMessageId(tempId, realId) { const tempDiv = document.getElementById('msg-' + tempId); if (tempDiv) { tempDiv.id = 'msg-' + realId; } } // Event listeners para envio de mensagem sendButton.addEventListener('click', async () => { const message = messageInput.value.trim(); if (message) { const tempId = generateTempId(); appendMessage(message, 'channel-sent', formatTime(new Date().toISOString()), 0, tempId); messageInput.value = ''; const data = { body: message, from: webchatId, name: webchatId, email: webchatId + '@webchat.com', tenantId: '1', event: 'messages.upsert', fromMe: false, channel: 'webchat', type: 'webchat', webchatId: webchatId }; console.log('[WebChat] Enviando mensagem:', data); try { const wabaId = 'a7709734-1d59-4415-8f1d-5c6bdd1bd2c3'; const websocketToken = '924c2431-ad94-4e36-8dea-77cf605b58f7'; const response = await fetch(`https://api.grafiart.net/webchat-webhook/${wabaId}`, { method: 'POST', headers: { 'Content-Type': 'application/json', 'x-websocket-token': websocketToken }, body: JSON.stringify(data) }); const respData = await response.json(); console.log('[WebChat] Resposta do backend:', respData); if (respData && respData.id) { updateMessageId(tempId, respData.id); } } catch (error) { console.error('[WebChat] Erro ao enviar mensagem:', error); } } }); messageInput.addEventListener('keypress', (e) => { if (e.key === 'Enter') { sendButton.click(); } }); // WebSocket para receber mensagens e ack em tempo real function connectWebSocket() { if (!webchatId || !token) return; let pingInterval; let historyInterval; let reconnectAttempts = 0; const MAX_RECONNECT_ATTEMPTS = 5; const RECONNECT_DELAY = 5000; const PING_INTERVAL = 30000; const HISTORY_INTERVAL = 60000; function connect() { const wabaId = 'a7709734-1d59-4415-8f1d-5c6bdd1bd2c3'; const websocketToken = '924c2431-ad94-4e36-8dea-77cf605b58f7'; ws = new WebSocket(`wss://websitechat.grafiart.net/wss?from=${webchatId}&token=${token}`); ws.onopen = () => { console.log('[WebChat] WebSocket conectado!'); reconnectAttempts = 0; pingInterval = setInterval(() => { if (ws.readyState === WebSocket.OPEN) { ws.send(JSON.stringify({ type: 'ping' })); } }, PING_INTERVAL); historyInterval = setInterval(async () => { if (ws.readyState === WebSocket.OPEN) { console.log('[WebChat] Buscando histórico periodicamente...'); await loadMessageHistory(); } }, HISTORY_INTERVAL); }; ws.onmessage = (event) => { try { const data = JSON.parse(event.data); console.log('[WebChat] Evento recebido do backend:', data); if (data.type === 'webhook' && data.payload && data.payload.message) { const msg = data.payload.message; appendMessage( msg.body, 'channel-received', formatTime(msg.createdAt), msg.ack, msg.id ); } if (data.type === 'ack_update' && data.payload) { updateMessageAck(data.payload.messageId, data.payload.ack); } if (data.type === 'pong') { console.log('[WebChat] Pong recebido'); } } catch (error) { console.error('[WebChat] Erro ao processar mensagem WebSocket:', error); } }; ws.onerror = (error) => { console.error('[WebChat] Erro na conexão WebSocket:', error); }; ws.onclose = () => { console.log('[WebChat] Conexão WebSocket fechada'); clearInterval(pingInterval); clearInterval(historyInterval); if (reconnectAttempts < MAX_RECONNECT_ATTEMPTS) { reconnectAttempts++; console.log(`[WebChat] Tentando reconectar (tentativa ${reconnectAttempts}/${MAX_RECONNECT_ATTEMPTS})...`); setTimeout(connect, RECONNECT_DELAY); } else { console.error('[WebChat] Número máximo de tentativas de reconexão atingido'); } }; } connect(); } // Função para limpar a sessão async function clearSession() { if (confirm('Tem certeza que deseja limpar a sessão e começar uma nova conversa?')) { messagesDiv.innerHTML = ''; sessionStorage.removeItem('channelWebchatId'); if (ws) { ws.close(); } webchatId = null; token = null; chatLoaded = false; await showSessionId(); await loadMessageHistory(); connectWebSocket(); } } chatClear.addEventListener('click', clearSession); })();

ADAPTADOR TRAVELER

PRODUCTOS SIMILARES

WEBChat