mirror of
https://github.com/laurent22/joplin.git
synced 2024-12-15 09:04:04 +02:00
99 lines
2.5 KiB
JavaScript
99 lines
2.5 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux'
|
|
import { ListView, Text, TouchableHighlight, View, StyleSheet } from 'react-native';
|
|
import { Log } from 'lib/log.js';
|
|
import { _ } from 'lib/locale.js';
|
|
import { Checkbox } from 'lib/components/checkbox.js';
|
|
import { reg } from 'lib/registry.js';
|
|
import { Note } from 'lib/models/note.js';
|
|
import { time } from 'lib/time-utils.js';
|
|
import { globalStyle } from 'lib/components/global-style.js';
|
|
|
|
let styles = {
|
|
listItem: {
|
|
flexDirection: 'row',
|
|
//height: 40,
|
|
borderBottomWidth: 1,
|
|
borderBottomColor: globalStyle.dividerColor,
|
|
alignItems: 'center',
|
|
paddingLeft: globalStyle.marginLeft,
|
|
paddingRight: globalStyle.marginRight,
|
|
paddingTop: globalStyle.itemMarginTop,
|
|
paddingBottom: globalStyle.itemMarginBottom,
|
|
backgroundColor: globalStyle.backgroundColor,
|
|
},
|
|
listItemText: {
|
|
flex: 1,
|
|
color: globalStyle.color,
|
|
fontSize: globalStyle.fontSize,
|
|
},
|
|
};
|
|
|
|
styles.listItemFadded = Object.assign({}, styles.listItem);
|
|
styles.listItemFadded.opacity = 0.4;
|
|
|
|
styles = StyleSheet.create(styles);
|
|
|
|
class NoteItemComponent extends Component {
|
|
|
|
noteItem_press(noteId) {
|
|
this.props.dispatch({
|
|
type: 'NAV_GO',
|
|
routeName: 'Note',
|
|
noteId: noteId,
|
|
});
|
|
}
|
|
|
|
async todoCheckbox_change(checked) {
|
|
if (!this.props.note) return;
|
|
|
|
const newNote = {
|
|
id: this.props.note.id,
|
|
todo_completed: checked ? time.unixMs() : 0,
|
|
}
|
|
await Note.save(newNote);
|
|
}
|
|
|
|
onPress() {
|
|
if (!this.props.note) return;
|
|
|
|
this.props.dispatch({
|
|
type: 'NAV_GO',
|
|
routeName: 'Note',
|
|
noteId: this.props.note.id,
|
|
});
|
|
}
|
|
|
|
render() {
|
|
const note = this.props.note ? this.props.note : {};
|
|
const onPress = this.props.onPress;
|
|
const onCheckboxChange = this.props.onCheckboxChange;
|
|
|
|
const checkboxStyle = !Number(note.is_todo) ? { display: 'none' } : { color: globalStyle.color };
|
|
const checkboxChecked = !!Number(note.todo_completed);
|
|
|
|
const listItemStyle = !!Number(note.is_todo) && checkboxChecked ? styles.listItemFadded : styles.listItem;
|
|
|
|
return (
|
|
<TouchableHighlight onPress={() => this.onPress()} underlayColor="#0066FF">
|
|
<View style={ listItemStyle }>
|
|
<Checkbox
|
|
style={checkboxStyle}
|
|
checked={checkboxChecked}
|
|
onChange={(checked) => this.todoCheckbox_change(checked)}
|
|
/>
|
|
<Text style={styles.listItemText}>{note.title}</Text>
|
|
</View>
|
|
</TouchableHighlight>
|
|
);
|
|
}
|
|
|
|
}
|
|
|
|
const NoteItem = connect(
|
|
(state) => {
|
|
return {};
|
|
}
|
|
)(NoteItemComponent)
|
|
|
|
export { NoteItem } |