add SessionAnalysisView

src/components/RoomSessionList.vue

@@ -66,7 +66,8 @@
       path: '/analysis/sessionAnalysis', 
       query: { 
         roomName: roomSession.roomName,
-        roomId: roomSession.roomId.toString()
+        roomId: roomSession.roomId.toString(),
+        roomSessionId: roomSession.id.toString()
       }
     });
   }

src/composables/api.ts

@@ -380,7 +380,11 @@ const api = {
   async getRoomSessions(roomId: string, categoryId: number): Promise<RoomSession[]> {
     const response = await fetch.getOrFail(`/category/${categoryId}/room/${roomId}/sessions`);
     return response as RoomSession[];    
-  }
+  },
+
+  async getRoomSessionById(sessionId: string, categoryId: string, roomId: string): Promise<RoomSession> {
+    return await fetch.getOrFail(`/category/${categoryId}/room/${roomId}/sessions/${sessionId}`);
+  },
 }
 
 /**

src/views/AnalysisView.vue

@@ -12,7 +12,7 @@
           <i class="fas fa-sync-alt me-2"></i>
           {{ isLoading ? 'Loading...' : 'Refresh Sessions' }}
         </button>
-      </div>
+    </div>
       
       <RoomSessionList 
         :sessions="sessions" 
@@ -21,16 +21,16 @@
       />
       
     </Layout>
-  </template>
-  
-  <script setup lang="ts">
-  import { ref, onMounted } from 'vue';
-  import { useRoute } from 'vue-router';
+</template>
+
+<script setup lang="ts">
+    import { ref, onMounted } from 'vue';
+    import { useRoute } from 'vue-router';
   import { useApi, RoomSession } from '@/composables/api';
   import Layout from '@/components/Layout.vue';
   import RoomSessionList from '@/components/RoomSessionList.vue';
-  
-  const route = useRoute();
+
+    const route = useRoute();
   const api = useApi();
   const sessions = ref<RoomSession[]>([]);
   const isLoading = ref(false);
@@ -50,8 +50,8 @@
   const selectSession = (session: RoomSession) => {
     selectedSession.value = session;
   };
-  
-  onMounted(async () => {
+
+    onMounted(async () => {
     await refreshSessions();
-  });
-  </script>
\ No newline at end of file
+    });
+</script>
\ No newline at end of file

src/views/SessionAnalysisView.vue

 <template>
-    <Layout title="Sitzungsanalyse" :buttons="['account', 'admin']">
-        
+    <Layout title="Raum Überblick" :buttons="['account', 'admin']">
+    <div>
+        <h1>Teilnehmer</h1>
+        <ul>
+            <li v-for="user in roomSession?.users">
+                {{ user.name }}
+            </li>
+        </ul>
+    </div>
     </Layout>
-  </template>
-  
-  <script setup lang="ts">
-  import { ref, onMounted } from 'vue';
-  import { useRoute } from 'vue-router';
-  import { useApi, RoomSession } from '@/composables/api';
-  import Layout from '@/components/Layout.vue';
- 
-  </script>
\ No newline at end of file
+</template>
+
+<script setup lang="ts">
+    import { ref, onMounted, Ref } from 'vue';
+    import { useApi } from '@/composables/api';
+    import { useRoute } from 'vue-router';
+    import { RoomSession } from '@/composables/api';
+    import Layout from '@/components/Layout.vue';
+
+    const route = useRoute();
+    const roomSession: Ref<RoomSession | null> = ref(null);
+
+    onMounted(async () => {
+        const response = await useApi().getRoomSessionById(route.query.roomSessionId as string, "0", "0");
+        roomSession.value = response;
+    });
+
+
+</script>
\ No newline at end of file