201 előtti mentés

frontend/admin/pages/dashboard.vue

@@ -273,30 +273,51 @@
           
           <!-- Total Assets -->
           <v-col cols="12" md="3">
-            <v-card class="pa-4">
+            <v-card
+              class="pa-4"
+              elevation="3"
+              rounded="xl"
+              :color="healthMonitor.loading ? 'grey-lighten-4' : 'surface'"
+              :loading="healthMonitor.loading && !healthMonitor.metrics"
+            >
               <v-card-title class="text-h6 d-flex align-center">
-                <v-icon icon="mdi-database" class="mr-2"></v-icon>
-                Total Assets
+                <v-icon icon="mdi-car" class="mr-2" color="indigo-darken-2"></v-icon>
+                Total Vehicles
                 <v-spacer></v-spacer>
                 <v-progress-circular
                   v-if="healthMonitor.loading && !healthMonitor.metrics"
                   indeterminate
                   size="20"
                   width="2"
+                  color="indigo"
                 ></v-progress-circular>
               </v-card-title>
-              <v-card-text class="text-h4 font-weight-bold text-primary">
+              <v-card-text class="text-h3 font-weight-bold text-indigo-darken-2">
                 {{ healthMonitor.metrics?.total_assets?.toLocaleString() || '--' }}
               </v-card-text>
-              <v-card-subtitle>Vehicles, services, and organizations</v-card-subtitle>
+              <v-card-subtitle class="text-caption">
+                <v-icon icon="mdi-database" size="small" class="mr-1"></v-icon>
+                Seeded vehicles in database
+              </v-card-subtitle>
+              <v-divider class="my-2"></v-divider>
+              <div class="d-flex align-center mt-2">
+                <v-icon icon="mdi-check-circle" color="success" size="small" class="mr-1"></v-icon>
+                <span class="text-caption text-disabled">Live from PostgreSQL</span>
+              </div>
             </v-card>
           </v-col>
           
           <!-- Total Organizations -->
           <v-col cols="12" md="3">
-            <v-card class="pa-4">
+            <v-card
+              class="pa-4"
+              elevation="3"
+              rounded="xl"
+              :color="healthMonitor.loading ? 'grey-lighten-4' : 'surface'"
+              :loading="healthMonitor.loading && !healthMonitor.metrics"
+            >
               <v-card-title class="text-h6 d-flex align-center">
-                <v-icon icon="mdi-office-building" class="mr-2"></v-icon>
+                <v-icon icon="mdi-office-building" class="mr-2" color="teal-darken-2"></v-icon>
                 Organizations
                 <v-spacer></v-spacer>
                 <v-progress-circular
@@ -304,129 +325,213 @@
                   indeterminate
                   size="20"
                   width="2"
+                  color="teal"
                 ></v-progress-circular>
               </v-card-title>
-              <v-card-text class="text-h4 font-weight-bold text-success">
+              <v-card-text class="text-h3 font-weight-bold text-teal-darken-2">
                 {{ healthMonitor.metrics?.total_organizations?.toLocaleString() || '--' }}
               </v-card-text>
