.agenda-table.mb-3
n-checkbox-group(v-model:value='pickedEvents')
table
thead
tr
th.agenda-table-head-check(v-if='pickerModeActive')
th.agenda-table-head-time Time
th.agenda-table-head-location(colspan='2') Location
th.agenda-table-head-event(colspan='2') {{ siteStore.viewport < 990 ? '' : 'Event' }}
tbody
tr.agenda-table-display-noresult(
v-if='!meetingEvents || meetingEvents.length < 1'
)
td(:colspan='pickerModeActive ? 6 : 5')
i.bi.bi-exclamation-triangle.me-2
span(v-if='agendaStore.searchVisible && agendaStore.searchText') No event matching your search query.
span(v-else) Nothing to display
tr(
v-for='item of meetingEvents'
:key='item.key'
:id='`agenda-rowid-` + item.key'
:class='item.cssClasses'
)
//- ROW - DAY HEADING -----------------------
template(v-if='item.displayType === `day`')
td(:id='`agenda-day-` + item.id', :colspan='pickerModeActive ? 6 : 5') {{item.date}}
//- ROW - SESSION HEADING -------------------
template(v-else-if='item.displayType === `session-head`')
td.agenda-table-cell-check(v-if='pickerModeActive')
td.agenda-table-cell-ts {{item.timeslot}}
td.agenda-table-cell-name(colspan='4') {{item.name}}
//- ROW - EVENT -----------------------------
template(v-else-if='item.displayType === `event`')
//- CELL - CHECKBOX -----------------------
td.agenda-table-cell-check(
v-if='pickerModeActive'
)
n-checkbox(
:value='item.key'
)
//- CELL - TIME ---------------------------
td.agenda-table-cell-ts(
:class='{ "is-session-event": item.isSessionEvent }'
)
span(v-if='item.isSessionEvent') —
span(v-else) {{item.timeslot}}
//- CELL - ROOM ---------------------------
td.agenda-table-cell-room(
:colspan='!item.isSessionEvent ? 2 : 1'
)
template(v-if='item.location && item.location.short')
n-popover(
trigger='hover'
v-if='agendaStore.floorIndicatorsShown'
)
template(#trigger)
span.badge {{item.location.short}}
span {{item.location.name}}
router-link.discreet(
:to='`/meeting/` + agendaStore.meeting.number + `/floor-plan?room=` + xslugify(item.room)'
:aria-label='item.room'
) {{item.room}}
span(v-else) {{item.room}}
//- CELL - GROUP --------------------------
td.agenda-table-cell-group(v-if='item.type === `regular`')
span.badge(v-if='agendaStore.areaIndicatorsShown && siteStore.viewport > 1200') {{item.groupAcronym}}
a.discreet(:href='`/group/` + item.acronym + `/about/`') {{item.acronym}}
//- CELL - NAME ---------------------------
td.agenda-table-cell-name
i.bi.me-2.agenda-event-icon(v-if='item.icon && agendaStore.eventIconsShown', :class='item.icon')
a.discreet(
v-if='item.flags.agenda'
:href='item.agenda.url'
:aria-label='item.isSessionEvent ? item.groupName : item.name'
) {{item.isSessionEvent ? item.groupName : item.name}}
span(v-else) {{item.isSessionEvent ? item.groupName : item.name}}
n-popover(
v-if='item.isBoF'
trigger='hover'
:width='250'
)
template(#trigger)
span.badge.is-bof BoF
span #[a(href='https://www.ietf.org/how/bofs/', target='_blank') Birds of a Feather] sessions (BoFs) are initial discussions about a particular topic of interest to the IETF community.
.agenda-table-note(v-if='item.note')
i.bi.bi-arrow-return-right.me-1
span {{item.note}}
.agenda-table-mobile-state(v-if='isMobile && item.status === `canceled`'): span.badge.is-cancelled Cancelled
.agenda-table-mobile-state(v-else-if='isMobile && item.status === `resched`'): span.badge.is-rescheduled Rescheduled
//- CELL - LINKS --------------------------
td.agenda-table-cell-links
template(v-if='state.selectedColorPicker === item.key')
.agenda-table-colorchoices
.agenda-table-colorchoice(
@click='setEventColor(item.key, null)'
)
i.bi.bi-x
.agenda-table-colorchoice(
v-for='(color, idx) in agendaStore.colors'
:key='idx'
:style='{ "color": color.hex }'
@click='setEventColor(item.key, idx)'
)
template(v-else)
span.badge.is-cancelled(v-if='!isMobile && item.status === `canceled`') Cancelled
span.badge.is-rescheduled(v-else-if='!isMobile && item.status === `resched`') Rescheduled
.agenda-table-cell-links-buttons(v-else-if='siteStore.viewport < 1200 && item.links && item.links.length > 0')
n-dropdown(
v-if='!agendaStore.colorPickerVisible'
trigger='click'
:options='item.links'
key-field='id'
:render-icon='renderLinkIcon'
:render-label='renderLinkLabel'
)
n-button(size='tiny')
i.bi.bi-three-dots
.agenda-table-cell-links-buttons(v-else-if='item.links && item.links.length > 0')
template(v-if='item.flags.agenda')
n-popover
template(#trigger)
i.bi.bi-collection(
:id='`btn-lnk-` + item.key + `-mat`'
@click='showMaterials(item.key)'
)
span Show meeting materials
template(v-else-if='item.type === `regular`')
n-popover
template(#trigger)
i.no-meeting-materials
i.bi.bi-clipboard-x
i.bi.bi-exclamation-triangle-fill.ms-1
span No meeting materials yet.
n-popover(v-for='lnk of item.links', :key='lnk.id')
template(#trigger)
a(
:id='`btn-` + lnk.id'
:href='lnk.href'
:aria-label='lnk.label'
:class='`text-` + lnk.color'
): i.bi(:class='`bi-` + lnk.icon')
span {{lnk.label}}
.agenda-table-colorindicator(
v-if='agendaStore.colorPickerVisible || getEventColor(item.key)'
@click='agendaStore.colorPickerVisible && openColorPicker(item.key)'
:class='{ "is-active": agendaStore.colorPickerVisible }'
:style='{ "color": getEventColor(item.key) }'
)
.agenda-table-search
n-popover
template(#trigger)
button(
@click='toggleSearch'
:aria-label='agendaStore.searchVisible ? `Close Search` : `Search Events`'
)
i.bi.bi-search
span {{ agendaStore.searchVisible ? 'Close Search' : 'Search Events' }}
.agenda-table-colorpicker
n-popover
template(#trigger)
button(
@click='toggleColorPicker'
:aria-label='agendaStore.colorPickerVisible ? `Exit Colors Assignment Mode` : `Assign Colors to Events`'
)
i.bi.bi-palette
span {{ agendaStore.colorPickerVisible ? 'Exit Colors Assignment Mode' : 'Assign Colors to Events' }}
.agenda-table-redhand(
v-if='agendaStore.redhandShown && state.redhandOffset > 0'
:style='{ "top": state.redhandOffset + "px" }'
)
agenda-details-modal(
v-model:shown='state.showEventDetails'
:event='state.eventDetails'
:meeting-number='agendaStore.meeting.number'
)