1. 创建/修改日记本

2. 删除日记本
This commit is contained in:
xuwenyang 2019-05-24 17:47:44 +08:00
parent a58a1dee69
commit d021cee7a9
5 changed files with 178 additions and 44 deletions

View file

@ -1,12 +1,46 @@
import React, {Component} from 'react';
import {StyleSheet, Text, View, ScrollView} from 'react-native';
import {Navigation} from 'react-native-navigation';
import Color from '../style/color';
import {Icon} from '../style/icon';
import NotebookDiaryList from '../component/notebook/notebookDiaryList';
export default class NotebookDetailPage extends Component {
constructor(props) {
super(props);
Navigation.events().bindComponent(this);
}
static options(passProps) {
return {
topBar: {
title: {
text: '《' + passProps.notebook.subject + '》'
},
rightButtons: [{
id: 'navButtonNotebookSetting',
icon: Icon.navButtonNotebookSetting,
color: Color.primary
}]
}
};
}
navigationButtonPressed({buttonId}) {
Navigation.push(this.props.componentId, {
component: {
name: 'NotebookEdit',
passProps: {
notebook: this.props.notebook
}
}
});
}
render() {
return (
<View style={{flex: 1}}>

View file

@ -1,5 +1,16 @@
import React, {Component} from 'react';
import {StyleSheet, Text, View, ScrollView, Switch, TextInput, TouchableOpacity} from 'react-native';
import {
StyleSheet,
Text,
View,
ScrollView,
Switch,
TextInput,
TouchableOpacity,
DeviceEventEmitter,
Keyboard,
Alert
} from 'react-native';
import {Navigation} from 'react-native-navigation';
import ActionSheet from 'react-native-actionsheet-api';
import ImagePicker from 'react-native-image-crop-picker'
@ -9,6 +20,7 @@ import Color from '../style/color';
import {Icon} from '../style/icon';
import Msg from '../util/msg';
import Api from '../util/api';
import Event from "../util/event";
import Loading from '../component/loading'
import DateInput from '../component/dateInput'
@ -23,11 +35,11 @@ export default class NotebookEditPage extends Component {
this.state = {
notebook: props.notebook,
subject: '',
isPublic: false,
dateString: '',
subject: props.notebook ? props.notebook.subject : '',
isPublic: props.notebook ? props.notebook.isPublic : false,
uploading: false
uploading: false,
saving: false
}
}
@ -35,7 +47,10 @@ export default class NotebookEditPage extends Component {
return {
topBar: {
title: {
text: '创建日记本'
text: !passProps.notebook ? '创建日记本' : '修改日记本'
},
backButton: {
title: passProps.backTitle ? passProps.backTitle : '返回'
},
rightButtons: [{
id: 'save',
@ -53,9 +68,50 @@ export default class NotebookEditPage extends Component {
}
navigationButtonPressed({buttonId}) {
console.log('date string:', this.dateInput.getDate());
this.saveNotebook();
}
async saveNotebook() {
let notebook = this.state.notebook;
let subject = this.state.subject;
let isPublic = this.state.isPublic;
try{
this.setState({saving: true});
let result;
if (!notebook) {
let dateString = this.dateInput.getDate();
result = await Api.createNotebook(subject, '', dateString, isPublic ? 10 : 1);
} else {
result = await Api.updateNotebook(notebook.id, subject, notebook.description, isPublic ? 10 : 1);
}
if(result) {
Keyboard.dismiss();
Msg.showMsg(!notebook ? '创建完成' : '保存完成');
DeviceEventEmitter.emit(Event.updateNotebooks);
Navigation.popToRoot(this.props.componentId);
} else {
throw {
message: 'save notebook failed'
}
}
} catch(e) {
console.log('e:', e);
Msg.showMsg(!notebook ? '创建日记本失败' : '修改日记本失败');
}
this.setState({saving: false});
}
async resizePhoto(uri, oWidth, oHeight) {
let width = 0;
let height = 0;
@ -123,24 +179,22 @@ export default class NotebookEditPage extends Component {
}
_onDelete() {
Navigation.popToRoot(this.props.componentId);
/*
let notebookId = this.state.notebook ? this.state.notebook.id;
let notebookId = this.state.notebook ? this.state.notebook.id : null;
if(!notebookId) {
return;
}
Api.deleteNotebook(notebookId)
.then(() => {
DeviceEventEmitter.emit(Event.updateNotebooks);
Alert.alert('提示', '日记本已删除', [{text: '好', onPress: () => {
Navigation.popToRoot();
Navigation.popToRoot(this.props.componentId);
}}]);
})
.catch((err) => {
Alert.alert('删除失败', err.message)
});
*/
}
render() {
@ -163,15 +217,21 @@ export default class NotebookEditPage extends Component {
</View>
<View style={localStyle.line} />
<View>
<View style={localStyle.item}>
<DateInput ref={(r) => {this.dateInput = r}}
style={localStyle.datePickerStyle}
customStyles={customDatePickerStyle}>
</DateInput>
</View>
</View>
<View style={localStyle.line} />
{
!this.state.notebook
? (
<View>
<View style={localStyle.item}>
<DateInput ref={(r) => {this.dateInput = r}}
style={localStyle.datePickerStyle}
customStyles={customDatePickerStyle}>
</DateInput>
</View>
<View style={localStyle.line} />
</View>
) : null
}
<View style={localStyle.item}>
<Text style={localStyle.title}>公开日记本</Text>
@ -183,24 +243,26 @@ export default class NotebookEditPage extends Component {
</View>
</View>
<View style={localStyle.group}>
<TouchableOpacity style={localStyle.item}
onPress={this._onEditCover.bind(this)}>
<Text style={localStyle.editCover}>设置封面</Text>
</TouchableOpacity>
</View>
<View>
<View style={localStyle.group}>
<TouchableOpacity style={localStyle.item}
onPress={this._onDelete.bind(this)}>
<Text style={localStyle.delete}>删除</Text>
</TouchableOpacity>
</View>
<Text style={localStyle.tip}>提示写过的日记本不能被删除</Text>
</View>
{
this.state.notebook
? (
<View>
<View style={localStyle.group}>
<TouchableOpacity style={localStyle.item}
onPress={this._onEditCover.bind(this)}>
<Text style={localStyle.editCover}>设置封面</Text>
</TouchableOpacity>
</View>
<View style={localStyle.group}>
<TouchableOpacity style={localStyle.item}
onPress={this._onDelete.bind(this)}>
<Text style={localStyle.delete}>删除</Text>
</TouchableOpacity>
</View>
<Text style={localStyle.tip}>提示写过的日记本不能被删除</Text>
</View>
) : null
}
</View>
);

View file

@ -1,5 +1,5 @@
import React, {Component} from 'react';
import {StyleSheet, Text, View, Animated} from 'react-native';
import {StyleSheet, Text, View, Animated, DeviceEventEmitter} from 'react-native';
import {
PagerScroll,
TabView,
@ -9,6 +9,7 @@ import {
import {Navigation} from 'react-native-navigation';
import Api from '../util/api';
import Event from "../util/event";
import Color from '../style/color';
import UserIntro from '../component/userIntro';
@ -36,7 +37,15 @@ export default class UserPage extends Component {
};
}
componentDidMount(){
this.listener = DeviceEventEmitter.addListener(Event.updateNotebooks, (param) => {
this.notebookList.refresh();
});
}
componentWillUnmount(){
this.listener.remove();
}
_renderLabel = props => ({route}) => {
let routes = props.navigationState.routes;
@ -75,6 +84,7 @@ export default class UserPage extends Component {
{...this.props}
/>,
notebook: () => <NotebookList
ref={(r) => this.notebookList = r}
user={this.user}
{...this.props}
/>

View file

@ -132,7 +132,28 @@ async function updateNotebookCover(bookId, photoUri) {
name: 'image.jpg',
type: 'image/jpg'
}
})
});
}
async function createNotebook(subject, description, expired, privacy) {
return call('POST', '/notebooks', {
subject: subject,
description: description,
expired: expired,
privacy: privacy
});
}
async function updateNotebook(id, subject, description, privacy) {
return call('PUT', '/notebooks/' + id, {
subject: subject,
description: description,
privacy: privacy
});
}
async function deleteNotebook(id) {
return call('DELETE', '/notebooks/' + id)
}
@ -272,5 +293,8 @@ export default {
getMessagesHistory,
updateNotebookCover
updateNotebookCover,
createNotebook,
updateNotebook,
deleteNotebook
}

4
src/util/event.js Normal file
View file

@ -0,0 +1,4 @@
export default {
updateNotebooks: 'updateNotebooks'
}