message page

src/components/loginView.tsx

@@ -0,0 +1,56 @@
+/**
+ * 通用 loginView 封装
+ */
+import React from 'react';
+import { View, Text, Image, Pressable, StyleSheet } from 'react-native';
+
+export const LoginView = () => {
+    return (
+        <View style={styles.login}>
+            <Image
+                style={styles.image}
+                source={ require('../static/img/login/transform.png') }
+            />
+            <Text style={styles.welcome}>使用推特登录 DeNet</Text>
+            <Pressable style={styles.button} onPress={goLogin}>
+                <Text style={styles.buttonText}>Login</Text>
+            </Pressable>
+        </View>
+    );
+};
+
+const goLogin = () => {
+}
+
+const styles = StyleSheet.create({
+    image: {
+        width: 264,
+        height: 100,
+        marginBottom: 39,
+    },
+    welcome: {
+        fontSize: 18,
+        marginBottom: 12,
+        fontWeight: 'bold',
+    },
+    login: {
+        flex: 1,
+        alignItems: 'center',
+        justifyContent: 'center',
+        backgroundColor: '#fff',
+    },
+	button: {
+        display: 'flex',
+        width: 335,
+        height: 46,
+		alignItems: 'center',
+		justifyContent: 'center',
+        backgroundColor: '#000',
+        borderRadius: 56,
+	},
+    buttonText: {
+        color: '#fff',
+        fontSize: 20,
+        fontWeight: 'bold',
+    }
+});

src/components/webview.tsx

@@ -6,10 +6,10 @@ import { WebView } from 'react-native-webview';
 
 interface Props {
 	uri: any;
-	onLoadEndHandle: () => void;
-	handleWebViewNavigationStateChange: (newNavState: { url: any }) => void;
+	onLoadEndHandle?: () => void;
+	handleWebViewNavigationStateChange?: (newNavState: { url: any }) => void;
 	onMessageHandle: (e: any) => void;
-	refHandle: (r: any) => any;
+	refHandle?: (r: any) => any;
 }
 export const DenetWebview = (props: Props) => {
 	return (

src/pages/navigations/message.tsx

@@ -1,12 +1,36 @@
-import React from 'react';
-import { Text, View } from 'react-native';
-
-const Message = () => {
-	return (
-		<View style={{ flex: 1 }}>
-			<Text>Message page</Text>
-		</View>
-	);
+import React, { Component } from 'react';
+import { LoginView } from '@/components/loginView';
+import { DenetWebview } from '@/components/webview';
+import { useLoginCom } from '@/components/useLogin';
+
+interface Props {
+	navigation: any;
+}
+
+const onMessage = async (event: any) => {
+	let { info, data } = (event.nativeEvent.data && JSON.parse(event.nativeEvent.data)) || {};
+	switch (info.actionType) {
+		case 'IFRAME_GET_EXTENSION_STORGE_DATA':
+			
+			break;
+	}
+}
+
+const Message = (props: Props) => {
+	const { isLogin, goTwitterAuthorize } = useLoginCom(props);
+
+	if (isLogin === false) {
+		return (
+			<LoginView></LoginView>
+		);
+	} else {
+		return (
+			<DenetWebview
+				onMessageHandle={onMessage}
+				uri="http://localhost:3000/nav-message?iframeID=de-nav-message-page&appVersionCode=23">
+			</DenetWebview>
+		);
+	}
 };
 
 export default Message;