Skip to content

S
safetcut-app
Commit d29b5f7f by HaOuiha
Options

update timerscreen

parent 5daa290a
Showing with 155 additions and 171 deletions
App.js
......@@ -20,17 +20,32 @@ const Application = () => {
useEffect(() => {
fixTimerWarning();
// const batch = fireStore.batch();
const batch = fireStore.batch();
// const mainRef = fireStore.doc(`device/${deviceId}`);
// const mcbLinksRef = fireStore.doc(`device/${deviceId}/mcbLinks/${mcbLinkId}`);
// const subBreakersRef = fireStore.doc(`device/${deviceId}/mcbLinks/${mcbLinkId}/subBreakers/${subBreakerId}`);
const mainRef = fireStore.doc(`device/${deviceId}`);
const mcbLinksRef = fireStore.doc(`device/${deviceId}/mcbLinks/${mcbLinkId}`);
const subBreakersRef = fireStore.doc(`device/${deviceId}/mcbLinks/${mcbLinkId}/subBreakers/${subBreakerId}`);
// batch.set(mainRef, main);
// batch.set(mcbLinksRef, mcbLinks);
// batch.set(subBreakersRef, subBreakers);
// const mcbLinksTimerRef = fireStore.doc(`device/${deviceId}/mcbLinks/${mcbLinkId}/Timers`);
// const subBreakersTimerRef = fireStore.doc(
// `device/${deviceId}/mcbLinks/${mcbLinkId}/subBreakers/${subBreakerId}/Timers`
// );
// batch.commit();
batch.set(mainRef, main);
batch.set(mcbLinksRef, mcbLinks);
batch.set(subBreakersRef, subBreakers);
for (let i = 1; i <= 5; i++) {
let mainTimerRef = fireStore
.collection('device')
.doc(deviceId)
.collection('Timers')
.doc();
batch.set(mainTimerRef, timer);
}
batch.commit();
}, []);
return (
......@@ -57,36 +72,6 @@ const main = {
description: 'description',
notification: true,
rcbo: 10,
timers: [
{
isActive: true,
isPowerOn: true,
timer: 1566378008,
repeatOn: [
{ id: 0, isRepeat: false, day: 'Sunday' },
{ id: 1, isRepeat: true, day: 'Monday' },
{ id: 2, isRepeat: true, day: 'Tuesday' },
{ id: 3, isRepeat: true, day: 'Wednesday' },
{ id: 4, isRepeat: true, day: 'Thursday' },
{ id: 5, isRepeat: false, day: 'Friday' },
{ id: 6, isRepeat: false, day: 'Saturday' },
],
},
{
isActive: false,
isPowerOn: false,
timer: 1566378008,
repeatOn: [
{ id: 0, isRepeat: false, day: 'Sunday' },
{ id: 1, isRepeat: true, day: 'Monday' },
{ id: 2, isRepeat: true, day: 'Tuesday' },
{ id: 3, isRepeat: true, day: 'Wednesday' },
{ id: 4, isRepeat: true, day: 'Thursday' },
{ id: 5, isRepeat: false, day: 'Friday' },
{ id: 6, isRepeat: false, day: 'Saturday' },
],
},
],
};
const mcbLinks = {
......@@ -94,36 +79,6 @@ const mcbLinks = {
type: 'mcbLink',
name: `MCB Link ${mcbLinkId}`,
description: `description ${mcbLinkId}`,
timers: [
{
isActive: true,
isPowerOn: false,
timer: 1566378008,
repeatOn: [
{ id: 0, isRepeat: false, day: 'Sunday' },
{ id: 1, isRepeat: false, day: 'Monday' },
{ id: 2, isRepeat: false, day: 'Tuesday' },
{ id: 3, isRepeat: false, day: 'Wednesday' },
{ id: 4, isRepeat: false, day: 'Thursday' },
{ id: 5, isRepeat: false, day: 'Friday' },
{ id: 6, isRepeat: false, day: 'Saturday' },
],
},
{
isActive: true,
isPowerOn: false,
timer: 1566378008,
repeatOn: [
{ id: 0, isRepeat: false, day: 'Sunday' },
{ id: 1, isRepeat: false, day: 'Monday' },
{ id: 2, isRepeat: false, day: 'Tuesday' },
{ id: 3, isRepeat: false, day: 'Wednesday' },
{ id: 4, isRepeat: false, day: 'Thursday' },
{ id: 5, isRepeat: false, day: 'Friday' },
{ id: 6, isRepeat: false, day: 'Saturday' },
],
},
],
};
const subBreakers = {
......@@ -131,48 +86,19 @@ const subBreakers = {
type: 'subBreaker',
name: `Sub Breaker ${subBreakerId}`,
description: `description ${subBreakerId}`,
timers: [
{
isActive: false,
isPowerOn: false,
timer: 1566378008,
repeatOn: [
{ id: 0, isRepeat: false, day: 'Sunday' },
{ id: 1, isRepeat: true, day: 'Monday' },
{ id: 2, isRepeat: true, day: 'Tuesday' },
{ id: 3, isRepeat: true, day: 'Wednesday' },
{ id: 4, isRepeat: true, day: 'Thursday' },
{ id: 5, isRepeat: false, day: 'Friday' },
{ id: 6, isRepeat: false, day: 'Saturday' },
],
},
{
isActive: false,
isPowerOn: false,
timer: 1566378008,
repeatOn: [
{ id: 0, isRepeat: false, day: 'Sunday' },
{ id: 1, isRepeat: true, day: 'Monday' },
{ id: 2, isRepeat: true, day: 'Tuesday' },
{ id: 3, isRepeat: true, day: 'Wednesday' },
{ id: 4, isRepeat: true, day: 'Thursday' },
{ id: 5, isRepeat: false, day: 'Friday' },
{ id: 6, isRepeat: false, day: 'Saturday' },
],
},
{
};
const timer = {
isActive: false,
isPowerOn: false,
timer: 1566378008,
repeatOn: [
{ id: 0, isRepeat: false, day: 'Sunday' },
{ id: 1, isRepeat: true, day: 'Monday' },
{ id: 2, isRepeat: true, day: 'Tuesday' },
{ id: 3, isRepeat: true, day: 'Wednesday' },
{ id: 4, isRepeat: true, day: 'Thursday' },
{ id: 1, isRepeat: false, day: 'Monday' },
{ id: 2, isRepeat: false, day: 'Tuesday' },
{ id: 3, isRepeat: false, day: 'Wednesday' },
{ id: 4, isRepeat: false, day: 'Thursday' },
{ id: 5, isRepeat: false, day: 'Friday' },
{ id: 6, isRepeat: false, day: 'Saturday' },
],
},
],
};
package.json
......@@ -22,7 +22,7 @@
"react-native": "^0.60.4",
"react-native-barcode-mask": "^1.0.5",
"react-native-camera": "^2.11.1",
"react-native-date-picker": "^2.5.1",
"react-native-date-picker": "^2.7.0",
"react-native-elements": "^1.1.0",
"react-native-gesture-handler": "^1.3.0",
"react-native-linear-gradient": "^2.5.4",
......
reduxStore/actions/timersAction.js
......@@ -6,11 +6,30 @@ export const GET_TIMERS_LOADING = 'GET_TIMERS_LOADING';
export const GET_TIMERS_ERROR = 'GET_TIMERS_ERROR';
export const GET_EXISTED_DATA = 'GET_EXISTED_DATA';
export const GET_MAIN_DEVICE_TIMERS = 'GET_MAIN_DEVICE_TIMERS';
export const GET_MCBLINKS_TIMERS = 'GET_MCBLINKS_TIMERS';
export const GET_SUBBREAKERS_TIMERS = 'GET_SUBBREAKERS_TIMERS';
export const getTimersAction = timers => ({
type: GET_TIMERS,
timers,
});
export const getMainDeviceTImersAction = mainDeviceTimers => ({
type: GET_MAIN_DEVICE_TIMERS,
mainDeviceTimers,
});
export const getMcbLinksTimersAction = mcbLinksTimers => ({
type: GET_MCBLINKS_TIMERS,
mcbLinksTimers,
});
export const getSubBreakersTimersAction = subBreakersTimers => ({
type: GET_SUBBREAKERS_TIMERS,
subBreakersTimers,
});
export const getExistedDataAction = existedData => ({
type: GET_EXISTED_DATA,
existedData,
......@@ -32,6 +51,12 @@ export const getTimers = () => async (dispatch, getState) => {
try {
dispatch(loadingAction(true));
let allTimersData = [];
let mainDeviceTimers = [];
let mcbLinksTimers = [];
let subBreakersTimers = [];
//main device section
/*-------------------------------------*/
const selectedDevice = await fireStore
.collection('device')
......@@ -39,9 +64,13 @@ export const getTimers = () => async (dispatch, getState) => {
.get();
const selectedDeviceData = await selectedDevice.data();
mainDeviceTimers.push(selectedDeviceData.timers);
selectedDeviceData.timers.map(timer =>
allTimersData.push(Object.assign(timer, { type: selectedDeviceData.type, name: selectedDeviceData.name }))
);
//mcblink section
/*-------------------------------------*/
const selectedDeviceMcbLinks = await fireStore
.collection('device')
......@@ -57,6 +86,8 @@ export const getTimers = () => async (dispatch, getState) => {
selectedDeviceMcbLinksData.push(mcbLink.data());
let mcbLinkData = mcbLink.data();
mcbLinksTimers.push(mcbLinkData.timers);
mcbLinkData.timers.map(timer => {
allTimersData.push(
Object.assign(timer, {
......@@ -67,7 +98,7 @@ export const getTimers = () => async (dispatch, getState) => {
);
});
});
//subbreaker section
/*-------------------------------------*/
let existedSubBreakers = [];
......@@ -88,6 +119,8 @@ export const getTimers = () => async (dispatch, getState) => {
let subBreakerData = subBreaker.data();
subBreakersTimers.push(subBreakerData.timers);
subBreakerData.timers.map(timer => {
allTimersData.push(
Object.assign(timer, {
......@@ -101,9 +134,17 @@ export const getTimers = () => async (dispatch, getState) => {
});
});
console.log('selectedDeviceMcbLinksData', selectedDeviceMcbLinksData);
const existedData = { existedMcbLinks, existedSubBreakers };
// console.log(mainDeviceTimers, mcbLinksTimers, subBreakersTimers);
dispatch(getExistedDataAction(existedData));
dispatch(getMainDeviceTImersAction(mainDeviceTimers));
dispatch(getMcbLinksTimersAction(mcbLinksTimers));
dispatch(getSubBreakersTimersAction(subBreakersTimers));
dispatch(getTimersAction(allTimersData));
} catch (error) {
dispatch(errorAction(error.message || error || 'Error'));
......
reduxStore/reducers/timersReducer.js
import { GET_TIMERS, GET_TIMERS_LOADING, GET_TIMERS_ERROR, GET_EXISTED_DATA } from '../actions/timersAction';
import {
GET_TIMERS,
GET_TIMERS_LOADING,
GET_TIMERS_ERROR,
GET_EXISTED_DATA,
GET_MAIN_DEVICE_TIMERS,
GET_MCBLINKS_TIMERS,
GET_SUBBREAKERS_TIMERS,
} from '../actions/timersAction';
const initState = {
timers: [],
mainDeviceTimers: [],
mcbLinksTimers: [],
subBreakersTimers: [],
existedData: {},
isLoading: true,
error: null,
......@@ -13,6 +24,12 @@ const timersReducer = (state = initState, action) => {
return { ...state, existedData: action.existedData };
case GET_TIMERS:
return { ...state, timers: action.timers };
case GET_MAIN_DEVICE_TIMERS:
return { ...state, mainDeviceTimers: action.mainDeviceTimers };
case GET_MCBLINKS_TIMERS:
return { ...state, mcbLinksTimers: action.mcbLinksTimers };
case GET_SUBBREAKERS_TIMERS:
return { ...state, subBreakersTimers: action.subBreakersTimers };
case GET_TIMERS_LOADING:
return { ...state, isLoading: action.isLoading };
case GET_TIMERS_ERROR:
......
screens/Private/SmartMeterScreen/SmartMeterDetailScreen.js
......@@ -195,7 +195,7 @@ class SmartMeterDetailScreen extends Component {
renderSubbreaker(item) {
return (
<View
key={`Subbreker${item}`}
key={`Subbreker${item.toString()}`}
style={[theme.containerWithPadding, { backgroundColor: 'rgba(216,216,216,0.1)' }]}
>
<Row>
......@@ -240,7 +240,7 @@ class SmartMeterDetailScreen extends Component {
<Card style={[theme.containerWithPadding, { borderRadius: 10 }]}>
<Row>
<Left>
<Text style={[theme.smallTitle, { color: color.darkGrey }]}>{data.name}</Text>
<Text style={[theme.smallTitle, { color: color.darkGrey }]}>{`untitled`}</Text>
</Left>
<Right>
<Switch
......
screens/Private/TimerScreen/TimerScreen.andriod.js
import React, { Component } from 'react';
import React, { PureComponent } from 'react';
import { Icon, Text } from 'native-base';
import {
View,
......@@ -24,6 +24,8 @@ import { isIphoneX } from '../../../utils/isPhoneX';
import { connect } from 'react-redux';
import { getTimers } from '../../../reduxStore/actions/timersAction';
import { fireStore } from '../../../firebase';
import firebase from 'firebase/app';
import 'firebase/firestore';
const initState = {
isActive: false,
......@@ -39,16 +41,18 @@ const initState = {
{ id: 6, isRepeat: false, day: 'Saturday' },
],
selectedBreaker: '',
checked: [],
isAddVisible: false,
isfilterVisible: false,
search: '',
selectedBreaker: null,
selectedSubBreaker: null,
};
class TimerScreen extends Component {
class TimerScreen extends PureComponent {
static navigationOptions = ({ navigation }) => ({
title: 'Timer',
headerLeft: (
......@@ -86,7 +90,6 @@ class TimerScreen extends Component {
{ id: 6, isRepeat: false, day: 'Saturday' },
],
selectedBreaker: '',
checked: [],
isAddVisible: false,
......@@ -95,17 +98,16 @@ class TimerScreen extends Component {
search: '',
pickerSelectData: [],
subBreakerList: [],
// mcbLinkId: undefined,
subBreakerId: undefined,
selectedBreaker: null,
selectedSubBreaker: null,
};
setPickerSelectData = () => {
setPickerSelectData = async () => {
let pickerSelectData = [{ label: 'Main Device', value: false }];
console.log(this.props.existedData.existedMcbLinks);
this.props.existedData.existedMcbLinks.map((mcbLinkId, index) => {
await this.props.existedData.existedMcbLinks.map((mcbLinkId, index) => {
pickerSelectData.push({ label: `MCB Link ${mcbLinkId}`, value: index + 1 });
});
this.setState({ pickerSelectData });
};
......@@ -119,11 +121,9 @@ class TimerScreen extends Component {
console.log('existedSubBreaker', existedSubBreaker);
let subBreakerList = new Array(existedSubBreaker.length).fill().map((el, index) => {
return {
id: index + 1,
selected: false,
};
return { id: index + 1, selected: false };
});
console.log('subBreakerList', subBreakerList);
this.setState({ subBreakerList });
};
......@@ -135,21 +135,12 @@ class TimerScreen extends Component {
this.currentlyOpenSwipe = swipeInstance;
};
// onValueChange=(value)=> {
// this.setState({selected: value,
// });
// }
toggleActive = () => {
this.setState(prevState => ({
isActive: !prevState.isActive,
}));
this.setState(prevState => ({ isActive: !prevState.isActive }));
};
togglePower = () => {
this.setState(prevState => ({
isPowerOn: !prevState.isPowerOn,
}));
this.setState(prevState => ({ isPowerOn: !prevState.isPowerOn }));
};
toggleRepeatDays = index => {
......@@ -166,23 +157,25 @@ class TimerScreen extends Component {
createNewTimer = () => {
const deviceId = this.props.selectedDeviceId;
const { subBreakerId, selectedBreaker } = this.state;
const data = {
timers: [
{
isActive: this.state.isActive,
isPowerOn: this.state.isPowerOn,
timer: Number(this.state.timer),
repeatOn: this.state.repeatOn,
},
],
};
let docRef = undefined;
if (subBreakerId) {
docRef = fireStore.doc(`device/${deviceId}/mcbLinks/${selectedBreaker}/subBreakers/${subBreakerId}`);
const { selectedSubBreaker, selectedBreaker } = this.state;
// const data = {
// timers: [
// {
// isActive: this.state.isActive,
// isPowerOn: this.state.isPowerOn,
// timer: Number(this.state.timer),
// repeatOn: this.state.repeatOn,
// },
// ],
// };
let docRef = null;
if (selectedSubBreaker) {
docRef = fireStore.doc(
`device/${deviceId}/mcbLinks/${selectedBreaker}/subBreakers/${selectedSubBreaker.id}`
);
} else if (selectedBreaker) {
docRef = fireStore.doc(`device/${deviceId}/mcbLinks/${selectedBreaker}`);
} else {
......@@ -190,7 +183,14 @@ class TimerScreen extends Component {
}
try {
docRef.update(data);
docRef.update({
timers: firebase.firestore.FieldValue.arrayUnion({
isActive: this.state.isActive,
isPowerOn: this.state.isPowerOn,
timer: Number(this.state.timer),
repeatOn: this.state.repeatOn,
}),
});
} catch (e) {
alert(e);
}
......@@ -207,6 +207,14 @@ class TimerScreen extends Component {
console.log('this.props.existedData.existedMcbLinks', this.props.existedData.existedMcbLinks);
this.setPickerSelectData();
}
if (prevState.subBreakerList !== this.state.subBreakerList && this.state.subBreakerList) {
let selectedSubBreaker = this.state.subBreakerList.find(subBreaker => {
return subBreaker.selected === true;
});
this.setState({ selectedSubBreaker: selectedSubBreaker });
}
console.log('STATE', this.state);
};
......@@ -220,7 +228,7 @@ class TimerScreen extends Component {
</TouchableOpacity>
),
});
this.setExistedSubBreaker();
this.props.existedData.existedMcbLinks && this.setPickerSelectData();
};
......@@ -306,10 +314,9 @@ class TimerScreen extends Component {
items={this.state.pickerSelectData}
useNativeAndroidPickerStyle={false}
onValueChange={(value, index) => {
console.log('selectedBreaker', value);
this.setState({ selectedBreaker: value });
}}
// placeholder={{ label: 'Select...', value: null }}
placeholder={{ label: 'Select...', value: null }}
style={pickerStyle}
Icon={() => (
<Icon name="ios-arrow-down" style={{ fontSize: 14, color: '#c8c8c8' }} />
......@@ -319,7 +326,7 @@ class TimerScreen extends Component {
<FlatList
style={theme.mt2}
data={this.state.subBreakerList}
// extradata={this.state.subBreakerList}
extradata={this.state}
ItemSeparatorComponent={() => <View style={theme.mt1} />}
renderItem={({ item, index }) => (
<CheckBox
......@@ -340,10 +347,10 @@ class TimerScreen extends Component {
style={{ color: color.grey, fontSize: 22 }}
/>
}
onPress={async () => {
await this.setState(prevState => ({
subBreakerList: prevState.subBreakerList.map(el =>
el.id === index + 1
onPress={() => {
this.setState(prevState => ({
subBreakerList: prevState.subBreakerList.map((el, elementIndex) =>
elementIndex === index
? {
...el,
selected: !this.state.subBreakerList[index].selected,
......@@ -351,13 +358,6 @@ class TimerScreen extends Component {
: { ...el, selected: false }
),
}));
this.state.subBreakerList.map(subBreaker => {
console.log('subBreaker', subBreaker);
if (subBreaker.selected === true) {
this.setState({ subBreakerId: subBreaker.id });
} else return this.setState({ subBreakerId: undefined });
});
}}
/>
)}
......
yarn.lock
......@@ -5920,10 +5920,10 @@ react-native-camera@^2.11.1:
dependencies:
prop-types "^15.6.2"
react-native-date-picker@^2.5.1:
version "2.6.1"
resolved "https://registry.yarnpkg.com/react-native-date-picker/-/react-native-date-picker-2.6.1.tgz#ad322cc12a760ad7a2cabce18928652dd4f8b8f0"
integrity sha512-9FVOMulMs5mWfjWcoEuHotIh5LiJPHvrSUEsHfiYW48kME3GF/nE0DyNg4qDuJFRsZr8mIdiNyLQHQbnhGKZ/Q==
react-native-date-picker@^2.7.0:
version "2.7.0"
resolved "https://registry.yarnpkg.com/react-native-date-picker/-/react-native-date-picker-2.7.0.tgz#91c6cd85c45309763e58982c46fcf3dba2d1da55"
integrity sha512-pevfIzZ2jnYZe3jrDsUN2EM0fGcal3lL2aqExDux7d01C4QWOJJdHbut2URjL/EzS1v2ByLQJNT0ErjniheRiw==
dependencies:
moment "^2.22.1"
......
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