diff --git a/backend/dps_training_k/configuration/settings.py b/backend/dps_training_k/configuration/settings.py
index c3bf5de5..0758a932 100644
--- a/backend/dps_training_k/configuration/settings.py
+++ b/backend/dps_training_k/configuration/settings.py
@@ -58,6 +58,7 @@
 ]
 
 MIDDLEWARE = [
+    "corsheaders.middleware.CorsMiddleware",
     "django.middleware.security.SecurityMiddleware",
     "django.contrib.sessions.middleware.SessionMiddleware",
     "django.middleware.common.CommonMiddleware",
diff --git a/backend/dps_training_k/game/consumers/abstract_consumer.py b/backend/dps_training_k/game/consumers/abstract_consumer.py
index 279aaa08..1f21552e 100644
--- a/backend/dps_training_k/game/consumers/abstract_consumer.py
+++ b/backend/dps_training_k/game/consumers/abstract_consumer.py
@@ -34,6 +34,7 @@ class ClosureCodes:
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         self.exercise_code = ""
+        self.exercise = None
         self.REQUESTS_MAP = {}
         self.user = None
 
@@ -141,25 +142,24 @@ def disconnect(self, code):
         #     self.user.clear_channel_name()
         code = self.ClosureCodes.UNKNOWN if not code else code
         super().disconnect(code)
-    
+
     def authenticate(self, token):
         try:
             token = Token.objects.get(key=token)
             self.user = token.user
             self.user.set_channel_name(self.channel_name)
-            return True
+            return True, self.user.username
         except Token.DoesNotExist:
             self.close(code=self.ClosureCodes.NOT_AUTHENTICATED)
-            return False
+            return False, None
 
     def _send_exercise(self):
-        exercise = Exercise.createExercise()
         patient = Patient.objects.create(
-            name="Max Mustermann", exercise=exercise, patientId=123456
+            name="Max Mustermann", exercise=self.exercise, patientId=123456
         )
         exercise_object = {
             "exercise": {
-                "exerciseId": exercise.exerciseId,
+                "exerciseId": self.exercise.exerciseId,
                 "areas": [
                     {
                         "areaName": "X",
@@ -167,25 +167,14 @@ def _send_exercise(self):
                             {
                                 "patientId": patient.patientId,
                                 "patientName": patient.name,
-                                "patientCode": 0
-                            }
-                        ],
-                        "personnel": [
-                            {
-                                "personnelId": 0,
-                                "personnelName": "X"
+                                "patientCode": 0,
+                                "triage": patient.triage,
                             }
                         ],
-                        "material": [
-                            {
-                                "materialId": 0,
-                                "materialName": "X"
-                            }
-                        ]
+                        "personnel": [{"personnelId": 0, "personnelName": "X"}],
+                        "material": [{"materialId": 0, "materialName": "X"}],
                     }
-                ]
+                ],
             }
         }
-        self.send_event(
-            self.OutgoingMessageTypes.EXERCISE, exercise=exercise_object
-        )
\ No newline at end of file
+        self.send_event(self.OutgoingMessageTypes.EXERCISE, exercise=exercise_object)
diff --git a/backend/dps_training_k/game/consumers/patient_consumer.py b/backend/dps_training_k/game/consumers/patient_consumer.py
index 67a26b29..7cc07f0a 100644
--- a/backend/dps_training_k/game/consumers/patient_consumer.py
+++ b/backend/dps_training_k/game/consumers/patient_consumer.py
@@ -1,11 +1,13 @@
 from .abstract_consumer import AbstractConsumer
 from urllib.parse import parse_qs
+from game.models import Patient
 
 
 class PatientConsumer(AbstractConsumer):
     class PatientIncomingMessageTypes:
         EXAMPLE = "example"
         TEST_PASSTHROUGH = "test-passthrough"
+        TRIAGE = "triage"
 
     class PatientOutgoingMessageTypes:
         RESPONSE = "response"
@@ -14,7 +16,8 @@ class PatientOutgoingMessageTypes:
 
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
-        self.patient_code = ""
+        self.patientId = ""
+        self.patient = None
         self.REQUESTS_MAP = {
             self.PatientIncomingMessageTypes.EXAMPLE: (
                 self.handle_example,
@@ -24,21 +27,29 @@ def __init__(self, *args, **kwargs):
             self.PatientIncomingMessageTypes.TEST_PASSTHROUGH: (
                 self.handle_test_passthrough,
             ),
+            self.PatientIncomingMessageTypes.TRIAGE: (
+                self.handle_triage,
+                "triage",
+            ),
         }
 
     def connect(self):
         query_string = parse_qs(self.scope["query_string"].decode())
         token = query_string.get("token", [None])[0]
-        if self.authenticate(token):
+        success, patientId = self.authenticate(token)
+        if success:
+            self.patient = Patient.objects.get(patientId=patientId)
+            self.patientId = patientId
+            self.exercise = self.patient.exercise
             self.accept()
             self._send_exercise()
 
     def handle_example(self, exercise_code, patient_code):
         self.exercise_code = exercise_code
-        self.patient_code = patient_code
+        self.patientId = patient_code
         self.send_event(
             self.PatientOutgoingMessageTypes.RESPONSE,
-            content=f"exercise_code {self.exercise_code} & patient_code {self.patient_code}",
+            content=f"exercise_code {self.exercise_code} & patient_code {self.patientId}",
         )
 
     def handle_test_passthrough(self):
@@ -46,3 +57,7 @@ def handle_test_passthrough(self):
             self.PatientOutgoingMessageTypes.TEST_PASSTHROUGH,
             message="received test event",
         )
+
+    def handle_triage(self, triage):
+        self.patient.triage = triage
+        self._send_exercise()
diff --git a/backend/dps_training_k/game/consumers/trainer_consumer.py b/backend/dps_training_k/game/consumers/trainer_consumer.py
index 8c165f10..5adc76e1 100644
--- a/backend/dps_training_k/game/consumers/trainer_consumer.py
+++ b/backend/dps_training_k/game/consumers/trainer_consumer.py
@@ -1,4 +1,5 @@
 from .abstract_consumer import AbstractConsumer
+from game.models import Exercise
 
 
 class TrainerConsumer(AbstractConsumer):
@@ -59,6 +60,7 @@ def handle_example(self, exercise_code):
         )
 
     def handle_create_exercise(self):
+        self.exercise = Exercise.createExercise()
         self._send_exercise()
 
     def handle_test_passthrough(self):
diff --git a/backend/dps_training_k/game/migrations/0006_patient_triage.py b/backend/dps_training_k/game/migrations/0006_patient_triage.py
new file mode 100644
index 00000000..aa95ab95
--- /dev/null
+++ b/backend/dps_training_k/game/migrations/0006_patient_triage.py
@@ -0,0 +1,18 @@
+# Generated by Django 5.0.1 on 2024-03-25 14:08
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('game', '0005_rename_invitation_code_exercise_exerciseid_and_more'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='patient',
+            name='triage',
+            field=models.CharField(choices=[('-', 'undefined'), ('R', 'red'), ('Y', 'yellow'), ('G', 'green'), ('A', 'airway'), ('B', 'breathing'), ('C', 'circulation'), ('D', 'disability'), ('E', 'exposure')], default='-'),
+        ),
+    ]
diff --git a/backend/dps_training_k/game/models/patient.py b/backend/dps_training_k/game/models/patient.py
index b676d0c1..d3764544 100644
--- a/backend/dps_training_k/game/models/patient.py
+++ b/backend/dps_training_k/game/models/patient.py
@@ -8,6 +8,17 @@
 
 
 class Patient(Eventable, Transitionable, UpdateSignals, models.Model):
+    class Triage(models.TextChoices):
+        UNDEFINED = "-", "undefined"
+        RED = "R", "red"
+        YELLOW = "Y", "yellow"
+        GREEN = "G", "green"
+        Airway = "A", "airway"
+        BREATHING = "B", "breathing"
+        CIRCULATION = "C", "circulation"
+        DISABILITY = "D", "disability"
+        EXPOSURE = "E", "exposure"
+
     name = models.CharField(
         max_length=100, default="Max Mustermann"
     )  # technically patientData but kept here for simplicity for now
