Commit 4ac09b8a by HaOuiha

Merge remote-tracking branch 'origin/ejectedExpo' into injectedFirebase

parents d29b5f7f 4a4d2f97
...@@ -2,7 +2,7 @@ import { StyleSheet } from 'react-native'; ...@@ -2,7 +2,7 @@ import { StyleSheet } from 'react-native';
export const color = { export const color = {
white: '#fff', white: '#fff',
defaultBg: '#f3f3f3', defaultBg: '#fbfbfb',
lightGrey: '#cfd7db', lightGrey: '#cfd7db',
grey: '#9b9b9b', grey: '#9b9b9b',
darkGrey: '#4a4a4a', darkGrey: '#4a4a4a',
......
...@@ -21,6 +21,7 @@ ...@@ -21,6 +21,7 @@
"react": "^16.9.0", "react": "^16.9.0",
"react-native": "^0.60.4", "react-native": "^0.60.4",
"react-native-barcode-mask": "^1.0.5", "react-native-barcode-mask": "^1.0.5",
"react-native-calendar-picker": "^6.0.1",
"react-native-camera": "^2.11.1", "react-native-camera": "^2.11.1",
"react-native-date-picker": "^2.7.0", "react-native-date-picker": "^2.7.0",
"react-native-elements": "^1.1.0", "react-native-elements": "^1.1.0",
......
[
{ "type": "log", "user": "Sukanya161", "time": 1566370057, "action": "Switched on", "device": "sub breaker 4" },
{ "type": "log", "user": "Sukanya161", "time": 1564639200, "action": "Switched off", "device": "sub breaker 1" },
{
"type": "notification",
"user": "Sukanya161",
"time": 1566370196,
"action": "Switched on",
"device": "sub breaker 2"
},
{ "type": "log", "user": "Sukanya161", "time": 1566371305, "action": "Switched on", "device": "sub breaker 1" },
{ "type": "log", "user": "Sukanya161", "time": 1566374629, "action": "Switched on", "device": "sub breaker 3" },
{ "type": "notification", "user": "Tonk", "time": 1566317460, "action": "Set timer", "device": "mcb link 1" },
{ "type": "notification", "user": "Tonk", "time": 1566438573, "action": "Set timer", "device": "mcb link 2" },
{ "type": "notification", "user": "Tonk", "time": 1565863930, "action": "???", "device": "???" },
{ "type": "notification", "user": "Tonk", "time": 1565777530, "action": "???", "device": "???" },
{ "type": "log", "user": "Sukanya161", "time": 1566467247, "action": "Switched on", "device": "sub breaker 4" },
{ "type": "log", "user": "Sukanya161", "time": 1564639200, "action": "Switched off", "device": "sub breaker 1" },
{
"type": "notification",
"user": "Sukanya161",
"time": 1566433810,
"action": "Switched on",
"device": "sub breaker 2"
},
{ "type": "log", "user": "Sukanya161", "time": 1566371305, "action": "Switched on", "device": "sub breaker 1" },
{ "type": "log", "user": "Sukanya161", "time": 1566374629, "action": "Switched on", "device": "sub breaker 3" },
{ "type": "notification", "user": "Tonk", "time": 1566317460, "action": "Leaved", "device": "office" },
{ "type": "notification", "user": "Tonk", "time": 1561975930, "action": "Entered", "device": "office" },
{ "type": "notification", "user": "Tonk", "time": 1564481530, "action": "ง่วง", "device": "มากๆ" },
{ "type": "notification", "user": "Tonk", "time": 1563790330, "action": "หิว", "device": "ข้าว" },
{ "type": "notification", "user": "Tonk", "time": 1566528669, "action": "Sleep", "device": "" }
]
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Text, List, ListItem, Body, Button } from 'native-base'; import { Text, List, ListItem, Body, Button } from 'native-base';
import { color, theme } from '../../../constants/Styles'; import { color, theme } from '../../../constants/Styles';
import { View, StyleSheet, TextInput, Modal } from 'react-native'; import { View, StyleSheet, TextInput } from 'react-native';
import { HeaderButtons, Item } from 'react-navigation-header-buttons'; import { HeaderButtons, Item } from 'react-navigation-header-buttons';
import IoniconsHeaderButton from '../../../components/IoniconsHeaderButton'; import IoniconsHeaderButton from '../../../components/IoniconsHeaderButton';
import { width } from '../../../constants/Layout'; import { width } from '../../../constants/Layout';
...@@ -35,13 +35,11 @@ export default class SmartMeterDetailScreen extends Component { ...@@ -35,13 +35,11 @@ export default class SmartMeterDetailScreen extends Component {
const { breaker, data, field, isVisible } = this.state; const { breaker, data, field, isVisible } = this.state;
return ( return (
<View style={[theme.container]}> <View style={[theme.container]}>
<Text style={[theme.description, theme.mt2, { marginLeft: 25, color: '#a8a8a8' }]}>
{breaker.toUpperCase()}
</Text>
<List style={[{ backgroundColor: color.white }, theme.mt2]}> <List style={[{ backgroundColor: color.white }, theme.mt2]}>
<ListItem itemDivider> <ListItem style={{ borderBottomWidth: 0 }}>
<Body>
<Text style={theme.description}>{breaker.toUpperCase()}</Text>
</Body>
</ListItem>
<ListItem>
<Body> <Body>
<Text style={[theme.normalText, theme.textDark]}>{field}</Text> <Text style={[theme.normalText, theme.textDark]}>{field}</Text>
<View <View
......
import React from 'react'; import React from 'react';
import { View, StyleSheet } from 'react-native'; import { View, StyleSheet, TouchableOpacity } from 'react-native';
import { ListItem, Body, Text, Icon, Right, Switch, List } from 'native-base'; import { ListItem, Body, Text, Icon, Right, Switch, List } from 'native-base';
import { theme, color } from '../../../constants/Styles'; import { theme, color } from '../../../constants/Styles';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { Overlay } from 'react-native-elements';
import { TouchableHighlight } from 'react-native-gesture-handler';
class SettingScreen extends React.Component { class SettingScreen extends React.Component {
static navigationOptions = ({ navigation }) => ({ static navigationOptions = ({ navigation }) => ({
title: 'Setting', title: 'Setting',
headerRight: navigation.state.params ? navigation.state.params.headerRight : null,
}); });
constructor(props) {
super(props);
this.props.navigation.setParams({
headerRight: (
<TouchableOpacity onPress={() => this.setState({ isVisible: true })}>
<View style={{ marginRight: 17 }}>
<Icon name="share-outline" type="MaterialCommunityIcons" style={{ color: color.white }} />
</View>
</TouchableOpacity>
),
});
}
state = { state = {
data: this.props.allMainDeviceInfo[0], data: this.props.allDeviceInfo[0],
isVisible: false,
pressQr: false,
pressMail: false,
}; };
toggleModal(visible) {
this.setState({
isVisible: visible,
});
}
render() { render() {
const { data } = this.state; const { data } = this.state;
return ( return (
<View style={[theme.container]}> <View style={[theme.container]}>
<Text style={[theme.description, theme.mt2, { marginLeft: 25, color: '#a8a8a8' }]}>
{data.type.toUpperCase()}
</Text>
<List style={styles.ListItemContainer}> <List style={styles.ListItemContainer}>
<ListItem itemDivider>
<Body>
<Text style={theme.description}>{data.type.toUpperCase()}</Text>
</Body>
</ListItem>
<ListItem <ListItem
onPress={() => onPress={() =>
this.props.navigation.navigate('SettingData', { this.props.navigation.navigate('SettingData', {
...@@ -29,6 +51,7 @@ class SettingScreen extends React.Component { ...@@ -29,6 +51,7 @@ class SettingScreen extends React.Component {
data: data.name, data: data.name,
}) })
} }
style={{ borderBottomColor: '#efefef' }}
> >
<Body> <Body>
<Text style={[theme.normalText, theme.textDark]}>Name</Text> <Text style={[theme.normalText, theme.textDark]}>Name</Text>
...@@ -48,6 +71,7 @@ class SettingScreen extends React.Component { ...@@ -48,6 +71,7 @@ class SettingScreen extends React.Component {
data: data.description, data: data.description,
}) })
} }
style={{ borderBottomColor: '#efefef' }}
> >
<Body> <Body>
<Text style={[theme.normalText, theme.textDark]}>Description</Text> <Text style={[theme.normalText, theme.textDark]}>Description</Text>
...@@ -67,6 +91,7 @@ class SettingScreen extends React.Component { ...@@ -67,6 +91,7 @@ class SettingScreen extends React.Component {
data: data.rcbo, data: data.rcbo,
}) })
} }
style={{ borderBottomColor: '#efefef' }}
> >
<Body> <Body>
<Text style={[theme.normalText, theme.textDark]}>RCBO</Text> <Text style={[theme.normalText, theme.textDark]}>RCBO</Text>
...@@ -78,7 +103,7 @@ class SettingScreen extends React.Component { ...@@ -78,7 +103,7 @@ class SettingScreen extends React.Component {
<Icon name="arrow-forward" /> <Icon name="arrow-forward" />
</Right> </Right>
</ListItem> </ListItem>
<ListItem> <ListItem style={{ borderBottomWidth: 0 }}>
<Body> <Body>
<Text style={[theme.normalText, theme.textDark]}>Notification</Text> <Text style={[theme.normalText, theme.textDark]}>Notification</Text>
</Body> </Body>
...@@ -87,13 +112,77 @@ class SettingScreen extends React.Component { ...@@ -87,13 +112,77 @@ class SettingScreen extends React.Component {
</Right> </Right>
</ListItem> </ListItem>
</List> </List>
<List style={styles.ListItemContainer}> <List style={[styles.ListItemContainer, { marginTop: 30 }]}>
<ListItem> <ListItem style={{ borderBottomWidth: 0 }}>
<Body> <Body>
<Text style={[theme.normalText, theme.textDanger]}>Delete</Text> <Text style={[theme.normalText, theme.textDanger]}>Delete</Text>
</Body> </Body>
</ListItem> </ListItem>
</List> </List>
<Overlay
borderRadius={20}
height={'25%'}
width={'90%'}
overlayStyle={styles.overlayStyle}
isVisible={this.state.isVisible}
onBackdropPress={() => {
this.toggleModal(!this.state.isVisible);
}}
>
<>
<Icon
name="close"
type="AntDesign"
style={{ position: 'absolute', top: 20, right: 20, fontSize: 16, color: color.lightGrey }}
onPress={() => {
this.toggleModal(!this.state.isVisible);
}}
/>
<Text style={[theme.normalText, theme.textDark, theme.centerText, { marginHorizontal: 30 }]}>
Share to these items?
</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<TouchableHighlight
underlayColor="transparent"
onHideUnderlay={() => this.setState({ pressQr: false })}
onShowUnderlay={() => this.setState({ pressQr: true })}
onPress={() => console.log('press')}
>
<View
style={[
styles.shareItemStyle,
{ backgroundColor: this.state.pressQr ? 'rgba(238,84,84,0.1)' : 'transparent' },
]}
>
<Icon
name="qrcode-scan"
type="MaterialCommunityIcons"
style={{ fontSize: 50, color: color.primary }}
/>
</View>
</TouchableHighlight>
<TouchableHighlight
underlayColor="transparent"
onHideUnderlay={() => this.setState({ pressMail: false })}
onShowUnderlay={() => this.setState({ pressMail: true })}
onPress={() => console.log('press')}
>
<View
style={[
styles.shareItemStyle,
{
backgroundColor: this.state.pressMail
? 'rgba(238,84,84,0.1)'
: 'transparent',
},
]}
>
<Icon name="mail" type="AntDesign" style={{ fontSize: 50, color: color.primary }} />
</View>
</TouchableHighlight>
</View>
</>
</Overlay>
</View> </View>
); );
} }
...@@ -107,6 +196,19 @@ export default connect(mapStateToProps)(SettingScreen); ...@@ -107,6 +196,19 @@ export default connect(mapStateToProps)(SettingScreen);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
ListItemContainer: { ListItemContainer: {
backgroundColor: color.white, backgroundColor: color.white,
marginTop: 20, marginTop: 10,
},
overlayStyle: {
padding: 20,
alignItems: 'center',
justifyContent: 'space-around',
},
shareItemStyle: {
height: 100,
width: 100,
justifyContent: 'center',
alignItems: 'center',
borderRadius: 6,
marginHorizontal: 15,
}, },
}); });
...@@ -119,9 +119,8 @@ class SmartMeterDetailScreen extends Component { ...@@ -119,9 +119,8 @@ class SmartMeterDetailScreen extends Component {
state = { state = {
mbOn: false, mbOn: false,
sb: this.expandState(), sb: this.expandState(),
data: this.props.allMainDeviceInfo[0], data: this.props.allDeviceInfo[0],
}; };
renderCurrent(item, index) { renderCurrent(item, index) {
return ( return (
<Card <Card
...@@ -172,7 +171,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -172,7 +171,7 @@ class SmartMeterDetailScreen extends Component {
renderMCBLink(item, index) { renderMCBLink(item, index) {
const sb = this.state.sb; const sb = this.state.sb;
return ( return (
<View key={`MBCLink${index}`}> <View>
<Row <Row
style={{ padding: 7 }} style={{ padding: 7 }}
onPress={() => onPress={() =>
...@@ -194,10 +193,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -194,10 +193,7 @@ class SmartMeterDetailScreen extends Component {
} }
renderSubbreaker(item) { renderSubbreaker(item) {
return ( return (
<View <View style={[theme.containerWithPadding, { backgroundColor: 'rgba(216,216,216,0.1)' }]}>
key={`Subbreker${item.toString()}`}
style={[theme.containerWithPadding, { backgroundColor: 'rgba(216,216,216,0.1)' }]}
>
<Row> <Row>
<Left> <Left>
<View> <View>
...@@ -240,7 +236,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -240,7 +236,7 @@ class SmartMeterDetailScreen extends Component {
<Card style={[theme.containerWithPadding, { borderRadius: 10 }]}> <Card style={[theme.containerWithPadding, { borderRadius: 10 }]}>
<Row> <Row>
<Left> <Left>
<Text style={[theme.smallTitle, { color: color.darkGrey }]}>{`untitled`}</Text> <Text style={[theme.smallTitle, { color: color.darkGrey }]}>{data.name}</Text>
</Left> </Left>
<Right> <Right>
<Switch <Switch
...@@ -297,7 +293,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -297,7 +293,7 @@ class SmartMeterDetailScreen extends Component {
} }
const mapStateToProps = state => ({ const mapStateToProps = state => ({
allMainDeviceInfo: state.allMainDeviceReducer.allMainDeviceInfo, allDeviceInfo: state.allDataReducer.allDeviceInfo,
}); });
export default connect(mapStateToProps)(SmartMeterDetailScreen); export default connect(mapStateToProps)(SmartMeterDetailScreen);
......
...@@ -5776,7 +5776,7 @@ prompts@^2.0.1: ...@@ -5776,7 +5776,7 @@ prompts@^2.0.1:
kleur "^3.0.2" kleur "^3.0.2"
sisteransi "^1.0.0" sisteransi "^1.0.0"
prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2: prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
version "15.7.2" version "15.7.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ== integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
...@@ -5913,6 +5913,14 @@ react-native-barcode-mask@^1.0.5: ...@@ -5913,6 +5913,14 @@ react-native-barcode-mask@^1.0.5:
dependencies: dependencies:
prop-types "^15.6.2" prop-types "^15.6.2"
react-native-calendar-picker@^6.0.1:
version "6.0.1"
resolved "https://registry.yarnpkg.com/react-native-calendar-picker/-/react-native-calendar-picker-6.0.1.tgz#28e7fa06f7a08a35586084496950df142fa5b05a"
integrity sha512-c12Afk3i1vpdRSfI0ic/5+m2LdBLAYyiO4M67TyzEqw3tfsg2IcDkDKa/rBi6METKhd55/8IqBi8669sBCeNJA==
dependencies:
prop-types "^15.6.0"
uuid "3.2.1"
react-native-camera@^2.11.1: react-native-camera@^2.11.1:
version "2.11.2" version "2.11.2"
resolved "https://registry.yarnpkg.com/react-native-camera/-/react-native-camera-2.11.2.tgz#4936bb0a484e8ba7d0b3ecf28fa7c161833b1ac0" resolved "https://registry.yarnpkg.com/react-native-camera/-/react-native-camera-2.11.2.tgz#4936bb0a484e8ba7d0b3ecf28fa7c161833b1ac0"
...@@ -7364,6 +7372,11 @@ utils-merge@1.0.1: ...@@ -7364,6 +7372,11 @@ utils-merge@1.0.1:
resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713" resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
integrity sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM= integrity sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=
uuid@3.2.1:
version "3.2.1"
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.2.1.tgz#12c528bb9d58d0b9265d9a2f6f0fe8be17ff1f14"
integrity sha512-jZnMwlb9Iku/O3smGWvZhauCf6cvvpKi4BKRiliS3cxnI+Gz9j5MEpTz2UFuXiKPJocb7gnsLHwiS05ige5BEA==
uuid@^3.3.2: uuid@^3.3.2:
version "3.3.2" version "3.3.2"
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131" resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131"
......
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