.

src/i18n/ko.js

@@ -28,6 +28,9 @@ export default {
         About : "다붓컨설팅",
         Version : "Version",
 
+    },
+    AccountInfo : {
+        "UpdateyourAccountDetails" : "상세계정정보를 업데이트 하실수 있습니다."
     }
 
 

src/navigation/SwitchNavigator.js

@@ -12,11 +12,20 @@ import Guide1 from "../pages/_3_Guide1";
 import Guide2 from "../pages/_4_Guide2";
 import Root from "../pages/_5_Root";
 
+// setting 
 import Setting from "../pages/_10_Setting";
+import AccountInfo from "../popup/_10_1_AccountInfo";
+import Notice from "../popup/_10_2_Notice";
+import FAQ from "../popup/_10_3_FAQ";
+import ChangeLanguage from "../popup/_10_4_ChangeLanguage";
+import Support from "../popup/_10_5_Support";
+import ServiceAlarm from "../popup/_10_6_ServiceAlarm";
+import About from "../popup/_10_7_About";
+
 
 import TermsPopup from '../popup/_1_TermsPopup';
 
-const SwitchNavigator = createSwitchNavigator(
+const SwitchNavigator = createStackNavigator(
   {
     Login,
     AcceptTerms,
@@ -24,10 +33,21 @@ const SwitchNavigator = createSwitchNavigator(
     Guide2,
     Root,
     Setting,
+
+    AccountInfo,
+    Notice,
+    FAQ,
+    ChangeLanguage,
+    Support,
+    ServiceAlarm,
+    About,
     
   },
   {
-    initialRouteName: "Setting"
+    initialRouteName: "ServiceAlarm", 
+
+    mode: 'modal',
+    headerMode: 'none',
   }
 );
 

src/pages/_10_Setting.js

@@ -60,13 +60,18 @@ export default (props)=>{
 
 const ItemView = ( props) =>{
     let {itemKey , data} = props;
-    
+    let onClick = (p)=>{
+        // console.log(props.data.page);
+        props.navigation.navigate(props.data.page);
+
+    }
     console.log(itemKey);    
     return ( 
         <C.EL.ListItem cls="w100"
         title={i18n.t(`Setting.${itemKey}`)}
         subtitle={itemKey}
         leftIcon={ <C.EL.Icon {... data.Icon} raised />} 
+        onPress={onClick }
         >
                 {/* <C.EL.Icon />
             

src/popup/_10_1_AccountInfo.js

@@ -0,0 +1,71 @@
+import React from 'react';
+ 
+import i18n from  "i18n-js";
+import C from 'rn-class'
+
+export default (props)=>{
+    let {UpdateyourAccountDetails} = i18n.t("AccountInfo")
+    let userInfoArr =[ 
+                                        { key : "자유해결사"  , icon : {type:"antdesign" , name:"user" }} , 
+                                        { key : "test@gmail.com" , icon : {type:"material-community" , name:"email-outline" } } ,
+                                        { key : "testtest" , icon : {type:"material-community" , name:"lock-outline" }  , input : true } 
+                                    ]
+   
+    let closeFunc  = ()=>{
+        props.navigation.goBack();
+    }
+    return (
+        <C.View cls="flx1 bgc-color-white ai-c"> 
+          <C.EL.Header 
+            ccls="bgc-color-transparent" 
+            leftComponent={<C.EL.Icon type="antdesign" name="close" onPress={()=>props.navigation.goBack()}/>}  
+        >
+        </C.EL.Header>
+        <C.View cls="mt3">
+            <C.EL.Avatar  source={require("../res/header_bubble.png")}   size="xlarge" resizeMode="contain"  showEditButton rounded/>
+        </C.View>
+
+        <C.View cls="mt3">
+            <C.Text cls="f2.5">
+                {UpdateyourAccountDetails}
+            </C.Text> 
+            <C.Text  cls="f2.5">      
+            Update your Account Details
+            </C.Text>
+        </C.View>
+
+        {/* <C.View cls="mt2 w100% flx1 ai-c">   */}
+            {
+                userInfoArr.map((obj, i )=>{
+                    let {key, icon, input } = obj;
+                    return (
+                        <C.View key={`item_${i}`} cls="w90% h8 br5 mt3 flx-row ai-c"> 
+                            <C.EL.Icon {...icon} ccls="mh4" raised/>
+                            {
+                                input  ? (
+                                    <C.TextInput secureTextEntry  value={key} /> 
+                                ) : (
+                                    <C.Text>{key}</C.Text> 
+                                )
+                            }
+                        </C.View>
+                    )
+                })
+            }
+
+        {/* </C.View> */}
+
+        {/* <C.View cls="br19 bgc-test1">   
+
+        </C.View> */} 
+
+            {/* <C.EL.Button  title="goback">
+                 
+            </C.EL.Button> */}
+        </C.View>
+    )  
+
+
+}
+
+ 

src/popup/_10_2_Notice.js

@@ -0,0 +1,20 @@
+import React from 'react';
+ 
+import C from 'rn-class'
+
+export default (props)=>{
+    return (
+        <C.View cls="flx1 bgc-color-white"> 
+            <C.EL.Header 
+                ccls="bgc-color-transparent" 
+                leftComponent={<C.EL.Icon type="antdesign" name="close" onPress={()=>props.navigation.goBack()}/>}  
+            >
+            </C.EL.Header>
+            
+        </C.View>
+    )  
+
+
+}
+
+

src/popup/_10_3_FAQ.js

@@ -0,0 +1,13 @@
+import React from 'react';
+ 
+import C from 'rn-class'
+
+export default (props)=>{
+    return (
+        <C.View cls="flx1 bgc-color-white"> 
+        </C.View>
+    )  
+
+
+}
+

src/popup/_10_4_ChangeLanguage.js

@@ -0,0 +1,13 @@
+import React from 'react';
+ 
+import C from 'rn-class'
+
+export default (props)=>{
+    return (
+        <C.View cls="flx1 bgc-color-white"> 
+        </C.View>
+    )  
+
+
+}
+

src/popup/_10_5_Support.js

@@ -0,0 +1,13 @@
+import React from 'react';
+ 
+import C from 'rn-class'
+
+export default (props)=>{
+    return (
+        <C.View cls="flx1 bgc-color-white"> 
+        </C.View>
+    )  
+
+
+}
+

src/popup/_10_6_ServiceAlarm.js

@@ -0,0 +1,35 @@
+import React from 'react';
+ 
+import C from 'rn-class'
+
+export default (props)=>{
+    return (
+        <C.View cls="flx1 bgc-color-white"> 
+            <C.EL.Header 
+                    ccls="bgc-color-transparent" 
+                    leftComponent={<C.EL.Icon type="antdesign" name="close" onPress={()=>props.navigation.goBack()}/>}  
+                >
+                </C.EL.Header>
+                <C.View cls="flx1 jc-sa ai-c">
+                    <C.View  >
+                        <C.Text cls="f3 fw-b"> 
+                            컨텐츠 알람
+                        </C.Text>
+                        <C.Text cls="f2"> 
+                        Contents Alarm
+                        </C.Text>
+                    </C.View>
+                    <C.View cls="mt10"> 
+                        <C.Text>신규콘텐츠 등록</C.Text>
+                        <C.Text>오늘의 명언</C.Text>
+                        <C.Text>타임스케줄</C.Text>  
+                        
+                        {/* <C.EL.Button ccls="w90%"  btncls="br10" title="다붓컨설팅 홈페이지"></C.EL.Button> */}
+                    </C.View>
+                </C.View>
+        </C.View>
+    )  
+
+
+}
+

src/popup/_10_7_About.js

@@ -0,0 +1,31 @@
+import React from 'react';
+ 
+import C from 'rn-class'
+
+export default (props)=>{
+    return (
+        <C.View cls="flx1 bgc-color-white"> 
+            <C.EL.Header 
+                ccls="bgc-color-transparent" 
+                leftComponent={<C.EL.Icon type="antdesign" name="close" onPress={()=>props.navigation.goBack()}/>}  
+            >
+            </C.EL.Header>
+            <C.View cls="flx1 jc-sa ai-c">
+                <C.View  >
+                    <C.Text cls="f3 fw-b"> 
+                    다붓컨설팅
+                    </C.Text>
+                    <C.Text cls="f2"> 
+                    www.dabut.co.kr
+                    </C.Text>
+                </C.View>
+                {/* <C.View cls="mt10">  */}
+                    <C.EL.Button ccls="w90%"  btncls="br10" title="다붓컨설팅 홈페이지"></C.EL.Button>
+                {/* </C.View> */}
+            </C.View>
+        </C.View>
+    )  
+
+
+}
+