8-28

Junhyeong1107 · Aug 28, 2023 · 3248639 · 3248639
1 parent 381c22e
commit 3248639
Show file tree

Hide file tree

Showing 8 changed files with 298 additions and 33 deletions.
diff --git a/App.js b/App.js
@@ -17,6 +17,10 @@ import BoardScreen from "./screens/Board/BoardScreen";
 import UploadScreen from "./screens/Board/UploadScreen";
 import CameraScreen from "./screens/Board/CameraScreen";
 
+import Best_user from "./screens/Complain/best_user";
+import Cctv from "./screens/Complain/cctv";
+import Complain_fac from "./screens/Complain/complain_fac";
+
 import { AuthProvider, useAuth } from "./AuthContext";
 
 const Tab = createBottomTabNavigator();
@@ -116,8 +120,8 @@ export default function App() {
             )}
           </Tab.Screen>
           <Tab.Screen
-            name="키우기"
-            component={DogScreen}
+            name="추천시설"
+            component={FacilityScreen}
             options={{
               headerShown: false,
               tabBarIcon: ({ focused }) => (
@@ -127,17 +131,43 @@ export default function App() {
           />
           <Tab.Screen
             name="민원"
-            component={ComplainScreen}
             options={{
               headerShown: false,
               tabBarIcon: ({ focused }) => (
                 <TabBarIcon focused={focused} iconName="게시판" />
               ),
             }}
-          />
+          >
+            {() => (
+              <Stack.Navigator>
+                <Stack.Screen
+                  name="complain_fac"
+                  component={Complain_fac}
+                  options={{
+                    headerTitle: "민원 화면", // 네비게이션 바 타이틀
+                  }}
+                />
+                <Stack.Screen
+                  name="cctv"
+                  component={Cctv}
+                  options={{
+                    headerTitle: "CCTV 화면", // 네비게이션 바 타이틀
+                  }}
+                />
+                <Stack.Screen
+                  name="best_user"
+                  component={Best_user}
+                  options={{
+                    headerTitle: "베스트 유저 화면", // 네비게이션 바 타이틀
+                  }}
+                />
+              </Stack.Navigator>
+            )}
+          </Tab.Screen>
           <Tab.Screen
             name="내 정보"
             options={{
+              headerShown: false,
               tabBarIcon: ({ focused }) => (
                 <TabBarIcon focused={focused} iconName="마이" />
               ),

diff --git a/assets/point_background.jpeg b/assets/point_background.jpeg
diff --git a/screens/Complain/best_user.js b/screens/Complain/best_user.js
@@ -0,0 +1,43 @@
+import React from "react";
+import { useNavigation } from "@react-navigation/native";
+import { View, Text, StyleSheet, ScrollView, Button } from "react-native";
+
+function Best_user() {
+  const navigation = useNavigation();
+
+  return (
+    <View>
+      {/* 버튼을 클릭하여 cctv 화면으로 이동 */}
+      <View style={styles.navi}>
+        <Button
+          style={styles.navi_btn}
+          title="시설보수"
+          onPress={() => navigation.navigate("complain_fac")}
+        />
+        <Button
+          style={styles.navi_btn}
+          title="CCTV"
+          onPress={() => navigation.navigate("cctv")}
+        />
+        <Button
+          style={styles.navi_btn}
+          title="우수 유저"
+          onPress={() => navigation.navigate("best_user")}
+        />
+      </View>
+      {/* 나머지 컴포넌트 내용 */}
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  navi: {
+    flexDirection: "row",
+    justifyContent: "space-around",
+    padding: 5,
+    borderBottomWidth: 1,
+    borderBottomColor: "gray",
+  },
+});
+
+export default Best_user;
diff --git a/screens/Complain/cctv.js b/screens/Complain/cctv.js
@@ -0,0 +1,42 @@
+import React from "react";
+import { useNavigation } from "@react-navigation/native";
+import { View, Text, StyleSheet, ScrollView, Button } from "react-native";
+
+function Cctv() {
+  const navigation = useNavigation();
+
+  return (
+    <View>
+      {/* 버튼을 클릭하여 cctv 화면으로 이동 */}
+      <View style={styles.navi}>
+        <Button
+          style={styles.navi_btn}
+          title="시설보수"
+          onPress={() => navigation.navigate("complain_fac")}
+        />
+        <Button
+          style={styles.navi_btn}
+          title="CCTV"
+          onPress={() => navigation.navigate("cctv")}
+        />
+        <Button
+          style={styles.navi_btn}
+          title="우수 유저"
+          onPress={() => navigation.navigate("best_user")}
+        />
+      </View>
+      {/* 나머지 컴포넌트 내용 */}
+    </View>
+  );
+}
+const styles = StyleSheet.create({
+  navi: {
+    flexDirection: "row",
+    justifyContent: "space-around",
+    padding: 5,
+    borderBottomWidth: 1,
+    borderBottomColor: "gray",
+  },
+});
+
+export default Cctv;
diff --git a/screens/Complain/complain_fac.js b/screens/Complain/complain_fac.js
@@ -0,0 +1,42 @@
+import React from "react";
+import { useNavigation } from "@react-navigation/native";
+import { View, Text, StyleSheet, ScrollView, Button } from "react-native";
+
+function Complain_fac() {
+  const navigation = useNavigation();
+
+  return (
+    <View>
+      {/* 버튼을 클릭하여 cctv 화면으로 이동 */}
+      <View style={styles.navi}>
+        <Button
+          style={styles.navi_btn}
+          title="시설보수"
+          onPress={() => navigation.navigate("complain_fac")}
+        />
+        <Button
+          style={styles.navi_btn}
+          title="CCTV"
+          onPress={() => navigation.navigate("cctv")}
+        />
+        <Button
+          style={styles.navi_btn}
+          title="우수 유저"
+          onPress={() => navigation.navigate("best_user")}
+        />
+      </View>
+      {/* 나머지 컴포넌트 내용 */}
+    </View>
+  );
+}
+const styles = StyleSheet.create({
+  navi: {
+    flexDirection: "row",
+    justifyContent: "space-around",
+    padding: 5,
+    borderBottomWidth: 1,
+    borderBottomColor: "gray",
+  },
+});
+
+export default Complain_fac;
diff --git a/screens/MyPage/LoggedInMyPage.js b/screens/MyPage/LoggedInMyPage.js
@@ -14,8 +14,15 @@ const MenuItem = ({ title, onPress }) => {
 
 const LoggedInMyPage = () => {
   const navigation = useNavigation();
-  const { isLoggedIn, handleLoggedout, userEmail } = useAuth();
-
+  const {
+    isLoggedIn,
+    handleLoggedout,
+    userEmail,
+    userPoints,
+    handleUserPoint,
+    handleUserPoint_reset,
+  } = useAuth();
+  const maxExperience = 100; // 최대 경험치 값
   const handleSettingsPress = () => {
     navigation.navigate("Settings");
   };
@@ -40,13 +47,20 @@ const LoggedInMyPage = () => {
           />
         </View>
         <View style={styles.info_lv3}>
-          <Text style={styles.info_text}>[닉네임]</Text>
-        </View>
-        <View style={styles.info_lv4}>
-          <Text style={[styles.info_text, styles.info_deco_point]}>
-            내 포인트 [포인트]p
-          </Text>
+          <Text style={styles.info_text}>{userEmail}</Text>
         </View>
+        {isLoggedIn ? (
+          <View style={{ alignItems: "center" }}>
+            <View style={styles.progressContainer}>
+              <View style={[styles.progressBar, { width: `${userPoints}%` }]} />
+              <Text style={styles.text}>
+                {userPoints % 100} / {maxExperience}
+              </Text>
+            </View>
+          </View>
+        ) : (
+          <Text style={{ heihgt: 30 }}>로그인 후 이용하세요</Text>
+        )}
       </View>
       <View style={styles.split_box}></View>
       <View style={styles.my_navi}>
@@ -93,6 +107,16 @@ const LoggedInMyPage = () => {
           <Text>고객센터</Text>
         </View>
       </View>
+      <View>
+        <View style={styles.navi_row}>
+          <Icon
+            name="check"
+            size={20}
+            style={{ marginRight: 10, color: "#487548" }}
+          />
+          <Text onPress={handleLoggedout}>로그아웃</Text>
+        </View>
+      </View>
     </View>
   );
 };
@@ -144,6 +168,26 @@ const styles = StyleSheet.create({
     borderBottomColor: "#487548", // red color
     alignItems: "center",
   },
+  progressContainer: {
+    width: "80%",
+    height: 30,
+    width: 200,
+    backgroundColor: "#ccc",
+    borderRadius: 15,
+    overflow: "hidden",
+    justifyContent: "center",
+    marginBottom: 20,
+  },
+  progressBar: {
+    height: "100%",
+    backgroundColor: "blue",
+  },
+  text: {
+    alignSelf: "center",
+    position: "absolute",
+    fontWeight: "bold",
+    color: "white",
+  },
 });
 
 export default LoggedInMyPage;