refactor on components and delete clear, profesional login

web/frontend/src/views/Articles.vue

@@ -47,14 +47,6 @@
           <button @click="loadArticles" class="btn btn-primary whitespace-nowrap">
             Actualizar
           </button>
-          <button 
-            v-if="isAdmin"
-            @click="handleClearAllArticles" 
-            class="btn btn-danger whitespace-nowrap"
-            title="Borrar todos los artículos (solo admin)"
-          >
-            🗑️ Borrar Todos
-          </button>
         </div>
       </div>
       
@@ -192,14 +184,6 @@ const filteredArticles = computed(() => {
 });
 
 
-function checkUserRole() {
-  currentUser.value = authService.getUsername() || null;
-  isAdmin.value = currentUser.value === 'admin'; // Simplificación temporal
-  // Si no es admin, no permitir filtrar por username
-  if (!isAdmin.value && selectedUsername.value) {
-    selectedUsername.value = '';
-  }
-}
 
 async function loadArticles(reset = true, silent = false) {
   if (reset) {
@@ -248,7 +232,12 @@ async function loadArticles(reset = true, silent = false) {
 }
 
 function handleAuthChange() {
-  checkUserRole();
+  currentUser.value = authService.getUsername() || null;
+  isAdmin.value = authService.isAdmin();
+  // Si no es admin, no permitir filtrar por username
+  if (!isAdmin.value && selectedUsername.value) {
+    selectedUsername.value = '';
+  }
   if (currentUser.value) {
     loadArticles();
   }
@@ -260,69 +249,11 @@ function loadMore() {
 
 function handleWSMessage(event) {
   const data = event.detail;
-  if (data.type === 'articles_updated' || data.type === 'articles_cleared' || data.type === 'cache_cleared') {
+  if (data.type === 'articles_updated') {
     loadArticles();
   }
 }
 
-async function handleClearAllArticles() {
-  if (!isAdmin.value) {
-    alert('Solo los administradores pueden borrar todos los artículos');
-    return;
-  }
-  
-  const confirmed = confirm(
-    '⚠️ ¿Estás seguro de que quieres borrar TODOS los artículos?\n\n' +
-    'Esta acción eliminará permanentemente todos los artículos de la base de datos.\n' +
-    'Esta acción NO se puede deshacer.\n\n' +
-    '¿Continuar?'
-  );
-  
-  if (!confirmed) {
-    return;
-  }
-  
-  // Confirmación adicional
-  const doubleConfirmed = confirm(
-    '⚠️ ÚLTIMA CONFIRMACIÓN ⚠️\n\n' +
-    'Estás a punto de borrar TODOS los artículos de la base de datos.\n' +
-    'Esta acción es IRREVERSIBLE.\n\n' +
-    '¿Estás absolutamente seguro?'
-  );
-  
-  if (!doubleConfirmed) {
-    return;
-  }
-  
-  loading.value = true;
-  
-  try {
-    const result = await api.clearAllArticles();
-    alert(`✅ ${result.message || `Se borraron ${result.count || 0} artículos`}`);
-    
-    // Limpiar la vista
-    allArticles.value = [];
-    searchResults.value = [];
-    total.value = 0;
-    offset.value = 0;
-    
-    // Recargar artículos (ahora estará vacío)
-    await loadArticles();
-  } catch (error) {
-    console.error('Error borrando artículos:', error);
-    
-    if (error.response?.status === 403) {
-      alert('❌ Error: No tienes permisos de administrador para realizar esta acción');
-    } else if (error.response?.status === 401) {
-      alert('❌ Error: Debes estar autenticado para realizar esta acción');
-    } else {
-      alert('❌ Error al borrar artículos: ' + (error.response?.data?.error || error.message || 'Error desconocido'));
-    }
-  } finally {
-    loading.value = false;
-  }
-}
-
 async function searchArticles(query) {
   if (!query.trim()) {
     searchResults.value = [];
@@ -378,7 +309,12 @@ watch(searchQuery, (newQuery) => {
 
 
 onMounted(() => {
-  checkUserRole();
+  currentUser.value = authService.getUsername() || null;
+  isAdmin.value = authService.isAdmin();
+  // Si no es admin, no permitir filtrar por username
+  if (!isAdmin.value && selectedUsername.value) {
+    selectedUsername.value = '';
+  }
   loadArticles();
   window.addEventListener('ws-message', handleWSMessage);
   window.addEventListener('auth-logout', handleAuthChange);