From efd853c8fed86d89dbb9da7613241fb5c806eb33 Mon Sep 17 00:00:00 2001
From: alex <alex@alexloehr.net>
Date: Tue, 03 Jun 2025 11:16:46 +0000
Subject: [PATCH] adding page KursDetail.vue

---
 vue/src/pages/Kurse.vue      |    2 
 package-lock.json            |   45 +++++++++++
 vue/src/router.js            |    6 +
 package.json                 |    1 
 vue/src/pages/KursDetail.vue |  129 ++++++++++++++++++++++++++++++++
 5 files changed, 180 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 073cdb0..08df5f0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.1",
       "dependencies": {
         "@fastify/static": "^8.2.0",
+        "@vueuse/core": "^13.3.0",
         "fastify": "^5.3.3",
         "lodash": "^4.17.21",
         "mysql2": "^3.14.1",
@@ -1636,6 +1637,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/web-bluetooth": {
+      "version": "0.0.21",
+      "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.21.tgz",
+      "integrity": "sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA==",
+      "license": "MIT"
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "5.2.4",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
@@ -1872,6 +1879,44 @@
       "integrity": "sha512-c/0fWy3Jw6Z8L9FmTyYfkpM5zklnqqa9+a6dz3DvONRKW2NEbh46BP0FHuLFSWi2TnQEtp91Z6zOWNrU6QiyPg==",
       "license": "MIT"
     },
+    "node_modules/@vueuse/core": {
+      "version": "13.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-13.3.0.tgz",
+      "integrity": "sha512-uYRz5oEfebHCoRhK4moXFM3NSCd5vu2XMLOq/Riz5FdqZMy2RvBtazdtL3gEcmDyqkztDe9ZP/zymObMIbiYSg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.21",
+        "@vueuse/metadata": "13.3.0",
+        "@vueuse/shared": "13.3.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "vue": "^3.5.0"
+      }
+    },
+    "node_modules/@vueuse/metadata": {
+      "version": "13.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-13.3.0.tgz",
+      "integrity": "sha512-42IzJIOYCKIb0Yjv1JfaKpx8JlCiTmtCWrPxt7Ja6Wzoq0h79+YVXmBV03N966KEmDEESTbp5R/qO3AB5BDnGw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared": {
+      "version": "13.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-13.3.0.tgz",
+      "integrity": "sha512-L1QKsF0Eg9tiZSFXTgodYnu0Rsa2P0En2LuLrIs/jgrkyiDuJSsPZK+tx+wU0mMsYHUYEjNsuE41uqqkuR8VhA==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "vue": "^3.5.0"
+      }
+    },
     "node_modules/abstract-logging": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/abstract-logging/-/abstract-logging-2.0.1.tgz",
