Revize f8083631

re #10844: NoteViewPage: GetPlanAll redux implementation

src/api/planservice.ts

@@ +1 @@
+import { axiosInstance } from "./api"
+
+
+export const getPlanAllRequest = async () => {
+    return await axiosInstance.get(
+        `/plan/all`
+    )
+}
+
+export const getPlanListRequest = async () => {
+    return await axiosInstance.get(
+        `/plan/list`
+    )
+}
+
+export const getPlanItemsRequest = async (page: number, pageSize: number, room: number, place?: number) => {
+    let url = `search_v2?activeTab=0&tabbed=false&cursor=0&page=${page}&items=${pageSize}&room=${room}`
+
+    if(place){
+        url += `&place=${place}`
+    }
+
+    return await axiosInstance.get(
+        url
+    )
+}
+

src/pages/PlanViewPage.tsx

@@ -9 +9 @@
 import { Box, CloseIcon, Select, useToast, Button, Flex } from "native-base"
 import { ErrorToast } from "../components/toast/ErrorToast"
 import { Floor, Place, Room } from "../types/plan"
-
+import { getFloorList } from "../stores/actions/planThunks"
+import { login } from "../stores/actions/userThunks"
 
 const PlanViewPage = ({ route, navigation }: DrawerScreenProps<RootDrawerParamList, 'Plan'>) => {
 
   const layout = useWindowDimensions();
 
-  // // Route: set selected room / place from 
-  // useEffect(() => {
-  //   if (route.params.roomId) {
-  //     if (route.params.placeId) {
-  //       // todo
-  //     }
+    // Route: set selected room / place from 
+    useEffect(() => {
+        console.log("dispatching get floor list")
+        // dispatch(login({username: "Viktorie", password: "Golem123."}))
+        dispatch(getFloorList())
+    }, [])
+
 
-  //     // todo
-  //   }
-  // }, [route.params.roomId, route.params.placeId])
+  let page = 1
+  let pageSize = 20
+  let room = 0
 
   const DEFAULT_FLOOR = "first_floor"
 
@@ -40 +42 @@
 
   useEffect(() => {
     if (floorList && !selectedFloor) {
+      if (route.params && route.params.roomId) {
+
+        selectRoom(route.params.roomId)
+  
+        if (route.params.placeId) {
+          selectPlace(route.params.placeId)
+        }
+  
+        // todo dispatch get items
+        // getPlanItems(page, pageSize, room)
+      }
+      else{
         selectFloor(DEFAULT_FLOOR)
+      }
     }
-  }, [floorList])
+  }, [floorList, route.params.roomId, route.params.placeId])
 
   useEffect(() => {
     if (lastError) {
@@ -58 +73 @@
     }
   }, [lastError])
 
