nucleo000/whatsappNucleo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Agregar botones de debug en header de lista de chats y ventana de chat
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m2s
Details

Browse Source
This commit is contained in:
josedario87
2025-12-02 20:25:15 -06:00
parent ea5c5943df
commit a750bd9163
1 changed files with 47 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
app/pages/messages/index.vue
View File

@@ -53,11 +53,29 @@
<!-- Chat List -->
<div class="col-span-4 instance-card overflow-hidden flex flex-col">
<div class="p-4 border-b border-[var(--wa-border)]">
<UInput
v-model="searchQuery"
placeholder="Buscar conversacion..."
icon="i-lucide-search"
/>
<div class="flex items-center gap-2">
<UInput
v-model="searchQuery"
placeholder="Buscar conversacion..."
icon="i-lucide-search"
class="flex-1"
/>
<button
@click="showChatsDebug = !showChatsDebug"
class="text-xs px-2 py-2 rounded bg-gray-700 hover:bg-gray-600 text-gray-300"
title="Debug chats array"
>
<UIcon name="i-lucide-bug" class="w-4 h-4" />
</button>
</div>
<!-- Chats Debug Panel -->
<div
v-if="showChatsDebug"
class="mt-2 p-2 rounded bg-gray-900 border border-gray-700 text-xs font-mono max-h-60 overflow-auto"
>
<div class="text-gray-400 mb-1">Chats ({{ chats.length }}):</div>
<pre class="text-green-400 whitespace-pre-wrap">{{ JSON.stringify(chats, null, 2) }}</pre>
</div>
</div>
<div class="flex-1 overflow-y-auto">
@@ -89,11 +107,28 @@
<template v-else>
<!-- Chat Header -->
<div class="p-4 border-b border-[var(--wa-border)] flex items-center gap-3">
<UAvatar :alt="selectedChat.name" size="md" />
<div>
<p class="font-medium text-[var(--wa-text)]">{{ selectedChat.name }}</p>
<p class="text-sm text-[var(--wa-text-muted)]">{{ selectedChat.jid }}</p>
<div class="p-4 border-b border-[var(--wa-border)]">
<div class="flex items-center gap-3">
<UAvatar :alt="selectedChat.name" size="md" />
<div class="flex-1">
<p class="font-medium text-[var(--wa-text)]">{{ selectedChat.name }}</p>
<p class="text-sm text-[var(--wa-text-muted)]">{{ selectedChat.jid }}</p>
</div>
<button
@click="showSelectedChatDebug = !showSelectedChatDebug"
class="text-xs px-2 py-2 rounded bg-gray-700 hover:bg-gray-600 text-gray-300"
title="Debug selected chat"
>
<UIcon name="i-lucide-bug" class="w-4 h-4" />
</button>
</div>
<!-- Selected Chat Debug Panel -->
<div
v-if="showSelectedChatDebug"
class="mt-2 p-2 rounded bg-gray-900 border border-gray-700 text-xs font-mono max-h-40 overflow-auto"
>
<div class="text-gray-400 mb-1">Selected Chat:</div>
<pre class="text-green-400 whitespace-pre-wrap">{{ JSON.stringify(selectedChat, null, 2) }}</pre>
</div>
</div>
@@ -134,6 +169,8 @@ const messages = ref<any[]>([])
const loadingChats = ref(false)
const loadingMessages = ref(false)
const showDebugPanel = ref(false)
const showChatsDebug = ref(false)
const showSelectedChatDebug = ref(false)
// Instance options for selector
const instanceOptions = computed(() =>