improved recruiter controls for applications

ui/src/pages/ManageApplications.vue

@@ -11,6 +11,7 @@ import {
 } from '@/components/ui/table'
 import Button from '@/components/ui/button/Button.vue';
 import { onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
 
 const appList = ref([]);
 const now = Date.now();
@@ -57,6 +58,9 @@ async function handleDeny(id) {
     appList.value = await getAllApplications();
 }
 
+function openApplication(id) {
+    useRouter().push('/hi')
+}
 
 onMounted(async () => {
     appList.value = await getAllApplications();
@@ -69,25 +73,28 @@ onMounted(async () => {
             <TableRow>
                 <TableHead class="w-[100px]">User</TableHead>
                 <TableHead>Date Submitted</TableHead>
+                <TableHead class="text-right"></TableHead>
                 <TableHead class="text-right">Status</TableHead>
             </TableRow>
         </TableHeader>
         <TableBody>
-            <TableRow v-for="app in appList" :key="app.id">
+            <TableRow v-for="app in appList" :key="app.id" class="cursor-pointer"
+                :onClick="() => { openApplication(app.id) }">
                 <TableCell class="font-medium">{{ app.member_name }}</TableCell>
                 <TableCell :title="formatExact(app.submitted_at)">
                     {{ formatAgo(app.submitted_at) }}
                 </TableCell>
-                <TableCell v-if="app.app_status != 'Pending'" class="text-right" :class="[
-                    'font-semibold',
+                <TableCell v-if="app.app_status === Status.Pending" class="inline-flex items-end gap-2">
+                    <Button variant="success" @click.stop="() => { console.log('hello') }">Accept</Button>
+                    <Button variant="destructive" @click.stop="() => { handleDeny(app.id) }">Deny</Button>
+                </TableCell>
+
+                <TableCell class="text-right font-semibold" :class="[
+                    ,
                     app.app_status === Status.Pending && 'text-yellow-500',
-                    app.app_status === Status.Accepted && 'text-success',
+                    app.app_status === Status.Accepted && 'text-green-500',
                     app.app_status === Status.Denied && 'text-destructive'
                 ]">{{ app.app_status }}</TableCell>
-                <TableCell v-else class="inline-flex items-end gap-2">
-                    <Button variant="success" :onClick="() => { handleApprove(app.id) }">Approve</Button>
-                    <Button variant="destructive" :onClick="() => { handleDeny(app.id) }">Deny</Button>
-                </TableCell>
             </TableRow>
         </TableBody>
     </Table>