-              <v-card-subtitle>Registered business entities</v-card-subtitle>
+              <v-card-subtitle class="text-caption">
+                <v-icon icon="mdi-domain" size="small" class="mr-1"></v-icon>
+                Registered business entities
+              </v-card-subtitle>
+              <v-divider class="my-2"></v-divider>
+              <div class="d-flex align-center mt-2">
+                <v-icon icon="mdi-check-circle" color="success" size="small" class="mr-1"></v-icon>
+                <span class="text-caption text-disabled">Real API data</span>
+              </div>
+            </v-card>
+          </v-col>
+          
+          <!-- Active Users -->
+          <v-col cols="12" md="3">
+            <v-card
+              class="pa-4"
+              elevation="3"
+              rounded="xl"
+              :color="healthMonitor.loading ? 'grey-lighten-4' : 'surface'"
+              :loading="healthMonitor.loading && !healthMonitor.metrics"
+            >
+              <v-card-title class="text-h6 d-flex align-center">
+                <v-icon icon="mdi-account-group" class="mr-2" color="emerald-darken-2"></v-icon>
+                Active Users
+                <v-spacer></v-spacer>
+                <v-progress-circular
+                  v-if="healthMonitor.loading && !healthMonitor.metrics"
+                  indeterminate
+                  size="20"
+                  width="2"
+                  color="emerald"
+                ></v-progress-circular>
+              </v-card-title>
+              <v-card-text class="text-h3 font-weight-bold text-emerald-darken-2">
+                {{ healthMonitor.metrics?.active_users?.toLocaleString() || '--' }}
+              </v-card-text>
+              <v-card-subtitle class="text-caption">
+                <v-icon icon="mdi-account" size="small" class="mr-1"></v-icon>
+                Total registered users
+              </v-card-subtitle>
+              <v-divider class="my-2"></v-divider>
+              <div class="d-flex align-center mt-2">
+                <v-icon icon="mdi-check-circle" color="success" size="small" class="mr-1"></v-icon>
+                <span class="text-caption text-disabled">Including superadmin</span>
+              </div>
             </v-card>
           </v-col>
           
           <!-- Critical Alerts -->
           <v-col cols="12" md="3">
-            <v-card class="pa-4">
+            <v-card
+              class="pa-4"
+              elevation="3"
+              rounded="xl"
+              :color="healthMonitor.loading ? 'grey-lighten-4' : 'surface'"
+              :loading="healthMonitor.loading && !healthMonitor.metrics"
+              :border="healthMonitor.metrics?.critical_alerts_24h ? 'left' : false"
+              :color-border="healthMonitor.metrics?.critical_alerts_24h ? 'error' : 'success'"
+            >
               <v-card-title class="text-h6 d-flex align-center">
-                <v-icon icon="mdi-alert" class="mr-2"></v-icon>
-                Critical Alerts (24h)
+                <v-icon
+                  :icon="healthMonitor.metrics?.critical_alerts_24h ? 'mdi-alert-octagon' : 'mdi-shield-check'"
+                  class="mr-2"
+                  :color="healthMonitor.metrics?.critical_alerts_24h ? 'error' : 'success'"
+                ></v-icon>
+                System Health
                 <v-spacer></v-spacer>
                 <v-progress-circular
                   v-if="healthMonitor.loading && !healthMonitor.metrics"
                   indeterminate
                   size="20"
                   width="2"
+                  :color="healthMonitor.metrics?.critical_alerts_24h ? 'error' : 'success'"
                 ></v-progress-circular>
               </v-card-title>
-              <v-card-text class="text-h4 font-weight-bold" :class="healthMonitor.metrics?.critical_alerts_24h ? 'text-error' : 'text-info'">
+              <v-card-text
+                class="text-h3 font-weight-bold"
+                :class="healthMonitor.metrics?.critical_alerts_24h ? 'text-error' : 'text-success'"
+              >
                 {{ healthMonitor.metrics?.critical_alerts_24h || 0 }}
               </v-card-text>
-              <v-card-subtitle>
-                <span v-if="healthMonitor.metrics?.critical_alerts_24h">Requires immediate attention</span>
-                <span v-else>No critical issues</span>
+              <v-card-subtitle class="text-caption">
+                <v-icon
+                  :icon="healthMonitor.metrics?.critical_alerts_24h ? 'mdi-alert' : 'mdi-check-circle'"
+                  size="small"
+                  class="mr-1"
+                  :color="healthMonitor.metrics?.critical_alerts_24h ? 'error' : 'success'"
+                ></v-icon>
+                <span :class="healthMonitor.metrics?.critical_alerts_24h ? 'text-error' : 'text-success'">
+                  {{ healthMonitor.metrics?.critical_alerts_24h ? 'Critical alerts' : 'All systems operational' }}
+                </span>
               </v-card-subtitle>
