Skip to content

S
safetcut-app
Commit edfa5612 by HaOuiha
Options

update behavier toggle switch

parent 589e7bf9
Showing with 83 additions and 132 deletions
reduxStore/actions/currentSelectedAction.js
import app, { fireStore, baseURL } 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 } from '../../utils/apollo/apollo';
import { getExistedConnectedDeviceAction } from './timersAction'; import { getExistedConnectedDeviceAction } from './timersAction';
...@@ -54,8 +54,11 @@ export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) = ...@@ -54,8 +54,11 @@ 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(value, ['CMD_MSG', 'SM1', 'MD_STA', 'ML0', 'ML1', 'ML2', 'ML3', 'ML4']);
const tempBreakersStatus = _.pick(value, ['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 } };
console.log('breakersStatus', breakersStatus);
dispatch(getBreakersStatusAction(breakersStatus)); dispatch(getBreakersStatusAction(breakersStatus));
dispatch(getCurrentSelectedShadowAction(value || null)); dispatch(getCurrentSelectedShadowAction(value || null));
...@@ -83,8 +86,9 @@ export const getCurrentSelectedData = deviceId => async dispatch => { ...@@ -83,8 +86,9 @@ export const getCurrentSelectedData = deviceId => async dispatch => {
}, },
} = 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(value, ['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 } };
console.log('breakersStatus', breakersStatus);
dispatch(getBreakersStatusAction(breakersStatus)); dispatch(getBreakersStatusAction(breakersStatus));
dispatch(getCurrentSelectedShadowAction(value || null)); dispatch(getCurrentSelectedShadowAction(value || null));
...@@ -133,13 +137,13 @@ export const updateDetail = (type, value) => async (dispatch, getState) => { ...@@ -133,13 +137,13 @@ export const updateDetail = (type, value) => async (dispatch, getState) => {
} }
}; };
export const setMainStatus = value => async (dispatch, getState) => { export const setMainStatus = settingValue => async (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer; const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer;
const selectedDeviceId = currentSelectedData.deviceId; const selectedDeviceId = currentSelectedData.deviceId;
const command = () => { const command = () => {
switch (value) { switch (settingValue) {
case true: case true:
return 'MAIN_ON'; return 'MAIN_ON';
case false: case false:
...@@ -149,31 +153,42 @@ export const setMainStatus = value => async (dispatch, getState) => { ...@@ -149,31 +153,42 @@ export const setMainStatus = value => async (dispatch, getState) => {
const data = { data: { CMD_MSG: { MSG1: command() } } }; const data = { data: { CMD_MSG: { MSG1: command() } } };
try { try {
const desiredBreakerStatus = { ...breakerStatus, SM1: { BK_S: settingValue ? 1 : 0 } };
dispatch(getBreakersStatusAction(desiredBreakerStatus));
await apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: data });
/*---------------polling-----------------*/
let countTimes = 0;
const queryShadowInterval = setInterval(async () => {
const { const {
data: { data: {
writeShadow: { shadow: { value },
value: { CMD_MSG },
},
}, },
} = await apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: data }); } = await apolloQuery(READ_SHADOW, { deviceid: selectedDeviceId });
console.log(value);
console.log('CMD_MSG', CMD_MSG); const tempBreakersStatus = _.pick(value, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']);
const desiredBreakerStatus = { ...breakerStatus, CMD_MSG, SM1: { ...breakerStatus.SM1, BK_S: value ? 1 : 0 } }; const breakersStatus = { ...tempBreakersStatus, SM1: { BK_S: tempBreakersStatus.SM1.BK_S } };
console.log('new', desiredBreakerStatus); dispatch(getBreakersStatusAction(breakersStatus));
dispatch(setDesiredSahdowAction(desiredBreakerStatus)); ++countTimes;
// console.log(countTimes);
if (countTimes >= 2) {
clearInterval(queryShadowInterval);
countTimes = 0;
}
}, 3000);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
}; };
export const setSubBreakerStatus = (value, MainIndex, SubIndex) => async (dispatch, getState) => { export const setSubBreakerStatus = (settingValue, MainIndex, SubIndex) => async (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer; const { currentSelectedData, breakerStatus } = currentSelectedDeviceReducer;
const selectedDeviceId = currentSelectedData.deviceId; const selectedDeviceId = currentSelectedData.deviceId;
const command = () => { const command = () => {
switch (value) { switch (settingValue) {
case true: case true:
return `L${MainIndex + 1}B${SubIndex + 1}_ON`; return `L${MainIndex + 1}B${SubIndex + 1}_ON`;
case false: case false:
...@@ -183,26 +198,37 @@ export const setSubBreakerStatus = (value, MainIndex, SubIndex) => async (dispat ...@@ -183,26 +198,37 @@ export const setSubBreakerStatus = (value, MainIndex, SubIndex) => async (dispat
const data = { data: { CMD_MSG: { MSG1: command() } } }; const data = { data: { CMD_MSG: { MSG1: command() } } };
try { try {
const {
data: {
writeShadow: {
value: { CMD_MSG },
},
},
} = await apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: data });
console.log(value);
console.log('CMD_MSG', CMD_MSG);
const desiredBreakerStatus = { const desiredBreakerStatus = {
...breakerStatus, ...breakerStatus,
CMD_MSG, [`ML${MainIndex + 1}`]: {
[`ML${MainIndex}`]: { ...breakerStatus[`ML${MainIndex + 1}`],
...breakerStatus[`ML${MainIndex}`], [`L${MainIndex + 1}B${SubIndex + 1}`]: settingValue ? 1 : 0,
[`L${MainIndex + 1}B${SubIndex + 1}`]: value ? 1 : 0,
}, },
}; };
console.log('new', desiredBreakerStatus); // console.log('desiredBreakerStatus55', desiredBreakerStatus);
dispatch(setDesiredSahdowAction(desiredBreakerStatus)); dispatch(getBreakersStatusAction(desiredBreakerStatus));
await apolloMutation(WRITE_SHADOW, { deviceid: selectedDeviceId, data: data });
/*---------------polling-----------------*/
let countTimes = 0;
const queryShadowInterval = setInterval(async () => {
const {
data: {
shadow: { value },
},
} = await apolloQuery(READ_SHADOW, { deviceid: selectedDeviceId });
const breakersStatus = _.pick(value, ['SM1', 'ML1', 'ML2', 'ML3', 'ML4']);
// console.log('BreakerStatus_polling', breakersStatus);
dispatch(getBreakersStatusAction(breakersStatus));
++countTimes;
if (countTimes >= 2) {
clearInterval(queryShadowInterval);
countTimes = 0;
}
}, 3000);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
......
screens/Private/SmartMeterScreen/SmartMeterDetailScreen.js
...@@ -14,6 +14,7 @@ import { ...@@ -14,6 +14,7 @@ import {
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';
const MockData = [ const MockData = [
{ name: 'AC Volt', limit: 1000, value: 100, unit: 'V' }, { name: 'AC Volt', limit: 1000, value: 100, unit: 'V' },
...@@ -24,8 +25,6 @@ const MockData = [ ...@@ -24,8 +25,6 @@ const MockData = [
{ name: 'Arcing Fault', limit: 1000, value: 100, unit: '' }, { name: 'Arcing Fault', limit: 1000, value: 100, unit: '' },
]; ];
let checkedTimes = 0;
class SmartMeterDetailScreen extends Component { class SmartMeterDetailScreen extends Component {
static navigationOptions = ({ navigation }) => { static navigationOptions = ({ navigation }) => {
return { return {
...@@ -68,8 +67,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -68,8 +67,7 @@ class SmartMeterDetailScreen extends Component {
componentDidUpdate = (prevProps, prevState) => { componentDidUpdate = (prevProps, prevState) => {
if ( if (
prevProps.currentSelectedData !== this.props.currentSelectedData || prevProps.currentSelectedData !== this.props.currentSelectedData ||
prevProps.breakerStatus !== this.props.breakerStatus || (prevProps.breakerStatus && prevProps.breakerStatus.SM1.BK_S !== this.props.breakerStatus.SM1.BK_S)
prevState.isPowerOn !== this.state.isPowerOn
) { ) {
this.setMainCardData(); this.setMainCardData();
} }
...@@ -83,50 +81,12 @@ class SmartMeterDetailScreen extends Component { ...@@ -83,50 +81,12 @@ class SmartMeterDetailScreen extends Component {
) { ) {
this.setSubBreakersState(); this.setSubBreakersState();
} }
// console.log(this.state);
}; };
handleToggle = async value => { handleToggle = async value => {
this.setState({ isWaiting: true }); this.setState({ isWaiting: true });
await this.props.getCurrentSelectedShadow();
await this.props.setMainStatus(value); await this.props.setMainStatus(value);
this.setState({ isWaiting: false });
this.setState({ isPowerOn: this.props.desiredBreakerStatus.SM1.BK_S });
const getShadowInterval = setInterval(async () => {
this.setState(() => {
const { currentSelectedData, breakerStatus, desiredBreakerStatus } = this.props;
if (desiredBreakerStatus.SM1.BK_S === breakerStatus.SM1.BK_S) {
clearInterval(getShadowInterval);
return {
isWaiting: false,
description: currentSelectedData.description,
name: currentSelectedData.name,
rcbo: currentSelectedData.rcbo,
isOnline: currentSelectedData.isOnline,
isPowerOn: desiredBreakerStatus ? desiredBreakerStatus.SM1.BK_S : false,
};
} else {
if (checkedTimes >= 2) {
clearInterval(getShadowInterval);
checkedTimes = 0;
}
return {
isWaiting: false,
description: currentSelectedData.description,
name: currentSelectedData.name,
rcbo: currentSelectedData.rcbo,
isOnline: currentSelectedData.isOnline,
isPowerOn: breakerStatus ? breakerStatus.SM1.BK_S : false,
};
}
});
++checkedTimes;
await this.props.getCurrentSelectedShadow();
this.setSubBreakersState();
}, 3000);
}; };
componentWillUnmount = () => { componentWillUnmount = () => {
...@@ -156,12 +116,16 @@ class SmartMeterDetailScreen extends Component { ...@@ -156,12 +116,16 @@ class SmartMeterDetailScreen extends Component {
const { existedSubBreakersData, breakerStatus } = this.props; const { existedSubBreakersData, breakerStatus } = this.props;
let subBreakersInfo = []; let subBreakersInfo = [];
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 =>
Object.assign(subBreaker, { Object.assign(subBreaker, {
isPowerOn: isPowerOn:
breakerStatus[`ML${subBreaker.mcbLinkId}`][ subBreakersStatus[`ML${subBreaker.mcbLinkId}`][
`L${subBreaker.mcbLinkId}B${subBreaker.subBreakerId}` `L${subBreaker.mcbLinkId}B${subBreaker.subBreakerId}`
] === 1 ] === 1
? true ? true
...@@ -171,11 +135,11 @@ class SmartMeterDetailScreen extends Component { ...@@ -171,11 +135,11 @@ class SmartMeterDetailScreen extends Component {
); );
}); });
this.setState({ subBreakersInfo: existedSubBreakersData }); this.setState({ subBreakersInfo });
}; };
renderMainDatailsCard = () => { renderMainDatailsCard = () => {
const { name, description, rcbo, isOnline, isPowerOn } = this.state; const { name, description, rcbo, isOnline, isPowerOn, isWaiting } = this.state;
return ( return (
<Card style={{ padding: 15, marginBottom: 20, borderRadius: 10, borderColor: color.white }}> <Card style={{ padding: 15, marginBottom: 20, borderRadius: 10, borderColor: color.white }}>
<Row style={{ justifyContent: 'center', alignItems: 'center' }}> <Row style={{ justifyContent: 'center', alignItems: 'center' }}>
...@@ -184,11 +148,11 @@ class SmartMeterDetailScreen extends Component { ...@@ -184,11 +148,11 @@ class SmartMeterDetailScreen extends Component {
</Left> </Left>
<Right> <Right>
<Switch <Switch
// disabled={this.state.isWaiting} thumbColor={isPowerOn === 1 ? '#10ca88' : color.grey}
value={isPowerOn === 1 ? true : false} trackColor={{ false: color.lightGrey, true: '#87E4C3' }}
onValueChange={value => { disabled={isWaiting}
this.state.isWaiting ? null : this.handleToggle(value); value={isPowerOn ? (isPowerOn === 1 ? true : false) : false}
}} onValueChange={this.handleToggle}
/> />
</Right> </Right>
</Row> </Row>
...@@ -262,53 +226,9 @@ class SmartMeterDetailScreen extends Component { ...@@ -262,53 +226,9 @@ class SmartMeterDetailScreen extends Component {
const renderSubBreaker = (subBreaker, indexSubBreakers) => { const renderSubBreaker = (subBreaker, indexSubBreakers) => {
const handleOnPressSubBreakerSwitch = async value => { const handleOnPressSubBreakerSwitch = async value => {
// this.setState({ isWaiting: true }); this.setState({ isWaiting: true });
// await this.props.setSubBreakerStatus(value, indexMcbLinks, indexSubBreakers);
// await this.getData();
// let getShadowInterval = setInterval(() => {
// this.getData();
// console.log('getShadow');
// }, 2000);
// this.setState((prevState, props) => {
// if (props.shadow === this.props.shadow) {
// console.log('hello');
// clearInterval(getShadowInterval);
// return { isWaiting: false };
// } else {
// setTimeout(() => {
// clearInterval(getShadowInterval);
// }, 6000);
// return { isWaiting: false };
// }
// });
// this.setState(
// prevState =>
// (subBreaker.isPowerOn = !prevState.subBreakersInfo[indexMcbLinks][indexSubBreakers].isPowerOn)
// );
await this.props.setSubBreakerStatus(value, indexMcbLinks, indexSubBreakers); await this.props.setSubBreakerStatus(value, indexMcbLinks, indexSubBreakers);
await this.props.getCurrentSelectedShadow(); this.setState({ isWaiting: false });
const getShadowInterval = setInterval(async () => {
this.setState(() => {
if (this.props.desiredBreakerStatus === this.props.breakerStatus) {
clearInterval(getShadowInterval);
return { isWaiting: false };
} else {
if (checkedTimes >= 2) {
clearInterval(getShadowInterval);
checkedTimes = 0;
}
return { isWaiting: false };
}
});
++checkedTimes;
await this.props.getCurrentSelectedShadow();
this.setSubBreakersState();
}, 3000);
}; };
return ( return (
...@@ -347,11 +267,11 @@ class SmartMeterDetailScreen extends Component { ...@@ -347,11 +267,11 @@ class SmartMeterDetailScreen extends Component {
</Left> </Left>
<Right> <Right>
<Switch <Switch
thumbColor={subBreaker.isPowerOn ? '#10ca88' : color.grey}
trackColor={{ false: color.lightGrey, true: '#87E4C3' }}
disabled={this.props.breakerStatus.SM1.BK_S === 0 ? true : false} disabled={this.props.breakerStatus.SM1.BK_S === 0 ? true : false}
value={subBreaker.isPowerOn} value={subBreaker.isPowerOn}
onValueChange={value => { onValueChange={handleOnPressSubBreakerSwitch}
this.state.isWaiting ? null : handleOnPressSubBreakerSwitch(value);
}}
/> />
</Right> </Right>
</Row> </Row>
......
screens/Public/AuthLoadingScreen.js
...@@ -31,12 +31,16 @@ class AuthLoadingScreen extends Component { ...@@ -31,12 +31,16 @@ class AuthLoadingScreen extends Component {
getToken = async () => { getToken = async () => {
const { uid } = app.auth().currentUser; const { uid } = app.auth().currentUser;
try {
const user = await fireStore const user = await fireStore
.collection('user') .collection('user')
.doc(uid) .doc(uid)
.get(); .get();
const { token } = user.data(); const { token } = user.data();
await AsyncStorage.setItem('token', token); await AsyncStorage.setItem('token', token);
} catch (error) {
alert(error);
}
}; };
bootstrapAsync = async () => { bootstrapAsync = async () => {
......
utils/apollo/apollo.js
...@@ -14,6 +14,7 @@ const client = new ApolloClient({ ...@@ -14,6 +14,7 @@ const client = new ApolloClient({
}, },
}); });
}, },
// cache: new InMemoryCache(),
}); });
//https://www.apollographql.com/docs/react/api/apollo-client/ //https://www.apollographql.com/docs/react/api/apollo-client/
......
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