work on frontend userdatainput behavior

ssciwr · Oct 18, 2024 · c79c449 · c79c449
1 parent 2f4f9f1
commit c79c449
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 61 deletions.
diff --git a/frontend/src/lib/components/UserDataInput.svelte b/frontend/src/lib/components/UserDataInput.svelte
@@ -1,41 +1,37 @@
 <script lang="ts">
-	import { goto } from '$app/navigation';
 	import AlertMessage from '$lib/components/AlertMessage.svelte';
 	import DataInput from '$lib/components/DataInput/DataInput.svelte';
 	import { preventDefault } from '$lib/util';
 	import { Button, Card, Heading } from 'flowbite-svelte';
+	import { CheckCircleOutline } from 'flowbite-svelte-icons';
 	import { _ } from 'svelte-i18n';
 
 	import {} from '$lib/client/services.gen';
 
-	function validate(): boolean {
-		missingValues = data.map((element) => element.value === '' || element.value === null);
-		return missingValues.every((v) => v === false);
-	}
-
 	async function submitData() {
-		const valid = validate();
-		if (valid) {
-			showAlert = false;
-			goto('/userLand/userLandingpage');
-		} else {
+		try {
+			// TODO: call the respective API function here to update the data
+			// TODO: add button icon and ok message
+			done = true;
+		} catch (error) {
 			showAlert = true;
+			alertMessage = $_('userData.alertMessageError') + ': ' + error.detail;
 		}
 	}
-	
+
 	// this can, but does not have to, come from a database later.
 	export let data: any[];
 
-	let missingValues = data.map(() => false);
-
-	let showAlert: boolean = true;
+	let showAlert: boolean = false;
+	let done: boolean = false;
+	let alertMessage = $_('userData.alertMessageMissing');
 </script>
 
 <!-- Show big alert message when something is missing -->
 {#if showAlert}
 	<AlertMessage
 		title={$_('userData.alertMessageTitle')}
-		message={$_('userData.alertMessageMissing')}
+		message={alertMessage}
 		onclick={() => {
 			showAlert = false;
 		}}
@@ -61,21 +57,33 @@
 					properties={element.props}
 					textTrigger={element.props.textTrigger}
 					eventHandlers={{
-						'on:change': element.onchange,
+						'on:change': () => {
+							done = false;
+							element?.onchange();
+						},
 						'on:blur': element.onblur,
 						'on:click': element.onclick
 					}}
 					additionalEventHandlers={{
-						'on:change': element.onchange,
+						'on:change': () => {
+							done = false;
+						},
 						'on:blur': element.onblur,
 						'on:click': element.onclick
 					}}
 				/>
 			{/each}
+			{#if done}
+				<div class="m-2 flex items-center justify-center p-2 text-gray-700 dark:text-gray-400">
+					<CheckCircleOutline size="xl" color="green" class="m-2" />
+					{$_('userData.submitSuccessMessage')}
+				</div>
+			{:else}
+				<Button
+					class="dark:bg-primay-700 bg-primary-700 hover:bg-primary-800 dark:hover:bg-primary-800 w-full text-center text-sm text-white hover:text-white"
+					type="submit">{$_('userData.submitButtonLabel')}</Button
+				>
+			{/if}
 		</form>
-		<Button
-			class="dark:bg-primay-700 w-full bg-primary-700 text-center text-sm text-white hover:bg-primary-800 hover:text-white dark:hover:bg-primary-800"
-			type="submit">{$_('userData.submitButtonLabel')}</Button
-		>
 	</Card>
 </div>
diff --git a/frontend/src/locales/de.json b/frontend/src/locales/de.json
@@ -79,7 +79,9 @@
 		"heading": "Benutzerdaten eingeben",
 		"alertMessageTitle": "Fehler",
 		"alertMessageMissing": "Bitte füllen Sie die benötigten Felder (hervorgehoben) aus.",
+		"alertMessageError": "Ein Fehler ist aufgetreten",
 		"submitButtonLabel": "Abschließen",
+		"submitSuccessMessage": "Vielen Dank!",
 		"yearOfBirth": {
 			"label": "Geburtsjahr",
 			"placeholder": "Bitte auswählen"

diff --git a/mondey_backend/src/mondey_backend/models/users.py b/mondey_backend/src/mondey_backend/models/users.py
@@ -6,7 +6,6 @@
 from sqlalchemy import Boolean
 from sqlalchemy import ForeignKey
 from sqlalchemy import Integer
-from sqlalchemy import String
 from sqlalchemy.orm import DeclarativeBase
 from sqlalchemy.orm import Mapped
 from sqlalchemy.orm import declared_attr
@@ -40,17 +39,3 @@ def user_id(cls) -> Mapped[int]:
         return mapped_column(
             Integer, ForeignKey("user.id", ondelete="cascade"), nullable=False
         )
-
-
-class ObserverData(Base):
-    id: Mapped[int] = mapped_column(Integer, primary_key=True)
-    birthYear: Mapped[int] = mapped_column(Integer, nullable=False)
-    gender: Mapped[str] = mapped_column(String(255), nullable=False)
-    education: Mapped[str] = mapped_column(String(255), nullable=False)
-    workingHours: Mapped[str] = mapped_column(String(255), nullable=False)
-    incomePerYear: Mapped[str] = mapped_column(String(255), nullable=False)
-    profession: Mapped[str] = mapped_column(String(255), nullable=False)
-    langid: Mapped[int] = mapped_column(Integer, nullable=False)
-    userid: Mapped[int] = mapped_column(
-        Integer, ForeignKey("user.id", ondelete="cascade"), nullable=False
-    )
diff --git a/mondey_backend/src/mondey_backend/routers/users.py b/mondey_backend/src/mondey_backend/routers/users.py
@@ -6,8 +6,6 @@
 from fastapi import HTTPException
 from fastapi import UploadFile
 from fastapi.responses import FileResponse
-from sqlmodel import col
-from sqlmodel import select
 
 from ..dependencies import CurrentActiveUserDep
 from ..dependencies import SessionDep
@@ -18,7 +16,6 @@
 from ..models.milestones import MilestoneAnswerPublic
 from ..models.milestones import MilestoneAnswerSession
 from ..models.milestones import MilestoneAnswerSessionPublic
-from ..models.users import ObserverData
 from ..models.users import UserRead
 from ..models.users import UserUpdate
 from ..settings import app_settings
@@ -33,27 +30,6 @@ def create_router() -> APIRouter:
     router = APIRouter(prefix="/users", tags=["users"])
     router.include_router(fastapi_users.get_users_router(UserRead, UserUpdate))
 
-    @router.get("/data/", response_model=ObserverData)
-    def get_userdata(session: SessionDep, current_active_user: CurrentActiveUserDep):
-        return ObserverData()
-
-    @router.post("/data/", response_model=ObserverData)
-    def create_userdata(session: SessionDep, current_active_user: CurrentActiveUserDep):
-        return ObserverData()
-
-    @router.put("/data/", response_model=ObserverData)
-    def update_userdata(session: SessionDep, current_active_user: CurrentActiveUserDep):
-        return ObserverData()
-
-    @router.get("/children/", response_model=list[ChildPublic])
-    def get_children(session: SessionDep, current_active_user: CurrentActiveUserDep):
-        return [
-            child
-            for child in session.exec(
-                select(Child).where(col(Child.user_id) == current_active_user.id)
-            ).all()
-        ]
-
     @router.post("/children/", response_model=ChildPublic)
     def create_child(
         session: SessionDep,