Steev/GeoTracking
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 🐛 replaced message ui with alert

Browse Source
This commit is contained in:
steev
2025-01-16 10:32:28 +01:00
parent f1ff69bef8
commit e931e23062
12 changed files with 162 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/App.vue
View File

@ -39,7 +39,7 @@ export default defineComponent({
<template>
<div class="appContainer">
<Navbar></Navbar>
<cookiePrompt v-if="showCookiePrompt"></cookiePrompt>
<cookiePrompt v-if="showCookiePrompt" @close="showCookiePrompt=false;"></cookiePrompt>
<RouterView></RouterView>
</div>
</template>

2
web/src/components/cookiePrompt.vue
View File

@ -8,10 +8,12 @@ export default defineComponent({
setup(_, { emit }: SetupContext) {
function acceptCookies(){
emit("close")
localStorage.setItem("allow-data-storage", "true")
}
function rejectCookies(){
emit("close")
localStorage.setItem("allow-data-storage", "false")
}

18
web/src/components/fileUpload.vue
View File

@ -81,6 +81,8 @@ export default defineComponent({
drivers.value.push({ id: jsonBody[i]["id"], name: jsonBody[i]["name"] })
}
} else {
alert(`upload failed: ${await response.text()}`)
console.log(await response.text())
messageType.value = "error";
message.value = `upload failed: ${await response.statusText}`;
@ -98,8 +100,8 @@ export default defineComponent({
headers: headers
})
// make sure the request was successful
var response = await fetch(request)
// make sure the request was successfull
if (response.ok) {
var jsonBody = await response.json()
@ -108,6 +110,8 @@ export default defineComponent({
vehicles.value.push({ id: jsonBody[i]["id"], name: jsonBody[i]["name"] })
}
} else {
alert(`upload failed: ${await response.text()}`)
console.log(await response.text())
messageType.value = "error";
message.value = `upload failed: ${await response.text()}`;
@ -118,6 +122,8 @@ export default defineComponent({
var save = async () => {
if (!file.value) {
alert("please select a file");
messageType.value = "warning";
message.value = "please select a file";
return;
@ -142,19 +148,25 @@ export default defineComponent({
if (response.ok) {
const result = await response.json();
emit("response", result);
messageType.value = "success";
message.value = `upload successfull`;
buttonText.value = 'upload successfull';
message.value = `Upload Successful`;
buttonText.value = 'Upload Successful';
setTimeout(() => {
buttonText.value = "Upload";
}, 2000);
} else {
alert(`upload failed: ${await response.statusText}`)
console.error('upload failed: ', await response.statusText);
messageType.value = "error";
message.value = `upload failed: ${await response.statusText}`;
buttonText.value = "Upload";
}
} catch (error) {
alert(`upload failed: ${error}`)
messageType.value = "error";
message.value = `upload failed: ${error}`;
buttonText.value = "Upload";

10
web/src/components/map.vue
View File

@ -96,8 +96,10 @@ export default defineComponent({
}
console.log(track.value)
} else {
alert(`failed to load track meta with error: ${await response.statusText}`)
messageType.value = "error";
message.value = `"failed to load track meta with error: ${await response.statusText}`;
message.value = `failed to load track meta with error: ${await response.statusText}`;
}
}
@ -122,6 +124,8 @@ export default defineComponent({
const bounds = geoJsonLayer.getBounds();
mapInstance.value.fitBounds(bounds);
} else {
alert("Map or GeoJSON data not available.")
console.error("Map or GeoJSON data not available.");
messageType.value = "error";
message.value = `"Map or GeoJSON data not available.`;
@ -160,7 +164,9 @@ export default defineComponent({
<tbody>
<!-- row 1 -->
<tr v-if="track.id == 0" class="bg-base-200">
<th>{{ track.name }}</th>
<th>
<div class="skeleton h-4 w-full"></div>
</th>
<td>
<div class="skeleton h-4 w-full"></div>
</td>

8
web/src/components/message.vue
View File

@ -25,19 +25,19 @@ export default defineComponent({
<template>
<div v-if="type==='info'" role="alert" class="alert alert-info alert-soft">
<div v-if="type=='info'" role="alert" class="alert alert-info alert-soft">
<span>{{ message }}</span>
<button class="btn btn-soft btn-info" v-on:click="close">Close</button>
</div>
<div v-if="type==='success'" role="alert" class="alert alert-success alert-soft">
<div v-if="type=='success'" role="alert" class="alert alert-success alert-soft">
<span>{{ message }}</span>
<button class="btn btn-soft btn-success" v-on:click="close">Close</button>
</div>
<div v-if="type==='warning'" role="alert" class="alert alert-warning alert-soft">
<div v-if="type=='warning'" role="alert" class="alert alert-warning alert-soft">
<span>{{ message }}</span>
<button class="btn btn-soft btn-warning" v-on:click="close">Close</button>
</div>
<div v-if="type==='error'" role="alert" class="alert error alert-soft">
<div v-if="type=='error'" role="alert" class="alert error alert-soft">
<span>{{ message }}</span>
<button class="btn btn-soft btn-error" v-on:click="close">Close</button>
</div>

30
web/src/components/pointcloud.vue
View File

@ -45,6 +45,8 @@ export default defineComponent({
console.log(props)
if (!props.routes || props.routes.length <= 0) {
alert("no points to show")
messageType.value = "error";
message.value = `no points to show`;
}
@ -80,6 +82,8 @@ export default defineComponent({
legend.value[driver["id"]] = driver["name"];
}
} else {
alert(`failed to get drivers with error: ${await response.statusText}`)
console.log(await response.text())
messageType.value = "error";
message.value = `failed to get drivers with error: ${await response.statusText}`;
@ -253,7 +257,30 @@ export default defineComponent({
}
}
/**
* Handles mouse clicks to navigate to the specific track page
* @param event MouseEvent triggered on click
*/
const onMouseClick = (event: MouseEvent) => {
if (!canvasRef.value) return;
raycaster.setFromCamera(mouse, camera);
const intersects = raycaster.intersectObject(pointCloud);
if (intersects.length > 0) {
const intersectIndex = Math.floor(intersects[0].index || 0);
const point = points[intersectIndex];
console.log(point.id)
// Redirect to /track/:id using Vue Router
router.push(`/track/${point.id}`);
}
};
// Add event listeners for mouse actions
canvasRef.value.addEventListener("mousemove", onMouseMove);
canvasRef.value.addEventListener("click", onMouseClick);
// Fenstergröße anpassen
window.addEventListener("resize", () => {
@ -278,7 +305,8 @@ export default defineComponent({
<template>
<Message v-if="type != 'None'" :type="messageType" :message="message" @close="message = ''; messageType = 'None'" style="z-index: -1;"></Message>
<Message v-if="type != 'None'" :type="messageType" :message="message" @close="message = ''; messageType = 'None'"
style="z-index: -1;"></Message>
<div class="pointcloud-container relative">
<canvas ref="canvasRef"></canvas>
<div ref="tooltipRef" class="tooltip hidden fixed z-50 px-2 py-1 bg-base-200 text-base-content rounded">

21
web/src/views/driver.vue
View File

@ -14,7 +14,7 @@ export default defineComponent({
const driverList: Ref<driver[]> = ref([])
// values for UI Information distribution
const messageType: Ref<string> = ref("");
const messageType: Ref<string> = ref("error");
const message: Ref<string> = ref("");
// handles delete a driver
@ -33,13 +33,17 @@ export default defineComponent({
var response = await fetch(request)
if (!response.ok) {
console.log(await response.text())
alert(`deleting driver failed with error: ${await response.text()}`)
messageType.value = "error";
message.value = `deleting driver failed with error: ${await response.text()}`;
} else {
console.log(await response.text())
alert("deleted driver successful")
messageType.value = "success";
message.value = `deleted driver`;
driverList.value = []
getDrivers();
}
}
@ -68,7 +72,8 @@ export default defineComponent({
driverList.value.push({ id: jsonBody[i]["id"], name: jsonBody[i]["name"] })
}
} else {
console.log(await response.text())
alert(`upload failed: ${response.text()}`)
messageType.value = "error";
message.value = `upload failed: ${response.text()}`;
}
@ -95,9 +100,10 @@ export default defineComponent({
var jsonBody = await response.json()
driverList.value.push({ id: jsonBody["body"], name: driverName.value })
} else {
console.log(await response.text())
alert(`creating driver: ${response.text()}`)
messageType.value = "error";
message.value = `upload failed: ${response.text()}`;
message.value = `creating driver: ${response.text()}`;
}
}
@ -116,8 +122,7 @@ export default defineComponent({
<template>
<Message v-if="type == 'none'" :type="messageType" :message="message" @close="message = ''; messageType = 'None'">
</Message>
<Message v-if="messageType != 'None'" :type="messageType" :message="message" @close="message = ''; messageType = 'None'"></Message>
<div class="overflow-x-auto">
<table class="table">
<!-- head -->

15
web/src/views/route.vue
View File

@ -81,11 +81,15 @@ export default defineComponent({
// Wenn die Antwort OK ist, die Daten verarbeiten
mapData.value = await response.json();
} else {
alert(`loading tracks failed: ${await response.text()}`)
console.log(await response.text());
messageType.value = "error";
message.value = `loading tracks failed: ${await response.text()}`;
}
} catch (error) {
alert(`loading tracks failed with error: ${error}`)
console.error("loading tracks failed with error:", error);
messageType.value = "error";
message.value = `loading tracks failed with error: ${error}`;
@ -114,6 +118,8 @@ export default defineComponent({
message.value = `deleting track failed with error: ${await response.text()}`;
getTracks()
} else {
alert("deleted track")
console.log(await response.text())
messageType.value = "success";
message.value = `deleted track`;
@ -141,6 +147,8 @@ export default defineComponent({
tracks.value.push({ id: jsonBody[i]["id"], name: jsonBody[i]["name"], driver: { name: "", id: 0 }, time: new Date(Date.now()) })
}
} else {
alert(`loading track list failed with error: ${error}`)
console.log(await response.text())
messageType.value = "error";
message.value = `loading track list failed with error: ${error}`;
@ -193,7 +201,8 @@ export default defineComponent({
showCloud.value = true;
} else {
console.log(await response.text())
alert(`searching tracks failed: ${await response.text()}`)
messageType.value = "error";
message.value = `searching tracks failed: ${await response.text()}`;
}
@ -242,7 +251,7 @@ export default defineComponent({
<template>
<Message v-if="type == 'none'" :type="messageType" :message="message" @close="message = ''; messageType = 'None'">
</Message>
<FileUpload v-if="showUpload" @close="showUpload = false;" @response="getTracks" :drivers="[]"
<FileUpload v-if="showUpload" @close="showUpload = false;" @response="tracks=[]; getTracks();" :drivers="[]"
style="position:absolute; top: 30VH; width: 80%;"></FileUpload>
<div class="grid grid-flow-col auto-cols-max gap-4">
<div>
@ -259,7 +268,7 @@ export default defineComponent({
</li>
<li v-for="track in tracks">
<span><a v-on:click="loadTrack(track.id); multipleTracks = false;"> {{ track.name }}</a>
<button class="btn btn-error" v-on:click="deleteTrack(track.id)">
<button class="btn btn-error" v-on:click="deleteTrack(track.id); tracks=[]; getTracks();">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
class="bi bi-trash3-fill" viewBox="0 0 16 16">
<path

12
web/src/views/vehicle.vue
View File

@ -35,11 +35,13 @@ export default defineComponent({
var response = await fetch(request)
if (!response.ok) {
console.log(await response.text())
alert(`deleting vehicle failed with error: ${await response.text()}`)
messageType.value = "error";
message.value = `deleting vehicle failed with error: ${await response.text()}`;
} else {
console.log(await response.text())
alert("delete vehicle")
messageType.value = "success";
message.value = `deleted vehicle`;
}
@ -72,7 +74,8 @@ export default defineComponent({
vehicleList.value.push({ id: vehicle["id"], name: vehicle["name"], licenseplate: plate })
}
} else {
console.log(await response.text())
alert(`loading vehicles failed with error: ${await response.text()}`)
messageType.value = "error";
message.value = `loading vehicles failed with error: ${await response.text()}`;
}
@ -99,7 +102,8 @@ export default defineComponent({
var jsonBody = await response.json()
vehicleList.value.push({ id: jsonBody["body"], name: vehicleName.value, licenseplate: "N/A" })
} else {
console.log(await response.text())
alert(`creating vehicle failed with error: ${error}`)
messageType.value = "error";
message.value = `creating vehicle failed with error: ${error}`;
}