Enhance caching mechanism and logging configuration

- Updated .gitignore to include additional IDE and OS files, as well as log and web build directories.
- Expanded config.sample.yaml to include cache configuration options for memory and Redis.
- Modified wallamonitor.py to load cache configuration and initialize ArticleCache.
- Refactored QueueManager to utilize ArticleCache for tracking notified articles.
- Improved logging setup to dynamically determine log file path based on environment.

web/frontend/src/views/Logs.vue

@@ -0,0 +1,111 @@
+<template>
+  <div>
+    <div class="flex justify-between items-center mb-6">
+      <h1 class="text-3xl font-bold text-gray-900">Logs del Sistema</h1>
+      <div class="flex items-center space-x-4">
+        <select v-model="logLevel" @change="loadLogs" class="input" style="width: auto;">
+          <option value="">Todos los niveles</option>
+          <option value="INFO">INFO</option>
+          <option value="WARNING">WARNING</option>
+          <option value="ERROR">ERROR</option>
+          <option value="DEBUG">DEBUG</option>
+        </select>
+        <button @click="loadLogs" class="btn btn-primary">
+          Actualizar
+        </button>
+        <button @click="autoRefresh = !autoRefresh" class="btn btn-secondary">
+          {{ autoRefresh ? '⏸ Pausar' : '▶ Auto-refresh' }}
+        </button>
+      </div>
+    </div>
+
+    <div class="card">
+      <div class="bg-gray-900 text-green-400 font-mono text-sm p-4 rounded-lg overflow-x-auto max-h-[600px] overflow-y-auto">
+        <div v-if="loading" class="text-center py-8">
+          <div class="inline-block animate-spin rounded-full h-6 w-6 border-b-2 border-green-400"></div>
+          <p class="mt-2 text-gray-400">Cargando logs...</p>
+        </div>
+        <div v-else-if="filteredLogs.length === 0" class="text-gray-500">
+          No hay logs disponibles
+        </div>
+        <div v-else>
+          <div
+            v-for="(log, index) in filteredLogs"
+            :key="index"
+            class="mb-1"
+            :class="getLogColor(log)"
+          >
+            {{ log }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed, onMounted, onUnmounted } from 'vue';
+import api from '../services/api';
+
+const logs = ref([]);
+const loading = ref(true);
+const logLevel = ref('');
+const autoRefresh = ref(false);
+let refreshInterval = null;
+
+const filteredLogs = computed(() => {
+  if (!logLevel.value) {
+    return logs.value;
+  }
+  return logs.value.filter(log => log.includes(logLevel.value));
+});
+
+function getLogColor(log) {
+  if (log.includes('ERROR')) return 'text-red-400';
+  if (log.includes('WARNING')) return 'text-yellow-400';
+  if (log.includes('INFO')) return 'text-blue-400';
+  if (log.includes('DEBUG')) return 'text-gray-400';
+  return 'text-green-400';
+}
+
+async function loadLogs() {
+  loading.value = true;
+  try {
+    const data = await api.getLogs(500);
+    logs.value = data.logs || [];
+  } catch (error) {
+    console.error('Error cargando logs:', error);
+  } finally {
+    loading.value = false;
+  }
+}
+
+function handleWSMessage(event) {
+  const data = event.detail;
+  if (data.type === 'logs_updated') {
+    loadLogs();
+  }
+}
+
+onMounted(() => {
+  loadLogs();
+  window.addEventListener('ws-message', handleWSMessage);
+  
+  // Auto-refresh
+  const checkAutoRefresh = () => {
+    if (autoRefresh.value) {
+      loadLogs();
+    }
+  };
+  
+  refreshInterval = setInterval(checkAutoRefresh, 5000);
+});
+
+onUnmounted(() => {
+  if (refreshInterval) {
+    clearInterval(refreshInterval);
+  }
+  window.removeEventListener('ws-message', handleWSMessage);
+});
+</script>
+