@@ -24,6 +35,10 @@ class Patient(Eventable, Transitionable, UpdateSignals, models.Model):
     patientId = models.IntegerField(
         help_text="patientId used to log into patient - therefore part of authentication"
     )
+    triage = models.CharField(
+        choices=Triage.choices,
+        default=Triage.UNDEFINED,
+    )
 
     def __str__(self):
         return f"Patient #{self.id} called {self.name} with ID {self.patientId}"
diff --git a/backend/dps_training_k/game/tests/factories/exercise_factory.py b/backend/dps_training_k/game/tests/factories/exercise_factory.py
index f674521e..6a7bf037 100644
--- a/backend/dps_training_k/game/tests/factories/exercise_factory.py
+++ b/backend/dps_training_k/game/tests/factories/exercise_factory.py
@@ -16,8 +16,8 @@ class Meta:
 class ExerciseFactory(factory.django.DjangoModelFactory):
     class Meta:
         model = Exercise
-        django_get_or_create = ("config", "invitation_code", "state")
+        django_get_or_create = ("config", "exerciseId", "state")
 
     config = factory.SubFactory(SavedExerciseFactory)
-    invitation_code = "a" * settings.INVITATION_LOGIC.code_length
+    exerciseId = "a" * settings.INVITATION_LOGIC.code_length
     state = Exercise.ExerciseStateTypes.CONFIGURATION
diff --git a/backend/dps_training_k/game/tests/factories/patient_factory.py b/backend/dps_training_k/game/tests/factories/patient_factory.py
index 68b348d1..68548250 100644
--- a/backend/dps_training_k/game/tests/factories/patient_factory.py
+++ b/backend/dps_training_k/game/tests/factories/patient_factory.py
@@ -6,8 +6,8 @@
 class PatientFactory(factory.django.DjangoModelFactory):
     class Meta:
         model = Patient
-        django_get_or_create = ("name", "exercise", "patientCode")
+        django_get_or_create = ("name", "exercise", "patientId")
 
     name = "Max Mustermann"
     exercise = factory.SubFactory(ExerciseFactory)
-    patientCode = 123456
+    patientId = 123456
diff --git a/backend/dps_training_k/game/tests/test_websocket_authentication.py b/backend/dps_training_k/game/tests/test_websocket_authentication.py
index e158e425..df9e6089 100644
--- a/backend/dps_training_k/game/tests/test_websocket_authentication.py
+++ b/backend/dps_training_k/game/tests/test_websocket_authentication.py
@@ -1,5 +1,6 @@
 from django.test import TransactionTestCase
 from game.models import User
+from .factories import PatientFactory
 from rest_framework.authtoken.models import Token
 from configuration.asgi import application
 from channels.testing import WebsocketCommunicator
@@ -9,8 +10,9 @@ class PatientWebSocketTest(TransactionTestCase):
     def setUp(self):
         super().setUp()
         # Create a user and token for testing
-        self.user = User.objects.create_user(username="testpatient123", password="test")
+        self.user = User.objects.create_user(username="123456", password="test")
         self.token, _ = Token.objects.get_or_create(user=self.user)
+        self.patient = PatientFactory()
 
     async def test_authenticated_websocket_connection(self):
         # Connect to the WebSocket
diff --git a/backend/dps_training_k/game/views.py b/backend/dps_training_k/game/views.py
index 5c8335d7..bd587844 100644
--- a/backend/dps_training_k/game/views.py
+++ b/backend/dps_training_k/game/views.py
@@ -3,18 +3,26 @@
 from rest_framework.response import Response
 from django.contrib.auth import authenticate
 from rest_framework.authtoken.models import Token
+from game.models import User
 
 
 class PatientAccessView(APIView):
     def post(self, request, *args, **kwargs):
+        user, created = User.objects.get_or_create(
+            username="123456"
+        )  # Ensure the username is a string
+        if created:
+            user.set_password("2")  # Properly hash the password
+            user.save()
+
         if not (request.data.get("exerciseId") and request.data.get("patientId")):
             return Response(
                 status=status.HTTP_400_BAD_REQUEST,
                 data="Some required fields are missing",
             )
-        exercise_code = request.data.get("exerciseId")
-        patient_code = request.data.get("patientId")
-        user = authenticate(username=exercise_code, password=patient_code)
+        exercise_id = str(request.data.get("exerciseId"))
+        patient_id = str(request.data.get("patientId"))
+        user = authenticate(username=exercise_id, password=patient_id)
         if user:
             token, created = Token.objects.get_or_create(user=user)
             return Response({"token": token.key}, status=status.HTTP_200_OK)
diff --git a/frontend/src/assets/main.css b/frontend/src/assets/main.css
index 3219db32..c2eb69c1 100644
--- a/frontend/src/assets/main.css
+++ b/frontend/src/assets/main.css
@@ -45,3 +45,63 @@ button:active {
   background-color: var(--green);
 }
 
+.popup-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  z-index: 1;
+}
+
+.list {
+  margin-top: 30px;
+  margin-left: 30px;
+  margin-right: 30px;
+}
+
+.listItem {
+  position: relative;
+  background-color: #FFFFFF;
+  border: 1px solid rgb(209, 213, 219);
+  display: flex;
+  align-items: center;
+  text-align: left;
+  margin-top: -1px;
+}
+
+.listItemButton {
+  position: relative;
+  background-color: #FFFFFF;
+  border: none;
+  display: flex;
+  align-items: center;
+  font-size: 1.25rem;
+  padding: .75rem 1rem;
+  padding-left: 0;
+  text-align: left;
+  height: 50px;
+  width: 100%;
+}
+
+.listItemAddButton {
+  text-align: center;
+  position: relative;
+  background-color: #FFFFFF;
+  border: 1px solid rgb(209, 213, 219);
+  box-sizing: border-box;
+  width: 100%;
+  font-size: 1.25rem;
+  line-height: 1.25rem;
+  padding: .75rem 1rem;
+  margin-top: -1px;
+}
+
+.listItemId, .listItemName {
+  padding: .75rem 1rem;
+}
\ No newline at end of file
diff --git a/frontend/src/components/screensTrainer/ScreenExerciseCreation.vue b/frontend/src/components/screensTrainer/ScreenExerciseCreation.vue
index 9fbe19f8..5e4ae8f8 100644
--- a/frontend/src/components/screensTrainer/ScreenExerciseCreation.vue
+++ b/frontend/src/components/screensTrainer/ScreenExerciseCreation.vue
@@ -6,7 +6,7 @@
 	import TopBarTrainer from "@/components/widgets/TopBarTrainer.vue"
 	import {svg} from "@/assets/Svg"
 	import {setArea} from "@/components/screensTrainer/ScreenResourceCreation.vue"
-	import AreaPopup from '../widgets/AreaPopup.vue'
+	import DeleteItemPopup from '../widgets/DeleteItemPopup.vue'
 
 	const exerciseStore = useExerciseStore()
 
@@ -32,21 +32,27 @@
 		socketTrainer.areaAdd()
 	}
 
+	function deleteArea(){
+		socketTrainer.areaDelete(currentArea.value)
+	}
+
 	const showPopup = ref(false)
 </script>
 
 <template>
-	<AreaPopup v-if="showPopup" :area-name="currentArea" @close-popup="showPopup=false" />
+	<DeleteItemPopup v-if="showPopup" :name="currentArea" @close-popup="showPopup=false" @delete="deleteArea" />
 	<TopBarTrainer />
-	<div id="list">
+	<div class="list">
 		<div
 			v-for="area in areas"
 			:key="area.areaName"
-			class="listitem"
+			class="listItem"
 			:class="{ 'selected': currentArea === area.areaName }"
 		>
-			<button class="areaButton" @click="openArea(area.areaName)">
-				{{ area.areaName }}
+			<button class="listItemButton" @click="openArea(area.areaName)">
+				<div class="listItemName">
+					{{ area.areaName }}
+				</div>
 			</button>
 			<button class="settingsButton" @click="openPopup(area.areaName)">
 				<svg
@@ -59,7 +65,7 @@
 				</svg>
 			</button>
 		</div>
