CooperandGoodman/homeschool
1
0
Fork 0
Code Issues Pull Requests Activity

Display all block times in AM/PM format instead of 24-hour

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Derek Cooper
2026-02-28 17:25:10 -08:00
parent 80109976bf
commit fc9413924d
2 changed files with 18 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/components/ScheduleBlock.vue
View File

@@ -14,7 +14,7 @@
<span v-if="subjectName && block.label" class="block-label-suffix"> - {{ block.label }}</span>
</div>
<div class="block-time">
{{ block.time_start }} – {{ block.time_end }}
{{ formatTime(block.time_start) }} – {{ formatTime(block.time_end) }}
<span class="block-duration" :class="{ 'block-duration-custom': block.duration_minutes != null }">
· {{ durationLabel }}
</span>
@@ -35,6 +35,14 @@ const props = defineProps({
compact: { type: Boolean, default: false },
})
function formatTime(str) {
if (!str) return ''
const [h, m] = str.split(':').map(Number)
const period = h >= 12 ? 'PM' : 'AM'
const hour = h % 12 || 12
return `${hour}:${String(m).padStart(2, '0')} ${period}`
}
const subjectColor = computed(() => props.block.subject?.color || '#475569')
const subjectName = computed(() => props.block.subject?.name || null)

10
frontend/src/views/AdminView.vue
View File

@@ -212,7 +212,7 @@
</form>
<!-- Display mode -->
<div v-else class="block-row">
<span class="block-time">{{ block.time_start }} – {{ block.time_end }}</span>
<span class="block-time">{{ formatTime(block.time_start) }} – {{ formatTime(block.time_end) }}</span>
<span class="block-label">{{ block.label || subjectName(block.subject_id) || 'Unnamed' }}</span>
<span class="block-duration" :class="{ 'block-duration-custom': block.duration_minutes != null }">
{{ blockDurationLabel(block) }}
@@ -384,6 +384,14 @@ function subjectName(id) {
return subjects.value.find((s) => s.id === id)?.name || null
}
function formatTime(str) {
if (!str) return ''
const [h, m] = str.split(':').map(Number)
const period = h >= 12 ? 'PM' : 'AM'
const hour = h % 12 || 12
return `${hour}:${String(m).padStart(2, '0')} ${period}`
}
function sortedBlocks(blocks) {
const toMin = (t) => { if (!t) return 0; const [h, m] = t.split(':').map(Number); return h * 60 + m }
return (blocks || []).slice().sort((a, b) => toMin(a.time_start) - toMin(b.time_start))