17th-Ranger-Battalion-ORG/milsim-site-v4
8
1
Fork 0
Code Issues 22 Pull Requests 1 Actions 2 Packages Projects Releases Wiki Activity

Major style pass to the form

Browse Source
This commit is contained in:
ajdj100
2025-11-20 19:39:29 -05:00
parent 03a8eee409
commit 9eb815cde5
2 changed files with 76 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
ui/src/pages/TrainingReport.vue
View File

@@ -10,7 +10,7 @@ import {
TableHeader,
TableRow,
} from '@/components/ui/table'
import { X } from 'lucide-vue-next';
import { Plus, X } from 'lucide-vue-next';
import Button from '@/components/ui/button/Button.vue';
import TrainingReportForm from '@/components/trainingReport/trainingReportForm.vue';
import Checkbox from '@/components/ui/checkbox/Checkbox.vue';
@@ -56,12 +56,12 @@ onMounted(async () => {
</script>
<template>
<div class="max-w-7xl mx-auto flex mt-5">
<div class="px-20 mx-auto max-w-[100rem] flex mt-5">
<!-- training report list -->
<div class="px-4" :class="sidePanel == sidePanelState.closed ? 'w-full' : 'w-2/5'">
<div class="px-4 my-3" :class="sidePanel == sidePanelState.closed ? 'w-full' : 'w-2/5'">
<div class="flex justify-between">
<p class="scroll-m-20 text-2xl font-semibold tracking-tight">Training Reports</p>
<Button @click="createTrainingReport">New Training Report</Button>
<Button @click="createTrainingReport"><Plus></Plus> New Training Report</Button>
</div>
<div class="overflow-y-auto max-h-[70vh] mt-5 scrollbar-themed">
<Table>
@@ -72,7 +72,7 @@ onMounted(async () => {
</TableHead>
<TableHead>Date</TableHead>
<TableHead class="text-right">
Posted By
Posted By
</TableHead>
</TableRow>
</TableHeader>
@@ -90,7 +90,7 @@ onMounted(async () => {
</div>
</div>
<!-- view training report section -->
<div v-if="sidePanel == sidePanelState.view" class="px-4 border-l w-3/5">
<div v-if="sidePanel == sidePanelState.view" class="px-4 my-3 border-l w-3/5">
<div class="flex justify-between my-3">
<div class="flex gap-5">
<p>{{ focusedTrainingReport.course_name }}</p>
@@ -132,17 +132,17 @@ onMounted(async () => {
</div>
</div>
</div>
<div v-if="sidePanel == sidePanelState.create" class="px-4 border-l w-3/5">
<div v-if="sidePanel == sidePanelState.create" class="pl-7 border-l w-3/5 max-w-5xl">
<div class="flex justify-between my-3">
<div class="flex gap-5">
<p>New Training Report</p>
<div class="flex pl-2 gap-5">
<p class="scroll-m-20 text-2xl font-semibold tracking-tight">New Training Report</p>
</div>
<button @click="closeTrainingReport" class="cursor-pointer">
<X></X>
</button>
</div>
<div class="overflow-y-auto max-h-[70vh] mt-5 scrollbar-themed">
<TrainingReportForm class="w-full"
<TrainingReportForm class="w-full pl-2"
@submit="(newID) => { viewTrainingReport(newID); loadTrainingReports() }"></TrainingReportForm>
</div>
</div>