Period titles shown and added to report

This commit is contained in:
PMKuipers 2023-07-29 12:21:30 +02:00
parent 19cc98a893
commit 795473a580
3 changed files with 37 additions and 5 deletions

View File

@ -286,7 +286,8 @@ export default {
<div class='r-studyplan-content'>
<!-- First paint the headings-->
<div class='r-studyplan-headings'
><r-studyline-heading v-for="(line,lineindex) in page.studylines"
><s-studyline-header-heading></s-studyline-header-heading>
<r-studyline-heading v-for="(line,lineindex) in page.studylines"
:key="line.id"
v-model="page.studylines[lineindex]"
:layers='countLineLayers(line)+1'
@ -298,6 +299,15 @@ export default {
<!-- Next, paint all the cells in the scrollable -->
<div class="r-studyplan-scrollable" >
<div class="r-studyplan-timeline" :style="columns_stylerule">
<!-- add period information -->
<template v-for="(n,index) in (page.periods+1)">
<s-studyline-header-period
v-if="index > 0"
v-model="page.perioddesc[index-1]"
></s-studyline-header-period>
<div class="s-studyline-header-filter"></div>
</template>
<!-- Line by line add the items -->
<!-- The grid layout handles putting it in rows and columns -->
<template v-for="(line,lineindex) in page.studylines"

View File

@ -169,9 +169,16 @@ export default {
},
template: `
<div class="s-studyline-header-period" ref="main"
><p><abbr v-b-tooltip.hover :title="value.fullname">{{ value.shortname }}</abbr>
<slot></slot><p
><p class="datespan">
><p><abbr :id="'s-period-'+value.id" :title="value.fullname">{{ value.shortname }}</abbr>
<b-tooltip
:target="'s-period-'+value.id" triggers="hover"
>{{ value.fullname }}<br>
<span class="s-studyline-header-period-datespan">
<span class="date">{{ startdate }}</span> - <span class="date">{{ enddate }}</span>
<span>
</b-tooltip>
<slot></slot
><p class="s-studyline-header-period-datespan small">
<span class="date">{{ startdate }}</span> - <span class="date">{{ enddate }}</span>
</p>
</div>

View File

@ -583,7 +583,22 @@ a.t-item-course-config {
border-bottom-style: solid;
}
.s-studyline-header-period .datespan{
.s-studyline-header-period {
text-align: center;
}
.s-studyline-header-period p {
margin-bottom: 0;
}
.s-studyline-header-period-datespan{
white-space: nowrap;
}
.s-studyline-header-period-datespan .date{
font-weight: bold;
}
.s-studyline-header-period-datespan.small{
font-size: 9px;
}