Commit edfa5612 by HaOuiha

update behavier toggle switch

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