Skip to content

B
banma_credit
Commit 7781b610 by CaryaLiu
Options

Merge branch 'develop' of http://git.hikcreate.com/hikrn/project/banma_credit into develop

parents 4bd4b4ea 00ce019b
Showing with 213 additions and 84 deletions
android @ 0d1c0f28
Subproject commit 1587df5e459ddf3c7241bad88cd66613a4347939
Subproject commit 0d1c0f28436083a4e7fbc31ab9d4fab192013f7b
src/components/BackButton/index.js 0 → 100644
import { Image, View } from 'react-native';
import { HeaderBackButton } from '@react-navigation/stack';
import { IC_BACK_BLACK } from '../assets/images'
export default BackButton = (props) => (
<HeaderBackButton
{...props}
backImage={() => (
<View style={{ paddingStart: 5, paddingEnd: 10, paddingTop: 10, paddingBottom: 10 }}>
<Image source={IC_BACK_BLACK} style={{ width: 10, height: 18 }} />
</View>
)}
/>
);
\ No newline at end of file
src/components/status-view/index.js
import React from 'react'
import { View, Text } from 'react-native'
import styles from './index.scss'
import React, { useState } from "react";
import { Button, Text, StyleSheet, StatusBar, View } from "react-native";
import { HEADER_HEIGHT } from "../../config"
const StatusHeader = (props) => {
const styleTypes = ['default', 'dark-content', 'light-content'];
const [visibleStatusBar, setVisibleStatusBar] = useState(false);
const [styleStatusBar, setStyleStatusBar] = useState(styleTypes[0]);
const changeVisibilityStatusBar = () => {
setVisibleStatusBar(!visibleStatusBar);
};
const changeStyleStatusBar = () => {
const styleId = styleTypes.indexOf(styleStatusBar) + 1;
if (styleId === styleTypes.length) {
return setStyleStatusBar(styleTypes[0]);
}
return setStyleStatusBar(styleTypes[styleId]);
};
const StatusView = ({
loading = true,
empty = false,
error = false,
// 是否填充
fill = true,
loadingText = '加载中...',
errorText = '加载失败了',
emptyText = '暂无相关数据',
emptyIcon = null,
errorIcon = null,
onClick = null,
style = {},
children = null,
}) => {
return (
<View style={[styles.statusContainer, fill ? styles.full : null]}>
{children ? children : <Text>加载中...</Text>}
<View style={styles.container}>
<View>
<Text style={styles.textStyle}>StatusBar Style: {styleStatusBar}</Text>
<Text style={styles.textStyle}>StatusBar Visibility: {!visibleStatusBar ? 'Visible' : 'Hidden'}</Text>
</View>
<StatusBar backgroundColor="blue" barStyle={styleStatusBar} />
<View>
<StatusBar hidden={visibleStatusBar} />
</View>
<View style={styles.buttonContainer}>
<Button title="Toggle StatusBar" onPress={() => changeVisibilityStatusBar()} />
</View>
<View style={styles.buttonContainer}>
<Button title="Change StatusBar Style" onPress={() => changeStyleStatusBar()} />
</View>
</View>
)
}
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
paddingTop: HEADER_HEIGHT,
backgroundColor: '#ECF0F1',
padding: 8
},
buttonContainer: {
padding: 10
},
textStyle: {
textAlign: 'center'
}
});
export default StatusView
export default StatusHeader;
src/config/index.js
import { NativeModules, StatusBar, Dimensions } from 'react-native';
const { BMCInfo: { getEnvInfo } } = NativeModules;
const dev = {
API_ROOT: 'http://devbmcapp.hikcreate.com',
}
const mock = {
API_ROOT: 'http://yapi.hikcreate.com',
}
const test = {
API_ROOT: 'http://testbmcapp.hikcreate.com',
}
const pre_prod = {
API_ROOT: 'https://prebmcapp.hikcreate.com',
}
const prod = {
API_ROOT: 'https://bmcapp.hikcreate.com',
}
const configs = {
const configs = [
dev,
dev,
mock,
test,
pre_prod,
prod,
]
let envInfo
export const getEnv = async () => {
if (!envInfo) {
envInfo = await getEnvInfo();
}
return configs[envInfo.env];
}
export default configs[process.env.buildEnv || 'dev']
// iPhone X、iPhone XS
const X_WIDTH = 375;
const X_HEIGHT = 812;
// iPhone XR、iPhone XS Max
const XSMAX_WIDTH = 414;
const XSMAX_HEIGHT = 896;
const DEVICE_SIZE = Dimensions.get('window');
const { height: D_HEIGHT, width: D_WIDTH } = DEVICE_SIZE;
export const isiOS = () => Platform.OS === 'ios'
export const isiPhoneX = () => {
return (
isiOS() &&
((D_HEIGHT === X_HEIGHT && D_WIDTH === X_WIDTH) ||
(D_HEIGHT === X_WIDTH && D_WIDTH === X_HEIGHT)) ||
((D_HEIGHT === XSMAX_HEIGHT && D_WIDTH === XSMAX_WIDTH) ||
(D_HEIGHT === XSMAX_WIDTH && D_WIDTH === XSMAX_HEIGHT))
);
};
export const HEADER_HEIGHT = 44
export const STATUS_BAR_HEIGHT = isiOS() ? (isiPhoneX() ? 34 : 20) : StatusBar.currentHeight
\ No newline at end of file
src/pages/ChangeNickname/index.js
......@@ -4,7 +4,7 @@
* */
import React, { useEffect, useState } from 'react'
import { TextInput, Text, TouchableHighlight, View, NativeModules, StatusBar, Platform } from 'react-native';
import { TextInput, Text, TouchableHighlight, View, NativeModules, StatusBar } from 'react-native';
// import Tabbar from '../../components/Tabbar';
import { user as userServices } from '../../services';
import styles from './style';
......@@ -36,6 +36,7 @@ const Equipment = () => {
return (
<View style={styles.container}>
<StatusBar translucent={false} backgroundColor='#fff' barStyle="dark-content" />
<View>
<TextInput
style={styles.input}
......
src/pages/Equipment/index.js
......@@ -4,7 +4,7 @@
* */
import React, { useEffect, useState } from 'react'
import { ScrollView, View, Text, SafeAreaView, NativeModules, FlatList } from 'react-native';
import { ScrollView, View, Text, SafeAreaView, NativeModules, FlatList, StatusBar } from 'react-native';
// import Tabbar from '../../components/Tabbar';
import { equiment as equimentServices } from '../../services';
import styles from './style';
......@@ -15,38 +15,43 @@ const Equipment = () => {
const [equimentList, setEquimentList] = useState([]);
useEffect(() => {
getEquimentList();
}, []);
}, []);//seEffect Hook 看做 componentDidMount，componentDidUpdate 和 componentWillUnmount 这三个函数的组合,传递一个空数组（[]）作为第二个参数。
//这就告诉 React 你的 effect 不依赖于 props 或 state 中的任何值，所以它永远都不需要重复执行。即只运行一次的 effect（仅在组件挂载和卸载时执行）
//[count]即仅在 count 更改时更新
const getEquimentList = async () => {
try {
const data = await equimentServices.getArticleList();
setEquimentList(data[0].devices || []);
} catch (e) {
BMCUI.showToast('e');
}
try {
const data = await equimentServices.getBindEquipmentList();
setEquimentList(data[0].devices || []);
} catch (e) {
BMCUI.showToast(e && e.message);
console.log("error:")
console.log(e)
}
};
return (
<SafeAreaView style={styles.container}>
<View style={styles.main}>
<Text style={styles.tip}>
标题文字点击无反馈，文字超长则隐藏，文字超长则隐藏
</Text>
<View style={styles.content}>
<FlatList
data={equimentList}
keyExtractor={(item, index) => item.deviceId + ''}
renderItem={({ item }) => {
return <View style={styles.ceil}>
<View style={styles.ceilTitle}>
<Text style={styles.ceilName}>{item.title}</Text>
{item.currentDevice && <Text style={styles.ceilTag}>本机</Text>}
</View>
<Text style={styles.ceilInfo}>最后登录时间：{item.gmtLoginDisplay}</Text>
</View>;
}}
/>
</View>
</View>
<StatusBar translucent={false} backgroundColor='#fff' barStyle="dark-content" />
<FlatList
style={styles.content}
data={equimentList}
keyExtractor={(item, index) => item.deviceId + ''}
ListHeaderComponent={() => {
return <Text style={styles.tip}>
列表呈现用户登录的常用设备，以及在常用设备上的最后登录时间
</Text>
}}
renderItem={({ item }) => {
return <View style={styles.ceil}>
<View style={styles.ceilTitle}>
<Text style={styles.ceilName}>{item.title}</Text>
{item.currentDevice && <Text style={styles.ceilTag}>本机</Text>}
</View>
<Text style={styles.ceilInfo}>最后登录时间：{item.gmtLoginDisplay}</Text>
</View>;
}}
/>
</SafeAreaView>
)
};
......
src/pages/Equipment/style.js
......@@ -8,20 +8,23 @@ export default StyleSheet.create({
flex: 1,
},
tip: {
fontSize: 16,
paddingLeft: 12,
paddingRight: 12,
paddingTop: 20,
paddingBottom: 20,
color: 'rgba(182, 182, 182, 1)',
fontSize: 14,
paddingLeft: 15,
paddingRight: 15,
paddingTop: 15,
paddingBottom: 15,
color: '#C3C3C3',
},
content: {
flex: 1,
},
ceil: {
backgroundColor: '#fff',
padding: 12,
marginBottom: 12,
paddingLeft: 15,
paddingRight: 15,
paddingTop: 10,
paddingBottom: 15,
marginBottom: 10,
},
ceilTitle: {
flexDirection: 'row',
......@@ -29,16 +32,22 @@ export default StyleSheet.create({
},
ceilName: {
fontSize: 16,
color: '#000',
color: '#141414',
},
ceilTag: {
marginLeft: 10,
backgroundColor: 'rgba(195, 195, 195, 0.5)',
marginLeft: 5,
marginRight: 5,
fontSize: 10,
color: '#5A5A5A',
backgroundColor: '#00000010',
padding: 2,
borderRadius: 4,
borderRadius: 1,
borderColor: "#979797"
},
ceilInfo: {
paddingTop: 6,
fontSize: 12,
color: "#7B7B7B"
},
});
src/router/index.js
import React from 'react'
import { NavigationContainer } from '@react-navigation/native';
import { NativeModules } from 'react-native';
import { NativeModules, Image, View } from 'react-native';
import { createStackNavigator, HeaderBackButton } from '@react-navigation/stack';
import { IC_BACK_BLACK } from '../assets/images'
import { HEADER_HEIGHT } from '../config'
import Equipment from '../pages/Equipment'
import ChangeNickname from '../pages/ChangeNickname'
......@@ -18,6 +20,11 @@ function AllStack(props) {
const headerLeft = (props) => (
<HeaderBackButton
{...props}
backImage={() => (
<View style={{ paddingStart: 5, paddingEnd: 10, paddingTop: 10, paddingBottom: 10 }}>
<Image source={IC_BACK_BLACK} style={{ width: 10, height: 18 }} />
</View>
)}
onPress={() => {
exit()
}}
......@@ -25,23 +32,20 @@ function AllStack(props) {
);
return (
<Stack.Navigator initialRouteName={pathMap[path] || 'changeNickname'}>
<Stack.Screen options={{
title: '常用设备',
<Stack.Navigator initialRouteName={pathMap[path] || 'changeNickname'}
screenOptions={{
headerLeft: headerLeft,
headerTitleStyle: {
flex: 1,
justifyContent: 'center'
headerStyle: {
height: HEADER_HEIGHT, // Specify the height of your custom header
},
}} name="equiment" component={Equipment} />
<Stack.Screen options={{
title: '修改昵称',
headerLeft: headerLeft,
headerTitleStyle: {
flex: 1,
justifyContent: 'center'
alignItems: "center",
fontSize: 18
},
}} name="changeNickname" component={ChangeNickname} />
headerTitleAlign: "center"
}}>
<Stack.Screen options={{ title: '常用设备', }} name="equiment" component={Equipment} />
<Stack.Screen options={{ title: '修改昵称' }} name="changeNickname" component={ChangeNickname} />
</Stack.Navigator>
);
}
......
src/services/equiment.js
......@@ -2,7 +2,7 @@ import { $request } from '../utils/request';
export default {
getArticleList(params = {}) {
getBindEquipmentList(params = {}) {
return $request.get('/user/loginDevices')
},
}
src/utils/request.js
const { BMCUI } = NativeModules;
import { NativeModules } from 'react-native';
import appConfig from '../config'
import { getEnv } from '../config'
const { BMCInfo: { getLoginInfo, getDeviceInfo } } = NativeModules;
// 服务器地址
export const API_SERVER = appConfig.API_ROOT
export let API_SERVER = null;
// 是否外部的服务器
export const isOutServer = url => url.indexOf('/') !== 0
......@@ -74,6 +74,11 @@ export const $request = {
_requestConfig: () => { return getRequestInfo(); },
async _request(url, method, params, config = {}) {
const isOutRequest = isOutServer(url)
if (!API_SERVER) {
const serverConfig = await getEnv();
API_SERVER = serverConfig.API_ROOT;
}
console.log(API_SERVER)
let headers = config.headers || {}
let body = {}
let errorToast = config.errorToast || true
......@@ -109,9 +114,21 @@ export const $request = {
errorProcess(res, reject, errorToast)
})
.then(json => {
console.log(`{
${method} request url=${url}
Token=${headers.Token}
Pvt-Token=${headers['Pvt-Token']}
response success:{${json && JSON.stringify(json)}}
}`)
responseProcess(json, resolve, reject, isOutRequest, errorToast)
})
.catch(e => {
console.log(`{
${method} request url=${url}
Token=${headers.Token}
Pvt-Token=${headers['Pvt-Token']}
response error:{${e && e.toJSONString()}}
}`)
errorProcess({ data: { message: e.message } }, reject, errorToast)
})
})
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment