Files
drip/components/cycle-day/symptoms/bleeding.js
T
2018-08-20 16:46:42 +02:00

78 lines
2.3 KiB
JavaScript

import React, { Component } from 'react'
import {
View,
Text,
Switch,
ScrollView
} from 'react-native'
import RadioForm from 'react-native-simple-radio-button'
import styles from '../../../styles'
import { saveSymptom } from '../../../db'
import { bleeding as labels } from '../labels/labels'
import ActionButtonFooter from './action-button-footer'
export default class Bleeding extends Component {
constructor(props) {
super(props)
this.cycleDay = props.cycleDay
this.makeActionButtons = props.makeActionButtons
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: labels[0], value: 0 },
{ label: labels[1], value: 1 },
{ label: labels[2], value: 2 },
{ label: labels[3], value: 3 },
]
return (
<View style={{ flex: 1 }}>
<ScrollView>
<View>
<View style={styles.radioButtonRow}>
<RadioForm
radio_props={bleedingRadioProps}
initial={this.state.currentValue}
formHorizontal={true}
labelHorizontal={false}
labelStyle={styles.radioButton}
onPress={(itemValue) => {
this.setState({ currentValue: itemValue })
}}
/>
</View>
<View style={styles.symptomViewRowInline}>
<Text style={styles.symptomDayView}>Exclude</Text>
<Switch
onValueChange={(val) => {
this.setState({ exclude: val })
}}
value={this.state.exclude}
/>
</View>
</View>
</ScrollView>
<ActionButtonFooter
symptom='bleeding'
cycleDay={this.props.cycleDay}
saveAction={() => {
saveSymptom('bleeding', this.props.cycleDay, {
value: this.state.currentValue,
exclude: this.state.exclude
})
}}
saveDisabled={this.state.currentValue === -1}
navigate={this.props.navigate}
/>
</View>
)
}
}