-            </v-card>
-          </v-col>
-          
-          <!-- System Uptime -->
-          <v-col cols="12" md="3">
-            <v-card class="pa-4">
-              <v-card-title class="text-h6 d-flex align-center">
-                <v-icon icon="mdi-heart-pulse" class="mr-2"></v-icon>
-                System Uptime
-                <v-spacer></v-spacer>
-                <v-progress-circular
-                  v-if="healthMonitor.loading && !healthMonitor.metrics"
-                  indeterminate
-                  size="20"
-                  width="2"
-                ></v-progress-circular>
-              </v-card-title>
-              <v-card-text class="text-h4 font-weight-bold text-warning">
-                {{ healthMonitor.formattedUptime }}
-              </v-card-text>
-              <v-card-subtitle>
-                Response: {{ healthMonitor.formattedResponseTime }}
+              <v-divider class="my-2"></v-divider>
+              <div class="d-flex align-center mt-2">
                 <v-icon
-                  v-if="healthMonitor.metrics?.response_time_ms < 100"
-                  icon="mdi-check"
-                  color="success"
+                  :icon="healthMonitor.metrics?.critical_alerts_24h ? 'mdi-clock-alert' : 'mdi-clock-check'"
+                  :color="healthMonitor.metrics?.critical_alerts_24h ? 'warning' : 'success'"
                   size="small"
-                  class="ml-1"
+                  class="mr-1"
                 ></v-icon>
-                <v-icon
-                  v-else-if="healthMonitor.metrics?.response_time_ms < 300"
-                  icon="mdi-alert"
-                  color="warning"
-                  size="small"
-                  class="ml-1"
-                ></v-icon>
-                <v-icon
-                  v-else
-                  icon="mdi-alert-circle"
-                  color="error"
-                  size="small"
-                  class="ml-1"
-                ></v-icon>
-              </v-card-subtitle>
+                <span class="text-caption text-disabled">Last 24 hours</span>
+              </div>
             </v-card>
           </v-col>
         </v-row>
         
-        <!-- Additional Metrics Row -->
-        <v-row class="mt-2">
+        <!-- Performance Metrics Row -->
+        <v-row class="mt-4">
           <v-col cols="12" md="4">
-            <v-card class="pa-4">
-              <v-card-title class="text-h6">
-                <v-icon icon="mdi-account-group" class="mr-2"></v-icon>
-                Active Users
+            <v-card
+              class="pa-4"
+              elevation="2"
+              rounded="lg"
+              color="surface-variant"
+            >
+              <v-card-title class="text-h6 d-flex align-center">
+                <v-icon icon="mdi-speedometer" class="mr-2" color="deep-purple"></v-icon>
+                System Uptime
               </v-card-title>
-              <v-card-text class="text-h3 font-weight-bold text-primary">
-                {{ healthMonitor.metrics?.active_users?.toLocaleString() || '--' }}
+              <v-card-text class="text-h2 font-weight-bold text-deep-purple-darken-2">
+                {{ healthMonitor.formattedUptime }}
               </v-card-text>
-              <v-card-subtitle>Currently logged in users</v-card-subtitle>
-            </v-card>
-          </v-col>
-          
-          <v-col cols="12" md="4">
-            <v-card class="pa-4">
-              <v-card-title class="text-h6">
-                <v-icon icon="mdi-database-export" class="mr-2"></v-icon>
-                DB Connections
-              </v-card-title>
-              <v-card-text class="text-h3 font-weight-bold" :class="getDbConnectionClass(healthMonitor.metrics?.database_connections)">
-                {{ healthMonitor.metrics?.database_connections || '--' }}
-              </v-card-text>
-              <v-card-subtitle>
-                <span v-if="healthMonitor.metrics?.database_connections > 40" class="text-error">High load</span>
-                <span v-else-if="healthMonitor.metrics?.database_connections > 20" class="text-warning">Moderate load</span>
-                <span v-else class="text-success">Normal load</span>
+              <v-card-subtitle class="text-caption">
+                <v-icon icon="mdi-heart-pulse" size="small" class="mr-1"></v-icon>
+                Service availability
               </v-card-subtitle>
+              <v-divider class="my-2"></v-divider>
+              <div class="d-flex align-center justify-space-between">
+                <span class="text-caption">Response time:</span>
+                <span class="text-caption font-weight-medium" :class="getResponseTimeClass(healthMonitor.metrics?.response_time_ms)">
+                  {{ healthMonitor.formattedResponseTime }}
+                  <v-icon
+                    :icon="getResponseTimeIcon(healthMonitor.metrics?.response_time_ms)"
+                    size="small"
+                    class="ml-1"
+                    :color="getResponseTimeColor(healthMonitor.metrics?.response_time_ms)"
+                  ></v-icon>
+                </span>
+              </div>
             </v-card>
           </v-col>
           
           <v-col cols="12" md="4">