-		<button id="addAreaButton" @click="addArea()">
+		<button class="listItemAddButton" @click="addArea()">
 			Bereich hinzufügen
 		</button>
 	</div>
@@ -70,33 +76,8 @@
 </template>
 
 <style scoped>
-	#list {
+	.list {
 		margin-top: 90px;
-		margin-left: 30px;
-		margin-right: 30px;
-	}
-
-	.listitem {
-		position: relative;
-		background-color: #FFFFFF;
-		border: 1px solid rgb(209, 213, 219);
-		display: flex;
-		align-items: center;
-		text-align: left;
-		margin-top: -1px;
-	}
-
-	.areaButton {
-		position: relative;
-		background-color: #FFFFFF;
-		border: none;
-		display: flex;
-		align-items: center;
-		font-size: 1.25rem;
-		padding: .75rem 1rem;
-		text-align: left;
-		height: 50px;
-		width: 100%;
 	}
 
 	.settingsButton {
@@ -106,20 +87,7 @@
 		background-color: rgb(243, 244, 246);
 	}
 
-	#addAreaButton {
-		text-align: center;
-		position: relative;
-		background-color: #FFFFFF;
-		border: 1px solid rgb(209, 213, 219);
-		box-sizing: border-box;
-		width: 100%;
-		font-size: 1.25rem;
-		line-height: 1.25rem;
-		padding: .75rem 1rem;
-		margin-top: -1px;
-	}
-
-	.selected .areaButton {
+	.selected .listItemButton {
 		filter: brightness(90%);
 	}
 </style>
\ No newline at end of file
diff --git a/frontend/src/components/screensTrainer/pagesResourceCreation/PageMaterial.vue b/frontend/src/components/screensTrainer/pagesResourceCreation/PageMaterial.vue
index cdcaac3c..5381795c 100644
--- a/frontend/src/components/screensTrainer/pagesResourceCreation/PageMaterial.vue
+++ b/frontend/src/components/screensTrainer/pagesResourceCreation/PageMaterial.vue
@@ -1,6 +1,10 @@
 <script setup lang="ts">
-	import {computed} from 'vue'
+	import {computed, ref} from 'vue'
 	import {useExerciseStore} from '@/stores/Exercise'
+	import ToggleSwitchForListItems from '@/components/widgets/ToggleSwitchForListItems.vue'
+	import DeleteItemPopup from '@/components/widgets/DeleteItemPopup.vue'
+	import socketTrainer from '@/sockets/SocketTrainer'
+	import AddMaterialPopup from '@/components/widgets/AddMaterialPopup.vue'
 
     const props = defineProps({
 		currentArea: {
@@ -12,11 +16,83 @@
 	const exerciseStore = useExerciseStore()
 
 	const currentAreaData = computed(() => exerciseStore.getArea(props.currentArea))
+
+	const currentMaterialName = ref('No Material Name')
+	const currentMaterialType = ref('No Material Type')
+
+	const showDeletePopup = ref(false)
+	const showAddPopup = ref(false)
+
+	function openDeletePopup(materialName: string) {
+		currentMaterialName.value = materialName
+		showDeletePopup.value = true
+	}
+
+	function openAddPopup(materialType: string) {
+		currentMaterialType.value = materialType
+		showAddPopup.value = true
+	}
+
+	function deleteMaterial(){
+		socketTrainer.materialDelete(currentMaterialName.value)
+	}
+
+	const devices = computed(() => {
+		return currentAreaData.value?.material.filter(material => material.materialType === 'device') || []
+	})
+
+	const bloodList = computed(() => {
+		return currentAreaData.value?.material.filter(material => material.materialType === 'blood') || []
+	})
 </script>
 
 <template>
-	<h1>Patienten</h1>
-	{{ currentAreaData?.devices }}
+	<DeleteItemPopup
+		v-if="showDeletePopup"
+		:name="currentMaterialName"
+		@delete="deleteMaterial"
+		@close-popup="showDeletePopup=false"
+	/>
+	<AddMaterialPopup
+		v-if="showAddPopup"
+		:material-type="currentMaterialType"
+		:current-area="props.currentArea"
+		@close-popup="showAddPopup=false"
+	/>
+	<div class="list">
+		<div
+			v-for="device in devices as Material[]"
+			:key="device.materialName"
+			class="listItem"
+		>
+			<button class="listItemButton" @click="openDeletePopup(device.materialName)">
+				<div class="listItemName">
+					{{ device.materialName }}
+				</div>
+			</button>
+			<ToggleSwitchForListItems default="active" />
+		</div>
+		<button v-if="currentAreaData" class="listItemAddButton" @click="openAddPopup('device')">
+			Gerät hinzufügen
+		</button>
+	</div>
+	<div class="list">
+		<div
+			v-for="blood in bloodList as Material[]"
+			:key="blood.materialName"
+			class="listItem"
+		>
+			<button class="listItemButton" @click="openDeletePopup(blood.materialName)">
+				<div class="listItemName">
+					{{ blood.materialName }}
+				</div>
+			</button>
+			<ToggleSwitchForListItems default="active" />
+		</div>
+		<button v-if="currentAreaData" class="listItemAddButton" @click="openAddPopup('blood')">
+			Blut hinzufügen
+		</button>
+	</div>
 </template>
 
 <style scoped>
diff --git a/frontend/src/components/screensTrainer/pagesResourceCreation/PagePatients.vue b/frontend/src/components/screensTrainer/pagesResourceCreation/PagePatients.vue
index 96bf9826..d2107865 100644
--- a/frontend/src/components/screensTrainer/pagesResourceCreation/PagePatients.vue
+++ b/frontend/src/components/screensTrainer/pagesResourceCreation/PagePatients.vue
@@ -47,24 +47,24 @@
 <template>
 	<EditPatientPopup v-if="showEditPatientPopup" :patient-id="currentPatientId" @close-popup="showEditPatientPopup=false" />
 	<AddPatientPopup v-if="showAddPatientPopup" :area-name="currentArea" :patient-name="newPatientName" @close-popup="showAddPatientPopup=false" />
-	<div id="list">
+	<div class="list">
 		<div
 			v-for="patient in currentAreaData?.patients"
 			:key="patient.patientName"
-			class="listitem"
+			class="listItem"
 		>
-			<button class="patientButton" @click="editPatient(patient.patientId)">
-				<div class="patientId">
+			<button class="listItemButton" @click="editPatient(patient.patientId)">
+				<div class="listItemId">
 					{{ patient.patientId.toString().padStart(3, '0') }}
 				</div>
 				<TriageForListItems :patient-code="patient.patientCode" />
-				<div class="patientName">
+				<div class="listItemName">
 					{{ patient.patientName }}
 				</div>
 			</button>
 			<ToggleSwitchForListItems default="active" />
 		</div>
-		<button v-if="currentAreaData" id="addPatientButton" @click="addPatient()">
+		<button v-if="currentAreaData" class="listItemAddButton" @click="addPatient()">
 			Patient hinzufügen
 		</button>
 	</div>
diff --git a/frontend/src/components/screensTrainer/pagesResourceCreation/PagePersonnel.vue b/frontend/src/components/screensTrainer/pagesResourceCreation/PagePersonnel.vue
index 5703321b..4d786377 100644
--- a/frontend/src/components/screensTrainer/pagesResourceCreation/PagePersonnel.vue
+++ b/frontend/src/components/screensTrainer/pagesResourceCreation/PagePersonnel.vue
@@ -1,8 +1,11 @@
 <script setup lang="ts">
-	import {computed} from 'vue'
+	import {computed, ref} from 'vue'
 	import {useExerciseStore} from '@/stores/Exercise'
+	import ToggleSwitchForListItems from '@/components/widgets/ToggleSwitchForListItems.vue'
+	import socketTrainer from '@/sockets/SocketTrainer'
+	import DeleteItemPopup from '@/components/widgets/DeleteItemPopup.vue'
 
-	const props = defineProps({
+    const props = defineProps({
 		currentArea: {
 			type: String,
 			default: "Kein Bereich ausgewählt"
@@ -12,11 +15,49 @@
 	const exerciseStore = useExerciseStore()
 
 	const currentAreaData = computed(() => exerciseStore.getArea(props.currentArea))
+
+	const currentPersonnel = ref(Number.NEGATIVE_INFINITY)
+
+	const showPopup = ref(false)
+
+	function openPopup(personnelId: number) {
+		currentPersonnel.value = personnelId
+		showPopup.value = true
+	}
+
+	function addPersonnel() {
+		socketTrainer.personnelAdd(props.currentArea)
+	}
+
+	function deletePersonnel(){
+		socketTrainer.personnelDelete(currentPersonnel.value)
+	}
 </script>
 
 <template>
-	<h1>Patienten</h1>
-	{{ currentAreaData?.personnel }}
+	<DeleteItemPopup
+		v-if="showPopup"
+		:name="exerciseStore.getPersonnel(currentPersonnel)?.personnelName"
+		@close-popup="showPopup=false"
+		@delete="deletePersonnel"
+	/>
+	<div class="list">
+		<div
+			v-for="personnel in currentAreaData?.personnel"
+			:key="personnel.personnelName"
+			class="listItem"
+		>
+			<button class="listItemButton" @click="openPopup(personnel.personnelId)">
+				<div class="listItemName">
+					{{ personnel.personnelName }}
+				</div>
+			</button>
+			<ToggleSwitchForListItems default="active" />
+		</div>
+		<button v-if="currentAreaData" class="listItemAddButton" @click="addPersonnel()">
+			Personal hinzufügen
+		</button>
+	</div>
 </template>
 
 <style scoped>
diff --git a/frontend/src/components/widgets/AddMaterialPopup.vue b/frontend/src/components/widgets/AddMaterialPopup.vue
new file mode 100644
index 00000000..30c512ce
--- /dev/null
+++ b/frontend/src/components/widgets/AddMaterialPopup.vue
@@ -0,0 +1,69 @@
+<script setup lang="ts">
+	import socketTrainer from "@/sockets/SocketTrainer"
+	import { useAvailablesStore } from "@/stores/Availables"
+	import { computed ,ref } from "vue"
+
+	const emit = defineEmits(['close-popup'])
+
+	const props = defineProps({
+		materialType: {
+			type: String,
+			default: 'Kein Materialtyp ausgewählt'
+		},
+		currentArea: {
+			type: String,
+			default: 'Kein Bereich ausgewählt'
+		}
+	})
+
+	const title = computed(() => {
+		switch (props.materialType) {
+			case 'device':
+				return 'Gerät hinzufügen'
+			case 'blood':
+				return 'Blut hinzufügen'
+			default:
+				return 'Kein Materialtyp ausgewählt'
+		}
+	})
+
+	const availablesStore = useAvailablesStore()
+	const availableMaterialList = ref(availablesStore.material)
+
+	const availableMaterial = computed(() => {
+		return availableMaterialList.value.filter(availableMaterial => availableMaterial.materialType === props.materialType)
+	})
+
+	function addMaterial(materialName: string){
+		socketTrainer.materialAdd(props.currentArea, materialName)
+		emit('close-popup')
+	}
+</script>
+
+<template>
+	<div class="popup-overlay" @click="emit('close-popup')">
+		<div class="popup" @click.stop="">
+			<h2>{{ title }}</h2>
+			<div class="list">
+				<div
+					v-for="material in availableMaterial"
+					:key="material.materialName"
+					class="listItem"
+				>
+					<button class="listItemButton" @click="addMaterial(material.materialName)">
+						<div class="listItemName">
+							{{ material.materialName }}
+						</div>
+					</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+<style scoped>
+	.popup {
+		background-color: white;
+		padding: 20px;
+		border-radius: 8px;
+	}
+</style>
\ No newline at end of file
diff --git a/frontend/src/components/widgets/AddPatientPopup.vue b/frontend/src/components/widgets/AddPatientPopup.vue
index dcc7d45e..2b265e82 100644
--- a/frontend/src/components/widgets/AddPatientPopup.vue
+++ b/frontend/src/components/widgets/AddPatientPopup.vue
@@ -82,20 +82,6 @@
 </template>
 
 <style scoped>
-	.popup-overlay {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		background-color: rgba(0, 0, 0, 0.5);
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		text-align: center;
-		z-index: 1;
-	}
-
 	.popup {
 		background-color: white;
 		padding: 20px;
@@ -119,6 +105,7 @@
 		display: flex;
 	}
 
+
 	#saveButton {
 		position: relative;
 		color: white;
diff --git a/frontend/src/components/widgets/AreaPopup.vue b/frontend/src/components/widgets/AreaPopup.vue
deleted file mode 100644
index 2c148a54..00000000
--- a/frontend/src/components/widgets/AreaPopup.vue
+++ /dev/null
@@ -1,62 +0,0 @@
-<script setup lang="ts">
-	import socketTrainer from "@/sockets/SocketTrainer"
-
-	const emit = defineEmits(['close-popup'])
-
-	const props = defineProps({
-		areaName: {
-			type: String,
-			default: "Kein Bereich ausgewählt"
-		}
-	})
-
-	function deleteArea(){
-		socketTrainer.areaDelete(props.areaName as string)
-	}
-</script>
-
-<template>
-	<div class="popup-overlay" @click="emit('close-popup')">
-		<div class="popup">
-			<h2>{{ props.areaName }}</h2>
-			<button id="deleteButton" @click="deleteArea()">
-				Bereich löschen
-			</button>
-		</div>
-	</div>
-</template>
-
-<style scoped>
-	.popup-overlay {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		background-color: rgba(0, 0, 0, 0.5);
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		text-align: center;
-		z-index: 1;
-	}
-
-	.popup {
-		background-color: white;
-		padding: 20px;
-		border-radius: 8px;
-	}
-
-	#deleteButton {
-		position: relative;
-		background-color: #ee4035;
-		color: white;
-		border: 1px solid rgb(209, 213, 219);
-		border-radius: .5rem;
-		width: 100%;
-		font-size: 1.25rem;
-		padding: .75rem 1rem;
-		text-align: center;
-		margin-top: 10px;
-	}
-</style>
\ No newline at end of file
diff --git a/frontend/src/components/widgets/ButtonMainAction.vue b/frontend/src/components/widgets/ButtonMainAction.vue
index 3915d95c..c8201626 100644
--- a/frontend/src/components/widgets/ButtonMainAction.vue
+++ b/frontend/src/components/widgets/ButtonMainAction.vue
@@ -1,6 +1,4 @@
 <script setup lang="ts">
-	import {defineEmits, defineProps} from 'vue'
-
 	withDefaults(defineProps<{
 		buttonText: string
 	}>(), {
diff --git a/frontend/src/components/widgets/DeleteItemPopup.vue b/frontend/src/components/widgets/DeleteItemPopup.vue
new file mode 100644
index 00000000..af4e3c71
--- /dev/null
+++ b/frontend/src/components/widgets/DeleteItemPopup.vue
@@ -0,0 +1,46 @@
+<script setup lang="ts">
+	const emit = defineEmits(['close-popup','delete'])
+
+	const props = defineProps({
+		name: {
+			type: String,
+			default: "Kein Name angegeben"
+		},
+        deleteText: {
+            type: String,
+            default: "Löschen"
+        }
+	})
+</script>
+
+<template>
+	<div class="popup-overlay" @click="emit('close-popup')">
+		<div class="popup">
+			<h2>{{ props.name }}</h2>
+			<button id="deleteButton" @click="emit('delete')">
+				{{ props.deleteText }}
+			</button>
+		</div>
+	</div>
+</template>
+
+<style scoped>
+	.popup {
+		background-color: white;
+		padding: 20px;
+		border-radius: 8px;
+	}
+
+	#deleteButton {
+		position: relative;
+		background-color: #ee4035;
+		color: white;
+		border: 1px solid rgb(209, 213, 219);
+		border-radius: .5rem;
+		width: 180px;
+		font-size: 1.25rem;
+		padding: .75rem 1rem;
+		text-align: center;
+		margin-top: 10px;
+	}
+</style>
\ No newline at end of file
diff --git a/frontend/src/components/widgets/EditPatientPopup.vue b/frontend/src/components/widgets/EditPatientPopup.vue
index 15a4db03..ff966d00 100644
--- a/frontend/src/components/widgets/EditPatientPopup.vue
+++ b/frontend/src/components/widgets/EditPatientPopup.vue
@@ -83,20 +83,6 @@
 </template>
 
 <style scoped>
-	.popup-overlay {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		background-color: rgba(0, 0, 0, 0.5);
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		text-align: center;
-		z-index: 1;
-	}
-
 	.popup {
 		background-color: white;
 		padding: 20px;
diff --git a/frontend/src/components/widgets/LoginPatient.vue b/frontend/src/components/widgets/LoginPatient.vue
index e3d49c01..416f97dc 100644
--- a/frontend/src/components/widgets/LoginPatient.vue
+++ b/frontend/src/components/widgets/LoginPatient.vue
@@ -25,7 +25,7 @@
 			"patientId": patientIdNumber,
 		}
 
-		fetch('https://localhost:8000/login/', {
+		fetch('http://localhost:8000/patient/access', {
 			method: 'POST',
 			headers: {
 				'Content-Type': 'application/json',
diff --git a/frontend/src/components/widgets/LoginTrainer.vue b/frontend/src/components/widgets/LoginTrainer.vue
index abc1c622..46dde68d 100644
--- a/frontend/src/components/widgets/LoginTrainer.vue
+++ b/frontend/src/components/widgets/LoginTrainer.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 	import {ref} from 'vue'
 	import {useTrainerStore} from '@/stores/Trainer'
-	import {Modules, setModule, showErrorToast} from "@/App.vue"
+	import {Modules, setModule} from "@/App.vue"
 	import {svg} from "@/assets/Svg"
 
 	const usernameInput = ref("")
@@ -11,12 +11,16 @@
 		const trainerStore = useTrainerStore()
 		trainerStore.username = usernameInput.value
 
-		const requestBody = {
+		setModule(Modules.TRAINER)
+		return
+
+		// Will be used when trainer login is implemented in the backend
+		/*const requestBody = {
 			"username": usernameInput.value,
 			"password": passwordInput.value,
 		}
 
-		fetch('https://localhost:8000/login/', {
+		fetch('https://localhost:8000/trainer/login', {
 			method: 'POST',
 			headers: {
 				'Content-Type': 'application/json',
@@ -41,7 +45,7 @@
 			.then(data => {
 				trainerStore.token = data.token
 				setModule(Modules.TRAINER)
-			})
+			})*/
 	}
 </script>
 
diff --git a/frontend/src/components/widgets/PatientInfo.vue b/frontend/src/components/widgets/PatientInfo.vue
index eb289c53..0bb03f37 100644
--- a/frontend/src/components/widgets/PatientInfo.vue
+++ b/frontend/src/components/widgets/PatientInfo.vue
@@ -16,13 +16,12 @@
 			type: String,
 			default: 'No Biometrics'
 		}
-
 	})
 </script>
 
 <template>
 	<p class="key">
-		Verletzung
+		Verletzungen
 	</p>{{ props.injury }}
 	<br>
 	<p class="key">
diff --git a/frontend/src/components/widgets/PatientStatus.vue b/frontend/src/components/widgets/PatientStatus.vue
index 77383aab..5d69e5b5 100644
--- a/frontend/src/components/widgets/PatientStatus.vue
+++ b/frontend/src/components/widgets/PatientStatus.vue
@@ -6,6 +6,18 @@
 
 <template>
 	<table>
+		<tr>
+			<td colspan="2">
+				<hr>
+			</td>
+		</tr>
+		<tr>
+			<td colspan="2">
+				<h1>
+					Status
+				</h1>
+			</td>
+		</tr>
 		<tr>
 			<td>
 				<p class="key">
@@ -42,18 +54,60 @@
 				</p>{{ patientStore.skin }}
 			</td>
 		</tr>
+		<tr>
+			<td colspan="2">
+				<hr>
+			</td>
+		</tr>
+		<tr>
+			<td colspan="2">
+				<h1>
+					Info
+				</h1>
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<p class="key">
+					Verletzungen
+				</p>{{ patientStore.injury }}
+			</td>
+			<td>
+				<p class="key">
+					Vorerkrankungen
+				</p>{{ patientStore.history }}
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<p class="key">
+					Personalien
+				</p>{{ patientStore.personalDetails }}
+			</td>
+			<td>
+				<p class="key">
+					Biometrie
+				</p>{{ patientStore.biometrics }}
+			</td>
+		</tr>
+		<tr>
+			<td colspan="2">
+				<hr>
+			</td>
+		</tr>
 	</table>
 </template>
 
 <style scoped>
 	table {
 		border-collapse: collapse;
-		width: 100%;
+		width: 90%;
+		max-width: calc(100% - 60px);
 		table-layout: fixed;
+		margin: 90px auto 30px auto;
 	}
 
 	td {
-		width: 50%;
 		padding: 10px;
 		vertical-align: top;
 		overflow: hidden;
@@ -62,4 +116,8 @@
 	.key {
 		font-weight: bold;
 	}
+
+	h1 {
+		text-align: center;
+	}
 </style>
\ No newline at end of file
diff --git a/frontend/src/components/widgets/ToggleSwitchForListItems.vue b/frontend/src/components/widgets/ToggleSwitchForListItems.vue
index bd3f2b14..ffe63214 100644
--- a/frontend/src/components/widgets/ToggleSwitchForListItems.vue
+++ b/frontend/src/components/widgets/ToggleSwitchForListItems.vue
@@ -61,6 +61,6 @@ input:checked + .slider {
 }
 
 input:checked + .slider:before {
-	transform: translateX(22px);
+	transform: translateX(23px);
 }
 </style>
\ No newline at end of file
diff --git a/frontend/src/components/widgets/TriagePopup.vue b/frontend/src/components/widgets/TriagePopup.vue
index 6a5b44a0..692ec024 100644
--- a/frontend/src/components/widgets/TriagePopup.vue
+++ b/frontend/src/components/widgets/TriagePopup.vue
@@ -45,20 +45,6 @@
 </template>
 
 <style scoped>
-	.popup-overlay {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		background-color: rgba(0, 0, 0, 0.5);
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		text-align: center;
-		z-index: 1;
-	}
-
 	.popup {
 		background-color: white;
 		padding: 20px;
diff --git a/frontend/src/sockets/MessageData.ts b/frontend/src/sockets/MessageData.ts
index d94c7666..04844f48 100644
--- a/frontend/src/sockets/MessageData.ts
+++ b/frontend/src/sockets/MessageData.ts
@@ -14,14 +14,13 @@ interface MessageData {
 	patientId?: number
 	personnelName?: string
 	personnelId?: number
-	deviceName?: string
-	deviceId?: number
+	materialName?: string
 	exercise?: Exercise
 	state?: State
 	logEntry?: LogEntry
 	availablePatients: AvailablePatients
 	availableActions: AvailableActions
-	availableMaterial: AvailableMaterial
+	availableMaterialList: AvailableMaterial
 }
 
 interface Exercise {
@@ -33,7 +32,7 @@ interface Area {
 	areaName: string
 	patients: Patient[]
 	personnel: Personnel[]
-	devices: Device[]
+	material: Material[]
 }
 
 interface Patient {
@@ -48,9 +47,9 @@ interface Personnel {
 	personnelName: string
 }
 
-interface Device {
-	deviceId: number
-	deviceName: string
+interface Material {
+	materialName: string
+	materialType: string
 }
 
 interface State {
@@ -70,32 +69,42 @@ interface LogEntry {
 	areaName: string
 	patientId: number
 	personnelId: number
-	deviceId: number
-}
-
-interface AvailablePatient {
-	patientCode: number
-	triage: string
-	patientInjury: string
-	patientHistory: string
-	patientPersonalDetails: string
-	patientBiometrics: string
 }
 
 interface Availables {
-	actions: [],
+	actions: AvailableAction[],
 	patients: AvailablePatient[],
-	material: [],
+	material: AvailableMaterial[],
 }
 
 interface AvailableActions {
-	actions: [],
+	availableActions: AvailableAction[],
+}
+
+interface AvailableAction {
+	actionName: string
+	actionDescription: string
+	actionType: string
 }
 
 interface AvailablePatients {
 	availablePatients: AvailablePatient[],
 }
 
+interface AvailablePatient {
+	patientCode: number
+	triage: string
+	patientInjury: string
+	patientHistory: string
+	patientPersonalDetails: string
+	patientBiometrics: string
+}
+
+interface AvailableMaterialList {
+	availableMaterialList: AvailableMaterial[],
+}
+
 interface AvailableMaterial {
-	material: [],
+	materialName: string
+	materialType: string
 }
\ No newline at end of file
diff --git a/frontend/src/sockets/SocketPatient.ts b/frontend/src/sockets/SocketPatient.ts
index 7fcfa314..fa40cb03 100644
--- a/frontend/src/sockets/SocketPatient.ts
+++ b/frontend/src/sockets/SocketPatient.ts
@@ -1,6 +1,7 @@
 import {connection} from "@/stores/Connection"
 import {usePatientStore} from "@/stores/Patient"
 import {useExerciseStore} from "@/stores/Exercise"
+import {useAvailablesStore} from "@/stores/Availables"
 import {showErrorToast, showWarningToast} from "@/App.vue"
 import {ScreenPosition, Screens, setScreen} from "@/components/ModulePatient.vue"
 
@@ -13,6 +14,10 @@ class SocketPatient {
 	}
 
 	connect(): void {
+		const patientStore = usePatientStore()
+		const exerciseStore = useExerciseStore()
+		const availablesStore = useAvailablesStore()
+
 		this.socket = new WebSocket(this.url + usePatientStore().token)
 
 		this.socket.onopen = () => {
@@ -47,13 +52,15 @@ class SocketPatient {
 					showWarningToast(data.message || '')
 					break
 				case 'state':
-					usePatientStore().loadStatusFromJSON(data.state as State)
+					patientStore.loadStatusFromJSON(data.state as State)
+					break
+				case 'available-patients':
+					availablesStore.loadAvailablePatients(data.availablePatients as AvailablePatients)
+					patientStore.initializePatientFromAvailablePatients()
 					break
 				case 'exercise':
-					useExerciseStore().createFromJSON(data.exercise as Exercise)
-					usePatientStore().patientName = useExerciseStore().getPatient(usePatientStore().patientId)?.patientName || ''
-					usePatientStore().areaName = useExerciseStore().getAreaOfPatient(usePatientStore().patientId)?.areaName || ''
-					usePatientStore().triage = useExerciseStore().getPatient(usePatientStore().patientId)?.triage || '-'
+					exerciseStore.createFromJSON(data.exercise as Exercise)
+					patientStore.initializePatientFromExercise()
 					break
 				case 'exercise-start':
 					setScreen(Screens.STATUS, ScreenPosition.LEFT)
@@ -114,8 +121,43 @@ export const serverMockEvents = [
 	{id: 'test-passthrough', data: '{"messageType":"test-passthrough","message":"received test-passthrough event"}'},
 	{
 		id: 'state',
-		data: '{"messageType":"state","state":{"phaseNumber":"123","airway":"Normal","breathing":"Regular","circulation":"Stable",' +
-			'"consciousness":"Alert","pupils":"Reactive","psyche":"Calm","skin":"Warm"}}'
+		data: '{"messageType":"state","state":{"phaseNumber":"123","airway":"Normal","breathing":"Regelmäßig","circulation":"Stabil",' +
+			'"consciousness":"Bewusstlos","pupils":"Geweitet","psyche":"Ruhig","skin":"Blass"}}'
+	},
+	{
+		id: "available-patients",
+		data: '{"messageType":"available-patients","availablePatients":{"availablePatients":['+
+			'{"patientCode":1,'+
+			'"triage":"Y","patientInjury":"Gebrochener Arm","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"weiblich, 30 Jahre alt","patientBiometrics":"Größe: 196cm, Gewicht: 76kg"},'+
+			'{"patientCode":2,'+
+			'"triage":"G","patientInjury":"Verdrehter Knöchel","patientHistory":"Keine Allergien",'+
+			'"patientPersonalDetails":"männlich, 47 Jahre alt","patientBiometrics":"Größe: 164cm, Gewicht: 65kg"},'+
+			'{"patientCode":3,'+
+			'"triage":"R","patientInjury":"Kopfverletzung","patientHistory":"Diabetes",'+
+			'"patientPersonalDetails":"weiblich, 20 Jahre alt","patientBiometrics":"Größe: 192cm, Gewicht: 77kg"},'+
+			'{"patientCode":4,'+
+			'"triage":"Y","patientInjury":"Gebprelltes Bein","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"männlich, 13 Jahre alt","patientBiometrics":"Größe: 165cm, Gewicht: 54kg"},'+
+			'{"patientCode":5,'+
+			'"triage":"G","patientInjury":"Butender Arm","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"weiblich, 53 Jahre alt","patientBiometrics":"Größe: 180cm, Gewicht: 71kg"},'+
+			'{"patientCode":6,'+
+			'"triage":"Y","patientInjury":"Verschobene Schulter","patientHistory":"Gehbehindert",'+
+			'"patientPersonalDetails":"männlich, 49 Jahre alt","patientBiometrics":"Größe: 170cm, Gewicht: 67kg"},'+
+			'{"patientCode":7,'+
+			'"triage":"R","patientInjury":"Kopfverletzung","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"weiblich, 23 Jahre alt","patientBiometrics":"Größe: 162cm, Gewicht: 67kg"},'+
+			'{"patientCode":8,'+
+			'"triage":"Y","patientInjury":"Verlorener Finger","patientHistory":"Diabetes",'+
+			'"patientPersonalDetails":"männlich, 43 Jahre alt","patientBiometrics":"Größe: 161cm, Gewicht: 56kg"},'+
+			'{"patientCode":9,'+
+			'"triage":"G","patientInjury":"Aufgschürfter Ellenbogen","patientHistory":"Bluthochdruck",'+
+			'"patientPersonalDetails":"weiblich, 23 Jahre alt","patientBiometrics":"Größe: 182cm, Gewicht: 75kg"},'+
+			'{"patientCode":10,'+
+			'"triage":"Y","patientInjury":"Gebrochene Nase","patientHistory":"Grippe",'+
+			'"patientPersonalDetails":"männlich, 39 Jahre alt","patientBiometrics":"Größe: 173cm, Gewicht: 61kg"}'+
+			']}}'
 	},
 	{
 		id: 'exercise',
@@ -123,14 +165,14 @@ export const serverMockEvents = [
 			'{"areaName":"Intensiv","patients":[{"patientId":5,"patientName":"Anna Müller","patientCode":1,"triage":"Y"},'+
 			'{"patientId":3,"patientName":"Frank Huber",' +
 			'"patientCode":2,"triage":"G"}],"personnel":[{"personnelId":1,"personnelName":"Sebastian Lieb"}],"devices":' +
-			'[{"deviceId":1,"deviceName":"Treadmill"}]},{"areaName":"ZNA","patients":' +
+			'[{"deviceName":"Treadmill"}]},{"areaName":"ZNA","patients":' +
 			'[{"patientId":2,"patientName":"Luna Patel","patientCode":3,"triage":"R"},' + 
 			'{"patientId":6,"patientName":"Friedrich Gerhard","patientCode":4,"triage":"Y"}],'+
-			'"personnel":[{"personnelId":2,"personnelName":"Hannah Mayer"}],"devices":[{"deviceId":2,"deviceName":"Dumbbells"}]},' +
+			'"personnel":[{"personnelId":2,"personnelName":"Hannah Mayer"}],"devices":[{"deviceName":"Dumbbells"}]},' +
 			'{"areaName":"Wagenhalle","patients":[{"patientId":1,"patientName":"Isabelle Busch","patientCode":5,"triage":"G"},' +
 			'{"patientId":4,"patientName":"Jasper Park","patientCode":6,"triage":"Y"}],' +
 			'"personnel":[{"personnelId":3,"personnelName":"Coach Flex"}],' +
-			'"devices":[{"deviceId":3,"deviceName":"Beatmungsgerät"}]}]}}'
+			'"devices":[{"deviceName":"Beatmungsgerät"}]}]}}'
 	},
 	{id: 'exercise-start', data: '{"messageType":"exercise-start"}'},
 	{id: 'exercise-stop', data: '{"messageType":"exercise-stop"}'},
diff --git a/frontend/src/sockets/SocketTrainer.ts b/frontend/src/sockets/SocketTrainer.ts
index a0bd4593..beb2a072 100644
--- a/frontend/src/sockets/SocketTrainer.ts
+++ b/frontend/src/sockets/SocketTrainer.ts
@@ -51,7 +51,7 @@ class SocketTrainer {
 					useAvailablesStore().loadAvailableActions(data.availableActions as AvailableActions)
 					break
 				case 'available-material':
-					useAvailablesStore().loadAvailableMaterial(data.availableMaterial as AvailableMaterial)
+					useAvailablesStore().loadAvailableMaterial(data.availableMaterialList as unknown as AvailableMaterialList)
 					break
 				case 'available-patients':
 					useAvailablesStore().loadAvailablePatients(data.availablePatients as AvailablePatients)
@@ -142,6 +142,35 @@ class SocketTrainer {
 			'patientId': patientId
 		}))
 	}
+
+	personnelAdd(areaName: string) {
+		this.#sendMessage(JSON.stringify({
+			'messageType': 'personnel-add',
+			'areaName': areaName
+		}))
+	}
+
+	personnelDelete(personnelId: number) {
+		this.#sendMessage(JSON.stringify({
+			'messageType': 'personnel-delete',
+			'personnelId': personnelId
+		}))
+	}
+
+	materialAdd(areaName: string, materialName: string) {
+		this.#sendMessage(JSON.stringify({
+			'messageType': 'material-add',
+			'areaName': areaName,
+			'materialName': materialName
+		}))
+	}
+
+	materialDelete(materialName: string) {
+		this.#sendMessage(JSON.stringify({
+			'messageType': 'material-delete',
+			'materialName': materialName
+		}))
+	}
 }
 
 const socketTrainer = new SocketTrainer('ws://localhost:8000/ws/trainer/?token=')
@@ -154,35 +183,53 @@ export const serverMockEvents = [
 		id: "available-patients",
 		data: '{"messageType":"available-patients","availablePatients":{"availablePatients":['+
 			'{"patientCode":1,'+
-			'"triage":"Y","patientInjury":"broken arm","patientHistory":"Asthma",'+
-			'"patientPersonalDetails":"Female, 30 years old","patientBiometrics":"Height:196cm, Weight: 76kg"},'+
+			'"triage":"Y","patientInjury":"Gebrochener Arm","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"weiblich, 30 Jahre alt","patientBiometrics":"Größe: 196cm, Gewicht: 76kg"},'+
 			'{"patientCode":2,'+
-			'"triage":"G","patientInjury":"twisted ankle","patientHistory":"No known allergies",'+
-			'"patientPersonalDetails":"Male, 47 years old","patientBiometrics":"Height:164cm, Weight: 65kg"},'+
+			'"triage":"G","patientInjury":"Verdrehter Knöchel","patientHistory":"Keine Allergien",'+
+			'"patientPersonalDetails":"männlich, 47 Jahre alt","patientBiometrics":"Größe: 164cm, Gewicht: 65kg"},'+
 			'{"patientCode":3,'+
-			'"triage":"R","patientInjury":"head injury","patientHistory":"Diabetes",'+
-			'"patientPersonalDetails":"Female, 20 years old","patientBiometrics":"Height:192cm, Weight: 77kg"},'+
+			'"triage":"R","patientInjury":"Kopfverletzung","patientHistory":"Diabetes",'+
+			'"patientPersonalDetails":"weiblich, 20 Jahre alt","patientBiometrics":"Größe: 192cm, Gewicht: 77kg"},'+
 			'{"patientCode":4,'+
-			'"triage":"Y","patientInjury":"sprained wrist","patientHistory":"gastroesophageal reflux disease",'+
-			'"patientPersonalDetails":"Male, 13 years old","patientBiometrics":"Height:165cm, Weight: 54kg"},'+
+			'"triage":"Y","patientInjury":"Gebprelltes Bein","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"männlich, 13 Jahre alt","patientBiometrics":"Größe: 165cm, Gewicht: 54kg"},'+
 			'{"patientCode":5,'+
-			'"triage":"G","patientInjury":"bruised ribs","patientHistory":"No known allergies",'+
-			'"patientPersonalDetails":"Female, 53 years old","patientBiometrics":"Height:180cm, Weight: 71kg"},'+
+			'"triage":"G","patientInjury":"Butender Arm","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"weiblich, 53 Jahre alt","patientBiometrics":"Größe: 180cm, Gewicht: 71kg"},'+
 			'{"patientCode":6,'+
-			'"triage":"Y","patientInjury":"shoulder dislocation","patientHistory":"paralyzed",'+
-			'"patientPersonalDetails":"Male, 49 years old","patientBiometrics":"Height:170cm, Weight: 67kg"},'+
+			'"triage":"Y","patientInjury":"Verschobene Schulter","patientHistory":"Gehbehindert",'+
+			'"patientPersonalDetails":"männlich, 49 Jahre alt","patientBiometrics":"Größe: 170cm, Gewicht: 67kg"},'+
 			'{"patientCode":7,'+
-			'"triage":"R","patientInjury":"head trauma","patientHistory":"Asthma",'+
-			'"patientPersonalDetails":"Female, 23 years old","patientBiometrics":"Height:162cm, Weight: 67kg"},'+
+			'"triage":"R","patientInjury":"Kopfverletzung","patientHistory":"Asthma",'+
+			'"patientPersonalDetails":"weiblich, 23 Jahre alt","patientBiometrics":"Größe: 162cm, Gewicht: 67kg"},'+
 			'{"patientCode":8,'+
-			'"triage":"Y","patientInjury":"bruised ribs","patientHistory":"reflux disease",'+
-			'"patientPersonalDetails":"Male, 43 years old","patientBiometrics":"Height:161cm, Weight: 56kg"},'+
+			'"triage":"Y","patientInjury":"Verlorener Finger","patientHistory":"Diabetes",'+
+			'"patientPersonalDetails":"männlich, 43 Jahre alt","patientBiometrics":"Größe: 161cm, Gewicht: 56kg"},'+
 			'{"patientCode":9,'+
-			'"triage":"G","patientInjury":"sprained wrist","patientHistory":"hearth disease",'+
-			'"patientPersonalDetails":"Female, 23 years old","patientBiometrics":"Height:182cm, Weight: 75kg"},'+
+			'"triage":"G","patientInjury":"Aufgschürfter Ellenbogen","patientHistory":"Bluthochdruck",'+
+			'"patientPersonalDetails":"weiblich, 23 Jahre alt","patientBiometrics":"Größe: 182cm, Gewicht: 75kg"},'+
 			'{"patientCode":10,'+
-			'"triage":"Y","patientInjury":"shoulder broken","patientHistory":"illness",'+
-			'"patientPersonalDetails":"Male, 39 years old","patientBiometrics":"Height:173cm, Weight: 61kg"}'+
+			'"triage":"Y","patientInjury":"Gebrochene Nase","patientHistory":"Grippe",'+
+			'"patientPersonalDetails":"männlich, 39 Jahre alt","patientBiometrics":"Größe: 173cm, Gewicht: 61kg"}'+
+			']}}'
+	},
+	{
+		id: "available-material",
+		data: '{"messageType":"available-material","availableMaterialList":{"availableMaterialList":['+
+			'{"materialName":"Beatmungsgerät","materialType":"device"},'+
+			'{"materialName":"Blutdruckmessgerät","materialType":"device"},'+
+			'{"materialName":"Defibrillator","materialType":"device"},'+
+			'{"materialName":"Endoskop","materialType":"device"},'+
+			'{"materialName":"Herz-Lungen-Maschine","materialType":"device"},'+
+			'{"materialName":"Blut 0 negativ","materialType":"blood"},'+
+			'{"materialName":"Blut 0 positiv","materialType":"blood"},'+
+			'{"materialName":"Blut A negativ","materialType":"blood"},'+
+			'{"materialName":"Blut A positiv","materialType":"blood"},'+
+			'{"materialName":"Blut B negativ","materialType":"blood"},'+
+			'{"materialName":"Blut B positiv","materialType":"blood"},'+
+			'{"materialName":"Blut AB negativ","materialType":"blood"},'+
+			'{"materialName":"Blut AB positiv","materialType":"blood"}'+
 			']}}'
 	},
 	{
@@ -190,15 +237,17 @@ export const serverMockEvents = [
 		data: '{"messageType":"exercise","exercise":{"exerciseId":123456,"areas":[' +
 			'{"areaName":"Intensiv","patients":[{"patientId":5,"patientName":"Anna Müller","patientCode":1,"triage":"Y"},'+
 			'{"patientId":3,"patientName":"Frank Huber",' +
-			'"patientCode":2,"triage":"G"}],"personnel":[{"personnelId":1,"personnelName":"Sebastian Lieb"}],"devices":' +
-			'[{"deviceId":1,"deviceName":"Treadmill"}]},{"areaName":"ZNA","patients":' +
+			'"patientCode":2,"triage":"G"}],"personnel":[{"personnelId":1,"personnelName":"Sebastian Lieb"}],"material":' +
+			'[{"materialName":"Beatmungsgerät","materialType":"device"},{"materialName":"Blut 0 positiv","materialType":"blood"}]},'+
+			'{"areaName":"ZNA","patients":' +
 			'[{"patientId":2,"patientName":"Luna Patel","patientCode":3,"triage":"R"},' + 
 			'{"patientId":6,"patientName":"Friedrich Gerhard","patientCode":4,"triage":"Y"}],'+
-			'"personnel":[{"personnelId":2,"personnelName":"Hannah Mayer"}],"devices":[{"deviceId":2,"deviceName":"Dumbbells"}]},' +
+			'"personnel":[{"personnelId":2,"personnelName":"Hannah Mayer"}],'+
+			'"material":[{"materialName":"Defibillator","materialType":"device"},{"materialName":"Blut A positiv","materialType":"blood"}]},' +
 			'{"areaName":"Wagenhalle","patients":[{"patientId":1,"patientName":"Isabelle Busch","patientCode":5,"triage":"G"},' +
 			'{"patientId":4,"patientName":"Jasper Park","patientCode":6,"triage":"Y"}],' +
-			'"personnel":[{"personnelId":3,"personnelName":"Coach Flex"}],' +
-			'"devices":[{"deviceId":3,"deviceName":"Beatmungsgerät"}]}]}}'
+			'"personnel":[{"personnelId":3,"personnelName":"Antonio Wilhelm David Fleiker"}],' +
+			'"material":[{"materialName":"Beatmungsgerät","materialType":"device"},{"materialName":"Blut 0 negativ","materialType":"blood"}]}]}}'
 	},
 	{id: 'exercise-start', data: '{"messageType":"exercise-start"}'},
 	{id: 'exercise-stop', data: '{"messageType":"exercise-stop"}'},
@@ -206,10 +255,10 @@ export const serverMockEvents = [
 		id: 'log-update',
 		data: '{"messageType":"log-update","logEntry":[' +
 			'{"logMessage":"Patient admitted","logTime":' + Date.UTC(2024, 2, 20, 14, 32, 20, 0) +
-			',"areaName":"EmergencyRoom","patientId":123,"personnelId":456,"deviceId":789},' +
+			',"areaName":"EmergencyRoom","patientId":123,"personnelId":456},' +
 			'{"logMessage":"Treatment started","logTime":' + Date.UTC(2024, 2, 20, 14, 32, 46, 0) +
-			',"areaName":"Operating Theater","patientId":123,"personnelId":456,"deviceId":789},' +
+			',"areaName":"Operating Theater","patientId":123,"personnelId":456},' +
 			'{"logMessage":"Patient stabilized","logTime":' + Date.UTC(2024, 2, 20, 14, 33, 8, 0) +
-			',"areaName":"ICU","patientId":123,"personnelId":456,"deviceId":789}]}'
+			',"areaName":"ICU","patientId":123,"personnelId":456}]}'
 	}
 ]
diff --git a/frontend/src/stores/Availables.ts b/frontend/src/stores/Availables.ts
index 377fe3de..c5fd4eba 100644
--- a/frontend/src/stores/Availables.ts
+++ b/frontend/src/stores/Availables.ts
@@ -19,13 +19,13 @@ export const useAvailablesStore = defineStore('availables', {
 	},
 	actions: {
 		loadAvailableActions(json: AvailableActions) {
-			this.actions = json.actions
+			this.actions = json.availableActions
 		},
 		loadAvailablePatients(json: AvailablePatients) {
 			this.patients = json.availablePatients
 		},
-		loadAvailableMaterial(json: AvailableMaterial) {
-			this.material = json.material
+		loadAvailableMaterial(json: AvailableMaterialList) {
+			this.material = json.availableMaterialList
 		}
 	}
 })
\ No newline at end of file
diff --git a/frontend/src/stores/Exercise.ts b/frontend/src/stores/Exercise.ts
index 23ed34b1..dbfe26cf 100644
--- a/frontend/src/stores/Exercise.ts
+++ b/frontend/src/stores/Exercise.ts
@@ -37,6 +37,17 @@ export const useExerciseStore = defineStore('exercise', {
 				})
 				return foundPatient
 			}
+		},
+		getPersonnel: (state) => {
+			return (personnelId: number): Personnel | null => {
+				let foundPersonnel: Personnel | null = null
+				state.areas.forEach((area) => {
+					area.personnel.forEach((personnel) => {
+						if (personnel.personnelId == personnelId) foundPersonnel = personnel
+					})
+				})
+				return foundPersonnel
+			}
 		}
 	},
 	actions: {
diff --git a/frontend/src/stores/Patient.ts b/frontend/src/stores/Patient.ts
index 197c9105..7d25b4dd 100644
--- a/frontend/src/stores/Patient.ts
+++ b/frontend/src/stores/Patient.ts
@@ -1,9 +1,12 @@
 import {defineStore} from "pinia"
+import {useExerciseStore} from "@/stores/Exercise"
+import { useAvailablesStore } from "./Availables"
 
 export const usePatientStore = defineStore('patient', {
 	state: () => ({
 		token: '',
 		patientId: Number.NEGATIVE_INFINITY,
+		patientCode: Number.NEGATIVE_INFINITY,
 		patientName: '',
 		triage: '-',
 		areaName: '',
@@ -14,7 +17,11 @@ export const usePatientStore = defineStore('patient', {
 		phaseNumber: 0,
 		psyche: '',
 		pupils: '',
-		skin: ''
+		skin: '',
+		injury: '',
+		history: '',
+		personalDetails: '',
+		biometrics: ''
 	}),
 	actions: {
 		loadStatusFromJSON(state: State) {
@@ -26,6 +33,20 @@ export const usePatientStore = defineStore('patient', {
 			this.psyche = state.psyche
 			this.pupils = state.pupils
 			this.skin = state.skin
+		},
+		initializePatientFromExercise() {
+			const exerciseStore = useExerciseStore()
+			this.patientName = exerciseStore.getPatient(this.patientId)?.patientName || ''
+			this.patientCode = exerciseStore.getPatient(this.patientId)?.patientCode || Number.NEGATIVE_INFINITY
+			this.areaName = exerciseStore.getAreaOfPatient(this.patientId)?.areaName || ''
+			this.triage = exerciseStore.getPatient(this.patientId)?.triage || '-'
+		},
+		initializePatientFromAvailablePatients() {
+			const availablesStore = useAvailablesStore()
+			this.injury = availablesStore.getPatient(this.patientCode)?.patientInjury || ''
+			this.history = availablesStore.getPatient(this.patientCode)?.patientHistory || ''
+			this.personalDetails = availablesStore.getPatient(this.patientCode)?.patientPersonalDetails || ''
+			this.biometrics = availablesStore.getPatient(this.patientCode)?.patientBiometrics || ''
 		}
 	}
 })
\ No newline at end of file