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

API integration stuff

Browse Source
This commit is contained in:
ajdj100
2025-08-25 23:34:49 -04:00
parent 3dadaf3b24
commit 342c6cd706
4 changed files with 100 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
ui/src/pages/Application.vue
View File

@@ -2,43 +2,58 @@
import ApplicationChat from '@/components/application/ApplicationChat.vue';
import ApplicationForm from '@/components/application/ApplicationForm.vue';
import { onMounted, ref } from 'vue';
import { loadApplication, postApplication, postChatMessage, Status } from '@/api/application';
import { ApplicationData, loadApplication, postApplication, postChatMessage, Status } from '@/api/application';
const appData = ref<Record<string, unknown> | null>(null);
const appData = ref<ApplicationData>(null);
const chatData = ref<object[]>([])
const readOnly = ref<boolean>(false);
const newApp = ref<boolean>(true);
const status = ref<Status>(Status.Pending);
const status = ref<Status>(null);
const decisionDate = ref<Date | null>(null);
const submitDate = ref<Date | null>(null);
const loading = ref<boolean>(true);
const member_name = ref<string>();
onMounted(async () => {
try {
const data = await loadApplication()
console.log(data);
if (data) {
appData.value = data.app;
appData.value = data.app_data;
chatData.value = data.messages;
status.value = data.app_status;
decisionDate.value = new Date(data.decision_at);
submitDate.value = data.decision_at ? new Date(data.submitted_at) : null;
member_name.value = data.member_name;
readOnly.value = true;
} else {
appData.value = {}
appData.value = null
newApp.value = false;
}
} catch (e) {
console.error(e)
}
loading.value = false;
})
</script>
<template>
<div class="max-w-3xl mx-auto my-20">
<div v-if="!loading" class="max-w-3xl mx-auto my-20">
<div v-if="newApp" class="flex flex-row justify-between items-center py-2 mb-8">
<!-- Application header -->
<h3 class="scroll-m-20 text-2xl font-semibold tracking-tight">Application Name</h3>
<h3 :class="[
'font-semibold',
status === Status.Pending && 'text-yellow-500',
status === Status.Approved && 'text-green-500',
status === Status.Denied && 'text-red-500'
]">{{ status }}</h3>
<div>
<h3 class="scroll-m-20 text-2xl font-semibold tracking-tight">{{ member_name }}</h3>
<p class="text-muted-foreground">Submitted: {{ submitDate.toLocaleString("en-US") }}</p>
</div>
<div>
<h3 class="text-right" :class="[
'font-semibold',
status === Status.Pending && 'text-yellow-500',
status === Status.Approved && 'text-green-500',
status === Status.Denied && 'text-red-500'
]">{{ status }}</h3>
<p class="text-muted-foreground">{{ status }}: {{ decisionDate.toLocaleString("en-US") }}</p>
</div>
</div>
<div v-else class="flex flex-row justify-between items-center py-2 mb-8">
<h3 class="scroll-m-20 text-2xl font-semibold tracking-tight">Apply to join the 17th Rangers</h3>