feat(sidebar): do not show pages only available to presidents to non-presidents

Author: qwerzl

components/custom/sidebar.vue

@@ -1,8 +1,22 @@
 <script setup lang="ts">
 import { Button } from '@/components/ui/button'
 import { cn } from '@/lib/utils'
+import type { AllClubs } from '~/types/api/user/all_clubs'
 
 const route = useRoute()
+
+const isPresident = ref(false)
+
+const { data } = await useAsyncData<AllClubs>('classroomStatuses', () => {
+  return $fetch<AllClubs>(`/api/user/all_clubs`, {
+    headers: useRequestHeaders(),
+    method: 'GET',
+  })
+})
+
+if (data.value?.president.length !== 0) {
+  isPresident.value = true
+}
 </script>
 
 <template>
@@ -55,14 +69,14 @@ const route = useRoute()
           CAS管理
         </h2>
         <div class="mt-2">
-          <NuxtLink to="/manage/reservation">
+          <NuxtLink v-if="isPresident" to="/manage/reservation">
             <Button :variant="route.name === 'manage-reservation' ? 'secondary' : 'ghost'" class="w-full justify-start">
               <Icon class="mr-2 h-4 w-4" name="material-symbols:calendar-today-outline" />
               预约教室
             </Button>
           </NuxtLink>
           <NuxtLink to="/manage/manage">
-            <Button :variant="route.name === 'manage-manage' ? 'secondary' : 'ghost'" class="w-full justify-start">
+            <Button v-if="isPresident" :variant="route.name === 'manage-manage' ? 'secondary' : 'ghost'" class="w-full justify-start">
               <Icon class="mr-2 h-4 w-4" name="material-symbols:calendar-today-outline" />
               管理预约
             </Button>
@@ -74,7 +88,7 @@ const route = useRoute()
             </Button>
           </NuxtLink>
           <NuxtLink to="/manage/record">
-            <Button :variant="route.name === 'manage-record' ? 'secondary' : 'ghost'" class="w-full justify-start mt-1">
+            <Button v-if="isPresident" :variant="route.name === 'manage-record' ? 'secondary' : 'ghost'" class="w-full justify-start mt-1">
               <Icon class="mr-2 h-4 w-4" name="charm:tick-double" />
               活动记录
             </Button>