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

Integrated application chat system

Browse Source
This commit is contained in:
ajdj100
2025-08-26 13:38:17 -04:00
parent 342c6cd706
commit e43117b64f
6 changed files with 174 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -5,9 +5,10 @@ import { onMounted, ref } from 'vue';
import { ApplicationData, loadApplication, postApplication, postChatMessage, Status } from '@/api/application';
const appData = ref<ApplicationData>(null);
const appID = ref<number | null>(null);
const chatData = ref<object[]>([])
const readOnly = ref<boolean>(false);
const newApp = ref<boolean>(true);
const newApp = ref<boolean>(null);
const status = ref<Status>(null);
const decisionDate = ref<Date | null>(null);
const submitDate = ref<Date | null>(null);
@@ -15,19 +16,25 @@ const loading = ref<boolean>(true);
const member_name = ref<string>();
onMounted(async () => {
try {
const data = await loadApplication()
console.log(data);
if (data) {
const raw = await loadApplication()
if (raw === null) {
//new app
appData.value = null
readOnly.value = false;
newApp.value = true;
} else {
//load app
const data = raw.application;
appID.value = data.id;
appData.value = data.app_data;
chatData.value = data.messages;
chatData.value = raw.comments;
status.value = data.app_status;
decisionDate.value = new Date(data.decision_at);
submitDate.value = data.decision_at ? new Date(data.submitted_at) : null;
submitDate.value = data.submitted_at ? new Date(data.submitted_at) : null;
member_name.value = data.member_name;
readOnly.value = true;
} else {
appData.value = null
newApp.value = false;
readOnly.value = true;
}
} catch (e) {
console.error(e)
@@ -35,34 +42,52 @@ onMounted(async () => {
loading.value = false;
})
async function postComment(comment) {
chatData.value.push(await postChatMessage(comment, appID.value));
}
</script>
<template>
<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">
<div v-if="!newApp" class="flex flex-row justify-between items-center py-2 mb-8">
<!-- Application header -->
<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>
<p class="text-muted-foreground">Submitted: {{ submitDate.toLocaleString("en-US", {
year: "numeric",
month: "long",
day: "numeric",
hour: "2-digit",
minute: "2-digit"
}) }}</p>
</div>
<div>
<h3 class="text-right" :class="[
'font-semibold',
status === Status.Pending && 'text-yellow-500',
status === Status.Approved && 'text-green-500',
status === Status.Accepted && 'text-green-500',
status === Status.Denied && 'text-red-500'
]">{{ status }}</h3>
<p class="text-muted-foreground">{{ status }}: {{ decisionDate.toLocaleString("en-US") }}</p>
<p v-if="status != Status.Pending" class="text-muted-foreground">{{ status }}: {{
decisionDate.toLocaleString("en-US", {
year: "numeric",
month: "long",
day: "numeric",
hour: "2-digit",
minute: "2-digit"
}) }}</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>
</div>
<ApplicationForm v-if="appData" :read-only="readOnly" :data="appData" @submit="(e) => { postApplication(e) }"
class="mb-7"></ApplicationForm>
<div v-if="newApp">
<ApplicationForm :read-only="readOnly" :data="appData" @submit="(e) => { postApplication(e) }" class="mb-7">
</ApplicationForm>
<div v-if="!newApp">
<h3 class="scroll-m-20 text-2xl font-semibold tracking-tight mb-4">Discussion</h3>
<ApplicationChat :messages="chatData" @post="postChatMessage"></ApplicationChat>
<ApplicationChat :messages="chatData" @post="postComment"></ApplicationChat>
</div>
</div>
<div v-else>HELLOOO</div>
</template>