Abänderungen

src/pages/RechnerSeite.vue

@@ -68,6 +68,22 @@
 						:rows-per-page-options="[0]"
 						virtual-scroll
 					>
+						<template #body-cell-name="props">
+							<q-td
+								:props="props"
+							>
+								<q-btn
+									flat
+									color="red"
+									size="small"
+									padding="xs"
+									icon="delete"
+									:disabled="!wirdDieShiftTasteGehalten"
+									@click="personRausschmeißen(props.value)"
+								/>
+								{{ props.value }}
+							</q-td>
+						</template>
 						<template #body-cell-geblecht="props">
 							<q-td
 								v-if="props.row.geblecht.length && witzigeEffekte"
@@ -132,13 +148,6 @@
 							:disabled="!personenAuswähler"
 							@click="geldBlechen"
 						/>
-
-						<q-btn
-							color="deep-orange"
-							label="Entfernen"
-							:disabled="!personenAuswähler"
-							@click="personRausschmeißen"
-						/>
 					</q-card-actions>
 				</q-card>
 			</div>
@@ -216,6 +225,8 @@
 </template>
 
 <script setup>
+// TODO: Multiselect wenn Geld blechen um nur bestimmte Personen mit einzubeziehen
+
 import { computed, onMounted, ref } from 'vue';
 
 const personen = ref({});
@@ -264,9 +275,13 @@ onMounted(() => {
 	}
 });
 
-// function blechGründe (nameDerPerson) {
-// 	return personen.value[nameDerPerson].geblecht;
-// }
+const wirdDieShiftTasteGehalten = ref(false);
+document.onkeydown = event => {
+	wirdDieShiftTasteGehalten.value = event.shiftKey;
+};
+document.onkeyup = event => {
+	wirdDieShiftTasteGehalten.value = event.shiftKey;
+};
 
 function speicherLeute () {
 	localStorage.setItem('personen', JSON.stringify(personen.value));
@@ -285,12 +300,8 @@ function personHinzufügen () {
 	speicherLeute();
 }
 
-function personRausschmeißen () {
-	delete personen.value[personenAuswähler.value];
-
-	personenAuswähler.value = null;
-	grundEingabeFeld.value = '';
-	geldEingabeFeld.value = 0.0;
+function personRausschmeißen (personenName) {	
+	delete personen.value[personenName];
 
 	speicherLeute();
 }