Skip to content

S
safetcut-app
Commit 77afa811 by HaOuiha
Options

subscribtion detail page

parent a0ea765d
Showing with 130 additions and 108 deletions
components/MeterCard.js
...@@ -23,7 +23,7 @@ const MeterCard = ({ item, onPressEachCard, data, isFocused, ...rest }) => { ...@@ -23,7 +23,7 @@ const MeterCard = ({ item, onPressEachCard, data, isFocused, ...rest }) => {
document: SUBSCRIBE_SHADOW, document: SUBSCRIBE_SHADOW,
variables: { deviceid: item.deviceId }, variables: { deviceid: item.deviceId },
updateQuery: (prev, { subscriptionData }) => { updateQuery: (prev, { subscriptionData }) => {
console.log(subscriptionData); // console.log(subscriptionData);
if (subscriptionData.data.shadowUpdated.data.hasOwnProperty('SM1')) { if (subscriptionData.data.shadowUpdated.data.hasOwnProperty('SM1')) {
setBreakerStatus(subscriptionData.data.shadowUpdated.data.SM1.BK_S); setBreakerStatus(subscriptionData.data.shadowUpdated.data.SM1.BK_S);
} }
...@@ -56,7 +56,9 @@ const MeterCard = ({ item, onPressEachCard, data, isFocused, ...rest }) => { ...@@ -56,7 +56,9 @@ const MeterCard = ({ item, onPressEachCard, data, isFocused, ...rest }) => {
</Text> </Text>
</View> </View>
<View style={[theme.rowContainer, { position: 'absolute', top: 10, right: 5 }]}> <View style={[theme.rowContainer, { position: 'absolute', top: 10, right: 5 }]}>
<View style={[styles.online, { backgroundColor: item.isOnline ? '#10ca88' : color.primary }]} /> <View
style={[styles.online, { backgroundColor: item.onlineStatus === 1 ? '#10ca88' : color.primary }]}
/>
<Icon name={item.isSharing ? 'users' : 'user'} type="FontAwesome" style={styles.iconStyle} /> <Icon name={item.isSharing ? 'users' : 'user'} type="FontAwesome" style={styles.iconStyle} />
<Icon name="wifi" type="FontAwesome" style={styles.iconStyle} /> <Icon name="wifi" type="FontAwesome" style={styles.iconStyle} />
</View> </View>
......
reduxStore/actions/allMainDeviceAction.js
import app, { fireStore, baseURL } from '../../firebase'; import { fireStore } from '../../firebase';
import _ from 'lodash'; import _ from 'lodash';
import { apolloQuery, READ_SHADOW } from '../../utils/apollo/apollo'; import { apolloQuery, READ_SHADOW, QUERY_ONLINE_STATUS } from '../../utils/apollo/apollo';
export const GET_ALL_MAIN_DEVICE_INFO = 'GET_ALL_MAIN_DEVICE_INFO'; export const GET_ALL_MAIN_DEVICE_INFO = 'GET_ALL_MAIN_DEVICE_INFO';
export const GET_ALL_MAIN_DEVICE_INFO_LOADING = 'GET_ALL_MAIN_DEVICE_INFO_LOADING'; export const GET_ALL_MAIN_DEVICE_INFO_LOADING = 'GET_ALL_MAIN_DEVICE_INFO_LOADING';
...@@ -49,10 +49,10 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => { ...@@ -49,10 +49,10 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => {
.get(); .get();
let ownerDeviceInfoData = ownerDeviceInfo.data(); let ownerDeviceInfoData = ownerDeviceInfo.data();
const breakerStatus = await getBreakerStatus(deviceId); const { breakerStatus, onlineStatus } = await getBreakerStatus(deviceId);
allMainDeviceInfoData.push( allMainDeviceInfoData.push(
Object.assign(ownerDeviceInfoData, { deviceId, isSharing: false, breakerStatus }) Object.assign(ownerDeviceInfoData, { deviceId, isSharing: false, breakerStatus, onlineStatus })
); );
}) })
); );
...@@ -65,10 +65,10 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => { ...@@ -65,10 +65,10 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => {
.get(); .get();
let sharingDeviceInfoData = sharingDeviceInfo.data(); let sharingDeviceInfoData = sharingDeviceInfo.data();
const breakerStatus = await getBreakerStatus(deviceId); const { breakerStatus, onlineStatus } = await getBreakerStatus(deviceId);
allMainDeviceInfoData.push( allMainDeviceInfoData.push(
Object.assign(sharingDeviceInfoData, { deviceId, isSharing: true, breakerStatus }) Object.assign(sharingDeviceInfoData, { deviceId, isSharing: true, breakerStatus, onlineStatus })
); );
}) })
); );
...@@ -94,22 +94,16 @@ const getBreakerStatus = async deviceId => { ...@@ -94,22 +94,16 @@ const getBreakerStatus = async deviceId => {
}, },
} = await apolloQuery(READ_SHADOW, { deviceid: deviceId }); } = await apolloQuery(READ_SHADOW, { deviceid: deviceId });
// const hello = await apolloSubscription(READ_SHADOW, { deviceid: deviceId }, SUBSCRIBE_SHADOW, { const res = await apolloQuery(QUERY_ONLINE_STATUS, { deviceid: deviceId });
// deviceid: deviceId, const onlineStatus = res.data.device[0].status;
// }); // console.log(onlineStatus);
// console.log('hello', hello);
// const res = await apolloSubscription(READ_SHADOW, { deviceid: deviceId });
// console.log(res);
const tempBreakerStatus = _.pick(data, ['SM1']); const tempBreakerStatus = _.pick(data, ['SM1']);
const breakerStatus = tempBreakerStatus.SM1.BK_S; const breakerStatus = tempBreakerStatus.SM1.BK_S;
return breakerStatus; return { breakerStatus, onlineStatus };
} catch (e) { } catch (e) {
// alert('Something went wrong!!'); // alert('Something went wrong!!');
console.log(e); console.log(e);
return 0; return { breakerStatus: 0, onlineStatus: 0 };
} }
}; };
reduxStore/actions/currentSelectedAction.js
import { fireStore } from '../../firebase'; import { fireStore } from '../../firebase';
import _ from 'lodash'; import _ from 'lodash';
import { apolloQuery, apolloMutation, READ_SHADOW, WRITE_SHADOW } from '../../utils/apollo/apollo'; import { apolloQuery, apolloMutation, READ_SHADOW, WRITE_SHADOW, QUERY_ONLINE_STATUS } from '../../utils/apollo/apollo';
import { import {
getExistedConnectedDeviceAction, getExistedConnectedDeviceAction,
getExistedMcbLinksDataAction, getExistedMcbLinksDataAction,
...@@ -14,7 +14,9 @@ export const GET_CURRENT_SELECTED_DATA_ERROR = 'GET_CURRENT_SELECTED_DATA_ERROR' ...@@ -14,7 +14,9 @@ export const GET_CURRENT_SELECTED_DATA_ERROR = 'GET_CURRENT_SELECTED_DATA_ERROR'
export const GET_CURRENT_SELECTED_SHADOW = 'GET_CURRENT_SELECTED_SHADOW'; export const GET_CURRENT_SELECTED_SHADOW = 'GET_CURRENT_SELECTED_SHADOW';
export const GET_BREAKERS_STATUS_SHADOW = 'GET_BREAKER_STATUS_SHADOW'; export const GET_BREAKERS_STATUS_SHADOW = 'GET_BREAKER_STATUS_SHADOW';
export const SET_DESIRED_BREAKERS_STATUS_SHADOW = 'SET_DESIRED_BREAKERS_STATUS_SHADOW'; export const GET_ONLINE_STATUS = 'GET_ONLINE_STATUS';
// export const SET_DESIRED_BREAKERS_STATUS_SHADOW = 'SET_DESIRED_BREAKERS_STATUS_SHADOW';
export const getCurrentSelectedDataAction = currentSelectedData => ({ export const getCurrentSelectedDataAction = currentSelectedData => ({
type: GET_CURRENT_SELECTED_DATA, type: GET_CURRENT_SELECTED_DATA,
...@@ -41,6 +43,11 @@ export const getBreakersStatusAction = breakerStatus => ({ ...@@ -41,6 +43,11 @@ export const getBreakersStatusAction = breakerStatus => ({
breakerStatus, breakerStatus,
}); });
export const getOnlineStatusAction = onlineStatus => ({
type: GET_ONLINE_STATUS,
onlineStatus,
});
export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) => { export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { currentSelectedData } = currentSelectedDeviceReducer; const { currentSelectedData } = currentSelectedDeviceReducer;
...@@ -53,7 +60,6 @@ export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) = ...@@ -53,7 +60,6 @@ export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) =
}, },
} = await apolloQuery(READ_SHADOW, { deviceid: deviceId || selectedDeviceId }); } = await apolloQuery(READ_SHADOW, { deviceid: deviceId || selectedDeviceId });
// const tempBreakersStatus = _.pick(value, ['CMD_MSG', 'SM1', 'MD_STA', 'ML0', 'ML1', 'ML2', 'ML3', 'ML4']);
const tempBreakersStatus = _.pick(data, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']); const tempBreakersStatus = _.pick(data, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']);
const breakersStatus = { ...tempBreakersStatus, SM1: { BK_S: tempBreakersStatus.SM1.BK_S } }; const breakersStatus = { ...tempBreakersStatus, SM1: { BK_S: tempBreakersStatus.SM1.BK_S } };
...@@ -77,8 +83,12 @@ export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) = ...@@ -77,8 +83,12 @@ export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) =
} }
} }
const res = await apolloQuery(QUERY_ONLINE_STATUS, { deviceid: deviceId });
const onlineStatus = res.data.device[0].status;
dispatch(getOnlineStatusAction(onlineStatus));
dispatch(getBreakersStatusAction(breakersStatus)); dispatch(getBreakersStatusAction(breakersStatus));
dispatch(getCurrentSelectedShadowAction(shadowValue || null)); dispatch(getCurrentSelectedShadowAction(shadowValue));
} catch (error) { } catch (error) {
dispatch(errorAction(error.message || error || 'Error')); dispatch(errorAction(error.message || error || 'Error'));
} }
...@@ -127,8 +137,12 @@ export const getCurrentSelectedData = (deviceId, showLoading) => async dispatch ...@@ -127,8 +137,12 @@ export const getCurrentSelectedData = (deviceId, showLoading) => async dispatch
} }
} }
const res = await apolloQuery(QUERY_ONLINE_STATUS, { deviceid: deviceId });
const onlineStatus = res.data.device[0].status;
dispatch(getOnlineStatusAction(onlineStatus));
dispatch(getBreakersStatusAction(breakersStatus)); dispatch(getBreakersStatusAction(breakersStatus));
dispatch(getCurrentSelectedShadowAction(shadowValue || null)); dispatch(getCurrentSelectedShadowAction(shadowValue));
dispatch(getCurrentSelectedDataAction(currentSelectedDeviceDataMoreInfo)); dispatch(getCurrentSelectedDataAction(currentSelectedDeviceDataMoreInfo));
showLoading && dispatch(loadingAction(false)); showLoading && dispatch(loadingAction(false));
} catch (error) { } catch (error) {
...@@ -137,6 +151,34 @@ export const getCurrentSelectedData = (deviceId, showLoading) => async dispatch ...@@ -137,6 +151,34 @@ export const getCurrentSelectedData = (deviceId, showLoading) => async dispatch
} }
}; };
export const updateSubscriptionToStore = newWholeShadow => async dispatch => {
const tempBreakersStatus = _.pick(newWholeShadow, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']);
const breakersStatus = { ...tempBreakersStatus, SM1: { BK_S: tempBreakersStatus.SM1.BK_S } };
let shadowTimers = [];
let shadowValue = null;
for (let i = 1; i <= 4; i++) {
for (let j = 1; j <= 8; j++) {
shadowTimers.push(`L${i}B${j}T`);
shadowValue = _.omit(newWholeShadow, [
'CMD_MSG',
'TIME_NOW',
'TIME_ZONE',
'VERSION',
'ML1',
'ML2',
'ML3',
'ML4',
'MAB1T',
...shadowTimers,
]);
}
}
dispatch(getBreakersStatusAction(breakersStatus));
dispatch(getCurrentSelectedShadowAction(shadowValue));
};
export const updateDetail = (type, value) => async (dispatch, getState) => { export const updateDetail = (type, value) => async (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { currentSelectedData } = currentSelectedDeviceReducer; const { currentSelectedData } = currentSelectedDeviceReducer;
...@@ -175,11 +217,13 @@ export const updateDetail = (type, value) => async (dispatch, getState) => { ...@@ -175,11 +217,13 @@ export const updateDetail = (type, value) => async (dispatch, getState) => {
} }
}; };
export const setMainStatus = settingValue => async (dispatch, getState) => { export const setMainStatus = settingValue => (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer; const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer;
const selectedDeviceId = currentSelectedData.deviceId; const selectedDeviceId = currentSelectedData.deviceId;
console.log(settingValue);
const command = () => { const command = () => {
switch (settingValue) { switch (settingValue) {
case true: case true:
...@@ -188,39 +232,18 @@ export const setMainStatus = settingValue => async (dispatch, getState) => { ...@@ -188,39 +232,18 @@ export const setMainStatus = settingValue => async (dispatch, getState) => {
return 'MAIN_OFF'; return 'MAIN_OFF';
} }
}; };
const data = { data: { CMD_MSG: { MSG1: command() } } }; const writingCommand = { CMD_MSG: { MSG1: command() } };
try { try {
const desiredBreakerStatus = { ...breakerStatus, SM1: { BK_S: settingValue ? 1 : 0 } }; const desiredBreakerStatus = { ...breakerStatus, SM1: { BK_S: settingValue ? 1 : 0 } };
dispatch(getBreakersStatusAction(desiredBreakerStatus)); dispatch(getBreakersStatusAction(desiredBreakerStatus));
await apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: data }); apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: writingCommand });
/*---------------polling-----------------*/
// let countTimes = 0;
// const queryShadowInterval = setInterval(async () => {
// const {
// data: {
// shadow: { data },
// },
// } = await apolloQuery(READ_SHADOW, { deviceid: selectedDeviceId });
// const tempBreakersStatus = _.pick(data, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']);
// const breakersStatus = { ...tempBreakersStatus, SM1: { BK_S: tempBreakersStatus.SM1.BK_S } };
// countTimes === 3 && dispatch(getBreakersStatusAction(breakersStatus));
// // console.log(countTimes);
// if (countTimes >= 3) {
// clearInterval(queryShadowInterval);
// countTimes = 0;
// }
// ++countTimes;
// }, 3000);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
}; };
export const setSubBreakerStatus = (settingValue, MainIndex, SubIndex) => async (dispatch, getState) => { export const setSubBreakerStatus = (settingValue, MainIndex, SubIndex) => (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer; const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer;
const selectedDeviceId = currentSelectedData.deviceId; const selectedDeviceId = currentSelectedData.deviceId;
...@@ -233,7 +256,7 @@ export const setSubBreakerStatus = (settingValue, MainIndex, SubIndex) => async ...@@ -233,7 +256,7 @@ export const setSubBreakerStatus = (settingValue, MainIndex, SubIndex) => async
return `L${MainIndex + 1}B${SubIndex + 1}_OFF`; return `L${MainIndex + 1}B${SubIndex + 1}_OFF`;
} }
}; };
const data = { data: { CMD_MSG: { MSG1: command() } } }; const writingCommand = { CMD_MSG: { MSG1: command() } };
try { try {
const desiredBreakerStatus = { const desiredBreakerStatus = {
...@@ -243,30 +266,8 @@ export const setSubBreakerStatus = (settingValue, MainIndex, SubIndex) => async ...@@ -243,30 +266,8 @@ export const setSubBreakerStatus = (settingValue, MainIndex, SubIndex) => async
[`L${MainIndex + 1}B${SubIndex + 1}`]: settingValue ? 1 : 0, [`L${MainIndex + 1}B${SubIndex + 1}`]: settingValue ? 1 : 0,
}, },
}; };
// console.log('desiredBreakerStatus55', desiredBreakerStatus);
dispatch(getBreakersStatusAction(desiredBreakerStatus)); dispatch(getBreakersStatusAction(desiredBreakerStatus));
await apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: data }); apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: writingCommand });
/*---------------polling-----------------*/
// let countTimes = 0;
// const queryShadowInterval = setInterval(async () => {
// const {
// data: {
// shadow: { data },
// },
// } = await apolloQuery(READ_SHADOW, { deviceid: selectedDeviceId });
// const breakersStatus = _.pick(data, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']);
// // console.log('BreakerStatus_polling', breakersStatus);
// countTimes === 3 && dispatch(getBreakersStatusAction(breakersStatus));
// if (countTimes >= 3) {
// clearInterval(queryShadowInterval);
// countTimes = 0;
// }
// ++countTimes;
// }, 3000);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
......
reduxStore/reducers/currentSelectedReducer.js
...@@ -4,6 +4,7 @@ import { ...@@ -4,6 +4,7 @@ import {
GET_CURRENT_SELECTED_DATA_ERROR, GET_CURRENT_SELECTED_DATA_ERROR,
GET_CURRENT_SELECTED_SHADOW, GET_CURRENT_SELECTED_SHADOW,
GET_BREAKERS_STATUS_SHADOW, GET_BREAKERS_STATUS_SHADOW,
GET_ONLINE_STATUS,
// SET_DESIRED_BREAKERS_STATUS_SHADOW, // SET_DESIRED_BREAKERS_STATUS_SHADOW,
} from '../actions/currentSelectedAction'; } from '../actions/currentSelectedAction';
...@@ -13,6 +14,7 @@ const initState = { ...@@ -13,6 +14,7 @@ const initState = {
isLoading: true, isLoading: true,
error: null, error: null,
breakerStatus: null, breakerStatus: null,
onlineStatus: null,
// desiredBreakerStatus: null, // desiredBreakerStatus: null,
}; };
...@@ -29,6 +31,8 @@ const currentSelectedDeviceReducer = (state = initState, action) => { ...@@ -29,6 +31,8 @@ const currentSelectedDeviceReducer = (state = initState, action) => {
case GET_BREAKERS_STATUS_SHADOW: case GET_BREAKERS_STATUS_SHADOW:
return { ...state, breakerStatus: action.breakerStatus }; return { ...state, breakerStatus: action.breakerStatus };
case GET_ONLINE_STATUS:
return { ...state, onlineStatus: action.onlineStatus };
// case SET_DESIRED_BREAKERS_STATUS_SHADOW: // case SET_DESIRED_BREAKERS_STATUS_SHADOW:
// return { ...state, desiredBreakerStatus: action.desiredBreakerStatus }; // return { ...state, desiredBreakerStatus: action.desiredBreakerStatus };
......
screens/Private/SmartMeterScreen/SmartMeterDetailScreen.js
...@@ -10,11 +10,14 @@ import { ...@@ -10,11 +10,14 @@ import {
loadingAction, loadingAction,
setMainStatus, setMainStatus,
setSubBreakerStatus, setSubBreakerStatus,
updateSubscriptionToStore,
} from '../../../reduxStore/actions/currentSelectedAction'; } from '../../../reduxStore/actions/currentSelectedAction';
import { getTimers, loadingTimersAction, errorTimersAction } from '../../../reduxStore/actions/timersAction'; import { getTimers, loadingTimersAction, errorTimersAction } from '../../../reduxStore/actions/timersAction';
import { isIphoneX } from '../../../utils/isPhoneX'; import { isIphoneX } from '../../../utils/isPhoneX';
import { withNavigationFocus } from 'react-navigation'; import { withNavigationFocus } from 'react-navigation';
import _ from 'lodash'; import _ from 'lodash';
import { graphql } from '@apollo/react-hoc';
import { READ_SHADOW, SUBSCRIBE_SHADOW } from '../../../utils/apollo/apollo';
class SmartMeterDetailScreen extends Component { class SmartMeterDetailScreen extends Component {
static navigationOptions = ({ navigation }) => { static navigationOptions = ({ navigation }) => {
...@@ -50,21 +53,39 @@ class SmartMeterDetailScreen extends Component { ...@@ -50,21 +53,39 @@ class SmartMeterDetailScreen extends Component {
{ name: 'Units/KWh', limit: 1000, value: 0, unit: '' }, { name: 'Units/KWh', limit: 1000, value: 0, unit: '' },
{ name: 'Arcing Fault', limit: 1000, value: 0, unit: '' }, { name: 'Arcing Fault', limit: 1000, value: 0, unit: '' },
], ],
shadow: null,
}; };
_mcbLinksListMounted = false; _mcbLinksListMounted = false;
getDataInterval = null; getDataInterval = null;
deviceId = this.props.navigation.getParam('deviceId'); deviceId = this.props.navigation.getParam('deviceId');
unsubscribeShadow = null;
subscribeToNewShadow = subscribeToMore => {
this.unsubscribeShadow = subscribeToMore({
document: SUBSCRIBE_SHADOW,
variables: { deviceid: this.deviceId },
updateQuery: (prev, { subscriptionData }) => {
this.setState((prevState, props) => ({
shadow: { ...prevState.shadow, ...subscriptionData.data.shadowUpdated.data },
}));
this.props.updateSubscriptionToStore(this.state.shadow);
},
});
};
getData = async () => { getData = async () => {
await this.props.getCurrentSelectedData(this.deviceId, true); await this.props.getCurrentSelectedData(this.deviceId, true);
await this.props.getTimers(); await this.props.getTimers();
// this.getDataInterval = setInterval(() => this.props.getCurrentSelectedData(this.deviceId), 6000);
}; };
componentDidMount = async () => { componentDidMount = async () => {
// console.log(this.state);
// console.log(this.props);
await this.getData(); await this.getData();
this.setState({ shadow: this.props.data.shadow.data });
this.subscribeToNewShadow(this.props.data.subscribeToMore);
}; };
componentDidUpdate = (prevProps, prevState) => { componentDidUpdate = (prevProps, prevState) => {
...@@ -85,15 +106,8 @@ class SmartMeterDetailScreen extends Component { ...@@ -85,15 +106,8 @@ class SmartMeterDetailScreen extends Component {
this.setSubBreakersState(); this.setSubBreakersState();
} }
if (prevProps.isFocused !== this.props.isFocused) { if (prevProps.isFocused !== this.props.isFocused) {
// if (this.props.isFocused === true) { this.props.isFocused === true && this.subscribeToNewShadow(this.props.data.subscribeToMore);
// clearInterval(this.getDataInterval); this.props.isFocused === false && this.unsubscribeShadow();
// this.getDataInterval = setInterval(() => this.props.getCurrentSelectedData(this.deviceId), 6000);
// }
// when not focud this page
// if (this.props.isFocused === false) {
// this._mcbLinksListMounted = false;
// clearInterval(this.getDataInterval);
// }
} }
if (prevProps.shadow !== this.props.shadow) { if (prevProps.shadow !== this.props.shadow) {
this.setState({ this.setState({
...@@ -107,29 +121,29 @@ class SmartMeterDetailScreen extends Component { ...@@ -107,29 +121,29 @@ class SmartMeterDetailScreen extends Component {
], ],
}); });
} }
// console.log(this.state.shadow);
}; };
handleToggle = async value => { handleToggle = async value => {
// clearInterval(this.getDataInterval);
this.setState({ isWaiting: true }); this.setState({ isWaiting: true });
await this.props.setMainStatus(value); await this.props.setMainStatus(value);
this.setState({ isWaiting: false }); this.setState({ isWaiting: false });
// this.getDataInterval = setInterval(() => this.props.getCurrentSelectedData(this.deviceId), 6000);
}; };
componentWillUnmount = () => { componentWillUnmount = () => {
//reset new loading to redux; fix blink screen //reset new loading to redux; fix blink screen
this.props.loadingAction(true); this.props.loadingAction(true);
this.props.loadingTimersAction(true); this.props.loadingTimersAction(true);
this.unsubscribeShadow();
}; };
setMainCardData = async () => { setMainCardData = async () => {
const { currentSelectedData, breakerStatus } = this.props; const { currentSelectedData, breakerStatus, onlineStatus } = this.props;
this.setState({ this.setState({
description: currentSelectedData.description, description: currentSelectedData.description,
name: currentSelectedData.name, name: currentSelectedData.name,
rcbo: currentSelectedData.rcbo, rcbo: currentSelectedData.rcbo,
isOnline: currentSelectedData.isOnline, isOnline: onlineStatus === 1 ? true : false,
isPowerOn: breakerStatus ? breakerStatus.SM1.BK_S : false, isPowerOn: breakerStatus ? breakerStatus.SM1.BK_S : false,
}); });
}; };
...@@ -146,7 +160,6 @@ class SmartMeterDetailScreen extends Component { ...@@ -146,7 +160,6 @@ class SmartMeterDetailScreen extends Component {
const subBreakersStatus = _.pick(breakerStatus, ['ML1', 'ML2', 'ML3', 'ML4']); const subBreakersStatus = _.pick(breakerStatus, ['ML1', 'ML2', 'ML3', 'ML4']);
// console.log('subBreakersStatus', subBreakersStatus); // console.log('subBreakersStatus', subBreakersStatus);
existedSubBreakersData.map(mcbLink => { existedSubBreakersData.map(mcbLink => {
subBreakersInfo.push( subBreakersInfo.push(
mcbLink.map(subBreaker => mcbLink.map(subBreaker =>
...@@ -161,7 +174,6 @@ class SmartMeterDetailScreen extends Component { ...@@ -161,7 +174,6 @@ class SmartMeterDetailScreen extends Component {
) )
); );
}); });
this.setState({ subBreakersInfo }); this.setState({ subBreakersInfo });
}; };
...@@ -256,11 +268,9 @@ class SmartMeterDetailScreen extends Component { ...@@ -256,11 +268,9 @@ class SmartMeterDetailScreen extends Component {
const renderSubBreaker = (subBreaker, indexSubBreakers) => { const renderSubBreaker = (subBreaker, indexSubBreakers) => {
const handleOnPressSubBreakerSwitch = async value => { const handleOnPressSubBreakerSwitch = async value => {
// clearInterval(this.getDataInterval);
this.setState({ isWaiting: true }); this.setState({ isWaiting: true });
await this.props.setSubBreakerStatus(value, indexMcbLinks, indexSubBreakers); await this.props.setSubBreakerStatus(value, indexMcbLinks, indexSubBreakers);
this.setState({ isWaiting: false }); this.setState({ isWaiting: false });
// this.getDataInterval = setInterval(() => this.props.getCurrentSelectedData(this.deviceId), 6000);
}; };
return ( return (
...@@ -345,6 +355,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -345,6 +355,7 @@ class SmartMeterDetailScreen extends Component {
render() { render() {
const { mcbLinksInfo } = this.state; const { mcbLinksInfo } = this.state;
const { isLoadingValues, isLoadingList, isFocused } = this.props; const { isLoadingValues, isLoadingList, isFocused } = this.props;
const isRefreshing = () => this._mcbLinksListMounted && (isLoadingList || isLoadingValues);
return isFocused ? ( return isFocused ? (
<ScrollView <ScrollView
...@@ -352,7 +363,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -352,7 +363,7 @@ class SmartMeterDetailScreen extends Component {
contentContainerStyle={[theme.containerWithPadding]} contentContainerStyle={[theme.containerWithPadding]}
refreshControl={ refreshControl={
<RefreshControl <RefreshControl
refreshing={this._mcbLinksListMounted && (isLoadingList || isLoadingValues)} refreshing={isRefreshing()}
onRefresh={async () => { onRefresh={async () => {
await this.getData(); await this.getData();
this.props.errorTimersAction(null); this.props.errorTimersAction(null);
...@@ -406,6 +417,7 @@ const mapStateToProps = state => ({ ...@@ -406,6 +417,7 @@ const mapStateToProps = state => ({
shadow: state.currentSelectedDeviceReducer.shadow, shadow: state.currentSelectedDeviceReducer.shadow,
breakerStatus: state.currentSelectedDeviceReducer.breakerStatus, breakerStatus: state.currentSelectedDeviceReducer.breakerStatus,
onlineStatus: state.currentSelectedDeviceReducer.onlineStatus,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {
...@@ -417,14 +429,19 @@ const mapDispatchToProps = { ...@@ -417,14 +429,19 @@ const mapDispatchToProps = {
setMainStatus, setMainStatus,
errorTimersAction, errorTimersAction,
setSubBreakerStatus, setSubBreakerStatus,
updateSubscriptionToStore,
}; };
const withNavSmartMeterDetailScreen = withNavigationFocus(SmartMeterDetailScreen); const WithSubscription = graphql(READ_SHADOW, {
options: props => ({ variables: { deviceid: props.navigation.getParam('deviceId') } }),
});
const enhancedScreen = WithSubscription(withNavigationFocus(SmartMeterDetailScreen));
export default connect( export default connect(
mapStateToProps, mapStateToProps,
mapDispatchToProps mapDispatchToProps
)(withNavSmartMeterDetailScreen); )(enhancedScreen);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
currentCard: { currentCard: {
......
screens/Public/AuthLoadingScreen.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { ActivityIndicator, View, Image } from 'react-native'; import { View, Image } from 'react-native';
import AsyncStorage from '@react-native-community/async-storage'; import AsyncStorage from '@react-native-community/async-storage';
import logo from '../../assets/images/logo2.png'; import logo from '../../assets/images/logo2.png';
import { width } from '../../constants/Layout'; import { width } from '../../constants/Layout';
import app from '../../firebase'; import app from '../../firebase';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { getCurrentUser } from '../../reduxStore/actions/cerrentUserAction'; import { getCurrentUser } from '../../reduxStore/actions/cerrentUserAction';
// import { fireStore } from '../../firebase';
class AuthLoadingScreen extends Component { class AuthLoadingScreen extends Component {
static navigationOptions = { static navigationOptions = {
...@@ -21,12 +20,11 @@ class AuthLoadingScreen extends Component { ...@@ -21,12 +20,11 @@ class AuthLoadingScreen extends Component {
}; };
_isMounted = false; _isMounted = false;
showLogoThenIndicator = () => { // showLogoThenIndicator = () => {
setTimeout(() => this._isMounted && this.setState({ isShowImg: false }), 1200); // 1200 // setTimeout(() => this._isMounted && this.setState({ isShowImg: false }), 1200); // 1200
}; // };
bootstrapAsync = async () => { bootstrapAsync = async () => {
this.showLogoThenIndicator();
try { try {
// Preload data from an external API && Preload data using AsyncStorage // Preload data from an external API && Preload data using AsyncStorage
const alreadyLaunched = await AsyncStorage.getItem('alreadyLaunched'); const alreadyLaunched = await AsyncStorage.getItem('alreadyLaunched');
...@@ -64,11 +62,7 @@ class AuthLoadingScreen extends Component { ...@@ -64,11 +62,7 @@ class AuthLoadingScreen extends Component {
render() { render() {
return ( return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}> <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
{this.state.isShowImg ? ( <Image style={{ width: width * 0.9, resizeMode: 'contain' }} source={logo} />
<Image style={{ width: width * 0.9, resizeMode: 'contain' }} source={logo} />
) : (
<ActivityIndicator size="large" color="#f44c4c" />
)}
</View> </View>
); );
} }
......
utils/apollo/apollo.js
...@@ -65,6 +65,7 @@ const apolloMutation = async (mutation, variables) => { ...@@ -65,6 +65,7 @@ const apolloMutation = async (mutation, variables) => {
mutation, mutation,
variables, variables,
errorPolicy: 'all', errorPolicy: 'all',
fetchPolicy: 'no-cache',
}); });
}; };
...@@ -82,7 +83,7 @@ const READ_SHADOW = gql` ...@@ -82,7 +83,7 @@ const READ_SHADOW = gql`
const WRITE_SHADOW = gql` const WRITE_SHADOW = gql`
mutation($deviceid: String!, $data: JSON!) { mutation($deviceid: String!, $data: JSON!) {
writeShadow(deviceid: $deviceid, value: $data) { writeShadow(deviceid: $deviceid, data: $data) {
data data
} }
} }
...@@ -103,7 +104,16 @@ const QUERY_DEVICE_BY_TAG = gql` ...@@ -103,7 +104,16 @@ const QUERY_DEVICE_BY_TAG = gql`
} }
} }
`; `;
export { READ_SHADOW, WRITE_SHADOW, QUERY_DEVICE_BY_TAG, SUBSCRIBE_SHADOW };
const QUERY_ONLINE_STATUS = gql`
query($deviceid: String!) {
device(deviceid: $deviceid) {
status
}
}
`;
export { READ_SHADOW, WRITE_SHADOW, SUBSCRIBE_SHADOW };
export { QUERY_DEVICE_BY_TAG, QUERY_ONLINE_STATUS };
// const apolloSubscription = async (query, queryVariables, subscribe, subscribeVariables) => { // const apolloSubscription = async (query, queryVariables, subscribe, subscribeVariables) => {
// const queryData = client.watchQuery({ // const queryData = client.watchQuery({
......
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