sidemenu and logout implemented!

lilyjeon13 · Nov 3, 2020 · 77b0b40 · 77b0b40
1 parent 9895e72
commit 77b0b40
Show file tree

Hide file tree

Showing 35 changed files with 457 additions and 956 deletions.
diff --git a/App.js b/App.js
@@ -6,22 +6,21 @@ import Enrollment from "./app/screens/Enrollment";
 import WritePettition from "./app/screens/WritePettition";
 import SimilarCaseAnalysis from "./app/screens/SimilarCaseAnalysis";
 import TerminologyExplanation from "./app/screens/TerminologyExplanation";
-import CaseBefore from "./app/screens/CaseBefore";
 import CaseView from "./app/screens/CaseView";
 import QnaList from "./app/screens/QnaList";
-import QnA from "./app/screens/QnA";
 import QaLawyer from "./app/screens/QaLawyer";
 import QaUser from "./app/screens/QaUser";
 import QaWrite from "./app/screens/QaWrite";
 import QaAnswer from "./app/screens/QaAnswer";
 import QnaView from "./app/screens/QnaView";
+import SideMenu from "./app/screens/SideMenu";
 import { NavigationContainer } from '@react-navigation/native';
 import { createStackNavigator } from '@react-navigation/stack';
-// import { createDrawerNavigator } from '@react-navigation/drawer';
+import { createDrawerNavigator } from '@react-navigation/drawer';
 import { MyContext, PRODUCTION_URL } from './context.js';
 
 const Stack = createStackNavigator();
-// const Drawer = createDrawerNavigator();
+const Drawer = createDrawerNavigator();
 
 export default class App extends Component {
   state = {
@@ -82,7 +81,7 @@ export default class App extends Component {
         updateToken: this.updateToken,
       }}>
         <NavigationContainer>
-          <Stack.Navigator initialRouteName={this.state.firstPage}>
+          {/* <Stack.Navigator initialRouteName={this.state.firstPage}>
             <Stack.Screen name="WelcomeScreen" component={WelcomeScreen} options={{ headerShown: false }} />
             <Stack.Screen name="Home" component={Home} options={{ headerShown: false }} />
             <Stack.Screen name="Enrollment" component={Enrollment} options={{ headerShown: false }} />
@@ -98,9 +97,22 @@ export default class App extends Component {
             <Stack.Screen name="QaUser" component={QaUser} options={{ headerShown: false }} />
             <Stack.Screen name="QaWrite" component={QaWrite} options={{ headerShown: false }} />
             <Stack.Screen name="QnaView" component={QnaView} options={{ headerShown: false }} />
-          </Stack.Navigator>
-          {/* <Drawer.Navigator>
-          </Drawer.Navigator> */}
+          </Stack.Navigator> */}
+          <Drawer.Navigator drawerContent={(props) => <SideMenu {...props}/>} initialRouteName={this.state.firstPage}>
+            <Drawer.Screen name="WelcomeScreen" component={WelcomeScreen} options={{ headerShown: false }} />
+            <Drawer.Screen name="Home" component={Home} options={{ headerShown: false }} />
+            <Drawer.Screen name="Enrollment" component={Enrollment} options={{ headerShown: false }} />
+            <Drawer.Screen name="WritePettition" component={WritePettition} options={{ headerShown: false }} />
+            <Drawer.Screen name="SimilarCaseAnalysis" component={SimilarCaseAnalysis} options={{ headerShown: false }} />
+            <Drawer.Screen name="TerminologyExplanation" component={TerminologyExplanation} options={{ headerShown: false }} />
+            <Drawer.Screen name="CaseView" component={CaseView} options={{ headerShown: false }} />
+            <Drawer.Screen name="QnaList" component={QnaList} options={{ headerShown: false }} />
+            <Drawer.Screen name="QaLawyer" component={QaLawyer} options={{ headerShown: false }} />
+            <Drawer.Screen name="QaAnswer" component={QaAnswer} options={{ headerShown: false }} />
+            <Drawer.Screen name="QaUser" component={QaUser} options={{ headerShown: false }} />
+            <Drawer.Screen name="QaWrite" component={QaWrite} options={{ headerShown: false }} />
+            <Drawer.Screen name="QnaView" component={QnaView} options={{ headerShown: false }} />
+          </Drawer.Navigator>
         </NavigationContainer>
       </MyContext.Provider>
     )

diff --git a/app/assets/aEmpty.png b/app/assets/aEmpty.png
diff --git a/app/assets/aFill.png b/app/assets/aFill.png
diff --git a/app/assets/caseFav.png b/app/assets/caseFav.png
diff --git a/app/assets/close.png b/app/assets/close.png
diff --git a/app/assets/close2.png b/app/assets/close2.png
diff --git a/app/assets/lawyerFav.png b/app/assets/lawyerFav.png
diff --git a/app/assets/myComment.png b/app/assets/myComment.png
diff --git a/app/assets/myPost.png b/app/assets/myPost.png
diff --git a/app/assets/qEmpty.png b/app/assets/qEmpty.png
diff --git a/app/assets/qFill.png b/app/assets/qFill.png
diff --git a/app/assets/qnaFav.png b/app/assets/qnaFav.png
diff --git a/app/assets/qnaFav2.png b/app/assets/qnaFav2.png
diff --git a/app/assets/scrap.png b/app/assets/scrap.png
diff --git a/app/screens/CaseBefore.js b/app/screens/CaseBefore.js
diff --git a/app/screens/CaseView.js b/app/screens/CaseView.js
@@ -18,6 +18,7 @@ import WebView from "react-native-webview";
 import { parse } from 'node-html-parser';
 
 import colors from "../config/colors";
