<script setup>
|
|
import {onMounted, reactive, ref} from "vue"
|
import {useRoute} from "vue-router"
|
import Pagination from "../components/Pagination.vue"
|
import {getKurse, routerBase} from "@/lib/api"
|
|
document.title = 'Kurse | globus-ilias-rest'
|
|
const route = useRoute()
|
const kurse = ref([])
|
const error = ref(null)
|
|
|
onMounted(init)
|
|
/////////////////////////////////////////////////////////////////////////
|
|
async function init(offset = 0) {
|
const data = await getKurse()
|
console.log(data)
|
kurse.value = data
|
}
|
|
function go(offset) {
|
console.log("go", offset)
|
return init(offset)
|
}
|
|
</script>
|
|
<template>
|
|
<div>
|
|
<h1>
|
ILIAS Kurse
|
<small>({{ kurse?.length }})</small>
|
</h1>
|
<p v-if="error">{{ error }}</p>
|
|
<div class="kurse">
|
|
<table class="w100p" v-if="kurse">
|
<thead>
|
<tr>
|
<th>ref_id</th>
|
<th>obj_id</th>
|
<th>title</th>
|
<th>description</th>
|
<th>type</th>
|
<th>offline</th>
|
</tr>
|
</thead>
|
<tbody>
|
<tr v-for="kurs in kurse">
|
<td>
|
<RouterLink :to="`${routerBase}/ui/kurs/${kurs.ref_id}`">
|
{{ kurs.ref_id }}
|
</RouterLink>
|
</td>
|
<td>{{ kurs.obj_id }}</td>
|
<td>{{ kurs.title }}</td>
|
<td>{{ kurs.description }}</td>
|
<td>{{ kurs.type }}</td>
|
<td>
|
<div :class="{red:kurs.offline===1,green:kurs.offline===0}">
|
{{ kurs.offline }}
|
</div>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
|
<!-- <pre>{{ kurse }}</pre>-->
|
|
</div>
|
|
</template>
|
|
<style scoped lang="stylus">
|
//
|
//.red
|
// max-width 2ch
|
// text-align center;
|
// background-color red;
|
// color white
|
// font-weight bold
|
//
|
//.green
|
// color green
|
|
</style>
|
