diff --git a/src/routes/(app)/register/store.js b/src/routes/(app)/register/store.js index a80206e..89c7097 100644 --- a/src/routes/(app)/register/store.js +++ b/src/routes/(app)/register/store.js @@ -9,4 +9,6 @@ export const selectedLocation = writable({}); export const registrationData = writable({}); export const studentId1 = writable(); export const studentId2 = writable(); -export const singleLocker = writable(false); \ No newline at end of file +export const singleLocker = writable(false); + +export const editMode = writable(false); \ No newline at end of file diff --git a/src/routes/(app)/register/views/Final.svelte b/src/routes/(app)/register/views/Final.svelte index 396fa54..314eb16 100644 --- a/src/routes/(app)/register/views/Final.svelte +++ b/src/routes/(app)/register/views/Final.svelte @@ -5,7 +5,7 @@ import {quartOut} from "svelte/easing"; import {submitLockers} from "$lib/services/app/mainApi.js"; - import {singleLocker, registrationData, studentId1, studentId2, selectedLocation, pageView} from "../store.js"; + import {singleLocker, registrationData, studentId1, studentId2, selectedLocation, pageView, editMode} from "../store.js"; import {goto} from "$app/navigation"; @@ -41,6 +41,7 @@ function back(){ pageView.set(1); + editMode.set(true); } @@ -93,11 +94,14 @@ text-align: left; font-size: 14px; color: var(--text); - margin-bottom: 8px; + margin-top: 16px; } .selection-div { width: 352px; + display: flex; + align-items: center; + justify-content: center; } .submit { @@ -107,7 +111,7 @@ border: none; border-radius: 4px; font-weight: bold; - margin-top: 20px; + margin-top: 4px; cursor: pointer; transition-duration: 150ms; color: var(--text); @@ -117,6 +121,39 @@ background-color: #577db2; } + .item { + /*background-color: green;*/ + height: 40px; + display: flex; + align-items: center; + justify-content: left; + gap: 15px; + } + + .data-cont { + height: 40px; + width: 90px; + background-color: #17171c; + border-radius: 10px; + color: white; + display: flex; + align-items: center; + justify-content: center; + font-size: 18px; + border: 2px solid #005cb3; + } + + .text { + color: #d6d6d6; + font-size: 24px; + } + + .expand { + display: flex; + gap: 10px; + flex-direction: column; + } + .material-symbols-outlined { color: #d6d6d6; width: 24px; @@ -160,10 +197,24 @@
Confirm Locker Selection
-
Your locker is assigned randomly
-
+
+
+
+
{$selectedLocation.building}
+
Building
+
+
+
{$selectedLocation.floor}
+
Floor
+
+
+
{$selectedLocation.level}
+
Level
+
+
+
Your locker is assigned randomly
diff --git a/src/routes/(app)/register/views/Selection.svelte b/src/routes/(app)/register/views/Selection.svelte index 2c43964..3761ee6 100644 --- a/src/routes/(app)/register/views/Selection.svelte +++ b/src/routes/(app)/register/views/Selection.svelte @@ -3,7 +3,7 @@ import {writable} from "svelte/store"; import {slide} from "svelte/transition"; import {quartOut} from "svelte/easing"; - import {singleLocker, studentId1, studentId2, selectedLocation, pageView} from "../store.js"; + import {singleLocker, studentId1, studentId2, selectedLocation, pageView, editMode} from "../store.js"; import {fetchAvailableLockers} from "$lib/services/app/mainApi.js"; import Select from "$lib/components/app/Select.svelte"; @@ -17,14 +17,51 @@ let data2 = []; let data3 = []; + if(!$editMode){ + selectedLocation.set({ + building: "", + floor: "", + level: "" + }) + } + + // let value1 = $selectedLocation.building.toString(); + // let value2 = $selectedLocation.floor.toString(); + // let value3 = $selectedLocation.level.toString(); + let value1; let value2; let value3; + let lab1; + let lab2; + let lab3; + + // $: if(!load1 && !load2 && !load3){ + // console.log("loading") + // console.log($editMode); + // if ($editMode) { + // console.log(value1); + // value1.label = selectedLocation.building; + // value2.label = selectedLocation.floor; + // value3.label = selectedLocation.level; + // } + // } + async function fetchData() { areas = await fetchAvailableLockers(); // Update data1 based on fetched areas data1 = Object.keys(areas); + + // console.log($editMode); + // if ($editMode) { + // console.log($selectedLocation) + // value1.value = $selectedLocation.building.toString(); + // value2.value = $selectedLocation.floor.toString(); + // value3.value = $selectedLocation.level.toString(); + // } + + } async function next() { @@ -36,7 +73,15 @@ if (value3.label === "Single") singleLocker.set(true); console.log($selectedLocation); - pageView.set(2); + + if ($editMode) { + pageView.set(4); + editMode.set(false); + + } else { + pageView.set(2); + } + } onMount(async () => { diff --git a/src/routes/(app)/register/views/View2.svelte b/src/routes/(app)/register/views/View2.svelte index ee357fe..12f4524 100644 --- a/src/routes/(app)/register/views/View2.svelte +++ b/src/routes/(app)/register/views/View2.svelte @@ -101,7 +101,7 @@ } .stat-div { - width: 352px; + width: 100%; } .stat-1-subcont-1 {