+import Header from "./Header.js";
 
 export default class CaseView extends Component {
   state = {
@@ -115,14 +116,7 @@ export default class CaseView extends Component {
 
     return (
       <View style={styles.container}>
-        <View style={styles.header}>
-            <Image source={require("../assets/menu.png")} style={styles.menu} />
-            <Text style={styles.logoTitle} onPress={() => {this.props.navigation.navigate("Home")}}>LAWBOT</Text>
-            <Image
-                source={require("../assets/profile.png")}
-                style={styles.profile}
-            />
-        </View>
+        <Header {...this.props}/>
         <View style={styles.webViewContainer}>
           <WebView 
           source={{ uri: this.props.route.params.caseURL }}
@@ -162,18 +156,6 @@ const styles = StyleSheet.create({
     overflow: "hidden",
     backgroundColor: "#fff",
   },
-  logoTitle: {
-    fontSize: 20,
-    fontFamily: "SCDream8",
-  },
-  menu: {
-    width: 20,
-    height: 20,
-  },
-  profile: {
-    width: 20,
-    height: 20,
-  },
   body: {
     flex: 0.3,
     justifyContent: "center",
@@ -199,16 +181,6 @@ const styles = StyleSheet.create({
     textAlign: "center",
     padding: 10,
   },
-  header: {
-    backgroundColor: "#fff",
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-    paddingLeft: "5%",
-    paddingRight: "5%",
-    minHeight: 50,
-    zIndex: 1,
-  },
   terminologyButton: {
     alignItems: "center",
     backgroundColor: "#fff",

diff --git a/app/screens/Enrollment.js b/app/screens/Enrollment.js
@@ -15,6 +15,7 @@ import * as Font from "expo-font";
 import Constants from "expo-constants";
 import { MyContext } from "../../context.js";
 
+import Certification from "./Certification.js";
 import colors from "../config/colors";
 
 export default class Enrollment extends Component {
@@ -181,8 +182,11 @@ export default class Enrollment extends Component {
     let lenCheck = this.state.phone.length == 13;
     this.state.phoneValid = regEx.test(this.state.phone) && lenCheck;
   }
+
   confirmThisPhone(){
-    // 추후에 사업자 등록을 한다면 다날 가입을 통해서 IamPort 이용 본인인증 서비스 구현 필요 
+    // 추후에 사업자 등록을 한다면 다날 가입을 통해서 IamPort 이용 본인인증 서비스 구현 필요
+    console.log("here");
+    Certification({ navigation: this.props.navigation, name: this.state.name, phone: this.state.phone });
   }
 
   render() {

diff --git a/app/screens/Header.js b/app/screens/Header.js
@@ -0,0 +1,75 @@
+import React, {Component}from 'react';
+import {
+    Text,
+    View,
+    StyleSheet,
+    Image,
+    TouchableOpacity,
+  } from "react-native";
+import * as Font from "expo-font";
+import { DrawerActions } from '@react-navigation/drawer';
+
+import colors from "../config/colors";
+
+
+export default class Header extends Component {
+    state = {
+        fontsLoaded: false,
+    };
+
+    async _loadFonts() {
+      await Font.loadAsync({
+          SCDream8: require("../assets/fonts/SCDream8.otf"),
+          KPWDBold: require("../assets/fonts/KPWDBold.ttf"),
+          KPWDMedium: require("../assets/fonts/KPWDMedium.ttf")
+      });
+      this.setState({ fontsLoaded: true });
+    }
+
+    componentDidMount() {
+        this._loadFonts();
+    }
+
+    render() {
+        if (!this.state.fontsLoaded) {
+            return <View />;
+          }
+          return (
+            <View style={styles.header}>
+                <TouchableOpacity onPress={() => {this.props.navigation.openDrawer()}}>
+                    <Image source={require("../assets/menu.png")} style={styles.menu} />
+                </TouchableOpacity>
+                <Text style={styles.logoTitle} onPress={() => {this.props.navigation.navigate("Home")}} >LAWBOT</Text>
+                <Image
+                    source={require("../assets/profile.png")}
+                    style={styles.profile}
+                />
+            </View>
+          )
+    };
+}
+
+const styles=StyleSheet.create({
+    header: {
+        flexDirection: "row",
+        justifyContent: "space-between",
+        alignItems: "center",
+        paddingLeft: "5%",
+        paddingRight: "5%",
+        minHeight: 50,
+        backgroundColor: "#fff",
+        zIndex: 1,
+    },
+    logoTitle: {
+        fontSize: 20,
+        fontFamily: "SCDream8",
+    },
+    menu: {
+        width: 20,
+        height: 20,
+    },
+    profile: {
+        width: 20,
+        height: 20,
+    },
+});