Skip to content

S
safetcut-app
Commit 435cb1a6 by HaOuiha
Options

subscribetion at mcbLinkPage && fix some bug

parent da24617a
Showing with 139 additions and 121 deletions
firebase.js
...@@ -12,7 +12,12 @@ const app = firebase.initializeApp({ ...@@ -12,7 +12,12 @@ const app = firebase.initializeApp({
messagingSenderId: '716807932076', messagingSenderId: '716807932076',
}); });
const fireStore = app.firestore(); let fireStore = null;
try {
fireStore = app.firestore();
} catch (e) {
alert(e);
}
const baseURL = 'https://us-central1-safetcut-20cdf.cloudfunctions.net'; const baseURL = 'https://us-central1-safetcut-20cdf.cloudfunctions.net';
......
reduxStore/actions/allMainDeviceAction.js
...@@ -88,20 +88,11 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => { ...@@ -88,20 +88,11 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => {
const getBreakerStatus = async deviceId => { const getBreakerStatus = async deviceId => {
try { try {
// const {
// data: {
// shadow: { data },
// },
// } = await apolloQuery(READ_SHADOW, { deviceid: deviceId });
const res1 = await apolloQuery(READ_SHADOW, { deviceid: deviceId }); const res1 = await apolloQuery(READ_SHADOW, { deviceid: deviceId });
const breakerStatusData = res1.data.shadow.data; const breakerStatusData = res1.data.shadow.data;
// const response = await apolloQuery(READ_SHADOW, { deviceid: deviceId });
// console.log(response);
const res2 = await apolloQuery(QUERY_ONLINE_STATUS, { deviceid: deviceId }); const res2 = await apolloQuery(QUERY_ONLINE_STATUS, { deviceid: deviceId });
const onlineStatus = res2.data.device[0].status; const onlineStatus = res2.data.device[0].status;
// console.log(onlineStatus);
const tempBreakerStatus = _.pick(breakerStatusData, ['SM1']); const tempBreakerStatus = _.pick(breakerStatusData, ['SM1']);
const breakerStatus = tempBreakerStatus.SM1.BK_S; const breakerStatus = tempBreakerStatus.SM1.BK_S;
......
reduxStore/actions/currentSelectedAction.js
...@@ -154,44 +154,35 @@ export const getCurrentSelectedData = (deviceId, showLoading) => async dispatch ...@@ -154,44 +154,35 @@ export const getCurrentSelectedData = (deviceId, showLoading) => async dispatch
export const updateSubscriptionToStore = subscriptionData => async (dispatch, getState) => { export const updateSubscriptionToStore = subscriptionData => async (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { shadow, breakerStatus } = currentSelectedDeviceReducer; const { shadow, breakerStatus } = currentSelectedDeviceReducer;
// console.log('subscriptionData', subscriptionData);
console.log('subscriptionData', subscriptionData); const isPropertyofBreakerStatus = ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']
console.log('s', shadow);
console.log('b', breakerStatus);
['SM1', 'ML1', 'ML2', 'ML3', 'ML4'].map(item => subscriptionData.hasOwnProperty(item));
console.log(
['SM1', 'ML1', 'ML2', 'ML3', 'ML4']
.map(item => subscriptionData.hasOwnProperty(item)) .map(item => subscriptionData.hasOwnProperty(item))
.some(item => item === true) .some(item => item === true);
);
const tempBreakersStatus = _.pick(newWholeShadow, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']); let subBreakerData = [];
const breakersStatus = { ...tempBreakersStatus, SM1: { BK_S: tempBreakersStatus.SM1.BK_S } };
let shadowTimers = [];
let shadowValue = null;
for (let i = 1; i <= 4; i++) { for (let i = 1; i <= 4; i++) {
for (let j = 1; j <= 8; j++) { for (let j = 1; j <= 8; j++) {
shadowTimers.push(`L${i}B${j}T`); subBreakerData.push(`data_L${i}_B${j}`);
shadowValue = _.omit(newWholeShadow, [
'CMD_MSG',
'TIME_NOW',
'TIME_ZONE',
'VERSION',
'ML1',
'ML2',
'ML3',
'ML4',
'MAB1T',
...shadowTimers,
]);
} }
} }
const isPropertyofShadow = ['MD_STA', 'MESSAGE', 'RMD9', 'SM1', 'RSSI', ...subBreakerData]
.map(item => subscriptionData.hasOwnProperty(item))
.some(item => item === true);
let newBreakerStatus = null;
let newShadow = null;
if (isPropertyofBreakerStatus) {
newBreakerStatus = { ...breakerStatus, ...subscriptionData };
const breakersStatus = { ...newBreakerStatus, SM1: { BK_S: newBreakerStatus.SM1.BK_S } };
dispatch(getBreakersStatusAction(breakersStatus)); dispatch(getBreakersStatusAction(breakersStatus));
dispatch(getCurrentSelectedShadowAction(shadowValue)); }
if (isPropertyofShadow) {
newShadow = { ...shadow, ...subscriptionData };
dispatch(getCurrentSelectedShadowAction(newShadow));
}
}; };
export const updateDetail = (type, value) => async (dispatch, getState) => { export const updateDetail = (type, value) => async (dispatch, getState) => {
......
reduxStore/actions/timersAction.js
...@@ -215,6 +215,9 @@ export const createNewTimer = (mcbLinkId, subBreakerId, settingTime) => async (d ...@@ -215,6 +215,9 @@ export const createNewTimer = (mcbLinkId, subBreakerId, settingTime) => async (d
const selectedDeviceId = currentSelectedData.deviceId; const selectedDeviceId = currentSelectedData.deviceId;
const { allTimers, existedSubBreakersData } = timersReducer; const { allTimers, existedSubBreakersData } = timersReducer;
console.log('settingTime',settingTime)
const getDocRef = () => { const getDocRef = () => {
if (mcbLinkId && subBreakerId) { if (mcbLinkId && subBreakerId) {
const docRef = fireStore const docRef = fireStore
......
screens/Private/NotificationScreen/NotificationScreen.js
import React from 'react'; import React from 'react';
import { Text, Tab, Tabs, ScrollableTab, Icon, Footer } from 'native-base'; import { Text, Tab, Tabs, ScrollableTab, Icon, Footer } from 'native-base';
import { View, StyleSheet, ScrollView, Modal, TouchableOpacity } from 'react-native'; import { View, StyleSheet, ScrollView, TouchableOpacity } from 'react-native';
import { color, theme } from '../../../constants/Styles'; import { color, theme } from '../../../constants/Styles';
import { SearchBar } from 'react-native-elements'; import { SearchBar } from 'react-native-elements';
import { format, isToday, isYesterday, isSameDay, isThisMonth, startOfDay, getTime, endOfDay } from 'date-fns'; import { format, isToday, isYesterday, isSameDay, isThisMonth, startOfDay, getTime, endOfDay } from 'date-fns';
...@@ -10,7 +10,7 @@ import CalendarPicker from 'react-native-calendar-picker'; ...@@ -10,7 +10,7 @@ import CalendarPicker from 'react-native-calendar-picker';
import { TouchableWithoutFeedback } from 'react-native-gesture-handler'; import { TouchableWithoutFeedback } from 'react-native-gesture-handler';
import { withNavigationFocus } from 'react-navigation'; import { withNavigationFocus } from 'react-navigation';
import dt2 from './notification.json'; import dt2 from './notification.json';
import Modal2 from 'react-native-modalbox'; import Modal from 'react-native-modalbox';
import { isIphoneX } from '../../../utils/isPhoneX'; import { isIphoneX } from '../../../utils/isPhoneX';
const tabHeader = [ const tabHeader = [
...@@ -18,6 +18,7 @@ const tabHeader = [ ...@@ -18,6 +18,7 @@ const tabHeader = [
{ type: 'notification', label: 'Notification' }, { type: 'notification', label: 'Notification' },
{ type: 'log', label: 'Logging' }, { type: 'log', label: 'Logging' },
]; ];
class NotificationScreen extends React.Component { class NotificationScreen extends React.Component {
static navigationOptions = ({ navigation }) => ({ static navigationOptions = ({ navigation }) => ({
title: 'Notifications', title: 'Notifications',
...@@ -29,9 +30,7 @@ class NotificationScreen extends React.Component { ...@@ -29,9 +30,7 @@ class NotificationScreen extends React.Component {
</TouchableOpacity> </TouchableOpacity>
), ),
}); });
constructor(props) { state = {
super(props);
this.state = {
search: '', search: '',
data: [], data: [],
filterData: [], filterData: [],
...@@ -42,22 +41,19 @@ class NotificationScreen extends React.Component { ...@@ -42,22 +41,19 @@ class NotificationScreen extends React.Component {
filterBy: null, filterBy: null,
toggleCalendar: false, toggleCalendar: false,
}; };
this.onDateChange = this.onDateChange.bind(this);
} componentDidMount = () => {
componentDidMount() {
this.sortDate(); this.sortDate();
}
componentDidUpdate(prevProps) {
if (prevProps.isFocused !== this.props.isFocused) {
this.setState(state => {
const readed = state.data.map(item => (item.read = true));
return {
readed,
}; };
componentDidUpdate = prevProps => {
if (prevProps.isFocused !== this.props.isFocused) {
this.setState(prevState => {
const readed = prevState.data.map(item => (item.read = true));
return { readed };
}); });
} }
} };
sortDate() { sortDate = () => {
const sortData = dt2.sort(function(a, b) { const sortData = dt2.sort(function(a, b) {
var dateA = new Date(a.time), var dateA = new Date(a.time),
dateB = new Date(b.time); dateB = new Date(b.time);
...@@ -67,8 +63,8 @@ class NotificationScreen extends React.Component { ...@@ -67,8 +63,8 @@ class NotificationScreen extends React.Component {
data: sortData, data: sortData,
initial: sortData, initial: sortData,
}); });
} };
onDateChange(date, type) { onDateChange = (date, type) => {
if (type === 'END_DATE') { if (type === 'END_DATE') {
this.setState({ this.setState({
selectedEndDate: date, selectedEndDate: date,
...@@ -79,15 +75,15 @@ class NotificationScreen extends React.Component { ...@@ -79,15 +75,15 @@ class NotificationScreen extends React.Component {
selectedEndDate: null, selectedEndDate: null,
}); });
} }
} };
clear() { clear = () => {
this.setState({ this.setState({
selectedStartDate: null, selectedStartDate: null,
selectedEndDate: null, selectedEndDate: null,
filterBy: null, filterBy: null,
toggleCalendar: false, toggleCalendar: false,
}); });
} };
updateSearch = text => { updateSearch = text => {
this.setState({ search: text }); this.setState({ search: text });
...@@ -109,7 +105,7 @@ class NotificationScreen extends React.Component { ...@@ -109,7 +105,7 @@ class NotificationScreen extends React.Component {
}); });
}; };
filterByDate() { filterByDate = () => {
const { filterBy, initial, selectedStartDate, selectedEndDate } = this.state; const { filterBy, initial, selectedStartDate, selectedEndDate } = this.state;
this.setState({ isfilterVisible: false, search: '' }); this.setState({ isfilterVisible: false, search: '' });
...@@ -166,10 +162,10 @@ class NotificationScreen extends React.Component { ...@@ -166,10 +162,10 @@ class NotificationScreen extends React.Component {
} else if (filterBy === 'all') { } else if (filterBy === 'all') {
this.setState({ filterData: initial }); this.setState({ filterData: initial });
} }
} };
// render component ----------------------------------------------- // render component -----------------------------------------------
renderActionCard(data, index) { renderActionCard = (data, index) => {
return ( return (
<View <View
style={[ style={[
...@@ -222,9 +218,9 @@ class NotificationScreen extends React.Component { ...@@ -222,9 +218,9 @@ class NotificationScreen extends React.Component {
</View> </View>
</View> </View>
); );
} };
renderDayList(type) { renderDayList = type => {
let data2render = []; let data2render = [];
if (this.state.filterBy && !this.state.search) { if (this.state.filterBy && !this.state.search) {
data2render.push(...this.state.filterData); data2render.push(...this.state.filterData);
...@@ -240,17 +236,21 @@ class NotificationScreen extends React.Component { ...@@ -240,17 +236,21 @@ class NotificationScreen extends React.Component {
let view = []; let view = [];
let day; let day;
if (data.length === 0) { if (data.length === 0) {
view.push(<Text style={[theme.normalText, { paddingHorizontal: 30, paddingVertical: 10 }]}>No data</Text>); view.push(
<Text key={data} style={[theme.normalText, { paddingHorizontal: 30, paddingVertical: 10 }]}>
No data
</Text>
);
} else { } else {
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
if (isToday(data[i].time * 1000) && i === 0) { if (isToday(data[i].time * 1000) && i === 0) {
view.push( view.push(
<> <View key={`today${i}`}>
<Text style={[theme.normalText, { paddingHorizontal: 30, paddingVertical: 10 }]}> <Text style={[theme.normalText, { paddingHorizontal: 30, paddingVertical: 10 }]}>
Today Today
</Text> </Text>
{this.renderActionCard(data[i], i)} {this.renderActionCard(data[i], i)}
</> </View>
); );
day = data[i].time * 1000; day = data[i].time * 1000;
} else if (isSameDay(day, data[i].time * 1000)) { } else if (isSameDay(day, data[i].time * 1000)) {
...@@ -258,23 +258,23 @@ class NotificationScreen extends React.Component { ...@@ -258,23 +258,23 @@ class NotificationScreen extends React.Component {
day = data[i].time * 1000; day = data[i].time * 1000;
} else { } else {
view.push( view.push(
<> <View key={`past${i}`}>
<Text style={[theme.normalText, { paddingHorizontal: 30, paddingVertical: 10 }]}> <Text style={[theme.normalText, { paddingHorizontal: 30, paddingVertical: 10 }]}>
{isYesterday(data[i].time * 1000) {isYesterday(data[i].time * 1000)
? 'Yesterday' ? 'Yesterday'
: format(data[i].time * 1000, 'DD/MM/YYYY')} : format(data[i].time * 1000, 'DD/MM/YYYY')}
</Text> </Text>
{this.renderActionCard(data[i], i)} {this.renderActionCard(data[i], i)}
</> </View>
); );
day = data[i].time * 1000; day = data[i].time * 1000;
} }
} }
} }
return view; return <View style={{ marginBottom: isIphoneX() ? 60 : 25 }}>{view}</View>;
} };
renderCalendar() { renderCalendar = () => {
const { selectedStartDate, selectedEndDate } = this.state; const { selectedStartDate, selectedEndDate } = this.state;
const maxDate = new Date(); const maxDate = new Date();
const startDate = selectedStartDate ? selectedStartDate.toString() : ''; const startDate = selectedStartDate ? selectedStartDate.toString() : '';
...@@ -332,7 +332,7 @@ class NotificationScreen extends React.Component { ...@@ -332,7 +332,7 @@ class NotificationScreen extends React.Component {
)} )}
</> </>
); );
} };
renderFilter = () => { renderFilter = () => {
return ( return (
...@@ -384,21 +384,23 @@ class NotificationScreen extends React.Component { ...@@ -384,21 +384,23 @@ class NotificationScreen extends React.Component {
tabStyle: { tabStyle: {
backgroundColor: 'transparent', backgroundColor: 'transparent',
borderRadius: 100, borderRadius: 100,
marginVertical: 10, marginVertical: 8,
paddingHorizontal: 10, paddingLeft: 0,
width: width / 3, paddingRight: 0,
width: (width - 50) / 3,
}, },
activeTabStyle: { activeTabStyle: {
backgroundColor: color.primary, backgroundColor: color.primary,
borderRadius: 100, borderRadius: 100,
marginVertical: 10, marginVertical: 8,
marginHorizontal: 5, paddingLeft: 0,
width: width / 3 - 10, paddingRight: 0,
width: (width - 50) / 3,
}, },
style: { backgroundColor: color.defaultBg }, style: { backgroundColor: color.defaultBg },
}; };
return ( return (
<View style={theme.container}> <View style={[theme.container]}>
<Tabs <Tabs
tabBarUnderlineStyle={{ backgroundColor: 'transparent' }} tabBarUnderlineStyle={{ backgroundColor: 'transparent' }}
renderTabBar={() => <ScrollableTab style={styles.scrollTab} />} renderTabBar={() => <ScrollableTab style={styles.scrollTab} />}
...@@ -430,24 +432,17 @@ class NotificationScreen extends React.Component { ...@@ -430,24 +432,17 @@ class NotificationScreen extends React.Component {
))} ))}
</Tabs> </Tabs>
<Modal <Modal
transparent coverScreen
presentationStyle={'overFullScreen'}
animationType="fade"
visible={this.state.isfilterVisible}
>
<Modal2
swipeArea={45} swipeArea={45}
swipeThreshold={65} swipeThreshold={65}
animationDuration={360}
backdropPressToClose={false} backdropPressToClose={false}
style={[styles.filterModal]} style={[styles.filterModal]}
position={'bottom'} position={'bottom'}
isOpen={this.state.isfilterVisible} isOpen={this.state.isfilterVisible}
onClosed={() => { onClosed={() => this.setState({ isfilterVisible: false })}
this.setState({ isfilterVisible: false });
}}
> >
{this.renderFilter()} {this.renderFilter()}
</Modal2>
</Modal> </Modal>
<Footer style={{ backgroundColor: 'transparent', borderColor: 'transparent' }} /> <Footer style={{ backgroundColor: 'transparent', borderColor: 'transparent' }} />
...@@ -482,7 +477,7 @@ const styles = StyleSheet.create({ ...@@ -482,7 +477,7 @@ const styles = StyleSheet.create({
width: 50, width: 50,
height: 5, height: 5,
borderRadius: 3, borderRadius: 3,
backgroundColor: color.grey, backgroundColor: color.lightGrey,
display: 'flex', display: 'flex',
alignSelf: 'center', alignSelf: 'center',
}, },
...@@ -549,6 +544,7 @@ const styles = StyleSheet.create({ ...@@ -549,6 +544,7 @@ const styles = StyleSheet.create({
backgroundColor: color.defaultBg, backgroundColor: color.defaultBg,
borderWidth: 0, borderWidth: 0,
marginTop: 10, marginTop: 10,
// marginHorizontal: 15,
}, },
tabContainer: { tabContainer: {
padding: 15, padding: 15,
......
screens/Private/SmartMeterScreen/McbLinkScreen.js
import React from 'react'; import React, { Component } from 'react';
import { Text, Tab, Tabs, ScrollableTab, View, Card, Icon } from 'native-base'; import { Text, Tab, Tabs, ScrollableTab, View, Card, Icon } from 'native-base';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { StyleSheet, TextInput, Image, TouchableOpacity, Animated, Easing } from 'react-native'; import { StyleSheet, TextInput, Image, TouchableOpacity, Animated, Easing } from 'react-native';
...@@ -12,14 +12,16 @@ import { ...@@ -12,14 +12,16 @@ import {
setSubBreakerStatus, setSubBreakerStatus,
deleteConnectedDevice, deleteConnectedDevice,
addConnectedDevice, addConnectedDevice,
updateSubscriptionToStore,
} from '../../../reduxStore/actions/currentSelectedAction'; } from '../../../reduxStore/actions/currentSelectedAction';
import Modal from 'react-native-modalbox'; import Modal from 'react-native-modalbox';
import { getDeviceIcon, listDeviceIcon } from '../../../components/deviceIcon'; import { getDeviceIcon, listDeviceIcon } from '../../../components/deviceIcon';
import { isIphoneX } from '../../../utils/isPhoneX'; import { isIphoneX } from '../../../utils/isPhoneX';
import { graphql } from '@apollo/react-hoc';
import { READ_SHADOW, SUBSCRIBE_SHADOW } from '../../../utils/apollo/apollo';
import { withNavigationFocus } from 'react-navigation';
let checkedTimes = 0; class McbLinkScreen extends Component {
class McbLinkScreen extends React.Component {
static navigationOptions = ({ navigation }) => { static navigationOptions = ({ navigation }) => {
return { return {
title: navigation.getParam('mcbLink').name || `MCB Link ${navigation.getParam('mcbIndex') + 1}`, title: navigation.getParam('mcbLink').name || `MCB Link ${navigation.getParam('mcbIndex') + 1}`,
...@@ -43,10 +45,11 @@ class McbLinkScreen extends React.Component { ...@@ -43,10 +45,11 @@ class McbLinkScreen extends React.Component {
), ),
}; };
}; };
constructor(props) {
super(props); shakeValue = new Animated.Value(0);
this.shakeValue = new Animated.Value(0); unsubscribeShadow = null;
} deviceId = this.props.navigation.getParam('deviceId');
state = { state = {
subBreakersInfo: [], subBreakersInfo: [],
subBreakerStatus: [], subBreakerStatus: [],
...@@ -58,8 +61,20 @@ class McbLinkScreen extends React.Component { ...@@ -58,8 +61,20 @@ class McbLinkScreen extends React.Component {
deviceName: '', deviceName: '',
deviceType: '', deviceType: '',
}; };
subscribeToNewShadow = subscribeToMore => {
this.unsubscribeShadow = subscribeToMore({
document: SUBSCRIBE_SHADOW,
variables: { deviceid: this.deviceId },
updateQuery: (prev, { subscriptionData }) => {
this.props.updateSubscriptionToStore(subscriptionData.data.shadowUpdated.data);
},
});
};
componentDidMount = () => { componentDidMount = () => {
this.setSubBreakersState(); this.setSubBreakersState();
this.subscribeToNewShadow(this.props.data.subscribeToMore);
}; };
componentDidUpdate = (prevProps, prevState) => { componentDidUpdate = (prevProps, prevState) => {
if ( if (
...@@ -69,6 +84,10 @@ class McbLinkScreen extends React.Component { ...@@ -69,6 +84,10 @@ class McbLinkScreen extends React.Component {
) { ) {
this.setSubBreakersState(); this.setSubBreakersState();
} }
if (prevProps.isFocused !== this.props.isFocused) {
this.props.isFocused === true && this.subscribeToNewShadow(this.props.data.subscribeToMore);
this.props.isFocused === false && this.unsubscribeShadow && this.unsubscribeShadow();
}
}; };
handleAnimation = () => { handleAnimation = () => {
// A loop is needed for continuous animation // A loop is needed for continuous animation
...@@ -117,7 +136,6 @@ class McbLinkScreen extends React.Component { ...@@ -117,7 +136,6 @@ class McbLinkScreen extends React.Component {
) )
); );
}); });
this.setState({ subBreakersInfo: existedSubBreakersData[mcbIndex], subBreakerStatus: status }); this.setState({ subBreakersInfo: existedSubBreakersData[mcbIndex], subBreakerStatus: status });
}; };
addDevice = async () => { addDevice = async () => {
...@@ -147,7 +165,6 @@ class McbLinkScreen extends React.Component { ...@@ -147,7 +165,6 @@ class McbLinkScreen extends React.Component {
const handleOnPressSubBreakerSwitch = async value => { const handleOnPressSubBreakerSwitch = async value => {
this.setState({ isWaiting: true }); this.setState({ isWaiting: true });
await this.props.setSubBreakerStatus(value, mcbIndex, index); await this.props.setSubBreakerStatus(value, mcbIndex, index);
await this.props.getCurrentSelectedShadow();
this.setState({ isWaiting: false }); this.setState({ isWaiting: false });
}; };
const { subBreakerStatus, isWaiting } = this.state; const { subBreakerStatus, isWaiting } = this.state;
...@@ -160,9 +177,11 @@ class McbLinkScreen extends React.Component { ...@@ -160,9 +177,11 @@ class McbLinkScreen extends React.Component {
{item.name || `Sub Breaker ${index + 1}`} {item.name || `Sub Breaker ${index + 1}`}
</Text> </Text>
<Switch <Switch
disabled={isWaiting ? true : false} thumbColor={subStatus ? '#10ca88' : color.grey}
trackColor={{ false: color.lightGrey, true: '#87E4C3' }}
// disabled={isWaiting ? true : false}
value={subStatus} value={subStatus}
onValueChange={value => handleOnPressSubBreakerSwitch(value)} onValueChange={handleOnPressSubBreakerSwitch}
/> />
</View> </View>
<Text style={[theme.description, theme.mt1]}>{item.description || 'No description'}</Text> <Text style={[theme.description, theme.mt1]}>{item.description || 'No description'}</Text>
...@@ -536,7 +555,7 @@ const styles = StyleSheet.create({ ...@@ -536,7 +555,7 @@ const styles = StyleSheet.create({
color: color.lightGrey, color: color.lightGrey,
}, },
addModal: { addModal: {
height: height * 0.8, height: height * 0.9,
borderTopLeftRadius: 10, borderTopLeftRadius: 10,
borderTopRightRadius: 10, borderTopRightRadius: 10,
}, },
...@@ -599,9 +618,16 @@ const mapDispatchToProps = { ...@@ -599,9 +618,16 @@ const mapDispatchToProps = {
getCurrentSelectedShadow, getCurrentSelectedShadow,
deleteConnectedDevice, deleteConnectedDevice,
addConnectedDevice, addConnectedDevice,
updateSubscriptionToStore,
}; };
const WithSubscription = graphql(READ_SHADOW, {
options: props => ({ variables: { deviceid: props.navigation.getParam('deviceId') } }),
});
const enhancedScreen = WithSubscription(withNavigationFocus(McbLinkScreen));
export default connect( export default connect(
mapStateToProps, mapStateToProps,
mapDispatchToProps mapDispatchToProps
)(McbLinkScreen); )(enhancedScreen);
screens/Private/SmartMeterScreen/SmartMeterDetailScreen.js
...@@ -67,9 +67,6 @@ class SmartMeterDetailScreen extends Component { ...@@ -67,9 +67,6 @@ class SmartMeterDetailScreen extends Component {
document: SUBSCRIBE_SHADOW, document: SUBSCRIBE_SHADOW,
variables: { deviceid: this.deviceId }, variables: { deviceid: this.deviceId },
updateQuery: (prev, { subscriptionData }) => { updateQuery: (prev, { subscriptionData }) => {
// this.setState((prevState, props) => ({
// shadow: { ...prevState.shadow, ...subscriptionData.data.shadowUpdated.data },
// }));
this.props.updateSubscriptionToStore(subscriptionData.data.shadowUpdated.data); this.props.updateSubscriptionToStore(subscriptionData.data.shadowUpdated.data);
}, },
}); });
...@@ -119,7 +116,6 @@ class SmartMeterDetailScreen extends Component { ...@@ -119,7 +116,6 @@ class SmartMeterDetailScreen extends Component {
], ],
}); });
} }
// console.log(this.state.shadow);
}; };
handleToggle = async value => { handleToggle = async value => {
...@@ -156,10 +152,8 @@ class SmartMeterDetailScreen extends Component { ...@@ -156,10 +152,8 @@ class SmartMeterDetailScreen extends Component {
setSubBreakersState = async () => { setSubBreakersState = async () => {
const { existedSubBreakersData, breakerStatus } = this.props; const { existedSubBreakersData, breakerStatus } = this.props;
let subBreakersInfo = []; let subBreakersInfo = [];
const subBreakersStatus = _.pick(breakerStatus, ['ML1', 'ML2', 'ML3', 'ML4']); const subBreakersStatus = _.pick(breakerStatus, ['ML1', 'ML2', 'ML3', 'ML4']);
// console.log('subBreakersStatus', subBreakersStatus);
existedSubBreakersData.map(mcbLink => { existedSubBreakersData.map(mcbLink => {
subBreakersInfo.push( subBreakersInfo.push(
mcbLink.map(subBreaker => mcbLink.map(subBreaker =>
...@@ -199,7 +193,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -199,7 +193,7 @@ class SmartMeterDetailScreen extends Component {
{description || 'No description'} {description || 'No description'}
</Text> </Text>
<Row style={theme.mt1}> <Row style={theme.mt1}>
<Text style={[theme.description, theme.textDark, { marginRight: 5 }]}> <Text style={[theme.description, theme.textDark, { marginRight: 16 }]}>
Status:{' '} Status:{' '}
<Text style={[theme.description, { color: isOnline ? color.success : color.primary }]}> <Text style={[theme.description, { color: isOnline ? color.success : color.primary }]}>
{isOnline ? 'Online' : 'Offline'} {isOnline ? 'Online' : 'Offline'}
...@@ -284,17 +278,19 @@ class SmartMeterDetailScreen extends Component { ...@@ -284,17 +278,19 @@ class SmartMeterDetailScreen extends Component {
backgroundColor: 'rgba(216,216,216,0.1)', backgroundColor: 'rgba(216,216,216,0.1)',
}} }}
> >
<Row <Row>
<Left style={{ flex: 4, alignSelf: 'stretch' }}>
<View style={{ felx: 1, alignSelf: 'stretch' }}>
<TouchableOpacity
onPress={() => onPress={() =>
this.props.navigation.navigate('McbLink', { this.props.navigation.navigate('McbLink', {
deviceId: this.deviceId,
mcbLink: mcbLink, mcbLink: mcbLink,
mcbIndex: indexMcbLinks, mcbIndex: indexMcbLinks,
subIndex: indexSubBreakers, subIndex: indexSubBreakers,
}) })
} }
> >
<Left style={{ flex: 4 }}>
<View>
<Text style={[theme.normalText, theme.textDark]}> <Text style={[theme.normalText, theme.textDark]}>
{subBreaker.name !== `Sub Breaker ${indexSubBreakers + 1}` {subBreaker.name !== `Sub Breaker ${indexSubBreakers + 1}`
? `Sub Breaker ${indexSubBreakers + 1} [${ ? `Sub Breaker ${indexSubBreakers + 1} [${
...@@ -307,6 +303,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -307,6 +303,7 @@ class SmartMeterDetailScreen extends Component {
<Text style={theme.description} numberOfLines={1}> <Text style={theme.description} numberOfLines={1}>
{subBreaker.description} {subBreaker.description}
</Text> </Text>
</TouchableOpacity>
</View> </View>
</Left> </Left>
<Right> <Right>
...@@ -338,7 +335,10 @@ class SmartMeterDetailScreen extends Component { ...@@ -338,7 +335,10 @@ class SmartMeterDetailScreen extends Component {
: `MCB Link ${indexMcbLinks + 1}`} : `MCB Link ${indexMcbLinks + 1}`}
</Text> </Text>
</Left> </Left>
<Right> <Right style={{ flexDirection: 'row', justifyContent: 'flex-end' }}>
<Text style={{ color: color.grey, marginRight: 10 }}>
{subBreakersInfo[indexMcbLinks] ? subBreakersInfo[indexMcbLinks].length : '0'}
</Text>
<Icon style={styles.mcbExpand} name={mcbLink.isExpand ? 'ios-arrow-up' : 'ios-arrow-down'} /> <Icon style={styles.mcbExpand} name={mcbLink.isExpand ? 'ios-arrow-up' : 'ios-arrow-down'} />
</Right> </Right>
</Row> </Row>
......
screens/Private/TimerScreen/TimerScreen.js
...@@ -209,6 +209,9 @@ class TimerScreen extends PureComponent { ...@@ -209,6 +209,9 @@ class TimerScreen extends PureComponent {
.valueOf() .valueOf()
); );
console.log('this.state.timer', this.state.timer);
console.log('saveTimer', saveTimer);
let timerData = { let timerData = {
isActive: this.state.isActive, isActive: this.state.isActive,
isPowerOn: this.state.isPowerOn, isPowerOn: this.state.isPowerOn,
...@@ -332,7 +335,10 @@ class TimerScreen extends PureComponent { ...@@ -332,7 +335,10 @@ class TimerScreen extends PureComponent {
<DatePicker <DatePicker
date={new Date(this.state.timer)} date={new Date(this.state.timer)}
onDateChange={date => this.setState({ timer: date })} onDateChange={date => {
console.log('date', date);
this.setState({ timer: date });
}}
mode="time" mode="time"
style={{ style={{
marginTop: 10, marginTop: 10,
......
screens/Public/LoginScreen.js
...@@ -15,7 +15,7 @@ class LoginScreen extends Component { ...@@ -15,7 +15,7 @@ class LoginScreen extends Component {
}; };
state = { state = {
isCheck: false, isCheck: true,
pass: '', pass: '',
passVisible: false, passVisible: false,
isModalVisible: false, isModalVisible: false,
...@@ -27,7 +27,7 @@ class LoginScreen extends Component { ...@@ -27,7 +27,7 @@ class LoginScreen extends Component {
const { email, password } = values; const { email, password } = values;
try { try {
const userCredential = await app.auth().signInWithEmailAndPassword(email, password); const userCredential = await app.auth().signInWithEmailAndPassword(email, password);
console.log(userCredential); // console.log(userCredential);
if (userCredential) { if (userCredential) {
await this.props.getCurrentUser(userCredential.user); await this.props.getCurrentUser(userCredential.user);
if (this.props.emailVerified && this.props.emailVerified === true) { if (this.props.emailVerified && this.props.emailVerified === true) {
......
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