fronting entry edits

NyaomiDEV · Aug 7, 2024 · 7442315 · 7442315
1 parent 78ecd76
commit 7442315
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 9 deletions.
diff --git a/src/modals/FrontingEntryEdit.vue b/src/modals/FrontingEntryEdit.vue
@@ -125,6 +125,10 @@
 	function updateSelectedMember(members: Member[]){
 		frontingEntry.value.member = members[0];
 	}
+
+	function removeFromFront() {
+		frontingEntry.value.endTime = new Date();
+	}
 </script>
 
 <template>
@@ -160,11 +164,10 @@
 						</IonLabel>
 						<IonDatetimeButton slot="end" datetime="startTime"></IonDatetimeButton>
 					</IonItem>
-					<IonItem v-if="!frontingEntry.endTime">
+					<IonItem button v-if="!frontingEntry.endTime" @click="removeFromFront">
 						<IonLabel>
-							<p>
-								{{ $t("options:frontHistory.edit.endTimeUnavailable") }}
-							</p>
+							<h2>{{ $t("options:frontHistory.edit.removeFromFront.title") }}</h2>
+							<p>{{ $t("options:frontHistory.edit.removeFromFront.desc") }}</p>
 						</IonLabel>
 					</IonItem>
 					<IonItem button v-if="frontingEntry.endTime">
@@ -190,7 +193,7 @@
 			</IonList>
 
 			<IonFab slot="fixed" vertical="bottom" horizontal="end">
-				<IonFabButton @click="save">
+				<IonFabButton @click="save" v-if="frontingEntry.member">
 					<IonIcon :ios="saveIOS" :md="saveMD" />
 				</IonFabButton>
 			</IonFab>

diff --git a/src/views/options/FrontHistory.vue b/src/views/options/FrontHistory.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-	import { IonContent, IonHeader, IonList, IonPage, IonTitle, IonLabel, IonToolbar, IonBackButton, IonItem, IonItemDivider, IonDatetime, IonButtons, IonIcon, IonButton, IonSearchbar } from '@ionic/vue';
+	import { IonContent, IonHeader, IonList, IonPage, IonTitle, IonLabel, IonToolbar, IonBackButton, IonItem, IonItemDivider, IonDatetime, IonButtons, IonIcon, IonButton, IonSearchbar, IonFabButton, IonFab } from '@ionic/vue';
 	import { inject, onMounted, onUnmounted, ref, ShallowRef, shallowRef, watch, WatchStopHandle } from 'vue';
 	import FrontingEntryAvatar from "../../components/frontingEntry/FrontingEntryAvatar.vue";
 	import FrontingEntryLabel from "../../components/frontingEntry/FrontingEntryLabel.vue";
@@ -12,11 +12,14 @@
 
 	import {
 		calendarOutline as calendarIOS,
-		listOutline as listIOS
+		listOutline as listIOS,
+		addOutline as addIOS
 	} from "ionicons/icons";
 
 	import calendarMD from "@material-design-icons/svg/outlined/calendar_month.svg";
 	import listMD from "@material-design-icons/svg/outlined/list.svg";
+	import addMD from "@material-design-icons/svg/outlined/add.svg";
+
 	import { appConfig } from '../../lib/config';
 	import { from, useObservable } from '@vueuse/rxjs';
 	import { liveQuery } from 'dexie';
@@ -58,7 +61,7 @@
 		handle();
 	});
 
-	async function showModal(clickedFrontingEntry: FrontingEntryComplete){
+	async function showModal(clickedFrontingEntry?: FrontingEntryComplete){
 		if(clickedFrontingEntry)
 			frontingEntry.value = {...clickedFrontingEntry};
 		else {
@@ -176,6 +179,12 @@
 					</IonItem>
 				</template>
 			</IonList>
+
+			<IonFab slot="fixed" vertical="bottom" horizontal="end">
+				<IonFabButton @click="showModal()">
+					<IonIcon :ios="addIOS" :md="addMD" />
+				</IonFabButton>
+			</IonFab>
 		</IonContent>
 
 		<FrontingEntryEdit :frontingEntry ref="frontingEntryModal" />

diff --git a/translations/en/options.json b/translations/en/options.json
@@ -22,7 +22,10 @@
 			"customStatus": "Custom status",
 			"startTime": "Start time",
 			"endTime": "End time",
-			"endTimeUnavailable": "To edit the end time, first remove this member from front",
+			"removeFromFront": {
+				"title": "Remove from front",
+				"desc": "You won't be able to undo this action after saving!"
+			},
 			"isMainFronter": "Main fronter?",
 			"delete": {
 				"title": "Delete fronting entry",