-            <v-card class="pa-4">
-              <v-card-title class="text-h6">
-                <v-icon icon="mdi-update" class="mr-2"></v-icon>
-                Last Updated
+            <v-card
+              class="pa-4"
+              elevation="2"
+              rounded="lg"
+              color="surface-variant"
+            >
+              <v-card-title class="text-h6 d-flex align-center">
+                <v-icon icon="mdi-database" class="mr-2" color="blue-grey"></v-icon>
+                Database Status
               </v-card-title>
-              <v-card-text class="text-h5 font-weight-bold text-grey">
+              <v-card-text class="text-h2 font-weight-bold" :class="getDbConnectionClass(healthMonitor.metrics?.database_connections)">
+                {{ healthMonitor.metrics?.database_connections || '0' }}
+              </v-card-text>
+              <v-card-subtitle class="text-caption">
+                <v-icon icon="mdi-connection" size="small" class="mr-1"></v-icon>
+                Active connections
+              </v-card-subtitle>
+              <v-divider class="my-2"></v-divider>
+              <div class="d-flex align-center">
+                <v-icon
+                  :icon="getDbStatusIcon(healthMonitor.metrics?.database_connections)"
+                  :color="getDbStatusColor(healthMonitor.metrics?.database_connections)"
+                  size="small"
+                  class="mr-1"
+                ></v-icon>
+                <span class="text-caption" :class="getDbStatusTextClass(healthMonitor.metrics?.database_connections)">
+                  {{ getDbStatusText(healthMonitor.metrics?.database_connections) }}
+                </span>
+              </div>
+            </v-card>
+          </v-col>
+          
+          <v-col cols="12" md="4">
+            <v-card
+              class="pa-4"
+              elevation="2"
+              rounded="lg"
+              color="surface-variant"
+            >
+              <v-card-title class="text-h6 d-flex align-center">
+                <v-icon icon="mdi-update" class="mr-2" color="amber"></v-icon>
+                Data Freshness
+              </v-card-title>
+              <v-card-text class="text-h2 font-weight-bold text-amber-darken-2">
                 {{ healthMonitor.lastUpdated ? formatTime(healthMonitor.lastUpdated) : 'Never' }}
               </v-card-text>
-              <v-card-subtitle>
+              <v-card-subtitle class="text-caption">
                 <v-icon icon="mdi-clock-outline" size="small" class="mr-1"></v-icon>
-                Auto-refresh every 30s
+                Last API sync
               </v-card-subtitle>
+              <v-divider class="my-2"></v-divider>
+              <div class="d-flex align-center justify-space-between">
+                <span class="text-caption">Auto-refresh:</span>
+                <v-chip size="x-small" color="info" variant="outlined">
+                  <v-icon icon="mdi-autorenew" size="x-small" class="mr-1"></v-icon>
+                  30s
+                </v-chip>
+              </div>
             </v-card>
           </v-col>
         </v-row>
@@ -552,6 +657,57 @@ const formatTime = (value: any) => {
   }
 }
 
