.

backend/IT18256888/app.py

@@ -124,8 +124,20 @@ def add_result():
     db.session.commit()
     return result_schema.jsonify(results)
 
+#GET method
+@app.route('/el_result', methods = ['GET'])
+def get_articles():
+    all_results = MemoryResults.query.with_entities(MemoryResults.name, MemoryResults.time_duration, MemoryResults.result).all()
+    return all_results
+    # results = results_schema.dump(all_results)
+    # return jsonify(results)
+    # qry = 'SELECT name,time_duration,result FROM memory_results'
+    # new = jsonify(get_data(qry))
+    # return make_response(new)
+
+
 #run the flask file
 if __name__ == "__main__":
     # app.run(debug=True)
     # app.run(host='192.168.8.101')
-    app.run(host='0.0.0.0', port=5000)
+    app.run(host='0.0.0.0')

frontend/src/component/memory/ResultTable.js

+import React, {useEffect, useState} from 'react';
+import {View, StyleSheet, ScrollView} from 'react-native';
+import {
+  Table,
+  TableWrapper,
+  Row,
+  Rows,
+  Col,
+} from 'react-native-table-component';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import Client from '../../screen/client/Client';
+import {fonts} from 'react-native-elements/dist/config';
+import {color} from 'react-native-reanimated';
+import endpoint from '../../constants/endpoint';
+import axios from 'axios';
+
+export default function TableList() {
+  const [tableData, setTableData] = useState({
+    tableHead: [],
+    data: [],
+  });
+  const [loading, setIsLoading] = useState(true);
+
+//   useEffect(() => {
+//     AsyncStorage.getItem('userId')
+//       .then(userId => {
+//         getReadResult(userId);
+//       })
+//       .catch(error => {
+//         console.log(error);
+//       });
+//   }, []);
+
+//   function getReadResult(userId) {
+//     const data = {
+//       userId: userId,
+//     };
+//     Client.get('result/' + userId)
+//       .then(response => {
+//         setTableData({
+//           tableHead: ['Word', 'Try Count', 'Level'],
+//           data: response.data.data,
+//         });
+//       })
+//       .catch(err => {
+//         console.log(err);
+//       });
+//   }
+
+//   useEffect(() => {
+//     // getResult(userId);
+//   }, []);
+const loadData = () => {
+    axios(`${endpoint}/el_result`,{
+        method: 'GET'
+    })
+    .then(result => {
+        console.log('terra',result.data);
+        // setTableData({
+        //   tableHead: ['Name', 'Time Duration', 'Level'],
+        //   data: result.data
+        // });
+      })
+    .catch(error => console.log(error))
+}
+
+useEffect(()=>{
+    loadData();
+},[]);
+
+  return (
+    <ScrollView>
+      <View style={styles.container}>
+        <Table borderStyle={{borderWidth: 3, borderColor: '#fff'}}>
+          <Row
+            data={tableData.tableHead}
+            flexArr={[ 1, 1.4, 1.3]}
+            style={styles.head}
+            textStyle={styles.text}
+          />
+          <TableWrapper style={styles.wrapper}>
+            <Rows
+              data={tableData.data}
+              flexArr={[1, 1.4, 1.3]}
+              style={styles.row}
+              textStyle={styles.text}
+            />
+          </TableWrapper>
+        </Table>
+      </View>
+    </ScrollView>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 0,
+    paddingTop: 40,
+    paddingLeft: 60,
+    paddingRight: 60,
+    marginTop: 0,
+  },
+  head: {height: 60, backgroundColor: 'green'},
+  wrapper: {
+    flexDirection: 'row',
+    backgroundColor: '#f1f8ff',
+  },
+  title: {flex: 1},
+  row: {height: 40},
+  text: {textAlign: 'center', fontSize: 20, color: 'black'},
+});

frontend/src/component/reading/TableList.js

