Skip to content

P
pill_minder
Commit 749e9400 authored by Phuengton Chummuel's avatar Phuengton Chummuel
Browse files
Options

add/delete reminder almost finish

parent fa48038f
Hide whitespace changes
Inline Side-by-side
Showing with 756 additions and 158 deletions
src/components/MedForm.js
View file @ 749e9400
import React, { Component } from 'react';
import React from 'react';
import {
View,
Text,
......
src/components/MedicineDetailCard.js 0 → 100644
View file @ 749e9400
import React from 'react'
import { Alert } from 'react-native'
import {
Container,
View,
Text,
Button,
} from 'native-base'
import moment from 'moment'
import { Grid, Col } from 'react-native-easy-grid';
import { ToastAndroid } from 'react-native';
import PushNotification from 'react-native-push-notification';
import realm from './../Database';
class MedicineDetailCard extends React.Component {
constructor(props) {
super(props)
}
render() {
const { headerStyle, timeTitleStyle, detailStyle, btnStyle } = styles;
const { id, medName, reminderTime, meal } = this.props.item
return (
<View style={{ flex: 1, marginTop: 10 }}>
<View style={timeTitleStyle}>
<Text style={{ color: 'white', fontSize: 20 }}>{moment(reminderTime).format('HH:mm')}</Text>
</View>
<View style={detailStyle}>
<Text>{medName}</Text>
<Text>Take 2</Text>
</View>
<View>
<Grid>
<Col>
<Button full style={btnStyle} >
<Text style={{ color: "#1686C4" }}>Delete</Text>
</Button>
</Col>
<Col>
<Button full style={btnStyle} onPress={() => this._cancleNotification(id)}>
<Text style={{ color: "#1686C4" }}>Delete</Text>
</Button>
</Col>
</Grid>
</View>
</View>
)
}
_cancleNotification(id) {
Alert.alert(
'Alert',
'Are you sure to delete this reminder ?',
[
{
text: 'OK', onPress: () => {
PushNotification.cancelLocalNotifications({ id })
realm.write(() => {
let myReminder = realm.objects('Reminder').filtered('id == ' + id)
realm.delete(myReminder)
ToastAndroid.show(JSON.stringify(myReminder), ToastAndroid.SHORT)
})
}
},
],
{ cancelable: false }
)
}
}
const styles = {
timeTitleStyle: {
height: 60,
justifyContent: 'center',
backgroundColor: "#1686c4",
padding: 10,
},
detailStyle: {
padding: 10,
},
btnStyle: {
backgroundColor: 'white',
}
}
export default MedicineDetailCard;
\ No newline at end of file
src/components/ReminderList.js 0 → 100644
View file @ 749e9400
import React from 'react';
import { ToastAndroid } from 'react-native';
import {
View,
Text,
List,
ListItem,
} from 'native-base';
class ReminderList extends React.Component {
constructor(props) {
super(props)
}
render() {
const { containerStyle } = styles
return (
<View>
<Text>{this.props.periodText}</Text>
<View style={containerStyle}>
<List dataArray={this.props.items}
renderRow={(item) =>
<ListItem>
<Text>{item.medName}</Text>
</ListItem>
}>
</List>
</View>
</View>
)
}
}
const styles = {
containerStyle: {
flex: 1,
height: 200,
backgroundColor: 'white',
borderWidth: 5,
borderRadius: 2,
borderColor: '#1686C4',
borderBottomWidth: 0,
elevation: 1,
}
}
export default ReminderList
\ No newline at end of file
src/navigators/RootNavigator.js
View file @ 749e9400
......@@ -8,16 +8,24 @@ import SettingsScreen from './../screens/SettingsScreen';
import MedicationsScreen from './../screens/MedicationsScreen';
import SignInScreen from './../screens/SignInScreen';
import MainScreen from './../screens/MainScreen';
import SettingsTimePeriod from './../screens/SettingsTimePeriod'
import ReminderDetail from './../screens/ReminderDetail'
const RootNavigator = StackNavigator(
{
SignIn: {
screen: SignInScreen,
},
Home: {
screen: DrawerNavigator({
Home: {
screen: HomeScreen,
screen: StackNavigator({
Home: {
screen: HomeScreen
},
Detail: {
screen: ReminderDetail
}
}, {
headerMode: 'none'
})
},
Camera: {
screen: StackNavigator({
......@@ -35,10 +43,22 @@ const RootNavigator = StackNavigator(
screen: MedicationsScreen
},
Settings: {
screen: SettingsScreen,
screen: StackNavigator({
Settings: {
screen: SettingsScreen
},
SettingsTime: {
screen: SettingsTimePeriod
}
}, {
headerMode: 'none'
})
}
})
}
},
SignIn: {
screen: SignInScreen,
},
}, {
headerMode: 'none'
}
......
src/screens/HomeScreen.js
View file @ 749e9400
import React, { Component } from 'react';
import { ToastAndroid } from 'react-native';
import { ToastAndroid, AsyncStorage, TouchableOpacity } from 'react-native';
import {
Container,
Content,
......@@ -18,30 +18,29 @@ import {
Grid
} from 'react-native-easy-grid'
import AppHeader from './../components/Header';
import Realm from 'realm';
let realm = new Realm({
schema: [{
name: 'Reminder',
properties: {
medName: 'string',
reminderTime: 'date'
}
}]
})
import ReminderList from './../components/ReminderList';
import { formatDate } from './../Utils';
import realm from './../Database';
class HomeScreen extends Component {
constructor() {
super();
this.state = {
firstLaunch: null,
active: false,
today: this.formatDate(new Date(Date.now()))
today: formatDate(new Date(Date.now())),
initDB: false,
morningReminder: [],
afternoonReminder: [],
eveningReminder: [],
nightReminder: [],
};
}
componentWillMount() {
let myReminder = realm.objects('Reminder')
ToastAndroid.show(JSON.stringify(myReminder), ToastAndroid.SHORT)
this._isFirstLaunched()
this._initDB()
this._queryReminder()
}
render() {
......@@ -68,38 +67,38 @@ class HomeScreen extends Component {
<Grid>
<Col>
<Row>
<View style={timePeriodLeftStyle}>
<Text>Morning</Text>
<View style={containerStyle}>
</View>
</View>
<TouchableOpacity style={timePeriodLeftStyle} onPress={() => this._timePeriodPress(this.state.morningReminder)}>
<ReminderList
periodText={"Morning"}
items={this.state.morningReminder}
/>
</TouchableOpacity>
</Row>
<Row>
<View style={timePeriodLeftStyle}>
<Text>Afternoon</Text>
<View style={containerStyle}>
</View>
</View>
<TouchableOpacity style={timePeriodLeftStyle} onPress={() => this._timePeriodPress(this.state.afternoonReminder)}>
<ReminderList
periodText={"Afternoon"}
items={this.state.afternoonReminder}
/>
</TouchableOpacity>
</Row>
</Col>
<Col>
<Row>
<View style={timePeriodRightStyle}>
<Text>Evening</Text>
<View style={containerStyle}>
</View>
</View>
<TouchableOpacity style={timePeriodRightStyle} onPress={() => this._timePeriodPress(this.state.eveningReminder)}>
<ReminderList
periodText={"Evening"}
items={this.state.eveningReminder}
/>
</TouchableOpacity>
</Row>
<Row>
<View style={timePeriodRightStyle}>
<Text>Night</Text>
<View style={containerStyle}>
</View>
</View>
<TouchableOpacity style={timePeriodRightStyle} onPress={() => this._timePeriodPress(this.state.nightReminder)}>
<ReminderList
periodText={"Night"}
items={this.state.nightReminder}
/>
</TouchableOpacity>
</Row>
</Col>
</Grid>
......@@ -125,36 +124,84 @@ class HomeScreen extends Component {
this.props.navigation.navigate('DrawerToggle');
}
formatDate(date) {
var monthNames = [
"January", "February", "March",
"April", "May", "June", "July",
"August", "September", "October",
"November", "December"
];
_timePeriodPress(data) {
ToastAndroid.show(JSON.stringify(data), ToastAndroid.SHORT)
this.props.navigation.navigate('Detail', { items: data })
}
_queryReminder() {
let myReminder = realm.objects('Reminder')
let morningReminder = myReminder.filtered('period == 1')
let afternoonReminder = myReminder.filtered('period == 2')
let eveningReminder = myReminder.filtered('period == 3')
let nightReminder = myReminder.filtered('period == 4')
var tmpMorning = []
morningReminder.forEach(i => {
tmpMorning.push(i)
});
var tmpAfternoon = []
afternoonReminder.forEach(i => {
tmpAfternoon.push(i)
})
var day = date.getDate();
var monthIndex = date.getMonth();
var tmpEvening = []
eveningReminder.forEach(i => {
tmpEvening.push(i)
})
return 'Today, ' + day + ' ' + monthNames[monthIndex];
var tmpNight = []
nightReminder.forEach(i => {
tmpNight.push(i)
})
this.setState({ morningReminder: tmpMorning, afternoonReminder: tmpAfternoon, eveningReminder: tmpEvening, nightReminder: tmpNight })
// ToastAndroid.show(JSON.stringify(myReminder), ToastAndroid.LONG)
ToastAndroid.show(JSON.stringify(this.state.morningReminder), ToastAndroid.LONG)
}
_isFirstLaunched() {
AsyncStorage.getItem("alreadyLaunched").then(value => {
if (value == null) {
AsyncStorage.setItem('alreadyLaunched', 'true')
.catch(error => {
ToastAndroid.show(error.toString(), ToastAndroid.SHORT)
}) // No need to wait for `setItem` to finish, although you might want to handle errors
this.setState({ firstLaunch: true });
ToastAndroid.show("Frist Launch:" + this.state.firstLaunch, ToastAndroid.LONG)
} else {
this.setState({ firstLaunch: false });
ToastAndroid.show("Frist Launch:" + this.state.firstLaunch, ToastAndroid.LONG)
}
}) // Add some error handling, also you can simply do this.setState({fistLaunch: value == null})
}
_initDB() {
AsyncStorage.getItem("alreadyInitDB").then(value => {
if (value == null) {
ToastAndroid.show("Init DB", ToastAndroid.LONG)
AsyncStorage.setItem('alreadyInitDB', 'true')
realm.write(() => {
realm.create('TimePeriod', {
morning: '08:00',
afternoon: '12:00',
evening: '16:00',
night: '20:00'
})
})
}
})
}
}
const styles = {
containerStyle: {
flex: 1,
backgroundColor: 'white',
borderWidth: 5,
borderRadius: 2,
borderColor: '#1686C4',
borderBottomWidth: 0,
elevation: 1,
padding: 10
},
timePeriodLeftStyle: {
flex: 1,
height: 200,
marginLeft: 20,
marginRight: 10,
marginTop: 20,
......@@ -162,7 +209,6 @@ const styles = {
},
timePeriodRightStyle: {
flex: 1,
height: 200,
marginLeft: 10,
marginRight: 20,
marginTop: 20,
......
src/screens/MainScreen.js
View file @ 749e9400
......@@ -23,7 +23,8 @@ class MainScreen extends Component {
render() {
return this.state.user != null ? <HomeScreen /> : <SignInScreen />;
// return this.state.user != null ? <HomeScreen /> : <SignInScreen />;
return <HomeScreen />
}
}
......
src/screens/MedicationsScreen.js
View file @ 749e9400
import React, { Component } from 'react';
import { DeviceEventEmitter, ToastAndroid } from 'react-native';
import { DeviceEventEmitter, ToastAndroid, Alert } from 'react-native';
import PushNotification from 'react-native-push-notification';
import {
Container,
......@@ -14,22 +14,38 @@ import {
Input,
ListItem,
Radio,
Right
Right,
Left,
Body,
} from 'native-base';
import DatePicker from 'react-native-datepicker';
import AppHeader from './../components/Header';
import MedForm from '../components/MedForm';
import Realm from 'realm';
let realm = new Realm({
schema: [{
name: 'Reminder',
properties: {
medName: 'string',
reminderTime: 'date'
}
}]
})
import { formatDate, scheduleLocalNotification } from './../Utils';
import moment from 'moment'
import realm from './../Database'
import { Grid, Col } from 'react-native-easy-grid';
PushNotification.configure({
// (required) Called when a remote or local notification is opened or received
onNotification: function (notification) {
ToastAndroid.show(JSON.stringify(notification.id), ToastAndroid.LONG)
// process the notification
},
// Should the initial notification be popped automatically
// default: true
popInitialNotification: true,
/**
* (optional) default: true
* - Specified if permissions (ios) and token (android and ios) will requested or not,
* - if not, you must call PushNotificationsHandler.requestPermissions() later
*/
requestPermissions: true,
});
class MedicationsScreen extends Component {
......@@ -40,16 +56,21 @@ class MedicationsScreen extends Component {
date: new Date(Date.now()).toISOString().split('T')[0],
reminderDate: new Date(Date.now()),
minDate: new Date(Date.now()).toISOString().split('T')[0],
morning: true,
lunch: false,
night: false
morning: false,
afternoon: false,
evening: false,
night: false,
morningTime: "",
afternoonTime: "",
eveningTime: "",
nightTime: "",
beforeMeal: true,
afterMeal: false,
};
}
componentWillMount() {
this.init()
PushNotification.registerNotificationActions(['Yes', 'No']);
DeviceEventEmitter.addListener('notificationActionReceived', function (action) {
console.log('Notification action received: ' + action);
......@@ -62,6 +83,17 @@ class MedicationsScreen extends Component {
}
});
let timePeriod = realm.objects('TimePeriod')
var morningTime = timePeriod[0].morning
var afternoonTime = timePeriod[0].afternoon
var eveningTime = timePeriod[0].evening
var nightTime = timePeriod[0].night
this.setState({ morningTime, afternoonTime, eveningTime, nightTime })
// ToastAndroid.show(morningTime + afternoonTime + eveningTime + nightTime, ToastAndroid.SHORT)
}
render() {
......@@ -93,29 +125,66 @@ class MedicationsScreen extends Component {
<MedForm titleText={"Reminder Time"}>
<Content>
<ListItem onPress={() => this._onReminderTimePresses("1")}>
<Text>Morning</Text>
<ListItem onPress={() => this._onReminderTimePresses(1)}>
<Radio selected={this.state.morning} />
<Body>
<Text>Morning</Text>
</Body>
<Right>
<Text>{this.state.morningTime}</Text>
</Right>
</ListItem>
<ListItem onPress={() => this._onReminderTimePresses(2)}>
<Radio selected={this.state.afternoon} />
<Body>
<Text>Afternoon</Text>
</Body>
<Right>
<Radio selected={this.state.morning} onPress={() => this._onReminderTimePresses("1")} />
<Text>{this.state.afternoonTime}</Text>
</Right>
</ListItem>
<ListItem onPress={() => this._onReminderTimePresses("2")}>
<Text>Lunch</Text>
<ListItem onPress={() => this._onReminderTimePresses(3)}>
<Radio selected={this.state.evening} />
<Body>
<Text>Evening</Text>
</Body>
<Right>
<Radio selected={this.state.lunch} onPress={() => this._onReminderTimePresses("2")} />
<Text>{this.state.eveningTime}</Text>
</Right>
</ListItem>
<ListItem onPress={() => this._onReminderTimePresses("3")}>
<Text>Night</Text>
<ListItem onPress={() => this._onReminderTimePresses(4)}>
<Radio selected={this.state.night} />
<Body>
<Text>Night</Text>
</Body>
<Right>
<Radio selected={this.state.night} onPress={() => this._onReminderTimePresses("3")} />
<Text>{this.state.nightTime}</Text>
</Right>
</ListItem>
</Content>
</MedForm>
<MedForm titleText={"Before/After Meal"}>
<Content>
<ListItem onPress={() => this._setBeforeAfterMeal(1)}>
<Radio selected={this.state.beforeMeal} />
<Body>
<Text>Before</Text>
</Body>
</ListItem>
<ListItem onPress={() => this._setBeforeAfterMeal(2)}>
<Radio selected={this.state.afterMeal} />
<Body>
<Text>After</Text>
</Body>
</ListItem>
</Content>
</MedForm>
<MedForm titleText={"Schedule"}>
<DatePicker
<Text style={timeStyle}>Start date : {formatDate(new Date(Date.now()))}</Text>
{/* <DatePicker
style={timeStyle}
date={new Date(this.state.date).toISOString().split('T')[0]}
mode="date"
......@@ -125,85 +194,132 @@ class MedicationsScreen extends Component {
confirmBtnText="Confirm"
cancelBtnText="Cancel"
onDateChange={(date) => { this.setState({ date: date }); }}
/>
/> */}
</MedForm>
<View>
<Button style={btnAddNoti} onPress={() => this._onResetPressed()}>
<Text style={{ color: "#1686C4" }}>Reset</Text>
</Button>
<Button style={btnAddNoti} onPress={() => this._setNotification()}>
<Text style={{ color: "#1686C4" }}>Add nonotification</Text>
</Button>
</View>
<Grid>
<Col>
<Button full style={btnAddNoti} onPress={() => this._onResetPressed()}>
<Text style={{ color: "#1686C4" }}>Reset</Text>
</Button>
</Col>
<Col>
<Button full style={btnAddNoti} onPress={() => this._onAddNotificationPressed()}>
<Text style={{ color: "#1686C4" }}>Add</Text>
</Button>
</Col>
</Grid>
</Content>
</Container>
)
};
init() {
_setBeforeAfterMeal(id) {
switch (id) {
case 1:
if (!this.state.beforeMeal) {
this.setState({ beforeMeal: !this.state.beforeMeal, afterMeal: !this.state.afterMeal })
}
break
case 2:
if (!this.state.afterMeal) {
this.setState({ afterMeal: !this.state.afterMeal, beforeMeal: !this.state.beforeMeal })
}
break
}
}
setReminderDate() {
_onAddNotificationPressed() {
var reminderDate = this.state.reminderDate
if (this.state.text && this.state.morning || this.state.afternoon || this.state.evening || this.state.night) {
if (this.state.morning) {
reminderDate = new Date(this.state.date).setHours(8, 0, 0, 0)
} else if (this.state.lunch) {
reminderDate = new Date(this.state.date).setHours(12, 0, 0, 0)
} else if (this.state.night) {
reminderDate = new Date(this.state.date).setHours(21, 0, 0, 0)
}
reminderDate = new Date(reminderDate)
if (this.state.morning === true) {
var time = this.state.morningTime.split(':')
this._setNotification(time[0], time[1], 1)
}
if (this.state.afternoon === true) {
var time = this.state.afternoonTime.split(':')
this._setNotification(time[0], time[1], 2)
}
if (this.state.evening === true) {
var time = this.state.eveningTime.split(':')
this._setNotification(time[0], time[1], 3)
}
if (this.state.night === true) {
var time = this.state.nightTime.split(':')
this._setNotification(time[0], time[1], 4)
}
this.setState({ reminderDate })
Alert.alert(
'Successful',
'',
[
{ text: 'OK', onPress: () => ToastAndroid.show("Successful", ToastAndroid.SHORT) },
],
{ cancelable: false }
)
} else {
Alert.alert(
'Please enter medine name / Select reminder time',
'',
[
{ text: 'OK', onPress: () => ToastAndroid.show("Please enter medine name / Select reminder time", ToastAndroid.SHORT) },
],
{ cancelable: false }
)
}
}
_setNotification() {
// if (this.state.text) {
// PushNotification.localNotificationSchedule({
// id: '1234',
// title: "ถึงเวลารับประทานยา " + this.state.text,
// message: "My Notification Message",
// date: new Date(Date.now() + (5 * 1000)),
// actions: '["Yes", "No"]',
// })
// }
if (this.state.text) {
realm.write(() => {
realm.create('Reminder', {
medName: this.state.text,
reminderTime: this.state.reminderDate
})
_setNotification(hour, minute, period) {
var id = Math.random() * 10000
var reminderDate = moment().hour(hour).minute(minute).second(0).toDate()
var beforeMeal = this.state.beforeMeal ? "\tก่อนอาหาร" : "\tหลังอาหาร";
var msg = "แจ้งเตือนกินยา\n" + "เวลา: " + hour + ":" + minute + "\nยา: " + this.state.text + beforeMeal;
scheduleLocalNotification(msg, reminderDate, id)
realm.write(() => {
realm.create('Reminder', {
id: id,
medName: this.state.text,
reminderTime: reminderDate,
meal: beforeMeal.trim(),
period: period
})
}
ToastAndroid.show(this.state.reminderDate.toString(), ToastAndroid.SHORT)
})
}
_onResetPressed() {
realm.write(() => {
let allReminder = realm.objects('Reminder')
realm.delete(allReminder)
})
let myReminder = realm.objects('Reminder')
}
_onReminderTimePresses(id) {
switch (id) {
case '1':
this.setState({ morning: !this.state.morning, lunch: false, night: false })
this.setReminderDate()
_onReminderTimePresses(pos) {
switch (pos) {
case 1:
this.setState({ morning: !this.state.morning })
break
case 2:
this.setState({ afternoon: !this.state.afternoon })
break
case '2':
this.setState({ lunch: !this.state.lunch, morning: false, night: false })
this.setReminderDate()
case 3:
this.setState({ evening: !this.state.evening })
break
case '3':
this.setState({ night: !this.state.night, morning: false, lunch: false })
this.setReminderDate()
case 4:
this.setState({ night: !this.state.night })
break
}
}
......@@ -212,21 +328,20 @@ class MedicationsScreen extends Component {
this.props.navigation.navigate("DrawerToggle");
}
_onResetPressed() {
let myReminder = realm.objects('Reminder')
ToastAndroid.show(JSON.stringify(myReminder), ToastAndroid.SHORT)
}
};
const styles = {
timeStyle: {
flex: 1,
padding: 15,
width: 200,
},
btnAddNoti: {
justifyContent: 'center',
backgroundColor: '#FFFFFF'
flex: 1,
backgroundColor: '#FFFFFF',
marginTop: 15,
marginBottom: 15,
marginLeft: 20,
marginRight: 20,
}
}
......
src/screens/ReminderDetail.js 0 → 100644
View file @ 749e9400
import React from 'react';
import {
Container,
Content,
View,
Text,
Button,
Icon,
List,
ListItem
} from 'native-base';
import AppHeader from './../components/Header';
import MedicineDetailCard from './../components/MedicineDetailCard';
import { formatDate } from './../Utils';
import moment from 'moment';
class ReminderDetail extends React.Component {
render() {
const { params } = this.props.navigation.state;
const { goBack } = this.props.navigation;
const items = params ? params.items : null
const { headerStyle, headerFontStyle } = styles
return (
<Container style={{ backgroundColor: 'white' }}>
<AppHeader
headerText={"Morning"}
headerLeft={
<Button onPress={() => goBack()}>
<Icon name='arrow-back' />
</Button>
}
/>
<Content>
<View style={headerStyle}>
<Text style={headerFontStyle}>{formatDate(new Date(Date.now()))}</Text>
</View>
<List dataArray={items}
renderRow={(item) =>
<ListItem style={{ marginLeft: 10, paddingLeft: 0, paddingRight: 0, marginRight: 10 }}>
<MedicineDetailCard
item={item}
/>
</ListItem>
}>
</List>
</Content>
</Container>
)
}
}
const styles = {
headerStyle: {
height: 50,
marginTop: 20,
marginBottom: 10,
justifyContent: 'center'
},
headerFontStyle: {
fontSize: 20,
textAlign: 'center',
}
}
export default ReminderDetail;
\ No newline at end of file
src/screens/SettingsScreen.js
View file @ 749e9400
......@@ -12,6 +12,12 @@ import AppHeader from '../components/Header';
import BtnSettings from '../components/BtnSettings';
class Menu extends Component {
constructor(props) {
super(props);
this.props.navigation.state.key = 'SettingsScreen'
}
render() {
return (
<Container>
......@@ -32,6 +38,12 @@ class Menu extends Component {
ToastAndroid.show("Language", ToastAndroid.SHORT)
}}
/>
<BtnSettings
text={"Time Period"}
onPress={() => {
this.props.navigation.navigate('SettingsTime', { keyBScreen: this.props.navigation.state.key });
}}
/>
<BtnSettings
text={"Log Out"}
onPress={() => {
......
src/screens/SettingsTimePeriod.js 0 → 100644
View file @ 749e9400
import React from 'react';
import { ToastAndroid, View, TimePickerAndroid, Alert } from 'react-native';
import {
Container,
Content,
Button,
Icon,
Text,
Left,
Right
} from 'native-base'
import AppHeader from './../components/Header';
import BtnSettings from './../components/BtnSettings';
import moment from 'moment';
import realm from './../Database';
class SettingTimePeriod extends React.Component {
constructor(props) {
super(props)
this.state = {
morningTime: "",
afternoonTime: "",
eveningTime: "",
nightTime: ""
}
}
componentDidMount() {
this._queryTimePeriod()
}
render() {
const { key } = this.props.navigation.state;
const { goBack } = this.props.navigation;
const { btnTimeStyle, fontStyle } = styles
return (
<Container>
<AppHeader
headerText={"Time Period"}
headerLeft={
<Button onPress={() => goBack(key.keyBScreen)}>
<Icon name='arrow-back' />
</Button>
}
/>
<Content style={{ marginTop: 50 }}>
<View style={{ borderBottomColor: '#EEEEEE', borderBottomWidth: 0.5 }}>
<Button style={btnTimeStyle} onPress={() => this._timePicker(1)}>
<Left>
<Text style={fontStyle}>Morning</Text>
</Left>
<Right>
<Text style={fontStyle}>{this.state.morningTime}</Text>
</Right>
</Button>
</View>
<View style={{ borderBottomColor: '#EEEEEE', borderBottomWidth: 0.5 }}>
<Button style={btnTimeStyle} onPress={() => this._timePicker(2)}>
<Left>
<Text style={fontStyle}>Afternoon</Text>
</Left>
<Right>
<Text style={fontStyle}>{this.state.afternoonTime}</Text>
</Right>
</Button>
</View>
<View style={{ borderBottomColor: '#EEEEEE', borderBottomWidth: 0.5 }}>
<Button style={btnTimeStyle} onPress={() => this._timePicker(3)}>
<Left>
<Text style={fontStyle}>Evening</Text>
</Left>
<Right>
<Text style={fontStyle}>{this.state.eveningTime}</Text>
</Right>
</Button>
</View>
<View style={{ borderBottomColor: '#EEEEEE', borderBottomWidth: 0.5 }}>
<Button style={btnTimeStyle} onPress={() => this._timePicker(4)}>
<Left>
<Text style={fontStyle}>Night</Text>
</Left>
<Right>
<Text style={fontStyle}>{this.state.nightTime}</Text>
</Right>
</Button>
</View>
</Content>
</Container>
)
}
_timePicker(period) {
try {
const { action, hour, minute } = TimePickerAndroid
.open({
is24Hour: true, // Will display '2 PM'
})
.then(({ action, hour, minute }) => {
switch (action) {
case "timeSetAction":
Alert.alert(
'Confirm',
'',
[
{ text: 'Cancel', onPress: () => console.log('Cancel Pressed'), style: 'cancel' },
{ text: 'OK', onPress: () => this._setTime(hour, minute, period) },
],
{ cancelable: false }
)
break;
case "dismissedAction":
break;
}
})
} catch ({ code, message }) {
console.warn('Cannot open time picker', message);
}
}
_setTime(hour, minute, period) {
let timePeriod = realm.objects("TimePeriod")
switch (period) {
case 1:
realm.write(() => {
timePeriod[0].morning = this._formatDate(hour, minute)
})
this.setState({ morningTime: this._formatDate(hour, minute) })
break;
case 2:
realm.write(() => {
timePeriod[0].afternoon = this._formatDate(hour, minute)
})
this.setState({ afternoonTime: this._formatDate(hour, minute) })
break;
case 3:
realm.write(() => {
timePeriod[0].evening = this._formatDate(hour, minute)
})
this.setState({ eveningTime: this._formatDate(hour, minute) })
break;
case 4:
realm.write(() => {
timePeriod[0].night = this._formatDate(hour, minute)
})
this.setState({ nightTime: this._formatDate(hour, minute) })
break;
}
}
_formatDate(hour, minute) {
return moment(hour + ":" + minute, 'HH:mm').format('HH:mm').toString()
}
_queryTimePeriod() {
let timePeriod = realm.objects('TimePeriod')
var morningTime = timePeriod[0].morning
var afternoonTime = timePeriod[0].afternoon
var eveningTime = timePeriod[0].evening
var nightTime = timePeriod[0].night
this.setState({ morningTime, afternoonTime, eveningTime, nightTime })
}
}
const styles = {
btnTimeStyle: {
height: 60,
backgroundColor: 'white',
padding: 20,
},
fontStyle: {
fontFamily: 'sans-serif-light',
fontSize: 18
}
}
export default SettingTimePeriod;
\ No newline at end of file
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