sev/RoggioApp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use correct EOF escaping to preserve template literals in JS
Deploy API / deploy (push) Failing after 16s
Details

Browse Source
This commit is contained in:
clara
2026-04-26 21:48:35 +02:00
parent 76f5cf7468
commit f9e2534d5f
1 changed files with 21 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/index.html
+21 -50
View File
@@ -3,7 +3,6 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>RoggioApp - API Dashboard</title> <title>RoggioApp - API Dashboard</title>
<!-- Vue 3 Global via cdnjs (als Backup zu unpkg) -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.4.21/vue.global.prod.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.4.21/vue.global.prod.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.tailwindcss.com"></script>
</head> </head>
@@ -17,17 +16,13 @@
</div> </div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8"> <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<!-- UNITS SECTION -->
<div class="bg-white p-6 rounded-lg shadow"> <div class="bg-white p-6 rounded-lg shadow">
<h2 class="text-2xl font-bold mb-4">Units (Räume/Objekte)</h2> <h2 class="text-2xl font-bold mb-4">Units (Räume/Objekte)</h2>
<form @submit.prevent="createUnit" class="mb-4 flex gap-2"> <form @submit.prevent="createUnit" class="mb-4 flex gap-2">
<input v-model="newUnit.name" placeholder="Name (z.B. Appartement 1)" class="border p-2 rounded flex-1" required> <input v-model="newUnit.name" placeholder="Name" class="border p-2 rounded flex-1" required>
<input v-model="newUnit.traits" placeholder="Traits (JSON)" class="border p-2 rounded flex-1"> <input v-model="newUnit.traits" placeholder="Traits (JSON)" class="border p-2 rounded flex-1">
<button type="submit" class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Neu</button> <button type="submit" class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Neu</button>
</form> </form>
<ul class="space-y-2"> <ul class="space-y-2">
<li v-for="unit in units" :key="unit.id" class="border p-4 rounded flex flex-col gap-2 bg-gray-50"> <li v-for="unit in units" :key="unit.id" class="border p-4 rounded flex flex-col gap-2 bg-gray-50">
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
@@ -40,10 +35,8 @@
</ul> </ul>
</div> </div>
<!-- EVENTS SECTION -->
<div class="bg-white p-6 rounded-lg shadow"> <div class="bg-white p-6 rounded-lg shadow">
<h2 class="text-2xl font-bold mb-4">Events (Buchungen/Aufgaben)</h2> <h2 class="text-2xl font-bold mb-4">Events (Buchungen/Aufgaben)</h2>
<form @submit.prevent="createEvent" class="mb-4 flex flex-col gap-2"> <form @submit.prevent="createEvent" class="mb-4 flex flex-col gap-2">
<select v-model="newEvent.unitId" class="border p-2 rounded" required> <select v-model="newEvent.unitId" class="border p-2 rounded" required>
<option disabled value="">Unit auswählen...</option> <option disabled value="">Unit auswählen...</option>
@@ -54,7 +47,6 @@
<button type="submit" class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Neu</button> <button type="submit" class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700">Neu</button>
</div> </div>
</form> </form>
<ul class="space-y-2"> <ul class="space-y-2">
<li v-for="event in events" :key="event.id" class="border p-4 rounded flex justify-between items-center bg-gray-50"> <li v-for="event in events" :key="event.id" class="border p-4 rounded flex justify-between items-center bg-gray-50">
<div> <div>
@@ -65,79 +57,58 @@
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
<script> <script>
document.addEventListener("DOMContentLoaded", () => { document.addEventListener("DOMContentLoaded", () => {
if (typeof Vue === "undefined") {
document.body.innerHTML += "<div style='color:red; padding:20px;'>CRITICAL: Vue library failed to load from CDN! AdBlocker/DNS issue?</div>";
return;
}
try { try {
const { createApp } = Vue; const { createApp } = Vue;
createApp({ createApp({
data() { data() {
return { return {
units: [], units: [], events: [],
events: [], newUnit: { name: "", traits: "{}" },
newUnit: { name: '', traits: '{"is_rentable": true}' }, newEvent: { unitId: "", type: "booking" },
newEvent: { unitId: '', type: 'booking' },
errorMsg: null errorMsg: null
} }
}, },
methods: { methods: {
async fetchUnits() { async fetchUnits() {
try { const res = await fetch("/api/units");
const res = await fetch('/api/units'); const data = await res.json();
if (!res.ok) throw new Error("API Fehler beim Laden der Units"); this.units = data.map(u => ({ ...u, traitsRaw: JSON.stringify(u.traits || {}, null, 2) }));
const data = await res.json();
this.units = data.map(u => ({ ...u, traitsRaw: JSON.stringify(u.traits || {}, null, 2) }));
} catch(e) {
this.errorMsg = e.message;
}
}, },
async fetchEvents() { async fetchEvents() {
try { const res = await fetch("/api/events");
const res = await fetch('/api/events'); this.events = await res.json();
if (!res.ok) throw new Error("API Fehler beim Laden der Events");
this.events = await res.json();
} catch(e) {
this.errorMsg = e.message;
}
}, },
getUnitName(id) { getUnitName(id) {
const u = this.units.find(u => u.id === id); const u = this.units.find(u => u.id === id);
return u ? u.name : id; return u ? u.name : id;
}, },
async createUnit() { async createUnit() {
try { const body = { name: this.newUnit.name, traits: JSON.parse(this.newUnit.traits || "{}") };
const body = { name: this.newUnit.name, traits: JSON.parse(this.newUnit.traits || '{}') }; await fetch("/api/units", { method: "POST", headers: {"Content-Type":"application/json"}, body: JSON.stringify(body) });
await fetch('/api/units', { method: 'POST', headers: {'Content-Type':'application/json'}, body: JSON.stringify(body) }); this.newUnit.name = "";
this.newUnit.name = ''; this.fetchUnits();
this.fetchUnits();
} catch(e) { alert("Fehler: " + e.message); }
}, },
async updateUnit(unit) { async updateUnit(unit) {
try { const body = { name: unit.name, traits: JSON.parse(unit.traitsRaw) };
const body = { name: unit.name, traits: JSON.parse(unit.traitsRaw) }; await fetch(`/api/units/${unit.id}`, { method: "PUT", headers: {"Content-Type":"application/json"}, body: JSON.stringify(body) });
await fetch(\`/api/units/\${unit.id}\`, { method: 'PUT', headers: {'Content-Type':'application/json'}, body: JSON.stringify(body) }); alert("Gespeichert!");
alert("Gespeichert!");
} catch(e) { alert("Invalid JSON: " + e.message); }
}, },
async deleteUnit(id) { async deleteUnit(id) {
await fetch(\`/api/units/\${id}\`, { method: 'DELETE' }); await fetch(`/api/units/${id}`, { method: "DELETE" });
this.fetchUnits(); this.fetchUnits();
}, },
async createEvent() { async createEvent() {
const body = { unitId: this.newEvent.unitId, type: this.newEvent.type, traits: {} }; const body = { unitId: this.newEvent.unitId, type: this.newEvent.type, traits: {} };
await fetch('/api/events', { method: 'POST', headers: {'Content-Type':'application/json'}, body: JSON.stringify(body) }); await fetch("/api/events", { method: "POST", headers: {"Content-Type":"application/json"}, body: JSON.stringify(body) });
this.fetchEvents(); this.fetchEvents();
}, },
async deleteEvent(id) { async deleteEvent(id) {
await fetch(\`/api/events/\${id}\`, { method: 'DELETE' }); await fetch(`/api/events/${id}`, { method: "DELETE" });
this.fetchEvents(); this.fetchEvents();
} }
}, },
@@ -145,9 +116,9 @@
this.fetchUnits(); this.fetchUnits();
this.fetchEvents(); this.fetchEvents();
} }
}).mount('#app') }).mount("#app")
} catch (err) { } catch (err) {
document.body.innerHTML += "<div style='color:red; padding: 20px;'>Kritischer Fehler beim Starten von Vue: " + err.message + "</div>"; document.body.innerHTML += "<div style=\"color:red; padding:20px;\">Error: " + err.message + "</div>";
} }
}); });
</script> </script>