@@ -36,7 +36,7 @@ export default function TableList() {
       .then(response => {
         setTableData({
           tableHead: ['Word', 'Try Count', 'Level'],
-          data: response.data.data,
+          data: response.data,
         });
       })
       .catch(err => {

frontend/src/router/router.js

@@ -64,16 +64,18 @@ import AdvanceGameScreenFiveAll from '../screen/memory/advance/AdvanceGameScreen
 import AdvanceGameScreenSix from '../screen/memory/advance/AdvanceGameScreenSix';
 import AdvanceGameScreenSixAll from '../screen/memory/advance/AdvanceGameScreenSixAll';
 import GameOverScreen from '../screen/memory/GameOverScreen';
-import MemoryResult from '../screen/memory/MemoryResult';
+import MemoryResult from '../screen/memory/Results/ElementryResults';
 import GameLevel from '../screen/memory/GameLevel';
 import MediumLevelStart from '../screen/memory/MediumLevelStart';
 import AdvanceLevelStart from '../screen/memory/AdvanceLevelStart';
+import ResultCategory from '../screen/memory/ResultCategory';
 
 import Sam from '../screen/sample/sam';
 import Progress from '../screen/Progress';
 import ReadActivityFish from '../screen/reading/advanced/ReadActivityFish';
 import ReadActivityDog from '../screen/reading/advanced/ReadActivityDog';
 import ReadResults from '../screen/reading/result/ReadResults';
+import ElementryResults from '../screen/memory/Results/ElementryResults';
 
 const Stack = createNativeStackNavigator();
 
@@ -199,6 +201,11 @@ const AppRouter = () => {
           name="ReadResults"
           component={ReadResults}
         />
+        <Stack.Screen
+          options={{headerShown: false}}
+          name="ElementryResults"
+          component={ElementryResults}
+        />
         <Stack.Screen
           options={{headerShown: false}}
           name="ColorResult"
@@ -313,6 +320,16 @@ const AppRouter = () => {
             headerStyle: {backgroundColor: '#5fcf93'},
           }}
         />
+        <Stack.Screen
+          name="ResultCategory"
+          component={ResultCategory}
+          options={{
+            headerShown: true,
+            title: 'Levels',
+            headerTintColor: 'white',
+            headerStyle: {backgroundColor: '#5fcf93'},
+          }}
+        />
         <Stack.Screen
           name="MediumLevelStart"
           component={MediumLevelStart}

frontend/src/screen/memory/GameList.js

@@ -29,7 +29,7 @@ const GameList = ({navigation}) => {
                 <Item
                   title='Flag'
                   iconName='flag'
-                  onPress={()=>{navigation.navigate('MemoryResult')}}
+                  onPress={()=>{navigation.navigate('ResultCategory')}}
                 />
               </HeaderButtons>
             )

frontend/src/screen/memory/GameOverScreen.js

@@ -28,7 +28,7 @@ const GameOverScreen = ({navigation}) => {
                 <Item
                   title='Flag'
                   iconName='flag'
-                  onPress={()=>{navigation.navigate('MemoryResult')}}
+                  onPress={()=>{navigation.navigate('ResultCategory')}}
                 />
               </HeaderButtons>
             )

frontend/src/screen/memory/ResultCategory.js

+import { Center, Column, Row } from 'native-base';
+import React, {useState} from 'react';
+import {Text, View, StyleSheet, Button, ScrollView, Image,ImageBackground, TouchableOpacity, Modal, Alert, Pressable} from 'react-native';
+import MainButton from '../../component/memory/MainButton';
+import { useDispatch, useSelector } from 'react-redux'; 
+import { Icon } from 'react-native-elements';
+
+const ResultCategory = ({navigation}) => {
+    const [modalVisible, setModalVisible] = useState(false);
+    const [mediumModalVisible, setMediumModalVisible] = useState(false);
+
+    const status = useSelector(state=>state.memory.is_passed.status);
+    const level = useSelector(state=>state.memory.is_passed.level);
+
+    console.log(status);
+    console.log(level);
+
+    React.useEffect(() => {
+      const unsubscribe = navigation.addListener('focus', () => {
+
+      });
+      return unsubscribe;
+    }, [navigation]);
+
+    return (
+        <ScrollView>
+            <View style={{ marginBottom: 20 }}>
+                    <View style={styles.gameItemRow}>
+                        <ImageBackground source={{ uri: 'https://cdn.pixabay.com/photo/2014/09/21/21/31/flowers-455591_960_720.jpg' }}
+                            style={styles.image}>
+                            {/* <Text style={styles.title}>Play Memo</Text> */}
+                            <View style={styles.titleContainer}>
+                                <Text style={styles.title} numberOfLines={1}> Results</Text>
+                            </View>
+                        </ImageBackground>
+                    </View>
+            </View>
+            <View style={styles.screen} >
+                <MainButton styles={styles.elementryBtn} onPress={()=>{navigation.navigate('ElementryResults')}}>
+                <Icon name="unlock-alt" type="font-awesome" size={36} color="white" />     Elementry 
+                </MainButton>
+                <MainButton styles={styles.mediumBtn} onPress={()=>{}}>
+                {/* navigation.navigate('MediumLevelStart') */}
+                <Icon name="unlock-alt" type="font-awesome" size={36} color="white" />     Medium
+                </MainButton>
+                <MainButton styles={styles.advanceBtn} onPress={()=>{}}>
+                <Icon name="lock" type="font-awesome" size={36} color="white" />     Advance
+                </MainButton>
+            </View>
+        </ScrollView>
+        // <View style={styles.screen} >
+        //     <View style={styles.levelWrapper}>
+        //         <View style={styles.levelContainer}>
+        //             <Button style={styles.btn} title='Elementry' onPress={()=>{navigation.navigate('StartGameScreen')}} />
+        //             <Button style={styles.btn} title='Medium' onPress={()=>{navigation.navigate('MediumLevelStart')}} />
+        //             <Button style={styles.btn} title='Advance' onPress={()=>{navigation.navigate('AdvanceLevelStart')}} />
+        //         </View>
+        //     </View>
+        // </View>
+    );
+}
+
+const styles = StyleSheet.create({
+    screen: {
+        flex: 1,
+        padding: 30
+    },
+    levelContainer: {
+        maxWidth: '100%',
+        height: '60%',
+        flexDirection: 'column',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        paddingHorizontal: 30
+    },
+    levelWrapper: {
+        width: '100%',
+        justifyContent: 'center',
+        alignItems: 'center'
+    },
+    elementryBtn: {
+        backgroundColor: '#6dce99'
+    },
+    mediumBtn: {
+        backgroundColor: '#4285F4'
+    },
+    advanceBtn: {
+        backgroundColor: '#DB4437'
+    },
+    image: {
+        height: 250,
+        width: '100%',
+    },
+    title: {
+        color: 'white',
+        fontWeight: 'bold',
+        fontSize: 30,
+        textAlign: 'center',
+    },
+    titleContainer: {
+        position: 'absolute',
+        padding: 20,
+        backgroundColor: 'rgba(0,0,0,0.5)',
+        bottom: 0,
+        width: '100%'
+      },
+      bgImage: {
+        height: '100%',
+        width: '100%',
+        justifyContent: 'flex-end'
+      },
+      gameItemRow: {
+        flexDirection: 'row',
+    },
+
+    centeredView: {
+        flex: 1,
+        justifyContent: "center",
+        alignItems: "center",
+        marginTop: 22
+      },
+      modalView: {
+        margin: 20,
+        backgroundColor: "white",
+        borderRadius: 20,
+        padding: 35,
+        alignItems: "center",
+        shadowColor: "#000",
+        shadowOffset: {
+          width: 0,
+          height: 2
+        },
+        shadowOpacity: 0.25,
+        shadowRadius: 4,
+        elevation: 5
+      },
+      button: {
+        borderRadius: 20,
+        padding: 10,
+        elevation: 2,
+        marginHorizontal: 10
+      },
+      buttonOpen: {
+        backgroundColor: "#F194FF",
+      },
+      buttonClose: {
+        backgroundColor: "#2196F3",
+      },
+      textStyle: {
+        color: "white",
+        fontWeight: "bold",
+        textAlign: "center",
+        fontSize: 20
+      },
+      modalText: {
+        marginBottom: 15,
+        textAlign: "center",
+        fontSize: 20
+      },
+      modalTextBold: {
+        marginBottom: 15,
+        textAlign: "center",
+        fontSize: 20,
+        fontWeight: 'bold'
+      }
+});
+
+export default ResultCategory;
+

frontend/src/screen/memory/MemoryResult.js → frontend/src/screen/memory/Results/ElementryResults.js

@@ -36,10 +36,19 @@ import Orientation from 'react-native-orientation-locker';
 import {useNavigation} from '@react-navigation/native';
 // import BackButton from '../../../component/BackButton';
 
-import TableList from '../../component/reading/TableList';
-import { ImagePaths } from '../../assets/read/data/ReadData';
+// import TableList from '../../component/reading/TableList';
+import ResultTable from '../../../component/memory/ResultTable';
+import { ImagePaths } from '../../../assets/read/data/ReadData';
 
-export default function ReadResults() {
+import {
+  Table,
+  TableWrapper,
+  Row,
+  Rows,
+  Col,
+} from 'react-native-table-component';
+
+export default function ElementryResults() {
   const navigation = useNavigation();
 
   React.useEffect(() => {
@@ -86,8 +95,7 @@ export default function ReadResults() {
           </View>
           <View style={styles.imageContainer}>
             {/* <View > */}
-
-            <TableList />
+            <ResultTable/>
             {/* </View> */}
           </View>
           <View>