REST Service for POPCORN - ILIAS
alex
2025-07-11 770082c6d51439f1b8b8ed9b84745e9b9cb02301
vue/src/pages/KursDetail.vue
@@ -2,20 +2,33 @@
import {useRoute} from 'vue-router'
import {onMounted, reactive, ref} from "vue"
import {getKurs, getKursItems, getKursTn} from "../lib/api.js"
import {getKurs, getKursItems, getKursRoles, getKursTn, getKursTnByRole, iliasBase, routerBase} from "../lib/api.js"
import LinkExtern from "../components/LinkExtern.vue"
import dayjs from "dayjs"
import KursItems from '../components/KursItems.vue'
import KursRoles from '../components/KursRoles.vue'
import KursMembers from '../components/KursMembers.vue'
import KursTnByRole from '../components/KursTnByRole.vue'
const route = useRoute()
const kursId = route.params.kursId
document.title = `Kurs ${kursId} | globus-ilias-rest`
const kurs = ref(null)
const kursItems = ref(null)
const kursTn = ref(null)
const kursTnByRolle = ref(null)
const kursRoles = ref(null)
const error = ref(null)
onMounted(init)
/////////////////////////////////////////////////////////////////////////
async function init () {
   const dataKurs = await getKurs(kursId)
   console.log(dataKurs)
   kurs.value = dataKurs
@@ -27,7 +40,18 @@
   const dataKursTn = await getKursTn(kursId)
   console.log(dataKursTn)
   kursTn.value = dataKursTn
   const dataKursTnByRolle = await getKursTnByRole(kursId)
   console.log(dataKursTnByRolle)
   kursTnByRolle.value = dataKursTnByRolle
   const dataKursRoles = await getKursRoles(kursId)
   console.log(dataKursRoles)
   kursRoles.value = dataKursRoles
}
const aaa = import.meta.env.VITE_TST
</script>
@@ -36,8 +60,7 @@
   <div>
      <h1>
         Kurs
         <small>{{ kursId }}</small>
         <!--         <small>{{ user?.firstname }} {{ user?.lastname }}</small>-->
         <small>{{ kurs?.title }}</small>
      </h1>
      <p v-if="error">{{ error }}</p>
@@ -45,7 +68,12 @@
      <div class="user" v-if="kurs">
         <span>ref_id</span>
         <div>{{ kurs.ref_id }}</div>
         <div>
            <a :href="`${iliasBase}/goto.php?target=${kurs.type}_${kurs.ref_id}`" target="_blank">
               {{ kurs.ref_id }}
               <LinkExtern />
            </a>
         </div>
         <span>obj_id</span>
         <div>{{ kurs.obj_id }}</div>
@@ -57,75 +85,42 @@
         <div style="grid-column: span 3">{{ kurs.description }}</div>
      </div>
      <!--      <pre>{{kurs}}</pre>-->
      <div class="cols">
      <h2>KursItems</h2>
      <table>
         <thead>
            <th>parent_id</th>
            <th>ref_id</th>
            <th>obj_id</th>
            <th>title</th>
            <th>type</th>
         </thead>
         <tbody>
            <!-- TODO verlinken auf Ziel in ILAS | goto.php?target=crs_ID -->
            <tr v-for="item in kursItems">
               <td>{{ item.parent_id }}</td>
               <td>{{ item.ref_id }}</td>
               <td>{{ item.obj_id }}</td>
               <td>{{ item.title }}</td>
               <td>{{ item.type }}</td>
            </tr>
         </tbody>
      </table>
      <pre>{{ kursItems }}</pre>
         <div>
            <h2>KursItems <small>({{ kursItems?.length }})</small></h2>
            <KursItems :kursItems="kursItems" />
         </div>
      <h2>KursTn</h2>
      <pre>{{ kursTn }}</pre>
         <div>
            <h2>KursRoles <small>({{ kursRoles?.length }})</small></h2>
            <KursRoles :kursRoles="kursRoles" />
         </div>
      <!--      <pre>{{ user }}</pre>-->
      </div>
      <div class="cols">
         <div>
            <h2>KursTn by Members <small>({{ kursTn?.length }})</small></h2>
            <KursMembers :kursTn="kursTn" />
         </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>-->
         <div>
            <h2>KursTnByRole <small>({{ kursTnByRolle?.length }})</small></h2>
            <KursTnByRole :kursTnByRolle="kursTnByRolle" />
         </div>
      <!--         </tbody>-->
      <!--      </table>-->
      </div>
   </div>
</template>
<style scoped>
<style scoped lang="stylus">
.cols
   display flex;
   gap 2em
</style>