diff --git a/components/bleeding.js b/components/bleeding.js new file mode 100644 index 0000000000000000000000000000000000000000..5fc625062e2b1ac88a5af122095b3cbb38f464ce --- /dev/null +++ b/components/bleeding.js @@ -0,0 +1,102 @@ +import React, { Component } from 'react' +import { + View, + Button, + Text, + Switch +} from 'react-native' +import RadioForm from 'react-native-simple-radio-button' +import styles from '../styles/index' +import { saveBleeding } from '../db' +import { bleeding as bleedingLabels } from '../labels/labels' + +export default class Bleeding extends Component { + constructor(props) { + super(props) + this.cycleDay = props.cycleDay + this.showView = props.showView + let bleedingValue = this.cycleDay.bleeding && this.cycleDay.bleeding.value + if (! (typeof bleedingValue === 'number') ){ + bleedingValue = -1 + } + this.state = { + currentValue: bleedingValue, + exclude: this.cycleDay.bleeding ? this.cycleDay.bleeding.exclude : false + } + } + + render() { + const bleedingRadioProps = [ + {label: bleedingLabels[0], value: 0 }, + {label: bleedingLabels[1], value: 1 }, + {label: bleedingLabels[2], value: 2 }, + {label: bleedingLabels[3], value: 3 }, + ] + return ( + <View style={ styles.symptomEditView }> + <View style={ styles.symptomEditSplitSymptomsAndLastRowButtons }> + <View style={ styles.symptomEditListedSymptomView }> + <View style={{flex: 1}}> + <Text style={styles.symptomDayView}>Bleeding</Text> + </View> + <View style={{flex: 1}}> + <RadioForm + radio_props={bleedingRadioProps} + initial={this.state.currentValue} + formHorizontal={true} + labelHorizontal={false} + labelStyle={styles.radioButton} + onPress={(itemValue) => { + this.setState({currentValue: itemValue}) + }} + /> + </View> + </View> + <View style={ styles.itemsInRowSeparatedView }> + <View style={ styles.singleButtonView }> + <Text style={ styles.symptomDayView }>Exclude</Text> + </View> + <View style={ styles.singleButtonView }> + <Switch + onValueChange={(val) => { + this.setState({exclude: val}) + }} + value={this.state.exclude} + /> + </View> + </View> + </View> + <View style={ styles.itemsInRowSeparatedView }> + <View style={ styles.singleButtonView }> + <Button + onPress={() => this.showView('dayView')} + title="Cancel"> + </Button> + </View> + <View style={ styles.singleButtonView }> + <Button + onPress={() => { + saveBleeding(this.cycleDay) + this.showView('dayView') + }} + title="Delete"> + </Button> + </View> + <View style={ styles.singleButtonView }> + <Button + onPress={() => { + saveBleeding(this.cycleDay, { + value: this.state.currentValue, + exclude: this.state.exclude + }) + this.showView('dayView') + }} + disabled={ this.state.currentValue === -1 } + title="Save"> + </Button> + </View> + </View> + </View> + ) + } +} diff --git a/components/cycle-day/cycle-day-overview.js b/components/cycle-day/cycle-day-overview.js index 220365302d91c9c5f2b77600b1b134434b34ef68..1212e1342135cd9466fe4a7ae99b4d20d029dc57 100644 --- a/components/cycle-day/cycle-day-overview.js +++ b/components/cycle-day/cycle-day-overview.js @@ -6,7 +6,7 @@ import { } from 'react-native' import styles from '../../styles' import { - bleeding as labels, + bleeding as bleedingLabels, mucusFeeling as feelingLabels, mucusTexture as textureLabels, mucusNFP as computeSensiplanMucusLabels, @@ -44,7 +44,7 @@ export default class DayView extends Component { const bleedingValue = this.cycleDay.bleeding && this.cycleDay.bleeding.value let bleedingLabel if (typeof bleedingValue === 'number') { - bleedingLabel = `${labels[bleedingValue]}` + bleedingLabel = `${bleedingLabels[bleedingValue]}` if (this.cycleDay.bleeding.exclude) bleedingLabel = "( " + bleedingLabel + " )" } else { bleedingLabel = 'edit'