Skip to content

S
safetcut-app
Commit a13786cc by HaOuiha
Options

fix bug

parent 3ff06c42
Showing with 128 additions and 81 deletions
components/MeterCard.js
...@@ -38,7 +38,11 @@ const MeterCard = ({ item, onPressEachCard }) => { ...@@ -38,7 +38,11 @@ const MeterCard = ({ item, onPressEachCard }) => {
); );
return Platform.OS === 'android' ? ( return Platform.OS === 'android' ? (
<BaseButton onPress={onPressEachCard} rippleColor={'#fcc5c5'} style={styles.cardContainer}> <BaseButton
onPress={onPressEachCard}
rippleColor={item.breakerStatus === 1 ? 'rgba(65, 204, 0, 0.1)' : 'rgba(223, 0, 0, 0.1)'}
style={styles.cardContainer}
>
{renderContent()} {renderContent()}
</BaseButton> </BaseButton>
) : ( ) : (
......
reduxStore/actions/timersAction.js
...@@ -294,12 +294,9 @@ export const createNewTimer = (mcbLinkId, subBreakerId, settingTime) => async (d ...@@ -294,12 +294,9 @@ export const createNewTimer = (mcbLinkId, subBreakerId, settingTime) => async (d
export const editTimer = settingTime => async (dispatch, getState) => { export const editTimer = settingTime => async (dispatch, getState) => {
const { currentSelectedDeviceReducer, timersReducer } = getState(); const { currentSelectedDeviceReducer, timersReducer } = getState();
const { const { selectedTimerData, allTimers, existedSubBreakersData } = timersReducer;
selectedTimerData: { mcbLinkId, subBreakerId, key },
allTimers,
existedSubBreakersData,
} = timersReducer;
const { currentSelectedData } = currentSelectedDeviceReducer; const { currentSelectedData } = currentSelectedDeviceReducer;
const { mcbLinkId, subBreakerId, key } = selectedTimerData;
const selectedDeviceId = currentSelectedData.deviceId; const selectedDeviceId = currentSelectedData.deviceId;
const getDocRef = () => { const getDocRef = () => {
if (mcbLinkId && subBreakerId) { if (mcbLinkId && subBreakerId) {
...@@ -323,7 +320,7 @@ export const editTimer = settingTime => async (dispatch, getState) => { ...@@ -323,7 +320,7 @@ export const editTimer = settingTime => async (dispatch, getState) => {
} }
}; };
const editTimer = allTimers.find(timer => timer.key === key); const editTimer = allTimers.find(timer => timer === selectedTimerData);
const editingTimer = { ...editTimer, ...settingTime }; const editingTimer = { ...editTimer, ...settingTime };
const assignMoreDetailToTimer = () => { const assignMoreDetailToTimer = () => {
...@@ -346,7 +343,7 @@ export const editTimer = settingTime => async (dispatch, getState) => { ...@@ -346,7 +343,7 @@ export const editTimer = settingTime => async (dispatch, getState) => {
} }
}; };
const allTimersWithoutEditingTimer = allTimers.filter(timer => timer.key !== key); const allTimersWithoutEditingTimer = allTimers.filter(timer => timer !== selectedTimerData);
const editedTimer = assignMoreDetailToTimer(); const editedTimer = assignMoreDetailToTimer();
//merge newTimers and sort with type > mcbLinkId > subBreakerId //merge newTimers and sort with type > mcbLinkId > subBreakerId
...@@ -393,8 +390,8 @@ export const deleteTimer = selectedData => async (dispatch, getState) => { ...@@ -393,8 +390,8 @@ export const deleteTimer = selectedData => async (dispatch, getState) => {
return docRef; return docRef;
} }
}; };
// console.log(selectedData);
const newAllTimers = allTimers.filter(timer => timer.key !== key); const newAllTimers = allTimers.filter(timer => timer !== selectedData); //timer.key !== key
let newAllTimersSortedData = _.sortBy(newAllTimers, ['type', 'mcbLinkId', 'subBreakerId', 'timer']); let newAllTimersSortedData = _.sortBy(newAllTimers, ['type', 'mcbLinkId', 'subBreakerId', 'timer']);
try { try {
......
screens/Private/TimerScreen/TimerScreen.js
...@@ -8,7 +8,8 @@ import { ...@@ -8,7 +8,8 @@ import {
TouchableOpacity, TouchableOpacity,
Platform, Platform,
RefreshControl, RefreshControl,
TouchableWithoutFeedback, TouchableNativeFeedback,
// TouchableWithoutFeedback,
} from 'react-native'; } from 'react-native';
import { color, theme } from '../../../constants/Styles'; import { color, theme } from '../../../constants/Styles';
import RNPickerSelect from 'react-native-picker-select'; import RNPickerSelect from 'react-native-picker-select';
...@@ -120,7 +121,7 @@ class TimerScreen extends PureComponent { ...@@ -120,7 +121,7 @@ class TimerScreen extends PureComponent {
} }
}; };
setPickerSelectData = () => { setPickerMainData = () => {
const { currentSelectedData } = this.props; const { currentSelectedData } = this.props;
let pickerSelectData = [ let pickerSelectData = [
{ {
...@@ -153,8 +154,12 @@ class TimerScreen extends PureComponent { ...@@ -153,8 +154,12 @@ class TimerScreen extends PureComponent {
let currentSelectedExistedSubBreakers = existedSubBreakersData[selectedBreaker - 1].map( let currentSelectedExistedSubBreakers = existedSubBreakersData[selectedBreaker - 1].map(
(subBreaker, index) => { (subBreaker, index) => {
return Object.assign(subBreaker, { return Object.assign(subBreaker, {
id: index + 1, // id: index + 1,
selected: false, selected: false,
label: `Sub Breaker ${index + 1} ${
subBreaker.name !== `Sub Breaker ${index + 1}` ? `[${subBreaker.name}]` : ''
} `,
value: index + 1,
}); });
} }
); );
...@@ -218,7 +223,7 @@ class TimerScreen extends PureComponent { ...@@ -218,7 +223,7 @@ class TimerScreen extends PureComponent {
isSuccess && this.resetStateAndProps(); isSuccess && this.resetStateAndProps();
} else if (selectedBreaker && selectedSubBreaker) { } else if (selectedBreaker && selectedSubBreaker) {
const isSuccess = await this.props.createNewTimer(selectedBreaker, selectedSubBreaker[0].id, timerData); const isSuccess = await this.props.createNewTimer(selectedBreaker, selectedSubBreaker.value, timerData);
isSuccess && this.resetStateAndProps(); isSuccess && this.resetStateAndProps();
} else alert('please select (Sub) Breaker'); } else alert('please select (Sub) Breaker');
...@@ -253,7 +258,7 @@ class TimerScreen extends PureComponent { ...@@ -253,7 +258,7 @@ class TimerScreen extends PureComponent {
} }
} }
if (prevProps.existedMcbLinksData !== this.props.existedMcbLinksData) { if (prevProps.existedMcbLinksData !== this.props.existedMcbLinksData) {
this.setPickerSelectData(); this.setPickerMainData();
} }
if (prevState.selectedBreaker !== this.state.selectedBreaker) { if (prevState.selectedBreaker !== this.state.selectedBreaker) {
this.setExistedSubBreaker(); this.setExistedSubBreaker();
...@@ -272,6 +277,7 @@ class TimerScreen extends PureComponent { ...@@ -272,6 +277,7 @@ class TimerScreen extends PureComponent {
repeatOn: this.props.selectedTimerData.repeatOn, repeatOn: this.props.selectedTimerData.repeatOn,
}); });
} }
// console.log('state', this.state);
}; };
componentDidMount = () => { componentDidMount = () => {
...@@ -285,7 +291,7 @@ class TimerScreen extends PureComponent { ...@@ -285,7 +291,7 @@ class TimerScreen extends PureComponent {
), ),
}); });
this.setTimersData(); this.setTimersData();
this.setPickerSelectData(); this.setPickerMainData();
this.setExistedSubBreaker(); this.setExistedSubBreaker();
}; };
...@@ -344,9 +350,7 @@ class TimerScreen extends PureComponent { ...@@ -344,9 +350,7 @@ class TimerScreen extends PureComponent {
<RNPickerSelect <RNPickerSelect
items={this.state.pickerSelectData} items={this.state.pickerSelectData}
useNativeAndroidPickerStyle={false} useNativeAndroidPickerStyle={false}
onValueChange={(value, index) => { onValueChange={(value, index) => this.setState({ selectedBreaker: value })}
this.setState({ selectedBreaker: value });
}}
placeholder={{ label: 'Select...', value: null }} placeholder={{ label: 'Select...', value: null }}
style={pickerStyle} style={pickerStyle}
Icon={() => ( Icon={() => (
...@@ -357,48 +361,28 @@ class TimerScreen extends PureComponent { ...@@ -357,48 +361,28 @@ class TimerScreen extends PureComponent {
)} )}
/> />
</View> </View>
<FlatList {/*-----------------------------------------------------------*/}
style={{ marginTop: 15 }} {this.state.selectedBreaker !== null && this.state.selectedBreaker !== 'main' && (
data={this.state.subBreakerList} <View style={[styles.pickerContainer, { marginTop: 10 }]}>
extradata={this.state} <RNPickerSelect
ItemSeparatorComponent={() => <View style={theme.mt1} />} items={this.state.subBreakerList}
renderItem={({ item, index }) => ( useNativeAndroidPickerStyle={false}
<CheckBox onValueChange={(value, index) =>
containerStyle={styles.checkboxContainer} this.setState(prevState => ({
fontFamily={'Avenir-Roman'} selectedSubBreaker: prevState.subBreakerList[index - 1],
textStyle={{ fontWeight: 'normal', color: color.darkGrey }} }))
title={`Sub Breaker ${item.id} ${
item.name !== `Sub Breaker ${item.id}` ? `[${item.name}]` : ''
}`}
checked={this.state.subBreakerList[index].selected}
checkedIcon={
<Icon
name="md-radio-button-on"
style={{ color: color.primary, fontSize: 22 }}
/>
} }
uncheckedIcon={ placeholder={{ label: 'Select...', value: null }}
style={pickerStyle}
Icon={() => (
<Icon <Icon
name="md-radio-button-off" name="ios-arrow-down"
style={{ color: color.grey, fontSize: 22 }} style={{ fontSize: 16, color: '#c8c8c8', marginBottom: 5 }}
/> />
} )}
onPress={() => {
this.setState(prevState => ({
subBreakerList: prevState.subBreakerList.map((el, elementIndex) =>
elementIndex === index
? {
...el,
selected: !this.state.subBreakerList[index].selected,
}
: { ...el, selected: false }
),
}));
}}
/> />
)} </View>
keyExtractor={(item, index) => `sub${index}`} )}
/>
</> </>
)} )}
...@@ -425,18 +409,27 @@ class TimerScreen extends PureComponent { ...@@ -425,18 +409,27 @@ class TimerScreen extends PureComponent {
keyExtractor={(item, index) => `days${item.day}`} keyExtractor={(item, index) => `days${item.day}`}
renderItem={({ item, index }) => { renderItem={({ item, index }) => {
let dynamicColor = this.state.repeatOn[index].isRepeat ? color.primary : color.grey; let dynamicColor = this.state.repeatOn[index].isRepeat ? color.primary : color.grey;
let renderDays = (
<View style={[styles.dayBtn, { borderColor: dynamicColor }]}>
<Text style={[theme.modalText, { color: dynamicColor }]}>
{item.day.substr(0, 1)}
</Text>
</View>
);
return ( return (
<View style={{ borderRadius: 20, width: 40, height: 40 }}> <View style={{ borderRadius: 20, width: 40, height: 40 }}>
<TouchableWithoutFeedback {Platform.OS === 'android' ? (
onPress={() => this.toggleRepeatDays(index)} <TouchableNativeFeedback
// background={TouchableNativeFeedback.Ripple(color.lightRed, true)} onPress={() => this.toggleRepeatDays(index)}
> background={TouchableNativeFeedback.Ripple(color.lightRed, true)}
<View style={[styles.dayBtn, { borderColor: dynamicColor }]}> >
<Text style={[theme.modalText, { color: dynamicColor }]}> {renderDays}
{item.day.substr(0, 1)} </TouchableNativeFeedback>
</Text> ) : (
</View> <TouchableOpacity onPress={() => this.toggleRepeatDays(index)}>
</TouchableWithoutFeedback> {renderDays}
</TouchableOpacity>
)}
</View> </View>
); );
}} }}
...@@ -559,8 +552,8 @@ class TimerScreen extends PureComponent { ...@@ -559,8 +552,8 @@ class TimerScreen extends PureComponent {
containerStyle={styles.checkboxContainer} containerStyle={styles.checkboxContainer}
fontFamily={'Avenir-Roman'} fontFamily={'Avenir-Roman'}
textStyle={{ fontWeight: 'normal', color: color.darkGrey }} textStyle={{ fontWeight: 'normal', color: color.darkGrey }}
title={`Sub Breaker ${item.id} ${ title={`Sub Breaker ${item.value} ${
item.name !== `Sub Breaker ${item.id}` ? `[${item.name}]` : '' item.name !== `Sub Breaker ${item.value}` ? `[${item.name}]` : ''
}`} }`}
checked={this.state.subBreakerList[index].selected} checked={this.state.subBreakerList[index].selected}
checkedIcon={<Icon name="md-checkbox" style={{ color: color.primary, fontSize: 26 }} />} checkedIcon={<Icon name="md-checkbox" style={{ color: color.primary, fontSize: 26 }} />}
...@@ -626,7 +619,7 @@ class TimerScreen extends PureComponent { ...@@ -626,7 +619,7 @@ class TimerScreen extends PureComponent {
colors={[color.primary]} colors={[color.primary]}
/> />
} }
contentContainerStyle={{ paddingBottom: isIphoneX() ? 90 : 55 }} contentContainerStyle={{ paddingBottom: isIphoneX() ? 105 : 70 }}
data={this.state.timersData} data={this.state.timersData}
extraData={this.state || this.props} extraData={this.state || this.props}
ListEmptyComponent={() => ( ListEmptyComponent={() => (
...@@ -649,7 +642,7 @@ class TimerScreen extends PureComponent { ...@@ -649,7 +642,7 @@ class TimerScreen extends PureComponent {
swipeArea={45} swipeArea={45}
swipeThreshold={65} swipeThreshold={65}
backdropPressToClose={false} backdropPressToClose={false}
animationDuration={360} animationDuration={350}
style={[styles.modal]} style={[styles.modal]}
position={'bottom'} position={'bottom'}
isOpen={this.state.isAddVisible || this.props.isEditVisible} isOpen={this.state.isAddVisible || this.props.isEditVisible}
...@@ -674,7 +667,7 @@ class TimerScreen extends PureComponent { ...@@ -674,7 +667,7 @@ class TimerScreen extends PureComponent {
swipeArea={45} swipeArea={45}
swipeThreshold={65} swipeThreshold={65}
backdropPressToClose={false} backdropPressToClose={false}
animationDuration={360} animationDuration={350}
style={[styles.filterModal]} style={[styles.filterModal]}
position={'bottom'} position={'bottom'}
isOpen={this.state.isFilterVisible} isOpen={this.state.isFilterVisible}
...@@ -815,5 +808,6 @@ const styles = StyleSheet.create({ ...@@ -815,5 +808,6 @@ const styles = StyleSheet.create({
borderColor: '#dcdcdc', borderColor: '#dcdcdc',
borderRadius: 5, borderRadius: 5,
padding: 10, padding: 10,
marginBottom: 10,
}, },
}); });
screens/Public/LoginScreen.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Text, CheckBox, Icon } from 'native-base'; import { Text, Icon, Button } from 'native-base';
import { theme, color } from '../../constants/Styles'; import { theme, color } from '../../constants/Styles';
import AsyncStorage from '@react-native-community/async-storage'; import AsyncStorage from '@react-native-community/async-storage';
import LoginForm from '../../components/Form/LoginForm'; import LoginForm from '../../components/Form/LoginForm';
import { KeyboardAvoidingView, View } from 'react-native'; import { KeyboardAvoidingView, View, StyleSheet } from 'react-native';
import app from '../../firebase'; import app from '../../firebase';
import { getCurrentUser, getCurrentUserLoadingAction } from '../../reduxStore/actions/cerrentUserAction'; import { getCurrentUser, getCurrentUserLoadingAction } from '../../reduxStore/actions/cerrentUserAction';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import Modal from 'react-native-modalbox';
class LoginScreen extends Component { class LoginScreen extends Component {
static navigationOptions = { static navigationOptions = {
...@@ -17,6 +18,8 @@ class LoginScreen extends Component { ...@@ -17,6 +18,8 @@ class LoginScreen extends Component {
isCheck: false, isCheck: false,
pass: '', pass: '',
passVisible: false, passVisible: false,
isModalVisible: false,
alertMessege: '',
}; };
handleSignIn = async values => { handleSignIn = async values => {
...@@ -24,6 +27,7 @@ class LoginScreen extends Component { ...@@ -24,6 +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);
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) {
...@@ -33,26 +37,26 @@ class LoginScreen extends Component { ...@@ -33,26 +37,26 @@ class LoginScreen extends Component {
} }
this.props.navigation.navigate('Main'); this.props.navigation.navigate('Main');
} else { } else {
alert('Please verify your email first!'); this.setState({ isModalVisible: true, alertMessege: `Please verify your email address.` });
} }
} }
} catch (error) { } catch (error) {
const errorCode = error.code; const errorCode = error.code;
const errorMessage = error.message; const errorMessage = error.message;
if (errorCode === 'auth/wrong-password') { if (errorCode === 'auth/wrong-password') {
alert('Wrong password.'); this.setState({ isModalVisible: true, alertMessege: 'Wrong password.' });
} else if (errorCode === 'auth/user-not-found') { } else if (errorCode === 'auth/user-not-found') {
alert('User not Found.'); this.setState({ isModalVisible: true, alertMessege: 'User not Found.' });
} else { } else {
alert(errorMessage); this.setState({ isModalVisible: true, alertMessege: errorMessage });
} }
} }
this.props.getCurrentUserLoadingAction(false); this.props.getCurrentUserLoadingAction(false);
}; };
componentDidUpdate = () => { // componentDidUpdate = () => {
console.log(this.props.emailVerified); // console.log(this.props.emailVerified);
}; // };
render() { render() {
const { isCheck } = this.state; const { isCheck } = this.state;
...@@ -84,6 +88,38 @@ class LoginScreen extends Component { ...@@ -84,6 +88,38 @@ class LoginScreen extends Component {
Register Register
</Text> </Text>
</Text> </Text>
<Modal
coverScreen
swipeToClose={false}
animationDuration={200}
style={{ height: '25%', width: '90%', borderRadius: 20 }}
position={'center'}
isOpen={this.state.isModalVisible}
onClosed={() => this.setState({ isModalVisible: false })}
>
<View style={styles.overlayStyle}>
<Text
style={[
theme.normalText,
theme.textDark,
theme.centerText,
{ marginHorizontal: 30, fontSize: 18 },
]}
>
{this.state.alertMessege}
</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<Button
style={styles.saveButtonModal}
rounded
onPress={() => this.setState({ isModalVisible: false })}
>
<Text>Ok</Text>
</Button>
</View>
</View>
</Modal>
</KeyboardAvoidingView> </KeyboardAvoidingView>
); );
} }
...@@ -103,3 +139,19 @@ export default connect( ...@@ -103,3 +139,19 @@ export default connect(
mapStateTOProps, mapStateTOProps,
mapDispatchToProps mapDispatchToProps
)(LoginScreen); )(LoginScreen);
const styles = StyleSheet.create({
overlayStyle: {
padding: 20,
flex: 1,
alignItems: 'center',
justifyContent: 'space-around',
},
saveButtonModal: {
width: '80%',
backgroundColor: color.primary,
color: color.white,
justifyContent: 'center',
borderRadius: 100,
},
});
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