feat:更新tabbar及操作退出

android @ 929c05f7

-Subproject commit cfa005dd4b3902d32a52ef4eeaffb20ada906c4d
+Subproject commit 929c05f7153e671b5ff1577df02add97871ebf94

src/App.js

 import React from 'react'
 import AppRouter from './router'
 
-const App = () => <AppRouter />
+const App = (props) => {
+  const { path } = props;
+  return <AppRouter path={path} />
+}
 
 export default App

src/assets/images/index.js

 
-export const IC_LAUNCHER = require('../images/ic_launcher.png')
-export const IC_WARN = require('../images/ic_warn.png')
+export const IC_LAUNCHER = require('../images/ic_launcher.png');
+export const IC_WARN = require('../images/ic_warn.png');
+export const IC_BACK_BLACK = require('../images/ic_back_black.png');

src/components/Tabbar/index.js

+import React from 'react'
+import { View, Text, TouchableHighlight, Image, NativeModules } from 'react-native';
+import styles from './style';
+import { IC_BACK_BLACK } from '../../assets/images';
+const { BMCAction: { exit } } = NativeModules;
+
+
+const AppTabBar = ({ title }) => {
+  const handleBack = () => {
+    exit();
+  };
+
+  return (
+    <View style={styles.container}>
+      <Text style={styles.title}>{title}</Text>
+
+      <TouchableHighlight style={styles.back} onPress={handleBack}>
+        <View style={styles.btn}>
+          <Image source={IC_BACK_BLACK} style={styles.backBtn} />
+        </View>
+      </TouchableHighlight>
+    </View>
+  )
+}
+
+export default AppTabBar

src/components/Tabbar/style.js

+import { StyleSheet } from 'react-native';
+
+
+export default StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    marginBottom: 12,
+    height: 50,
+    backgroundColor: '#fff',
+    alignItems: 'center',
+    paddingLeft: 12,
+    paddingRight: 12,
+  },
+  title: {
+    position: 'relative',
+    width: '100%',
+    flexDirection: 'row',
+    textAlign: 'center',
+    justifyContent: 'center',
+    fontSize: 16,
+    color: '#000',
+  },
+  back: {
+    position: 'absolute',
+    left: 16,
+    top: 16,
+  },
+  backBtn: {
+    width: 16,
+    height: 16,
+  },
+});
+

src/components/tabbar/index.js

-import React from 'react'
-import { View, Text } from 'react-native'
-
-const AppTabBar = () => {
-  return (
-    <View>
-      <Text></Text>
-    </View>
-  )
-}
-
-export default AppTabBar

src/pages/ChangeNickname/index.js

@@ -4,11 +4,12 @@
  * */
 
 import React, { useEffect, useState } from 'react'
-import { TextInput, Text, TouchableHighlight, View, NativeModules } from 'react-native';
+import { TextInput, Text, TouchableHighlight, View, NativeModules, StatusBar, Platform } from 'react-native';
+import Tabbar from '../../components/Tabbar';
 import { user as userServices } from '../../services';
 import styles from './style';
 
-const { BMCInfo: { getUserInfo }, BMCUI } = NativeModules;
+const { BMCInfo: { getUserInfo }, BMCUI, BMCAction: { exit } } = NativeModules;
 
 const Equipment = () => {
   const [nickname, setNickName] = useState('');
@@ -26,6 +27,7 @@ const Equipment = () => {
     if (/^[\w\d_-]{4,20}$/.test(nickName)) {
       const data = await userServices.setNickName({ nickname });
       BMCUI.show('修改昵称成功！');
+      exit();
     } else {
       BMCUI.show('昵称不合法！');
     }
@@ -33,6 +35,7 @@ const Equipment = () => {
 
   return (
     <View style={styles.container}>
+      <Tabbar title="修改昵称" />
       <View>
         <TextInput
           style={styles.input}

src/pages/ChangeNickname/style.js

@@ -3,7 +3,6 @@ import { StyleSheet } from 'react-native';
 
 export default StyleSheet.create({
   container: {
-    marginTop: 12,
   },
   input: {
     width: '100%',

src/pages/Equipment/index.js

@@ -5,10 +5,11 @@
 
 import React, { useEffect, useState } from 'react'
 import { ScrollView, View, Text, SafeAreaView, NativeModules, FlatList } from 'react-native';
+import Tabbar from '../../components/Tabbar';
 import { equiment as equimentServices } from '../../services';
 import styles from './style';
 
-const { BMCInfo: { getLoginInfo } } = NativeModules;
+const { BMCInfo: { getLoginInfo }, BMCUI } = NativeModules;
 
 const Equipment = () => {
   const [equimentList, setEquimentList] = useState([]);
@@ -21,13 +22,14 @@ const Equipment = () => {
      const data = await equimentServices.getArticleList();
      setEquimentList(data[0].devices || []);
    } catch (e) {
-     console.log('e', e);
+     BMCUI.show('e');
    }
   };
 
   return (
     <SafeAreaView>
-      <ScrollView style={styles.container}>
+      <View style={styles.container}>
+        <Tabbar title="常用设备" />
         <Text style={styles.tip}>
           标题文字点击无反馈，文字超长则隐藏，文字超长则隐藏
         </Text>
@@ -46,7 +48,7 @@ const Equipment = () => {
             }}
           />
         </View>
-      </ScrollView>
+      </View>
     </SafeAreaView>
   )
 };

src/router/index.js

@@ -6,19 +6,28 @@ import ChangeNickname from '../pages/ChangeNickname'
 
 const Stack = createStackNavigator();
 
-function AllStack() {
+const pathMap = {
+  '/equiment': 'equiment',
+  '/changeNickname': 'changeNickname',
+};
+
+function AllStack(props) {
+  const { path } = props;
+  console.log('pathMap[path]', pathMap[path]);
   return (
-    <Stack.Navigator initialRouteName="changeNickname">
+    <Stack.Navigator initialRouteName={pathMap[path] || 'changeNickname'}>
       <Stack.Screen options={{title: '常用设备'}} name="equiment" component={Equipment} />
       <Stack.Screen options={{title: '修改昵称'}} name="changeNickname" component={ChangeNickname} />
     </Stack.Navigator>
   );
 }
 
-export default function App() {
+export default function App(props) {
+  const { path } = props;
+  console.log('path', path);
   return (
     <NavigationContainer>
-      <AllStack />
+      <AllStack path={path} />
     </NavigationContainer>
   );
 }