Added Today View and show message with week info when in grading view.
Build and Test App / Build-and-test-App (push) Successful in 34s
Details
Build and Test App / Build-and-test-App (push) Successful in 34s
Details
This commit is contained in:
parent
45ac42aa80
commit
4349e4f2c3
|
@ -22,7 +22,8 @@ const apiClient = new ClassroomComplianceAPIClient(authStore)
|
|||
enum TableView {
|
||||
FULL = "Full",
|
||||
GRADING = "Grading",
|
||||
WHITEBOARD = "Whiteboard"
|
||||
WHITEBOARD = "Whiteboard",
|
||||
TODAY = "Today"
|
||||
}
|
||||
|
||||
const students: Ref<EntriesResponseStudent[]> = ref([])
|
||||
|
@ -55,6 +56,12 @@ onMounted(async () => {
|
|||
}
|
||||
saveSortPreference()
|
||||
})
|
||||
// If the user selects "Today View", forcibly load the current week, so they'll only see today.
|
||||
watch(selectedView, () => {
|
||||
if (selectedView.value === TableView.TODAY) {
|
||||
showThisWeek()
|
||||
}
|
||||
})
|
||||
attemptSortByStoredPreference()
|
||||
})
|
||||
|
||||
|
@ -185,6 +192,19 @@ async function discardEdits() {
|
|||
}
|
||||
}
|
||||
|
||||
function getVisibleDates(): string[] {
|
||||
if (selectedView.value === TableView.FULL) return dates.value
|
||||
if (selectedView.value === TableView.TODAY) {
|
||||
const today = new Date()
|
||||
today.setUTCHours(0, 0, 0, 0)
|
||||
const todayStr = today.toISOString().substring(0, 10)
|
||||
for (const date of dates.value) {
|
||||
if (date === todayStr) return [date]
|
||||
}
|
||||
}
|
||||
return []
|
||||
}
|
||||
|
||||
function addAllEntriesForDate(dateStr: string) {
|
||||
for (let i = 0; i < students.value.length; i++) {
|
||||
const student = students.value[i]
|
||||
|
@ -198,9 +218,10 @@ function addAllEntriesForDate(dateStr: string) {
|
|||
<template>
|
||||
<div>
|
||||
<div class="button-bar">
|
||||
<button type="button" @click="showPreviousWeek">Previous Week</button>
|
||||
<button type="button" @click="showThisWeek">This Week</button>
|
||||
<button type="button" @click="showNextWeek">Next Week</button>
|
||||
<button type="button" @click="showPreviousWeek" :disabled="selectedView === TableView.TODAY">Previous
|
||||
Week</button>
|
||||
<button type="button" @click="showThisWeek" :disabled="selectedView === TableView.TODAY">This Week</button>
|
||||
<button type="button" @click="showNextWeek" :disabled="selectedView === TableView.TODAY">Next Week</button>
|
||||
<button type="button" @click="saveEdits" :disabled="!entriesChangedSinceLastSave">
|
||||
Save
|
||||
</button>
|
||||
|
@ -217,15 +238,20 @@ function addAllEntriesForDate(dateStr: string) {
|
|||
<option :value="TableView.FULL">Full View</option>
|
||||
<option :value="TableView.GRADING">Grading View</option>
|
||||
<option :value="TableView.WHITEBOARD">Whiteboard View</option>
|
||||
<option :value="TableView.TODAY">Today View</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<p v-if="selectedView === TableView.GRADING">
|
||||
Grading for the week from {{ fromDate.toLocaleDateString() }} to {{ toDate.toLocaleDateString() }}.
|
||||
</p>
|
||||
|
||||
<table class="entries-table" :class="{ 'entries-table-reduced-view': selectedView !== TableView.FULL }">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Student</th>
|
||||
<th v-if="assignedDesks">Desk</th>
|
||||
<DateHeaderCell v-for="date in selectedView === TableView.FULL ? dates : []" :key="date" :date-str="date"
|
||||
<DateHeaderCell v-for="date in getVisibleDates()" :key="date" :date-str="date"
|
||||
@add-all-entries-clicked="addAllEntriesForDate(date)" />
|
||||
<th v-if="selectedView !== TableView.WHITEBOARD">Score</th>
|
||||
</tr>
|
||||
|
|
Loading…
Reference in New Issue