diff --git a/package.json b/package.json
index eaf5fd1..64e72e9 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
   },
   "dependencies": {
     "@fastify/static": "^8.2.0",
+    "@vueuse/core": "^13.3.0",
     "fastify": "^5.3.3",
     "lodash": "^4.17.21",
     "mysql2": "^3.14.1",
diff --git a/vue/src/pages/KursDetail.vue b/vue/src/pages/KursDetail.vue
new file mode 100644
index 0000000..2da1ab3
--- /dev/null
+++ b/vue/src/pages/KursDetail.vue
@@ -0,0 +1,129 @@
+<script setup>
+
+import {useRoute} from 'vue-router'
+import {onMounted, reactive, ref} from "vue"
+
+const route = useRoute()
+const kursId = route.params.kursId
+const kurs = ref(null)
+const kursItems = ref(null)
+const kursTn = ref(null)
+const error = ref(null)
+
+onMounted(init)
+
+/////////////////////////////////////////////////////////////////////////
+
+async function init () {
+   let resKurs = await fetch(`/api/kurs/${kursId}?token=jiuGfr432898D90290kjfsldkfn3hh8F`)
+   let dataKurs = await resKurs.json()
+   console.log(dataKurs)
+   kurs.value = dataKurs
+
+   let resKursItems = await fetch(`/api/kurs/items/${kursId}?token=jiuGfr432898D90290kjfsldkfn3hh8F`)
+   let dataKursItems = await resKursItems.json()
+   console.log(dataKursItems)
+   kursItems.value = dataKursItems
+
+   let resKursTn = await fetch(`/api/kurs/teilnehmer/${kursId}?token=jiuGfr432898D90290kjfsldkfn3hh8F`)
+   let dataKursTn = await resKursTn.json()
+   console.log(dataKursTn)
+   kursTn.value = dataKursTn
+
+}
+
+</script>
+
+<template>
+
+   <div>
+      <h1>
+         Kurs {{ kursId }}
+<!--         <small>{{ user?.firstname }} {{ user?.lastname }}</small>-->
+      </h1>
+      <p v-if="error">{{ error }}</p>
+
+      <h2>Kurs</h2>
+      <pre>{{kurs}}</pre>
+      <h2>KursItems</h2>
+      <pre>{{kursItems}}</pre>
+      <h2>KursTn</h2>
+      <pre>{{kursTn}}</pre>
+
+<!--      <pre>{{ user }}</pre>-->
+
+<!--      <div class="user" v-if="user">-->
+<!--         <span>usr_id</span>-->
+<!--         <div>{{ user.usr_id }}</div>-->
+
+<!--         <span>login</span>-->
+<!--         <div>{{ user.login }}</div>-->
+
+<!--         <span>firstname</span>-->
+<!--         <div>{{ user.firstname }}</div>-->
+
+<!--         <span>lastname</span>-->
+<!--         <div>{{ user.lastname }}</div>-->
+
+<!--         <span>gender</span>-->
+<!--         <div>{{ user.gender }}</div>-->
+
+<!--         <span>email</span>-->
+<!--         <div>{{ user.email }}</div>-->
+
+<!--         <span>Markt</span>-->
+<!--         <div>{{ user.Markt }}</div>-->
+
+<!--         <span>Marktnummer</span>-->
+<!--         <div>{{ user.Marktnummer }}</div>-->
+
+<!--         <span>Personalnummer</span>-->
+<!--         <div>{{ user.Personalnummer }}</div>-->
+
+<!--         <span>department</span>-->
+<!--         <div>{{ user.department }}</div>-->
+
+
+<!--      </div>-->
+
+      <!--      <table v-if="user">-->
+      <!--         <tbody>-->
+      <!--            <tr>-->
+      <!--               <td>user_id</td>-->
+      <!--               <td>{{user.usr_id}}</td>-->
+      <!--               <td>login</td>-->
+      <!--               <td>{{user.login}}</td>-->
+      <!--            </tr>-->
+      <!--            <tr>-->
+      <!--               <td>firstname</td>-->
+      <!--               <td>{{user.firstname}}</td>-->
+      <!--               <td>lastname</td>-->
+      <!--               <td>{{user.lastname}}</td>-->
+      <!--            </tr>-->
+      <!--            <tr>-->
+      <!--               <td>usr_id</td>-->
+      <!--               <td>{{user.usr_id}}</td>-->
+      <!--            </tr>-->
+      <!--            <tr>-->
+      <!--               <td>usr_id</td>-->
+      <!--               <td>{{user.usr_id}}</td>-->
+      <!--            </tr>-->
+      <!--            <tr>-->
+      <!--               <td>usr_id</td>-->
+      <!--               <td>{{user.usr_id}}</td>-->
+      <!--            </tr>-->
+      <!--            <tr>-->
+      <!--               <td>usr_id</td>-->
+      <!--               <td>{{user.usr_id}}</td>-->
+      <!--            </tr>-->
+
+      <!--         </tbody>-->
+      <!--      </table>-->
+
+   </div>
+
+</template>
+
+<style scoped>
+
+</style>
diff --git a/vue/src/pages/Courses.vue b/vue/src/pages/Kurse.vue
similarity index 96%
rename from vue/src/pages/Courses.vue
rename to vue/src/pages/Kurse.vue
index fcfb3e6..326da47 100644
--- a/vue/src/pages/Courses.vue
+++ b/vue/src/pages/Kurse.vue
@@ -56,7 +56,7 @@
             <tbody>
                <tr v-for="kurs in kurse">
                   <td>
-                     <RouterLink :to="`/ui/user/${kurs.usr_id}`">
+                     <RouterLink :to="`/ui/kurs/${kurs.ref_id}`">
                         {{kurs.ref_id}}
                      </RouterLink>
                   </td>
diff --git a/vue/src/router.js b/vue/src/router.js
index 68ece82..b79cbe4 100644
--- a/vue/src/router.js
+++ b/vue/src/router.js
@@ -5,13 +5,15 @@
 
 import Users from './pages/Users.vue'
 import UserDetail from './pages/UserDetail.vue'
-import Courses from './pages/Courses.vue'
+import Kurse from './pages/Kurse.vue'
+import KursDetail from './pages/KursDetail.vue'
 
 const routes = [
    { path: '/', redirect: "/user" },
    { path: '/ui/user', component: Users },
    { path: '/ui/user/:userId', component: UserDetail },
-   { path: '/ui/course', component: Courses },
+   { path: '/ui/kurs', component: Kurse },
+   { path: '/ui/kurs/:kursId', component: KursDetail },
 ]
 
 const router = createRouter({

--
Gitblit v1.8.0