-  // // initial: load selected plan
-  // useEffect(() => {
-  //   dispatch(getItem(route.params.itemId));
-  //   log.debug("PlanViewPage", "useEffect", "getPlan", route.params.itemId);
-  // }, [route.params.itemId])
 
   const searchSubmit = () => {
     log.debug("PlanView", "searchSubmit")
@@ -137 +147 @@
       {/* Selection */}
 
       {
-      floorListLoading ?
-        <LoadingBox text="Floor list loading"></LoadingBox>
-        :
-        <>
-          {/* Floor */}
-          <Select
-            mt={2.5}
-            ml={2.5}
-            mr={2.5}
-
-            placeholder={"Floor"}
-            selectedValue={selectedFloor?.id}
-            onValueChange={selectFloor}
-            variant="rounded"
-          >
-            {floorList.map((floor, index) => {
-              return (
-                <Select.Item value={floor.id} label={floor.label} />
-              );
-            })}
-          </Select>
-
-          {/* Room */}
-          <Select
-            mt={2.5}
-            ml={2.5}
-            mr={2.5}
-
-            placeholder={"Room"}
-            selectedValue={selectedRoom?.id.toString()}
-            onValueChange={(value: string) => selectRoom(parseInt(value))}
-          variant="rounded"
-          >
-          {selectedFloor?.roomList?.map((room, index) => {
-            return (
-              <Select.Item value={room.id.toString()} label={room.label} />
-            );
-          })}
-        </Select>
-
-      {/* Place */}
-      <Select
-        mt={2.5}
-        ml={2.5}
-        mr={2.5}
-
-        placeholder={"Place"}
-        selectedValue={selectedPlace?.id.toString()}
-        onValueChange={(value: string) => selectPlace(parseInt(value))}
-        variant="rounded"
-      >
-        {selectedRoom?.places?.map((place, index) => {
-          return (
-            <Select.Item value={place.id.toString()} label={place.label} />
-          );
-        })}
-      </Select>
-
-      {/* Filter */}
-      <Flex direction="row" alignItems="center" justify="flex-end"
-        mt={2.5}
-        ml={2.5}
-        mr={3}
-      >
-        <Button
-          endIcon={
-            <CloseIcon size="xs" />
-          }
-          onPress={clearForm}
-          variant="outline"
-          color="primary.500"
-          borderColor="primary.100"
-          mr={2}
-          borderRadius={15}
-          size={"md"}
-        >
-          Reset
-        </Button>
-        <Button
-          onPress={() => searchSubmit()}
-          colorScheme="primary"
-          background={"primary.100"}
-          variant="solid"
-          borderRadius={15}
-          size={"md"}
-        >
-          Search
-        </Button>
-      </Flex>
-    </>
+        floorListLoading ?
+          <LoadingBox text="Floor list loading"></LoadingBox>
+          :
+          <>
+            {/* Floor */}
+            <Select
+              mt={2.5}
+              ml={2.5}
+              mr={2.5}
+
+              placeholder={"Floor"}
+              selectedValue={selectedFloor?.id}
+              onValueChange={selectFloor}
+              variant="rounded"
+            >
+              {floorList.map((floor, index) => {
+                return (
+                  <Select.Item value={floor.id} label={floor.label} />
+                );
+              })}
+            </Select>
+
+            {/* Room */}
+            {selectedFloor && selectedFloor.roomList && selectedFloor.roomList.length > 0 &&
+              < Select
+                mt={2.5}
+                ml={2.5}
+                mr={2.5}
+
+                placeholder={"Room"}
+                selectedValue={selectedRoom?.id.toString()}
+                onValueChange={(value: string) => selectRoom(parseInt(value))}
+                variant="rounded"
+              >
+                {selectedFloor?.roomList?.map((room, index) => {
+                  if (room.room_list) {
+                    return (
+                      <Select.Item value={room.id.toString()} label={room.label} />
+                    );
+                  }
+                })}
+              </Select>
+            }
+
+            {/* Place */}
+            {selectedRoom && selectedRoom.places && selectedRoom.places.length > 0 &&
+              <Select
+                mt={2.5}
+                ml={2.5}
+                mr={2.5}
+
+                placeholder={"Place"}
+                selectedValue={selectedPlace?.id.toString()}
+                onValueChange={(value: string) => selectPlace(parseInt(value))}
+                variant="rounded"
+              >
+                {selectedRoom?.places?.map((place, index) => {
+                  return (
+                    <Select.Item value={place.id.toString()} label={place.label} />
+                  );
+                })}
+              </Select>
+            }
+
+            {/* Filter */}
+            <Flex direction="row" alignItems="center" justify="flex-end"
+              mt={2.5}
+              ml={2.5}
+              mr={3}
+            >
+              <Button
+                endIcon={
+                  <CloseIcon size="xs" />
+                }
+                onPress={clearForm}
+                variant="outline"
+                color="primary.500"
+                borderColor="primary.100"
+                mr={2}
+                borderRadius={15}
+                size={"md"}
+              >
+                Reset
+              </Button>
+              <Button
+                onPress={() => searchSubmit()}
+                colorScheme="primary"
+                background={"primary.100"}
+                variant="solid"
+                borderRadius={15}
+                size={"md"}
+              >
+                Search
+              </Button>
+            </Flex>
+          </>
       }
 
 
 
-{/* Plan */ }
+      {/* Plan */}
 
 
-{/* Item List */ }
+      {/* Item List */}
 
-{/* <ItemPreview
+      {/* <ItemPreview
           // @ts-ignore
           caption={item.object[0].caption}
           title={item.text}

src/stores/actions/planThunks.ts

@@ +1 @@
+import { createAsyncThunk } from "@reduxjs/toolkit"
+import { SortOptions } from "../../types/general";
+import { Note } from "../../types/note";
+import { getPlanAllRequest } from "../../api/planservice";
+import { Floor, Room } from "../../types/plan";
+
+export const getFloorList = createAsyncThunk(
+    "plan/getFloorList",
+    async () => {
+        try {
+            try {
+                const response = await getPlanAllRequest()
+                if (response.status === 200) {
+
+                    let floorsDict: Record<string, Floor> = {
+                        "ground_floor": { label: "Ground floor", id: "ground_floor", roomList: [] },
+                        "first_floor": { label: "First floor", id: "first_floor", roomList: [] },
+                        "second_floor": { label: "Second floor", id: "second_floor", roomList: [] }
+                    }
+
+                    const unstructeredRoomList: Room[] = response.data
+
+                    unstructeredRoomList.map((room) => {
+                        if (room.floor in floorsDict) {
+                            floorsDict[room.floor].roomList.push(room)
+                        }
+                        else {
+                            floorsDict[room.floor] = { id: room.floor, label: room.floor, roomList: [room] }
+                        }
+                    }
+                    )
+
+                    let floorList = []
+
+                    for (let key in floorsDict) {
+                        let floor : Floor = floorsDict[key]
+                        floorList.push(floor)
+                    }
+
+                    return floorList
+                } else {
+                    return Promise.reject(response.data ? response.data : "Get plan all request failed")
+                }
+            } catch (err: any) {
+                return Promise.reject(err.response.data)
+            }
+
+        } catch (err: any) {
+            console.log(err);
+            return Promise.reject(err.response.data)
+        }
+    }
+)

src/stores/reducers/planSlice.ts

@@ -1 +1 @@
 import { PayloadAction, createSlice } from "@reduxjs/toolkit"
 import { PlanViewState } from "../../types/plan";
+import { getFloorList } from "../actions/planThunks";
 
 const initialState: PlanViewState = {
     lastError: "",
-   
+
 
 
     // TODO backend -> retrieve list of floors, not static -> not implemented at the time of coding
@@ -23 +24 @@
     initialState: initialState,
     reducers: {},
     extraReducers: (builder) => {
+
+        builder.addCase(getFloorList.fulfilled, (state, action) => {
+
+            state.floorList = action.payload
+            state.floorListLoading = false;
+        })
+        builder.addCase(getFloorList.pending, (state, action) => {
+            state.floorListLoading = true;
+        })
+        builder.addCase(getFloorList.rejected, (state, action) => {
+            state.floorListLoading = false;
+            state.lastError = action.error.message
+        })
     }
 })