Initial commit: Robot ökoszisztéma v2.0 - Stabilizált jármű és szerviz robotok
This commit is contained in:
56
frontend/src/views/AddExpense.vue
Executable file
56
frontend/src/views/AddExpense.vue
Executable file
@@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div class="max-w-md mx-auto bg-white p-8 rounded-2xl shadow-xl border border-gray-100 mt-10">
|
||||
<h2 class="text-2xl font-bold text-gray-800 mb-6 flex items-center gap-2">
|
||||
<span>💸</span> Új költség rögzítése
|
||||
</h2>
|
||||
|
||||
<form @submit.prevent="handleSubmit" class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Kategória</label>
|
||||
<select v-model="form.category" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-blue-500 focus:border-blue-500 p-2.5 border">
|
||||
<option value="REFUELING">⛽ Tankolás</option>
|
||||
<option value="SERVICE">🔧 Szerviz</option>
|
||||
<option value="INSURANCE">🛡️ Biztosítás</option>
|
||||
<option value="TOLL">🛣️ Útdíj / Matrica</option>
|
||||
<option value="FINE">👮 Büntetés</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Összeg (Ft)</label>
|
||||
<input v-model="form.amount" type="number" required class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-blue-500 focus:border-blue-500 p-2.5 border" placeholder="Pl: 25000">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Km óra állása</label>
|
||||
<input v-model="form.odometer_value" type="number" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm focus:ring-blue-500 focus:border-blue-500 p-2.5 border" placeholder="Pl: 145200">
|
||||
</div>
|
||||
|
||||
<button type="submit" class="w-full bg-blue-600 text-white font-bold py-3 rounded-lg hover:bg-blue-700 transition-colors shadow-lg shadow-blue-200">
|
||||
Mentés rögzítése
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import axios from 'axios'
|
||||
|
||||
const form = ref({
|
||||
category: 'REFUELING',
|
||||
amount: null,
|
||||
odometer_value: null,
|
||||
vehicle_id: 'auto-uuid-helye', // Ezt majd a routerből kapjuk
|
||||
date: new Date().toISOString().split('T')[0]
|
||||
})
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
await axios.post('http://localhost:8000/api/v1/expenses/add', form.value)
|
||||
alert("Sikeresen mentve!")
|
||||
} catch (err) {
|
||||
alert("Hiba történt a mentéskor.")
|
||||
}
|
||||
}
|
||||
</script>
|
||||
68
frontend/src/views/AddVehicle.vue
Executable file
68
frontend/src/views/AddVehicle.vue
Executable file
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div class="max-w-2xl mx-auto bg-white p-8 rounded-2xl shadow-lg mt-6">
|
||||
<h2 class="text-2xl font-bold mb-6 flex items-center gap-2">
|
||||
<span class="text-3xl">➕</span> Új jármű hozzáadása
|
||||
</h2>
|
||||
|
||||
<div class="space-y-6">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Márka keresése</label>
|
||||
<input v-model="searchQuery" @input="searchBrands" type="text" placeholder="Pl: Audi, Toyota..." class="mt-1 block w-full p-3 border rounded-lg shadow-sm" />
|
||||
|
||||
<div v-if="brands.length > 0" class="mt-2 border rounded-lg divide-y bg-gray-50">
|
||||
<div v-for="brand in brands" :key="brand.id" @click="selectBrand(brand)" class="p-3 hover:bg-blue-100 cursor-pointer flex justify-between">
|
||||
<span class="font-bold">{{ brand.name }}</span>
|
||||
<span class="text-xs text-gray-400 italic">{{ brand.country_of_origin }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="selectedBrand" class="p-4 bg-blue-50 rounded-lg border border-blue-200 animate-fade-in">
|
||||
<p class="font-bold text-blue-800">Kiválasztott márka: {{ selectedBrand.name }}</p>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-4">
|
||||
<input v-model="form.model_name" type="text" placeholder="Modell (Pl: A4, Corolla)" class="p-2 border rounded" />
|
||||
<input v-model="form.plate" type="text" placeholder="Rendszám" class="p-2 border rounded uppercase" />
|
||||
<input v-model="form.vin" type="text" placeholder="Alvázszám (opcionális)" class="p-2 border rounded uppercase" />
|
||||
<input v-model="form.current_odo" type="number" placeholder="Aktuális km állás" class="p-2 border rounded" />
|
||||
</div>
|
||||
<button @click="saveVehicle" class="w-full mt-6 bg-blue-700 text-white py-3 rounded-lg font-bold shadow-lg">Jármű mentése a Széfbe</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import axios from 'axios'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
||||
const router = useRouter()
|
||||
const searchQuery = ref('')
|
||||
const brands = ref([])
|
||||
const selectedBrand = ref(null)
|
||||
const form = ref({ model_name: '', plate: '', vin: '', current_odo: 0 })
|
||||
|
||||
const searchBrands = async () => {
|
||||
if (searchQuery.value.length < 2) { brands.value = []; return; }
|
||||
const res = await axios.get(`http://192.168.100.43:8000/api/v1/vehicles/search/brands?q=${searchQuery.value}`)
|
||||
brands.value = res.data.data
|
||||
}
|
||||
|
||||
const selectBrand = (brand) => {
|
||||
selectedBrand.value = brand
|
||||
brands.value = []
|
||||
}
|
||||
|
||||
const saveVehicle = async () => {
|
||||
const token = localStorage.getItem('token')
|
||||
try {
|
||||
await axios.post('http://192.168.100.43:8000/api/v1/vehicles/register', {
|
||||
brand_id: selectedBrand.value.id,
|
||||
...form.value
|
||||
}, { headers: { Authorization: `Bearer ${token}` }})
|
||||
router.push('/')
|
||||
} catch (err) {
|
||||
alert("Hiba a mentés során.")
|
||||
}
|
||||
}
|
||||
</script>
|
||||
33
frontend/src/views/Dashboard.vue
Executable file
33
frontend/src/views/Dashboard.vue
Executable file
@@ -0,0 +1,33 @@
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import axios from 'axios'
|
||||
|
||||
const report = ref(null)
|
||||
const loading = ref(true)
|
||||
|
||||
onMounted(async () => {
|
||||
const token = localStorage.getItem('token')
|
||||
try {
|
||||
const res = await axios.get('http://localhost:8000/api/v1/reports/summary/latest', {
|
||||
headers: { Authorization: `Bearer ${token}` }
|
||||
})
|
||||
report.value = res.data
|
||||
} catch (err) {
|
||||
console.log("Még nincs rögzített adat.")
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="!loading">
|
||||
<div v-if="report" class="space-y-6">
|
||||
</div>
|
||||
<div v-else class="text-center mt-20">
|
||||
<span class="text-6xl text-gray-300">📭</span>
|
||||
<h2 class="text-xl font-bold text-gray-500 mt-4">Még nincsenek rögzített költségeid.</h2>
|
||||
<router-link to="/expenses" class="mt-4 inline-block text-blue-700 font-bold">Kezdd el itt! →</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
8
frontend/src/views/Expenses.vue
Executable file
8
frontend/src/views/Expenses.vue
Executable file
@@ -0,0 +1,8 @@
|
||||
<template>
|
||||
<div class="p-4">
|
||||
<h2 class="text-2xl font-bold mb-4 text-gray-800">Költségek kezelése</h2>
|
||||
<div class="bg-blue-50 p-4 rounded-lg border border-blue-200">
|
||||
<p>Itt tudod majd rögzíteni és listázni a kiadásaidat.</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
33
frontend/src/views/ForgotPassword.vue
Executable file
33
frontend/src/views/ForgotPassword.vue
Executable file
@@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<div class="max-w-md mx-auto mt-20 p-8 bg-white rounded-2xl shadow-xl border">
|
||||
<h2 class="text-2xl font-bold text-center mb-4 text-gray-800">Elfelejtett jelszó</h2>
|
||||
<p class="text-sm text-gray-600 mb-6 text-center">Add meg az e-mail címed, és küldünk egy linket a jelszó visszaállításához.</p>
|
||||
|
||||
<form @submit.prevent="handleForgot" class="space-y-4">
|
||||
<input v-model="email" type="email" placeholder="E-mail címed" required class="w-full p-3 border rounded-lg focus:ring-2 focus:ring-blue-500" />
|
||||
<button type="submit" class="w-full bg-blue-700 text-white py-3 rounded-lg font-bold hover:bg-blue-800">Küldés</button>
|
||||
</form>
|
||||
|
||||
<p v-if="message" class="mt-4 text-center font-medium text-blue-600">{{ message }}</p>
|
||||
<div class="mt-6 text-center">
|
||||
<router-link to="/login" class="text-sm text-gray-500 hover:underline">Vissza a belépéshez</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import axios from 'axios'
|
||||
|
||||
const email = ref('')
|
||||
const message = ref('')
|
||||
|
||||
const handleForgot = async () => {
|
||||
try {
|
||||
await axios.post(`http://192.168.100.43:8000/api/v2/auth/forgot-password?email=${email.value}`)
|
||||
message.value = "Ha a cím létezik, a helyreállító levelet elküldtük."
|
||||
} catch (err) {
|
||||
message.value = "Hiba történt a kérés feldolgozásakor."
|
||||
}
|
||||
}
|
||||
</script>
|
||||
87
frontend/src/views/Login.vue
Executable file
87
frontend/src/views/Login.vue
Executable file
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div class="max-w-md mx-auto mt-20 p-8 bg-white rounded-3xl shadow-2xl border border-gray-100">
|
||||
<div class="text-center mb-10">
|
||||
<span class="text-5xl">🚗</span>
|
||||
<h2 class="text-3xl font-black text-gray-900 mt-4 uppercase tracking-tighter">Belépés</h2>
|
||||
<p class="text-gray-400 text-sm font-medium">Service Finder V2.0</p>
|
||||
</div>
|
||||
|
||||
<form @submit.prevent="handleLogin" class="space-y-6">
|
||||
<div class="space-y-1">
|
||||
<label class="text-xs font-bold text-gray-500 uppercase ml-1">E-mail cím</label>
|
||||
<input v-model="email" type="email" required
|
||||
class="w-full p-4 bg-gray-50 border-2 border-transparent rounded-2xl focus:border-blue-500 focus:bg-white transition-all outline-none"
|
||||
placeholder="kincses@gmail.com" />
|
||||
</div>
|
||||
|
||||
<div class="space-y-1">
|
||||
<div class="flex justify-between items-center">
|
||||
<label class="text-xs font-bold text-gray-500 uppercase ml-1">Jelszó</label>
|
||||
<router-link to="/forgot-password" class="text-xs font-bold text-blue-600 hover:text-blue-800">Elfelejtetted?</router-link>
|
||||
</div>
|
||||
<input v-model="password" type="password" required
|
||||
class="w-full p-4 bg-gray-50 border-2 border-transparent rounded-2xl focus:border-blue-500 focus:bg-white transition-all outline-none"
|
||||
placeholder="••••••••" />
|
||||
</div>
|
||||
|
||||
<div v-if="error" class="p-4 bg-red-50 border-l-4 border-red-500 text-red-700 rounded-lg text-sm font-bold">
|
||||
⚠️ {{ error }}
|
||||
</div>
|
||||
|
||||
<button type="submit" :disabled="loading"
|
||||
class="w-full bg-blue-700 text-white py-4 rounded-2xl font-black text-lg hover:bg-blue-800 transition-all shadow-xl hover:shadow-blue-200 disabled:bg-gray-300">
|
||||
{{ loading ? 'ELLENŐRZÉS...' : 'BEJELENTKEZÉS' }}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div class="mt-10 pt-6 border-t border-gray-100 text-center">
|
||||
<p class="text-gray-500 font-medium mb-3">Nincs még fiókod?</p>
|
||||
<router-link to="/register"
|
||||
class="inline-block w-full py-3 px-6 border-2 border-blue-700 text-blue-700 rounded-2xl font-bold hover:bg-blue-50 transition-all">
|
||||
Új Széf létrehozása
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import axios from 'axios'
|
||||
|
||||
const email = ref('')
|
||||
const password = ref('')
|
||||
const error = ref('')
|
||||
const loading = ref(false)
|
||||
const router = useRouter()
|
||||
|
||||
// URLSearchParams használata - ez pontosan azt a formátumot küldi, amit a Swagger
|
||||
const params = new URLSearchParams()
|
||||
params.append('username', email.value)
|
||||
params.append('password', password.value)
|
||||
|
||||
try {
|
||||
const res = await axios.post('http://192.168.100.43:8000/api/v2/auth/login', params, {
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded'
|
||||
}
|
||||
})
|
||||
|
||||
const token = res.data.access_token
|
||||
localStorage.setItem('token', token)
|
||||
|
||||
// Profil lekérése a jogosultságok miatt
|
||||
const userRes = await axios.get('http://192.168.100.43:8000/api/v1/users/me', {
|
||||
headers: { Authorization: `Bearer ${token}` }
|
||||
})
|
||||
|
||||
localStorage.setItem('is_admin', userRes.data.is_superuser ? 'true' : 'false')
|
||||
router.push('/')
|
||||
} catch (err) {
|
||||
console.error("Belépési hiba részletei:", err.response?.data)
|
||||
error.value = err.response?.data?.detail || "Hibás e-mail vagy jelszó."
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
|
||||
</script>
|
||||
36
frontend/src/views/Register.vue
Executable file
36
frontend/src/views/Register.vue
Executable file
@@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<div class="max-w-md mx-auto mt-10 p-8 bg-white rounded-2xl shadow-xl">
|
||||
<h2 class="text-2xl font-bold mb-6 text-center">Új Széf létrehozása</h2>
|
||||
<form @submit.prevent="handleRegister" class="space-y-4">
|
||||
<input v-model="form.first_name" type="text" placeholder="Keresztnév" required class="w-full p-3 border rounded-lg" />
|
||||
<input v-model="form.last_name" type="text" placeholder="Vezetéknév" required class="w-full p-3 border rounded-lg" />
|
||||
<input v-model="form.email" type="email" placeholder="E-mail" required class="w-full p-3 border rounded-lg" />
|
||||
<input v-model="form.password" type="password" placeholder="Jelszó" required class="w-full p-3 border rounded-lg" />
|
||||
<button class="w-full bg-green-600 text-white py-3 rounded-lg font-bold hover:bg-green-700 transition">Fiók létrehozása</button>
|
||||
</form>
|
||||
<p v-if="msg" class="mt-4 text-center font-medium text-green-600">{{ msg }}</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import axios from 'axios'
|
||||
|
||||
const form = ref({ email: '', password: '', first_name: '', last_name: '' })
|
||||
const msg = ref('')
|
||||
|
||||
const handleRegister = async () => {
|
||||
msg.value = ""; // Üzenet alaphelyzetbe
|
||||
try {
|
||||
const res = await axios.post(`http://192.168.100.43:8000/api/v2/auth/register`, null, { params: form.value });
|
||||
msg.value = "Sikeres regisztráció! Kérlek aktiváld az e-mailedet.";
|
||||
} catch (err) {
|
||||
// ITT A JAVÍTÁS: kiolvassuk a backend hibaüzenetét
|
||||
if (err.response && err.response.data && err.response.data.detail) {
|
||||
msg.value = "Hiba: " + err.response.data.detail;
|
||||
} else {
|
||||
msg.value = "Hiba történt a regisztráció során.";
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
43
frontend/src/views/ResetPassword.vue
Executable file
43
frontend/src/views/ResetPassword.vue
Executable file
@@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<div class="max-w-md mx-auto mt-20 p-8 bg-white rounded-2xl shadow-xl border">
|
||||
<h2 class="text-2xl font-bold text-center mb-6">Új jelszó megadása</h2>
|
||||
|
||||
<form @submit.prevent="handleReset" class="space-y-4">
|
||||
<input v-model="password" type="password" placeholder="Új jelszó" required class="w-full p-3 border rounded-lg" />
|
||||
<input v-model="passwordConfirm" type="password" placeholder="Jelszó megerősítése" required class="w-full p-3 border rounded-lg" />
|
||||
<button type="submit" class="w-full bg-blue-700 text-white py-3 rounded-lg font-bold">Jelszó mentése</button>
|
||||
</form>
|
||||
|
||||
<p v-if="error" class="mt-4 text-red-600 text-center">{{ error }}</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import axios from 'axios'
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const password = ref('')
|
||||
const passwordConfirm = ref('')
|
||||
const error = ref('')
|
||||
|
||||
const handleReset = async () => {
|
||||
if (password.value !== passwordConfirm.value) {
|
||||
error.value = "A két jelszó nem egyezik!";
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const token = route.query.token;
|
||||
await axios.post(`http://192.168.100.43:8000/api/v2/auth/reset-password-confirm`, {
|
||||
token: token,
|
||||
new_password: password.value
|
||||
});
|
||||
alert("Jelszó sikeresen megváltoztatva!");
|
||||
router.push('/login');
|
||||
} catch (err) {
|
||||
error.value = "Hiba történt. Lehetséges, hogy a link lejárt.";
|
||||
}
|
||||
}
|
||||
</script>
|
||||
48
frontend/src/views/admin/AdminStats.vue
Executable file
48
frontend/src/views/admin/AdminStats.vue
Executable file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<div class="p-6">
|
||||
<h1 class="text-2xl font-bold mb-6">Rendszer Statisztika (Admin)</h1>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
|
||||
<div class="bg-blue-600 text-white p-6 rounded-lg shadow-lg">
|
||||
<p class="text-blue-100 uppercase text-xs font-bold">Összes Felhasználó</p>
|
||||
<p class="text-4xl font-black">1,248</p>
|
||||
</div>
|
||||
<div class="bg-emerald-600 text-white p-6 rounded-lg shadow-lg">
|
||||
<p class="text-emerald-100 uppercase text-xs font-bold">Aktív Voucherek</p>
|
||||
<p class="text-4xl font-black">42</p>
|
||||
</div>
|
||||
<div class="bg-amber-600 text-white p-6 rounded-lg shadow-lg">
|
||||
<p class="text-amber-100 uppercase text-xs font-bold">Bot Találatok (Új)</p>
|
||||
<p class="text-4xl font-black">156</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white rounded-lg shadow overflow-hidden">
|
||||
<div class="p-4 border-b bg-gray-50 flex justify-between items-center">
|
||||
<span class="font-bold text-gray-700">Jóváhagyásra váró szervizek</span>
|
||||
<button class="bg-blue-500 text-white px-3 py-1 rounded text-sm hover:bg-blue-600">Összes frissítése</button>
|
||||
</div>
|
||||
<table class="w-full text-left border-collapse">
|
||||
<thead class="bg-gray-100 text-gray-600 text-xs uppercase">
|
||||
<tr>
|
||||
<th class="p-3">Név</th>
|
||||
<th class="p-3">Város</th>
|
||||
<th class="p-3">Típus</th>
|
||||
<th class="p-3 text-right">Művelet</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-gray-200 text-sm">
|
||||
<tr v-for="i in 3" :key="i" class="hover:bg-gray-50">
|
||||
<td class="p-3 font-semibold">Profi Gumiszerviz #{{i}}</td>
|
||||
<td class="p-3">Budapest</td>
|
||||
<td class="p-3"><span class="bg-green-100 text-green-700 px-2 py-0.5 rounded-full text-xs">Gumis</span></td>
|
||||
<td class="p-3 text-right">
|
||||
<button class="text-blue-600 hover:underline mr-3">Szerkeszt</button>
|
||||
<button class="text-green-600 hover:underline font-bold text-lg">✓</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user