+// Response time helper functions
+const getResponseTimeClass = (responseTime: number | undefined) => {
+  if (!responseTime) return 'text-grey'
+  if (responseTime < 100) return 'text-success'
+  if (responseTime < 300) return 'text-warning'
+  return 'text-error'
+}
+
+const getResponseTimeIcon = (responseTime: number | undefined) => {
+  if (!responseTime) return 'mdi-help-circle'
+  if (responseTime < 100) return 'mdi-check'
+  if (responseTime < 300) return 'mdi-alert'
+  return 'mdi-alert-circle'
+}
+
+const getResponseTimeColor = (responseTime: number | undefined) => {
+  if (!responseTime) return 'grey'
+  if (responseTime < 100) return 'success'
+  if (responseTime < 300) return 'warning'
+  return 'error'
+}
+
+// Database status helper functions
+const getDbStatusIcon = (connections: number | undefined) => {
+  if (!connections) return 'mdi-database-off'
+  if (connections > 40) return 'mdi-alert-circle'
+  if (connections > 20) return 'mdi-alert'
+  return 'mdi-check-circle'
+}
+
+const getDbStatusColor = (connections: number | undefined) => {
+  if (!connections) return 'grey'
+  if (connections > 40) return 'error'
+  if (connections > 20) return 'warning'
+  return 'success'
+}
+
+const getDbStatusTextClass = (connections: number | undefined) => {
+  if (!connections) return 'text-grey'
+  if (connections > 40) return 'text-error'
+  if (connections > 20) return 'text-warning'
+  return 'text-success'
+}
+
+const getDbStatusText = (connections: number | undefined) => {
+  if (!connections) return 'No data'
+  if (connections > 40) return 'High load'
+  if (connections > 20) return 'Moderate load'
+  return 'Normal load'
+}
+
 // Lifecycle
 onMounted(() => {
   console.log('Dashboard mounted for user:', userEmail.value)

frontend/admin/pages/index.vue

@@ -0,0 +1,15 @@
+<template>
+  <div>
+    <!-- Redirect to dashboard using Nuxt's navigateTo -->
+    <p>Redirecting to dashboard...</p>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { navigateTo } from '#app'
+
+// Redirect to dashboard on mount
+onMounted(() => {
+  navigateTo('/dashboard')
+})
+</script>

frontend/admin/pages/login.vue

@@ -25,8 +25,10 @@
           <v-text-field
             v-model="password"
             label="Password"
-            type="password"
+            :type="showPassword ? 'text' : 'password'"
             prepend-icon="mdi-lock"
+            :append-inner-icon="showPassword ? 'mdi-eye-off' : 'mdi-eye'"
+            @click:append-inner="showPassword = !showPassword"
             :rules="passwordRules"
             required
             class="mb-2"
@@ -50,18 +52,7 @@
             Sign In
           </v-btn>
           
-          <!-- Dev Login Button (ALWAYS VISIBLE - BULLETPROOF FIX) -->
-          <v-btn
-            color="warning"
-            size="large"
-            block
-            :loading="isLoading"
-            class="mb-4"
-            @click="handleDevLogin"
-          >
-            <v-icon icon="mdi-bug" class="mr-2"></v-icon>
-            Dev Login (Bypass)
-          </v-btn>
+          <!-- Real API Login Only - No Dev Bypass -->
           
           <v-alert
             v-if="error"
@@ -85,11 +76,8 @@
               <v-chip size="small" variant="outlined" @click="setDemoCredentials('admin')">
                 Admin
               </v-chip>
-              <v-chip size="small" variant="outlined" @click="setDemoCredentials('moderator')">
-                Moderator
-              </v-chip>
-              <v-chip size="small" variant="outlined" @click="setDemoCredentials('salesperson')">
-                Salesperson
+              <v-chip size="small" variant="outlined" @click="setDemoCredentials('tester')">
+                Tester
               </v-chip>
             </v-chip-group>
           </div>
@@ -110,10 +98,12 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 import { useAuthStore } from '~/stores/auth'
+import { navigateTo } from '#app'
 
 // State
 const email = ref('')
 const password = ref('')
+const showPassword = ref(false)
 const isLoading = ref(false)
 const error = ref('')
 const loginForm = ref()
@@ -132,41 +122,28 @@ const passwordRules = [
 // Store
 const authStore = useAuthStore()
 
-// Demo credentials
+// Demo credentials - Using real credentials from the task
 const demoCredentials = {
   superadmin: {
-    email: 'superadmin@servicefinder.com',
-    password: 'superadmin123',
+    email: 'superadmin@profibot.hu',
+    password: 'Superadmin123!',
     role: 'superadmin',
-    rank: 10,
+    rank: 100,
     scope_level: 'global'
   },
   admin: {
-    email: 'admin@servicefinder.com',
-    password: 'admin123',
+    email: 'admin@profibot.hu',
+    password: 'Admin123!',
     role: 'admin',
-    rank: 7,
-    scope_level: 'region',
-    region_code: 'HU-BU',
-    scope_id: 123
+    rank: 50,
+    scope_level: 'global'
   },
-  moderator: {
-    email: 'moderator@servicefinder.com',
-    password: 'moderator123',
-    role: 'moderator',
-    rank: 5,
-    scope_level: 'city',
-    region_code: 'HU-BU',
-    scope_id: 456
-  },
-  salesperson: {
-    email: 'sales@servicefinder.com',
-    password: 'sales123',
-    role: 'salesperson',
-    rank: 3,
-    scope_level: 'district',
-    region_code: 'HU-BU',
-    scope_id: 789
+  tester: {
+    email: 'tester_pro@profibot.hu',
+    password: 'Tester123!',
+    role: 'tester',
+    rank: 30,
+    scope_level: 'global'
   }
 }
 
@@ -180,34 +157,7 @@ function setDemoCredentials(role: keyof typeof demoCredentials) {
   error.value = `Demo ${role} credentials loaded. Role: ${creds.role}, Rank: ${creds.rank}, Scope: ${creds.scope_level}`
 }
 
-// Handle dev login (bypass authentication)
-async function handleDevLogin() {
-  isLoading.value = true
-  error.value = ''
-  
-  try {
-    console.log('[DEV MODE] Using development login bypass')
-    
-    // Use the exact mock JWT string provided in the task
-    const mockJwtToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJzdXBlcmFkbWluQHNlcnZpY2VmaW5kZXIuY29tIiwicm9sZSI6InN1cGVyYWRtaW4iLCJyYW5rIjoxMDAsInNjb3BlX2xldmVsIjoiZ2xvYmFsIiwiZXhwIjozMDAwMDAwMDAwLCJpYXQiOjE3MDAwMDAwMDB9.dummy_signature'
-    
-    // Store token and parse
-    if (typeof window !== 'undefined') {
-      localStorage.setItem('admin_token', mockJwtToken)
-    }
-    authStore.token = mockJwtToken
-    authStore.parseToken()
-    
-    // Navigate to dashboard
-    navigateTo('/dashboard')
-  } catch (err) {
-    error.value = err instanceof Error ? err.message : 'Dev login failed'
-  } finally {
-    isLoading.value = false
-  }
-}
-
-// Handle login
+// Handle login - REAL API AUTHENTICATION ONLY
 async function handleLogin() {
   // Validate form
   const { valid } = await loginForm.value.validate()
@@ -217,6 +167,10 @@ async function handleLogin() {
   error.value = ''
   
   try {
+    // Debug: Log the input values
+    console.log('Attempting login with:', email.value, password.value)
+    console.log('Email type:', typeof email.value, 'Password type:', typeof password.value)
+    
     // For demo purposes, simulate login with demo credentials
     const role = Object.keys(demoCredentials).find(key =>
       demoCredentials[key as keyof typeof demoCredentials].email === email.value
@@ -230,15 +184,22 @@ async function handleLogin() {
       const success = await authStore.login(email.value, password.value)
       if (!success) {
         error.value = 'Invalid credentials. Please try again.'
+      } else {
+        // Redirect to dashboard on successful login
+        await navigateTo('/dashboard')
       }
     } else {
       // Simulate API call for real credentials
       const success = await authStore.login(email.value, password.value)
       if (!success) {
         error.value = 'Invalid credentials. Please try again.'
+      } else {
+        // Redirect to dashboard on successful login
+        await navigateTo('/dashboard')
       }
     }
   } catch (err) {
+    console.error('Login error:', err)
     error.value = err instanceof Error ? err.message : 'Login failed'
   } finally {
     isLoading.value = false

frontend/admin/pages/moderation-map.vue

@@ -218,7 +218,7 @@ const approveService = (serviceId: number) => {
 }
 
 .stat-value.pending {
-  color: #ffc107;
+  color: #3b82f6;
 }
 
 .stat-value.approved {
@@ -276,8 +276,8 @@ const approveService = (serviceId: number) => {
 }
 
 .status-badge.pending {
-  background-color: #fff3cd;
-  color: #856404;
+  background-color: #dbeafe;
+  color: #1d4ed8;
 }
 
 .status-badge.approved {