1. 代码整理,bug修复

This commit is contained in:
xuwenyang 2019-06-21 23:11:00 +08:00
parent 5a4a8c9f78
commit 6a3c7333ad
12 changed files with 192 additions and 84 deletions

View file

@ -10,10 +10,25 @@ import UserIcon from '../userIcon';
export default class Comment extends Component { export default class Comment extends Component {
constructor(props) {
super(props);
this.state = {
comment: props.comment,
isMyDiary: props.isMyDiary || false,
isMyComment: props.isMyComment || false,
expired: props.expired || false
};
}
render() { render() {
let comment = this.props.comment; let comment = this.state.comment;
let user = comment.user; let user = comment.user;
let editable = this.props.editable;
let isMyDiary = this.state.isMyDiary;
let isMyComment = this.state.isMyComment;
let expired = this.state.expired;
return ( return (
<View> <View>
@ -39,7 +54,7 @@ export default class Comment extends Component {
</View> </View>
{ {
editable (isMyDiary || isMyComment) && !expired
? <TouchableOpacity onPress={this.props.onCommentAction} style={localStyle.moreIcon}> ? <TouchableOpacity onPress={this.props.onCommentAction} style={localStyle.moreIcon}>
<Ionicons name="ios-more" size={24} color={Color.inactiveText} /> <Ionicons name="ios-more" size={24} color={Color.inactiveText} />
</TouchableOpacity> </TouchableOpacity>

View file

@ -17,7 +17,7 @@ import Touchable from '../touchable';
import Color from '../../style/color'; import Color from '../../style/color';
import Api from '../../util/api'; import Api from '../../util/api';
import Event from '../../util/event'; import Event from '../../util/event';
import Msg from '../../util/msg' import Msg from '../../util/msg';
import Comment from './comment'; import Comment from './comment';
@ -27,14 +27,27 @@ export default class CommentList extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.diaryId = props.diaryId;
this.editable = props.editable || false;
this.state = { this.state = {
diaryId: props.diaryId,
selfInfo: props.selfInfo,
isMine: props.isMine || false,
expired: props.expired || false,
comments: [] comments: []
}; };
} }
componentWillReceiveProps(nextProps) {
this.setState({
diaryId: nextProps.diaryId,
selfInfo: nextProps.selfInfo,
isMine: nextProps.isMine || false,
expired: nextProps.expired || false
});
}
componentDidMount() { componentDidMount() {
InteractionManager.runAfterInteractions(() => { InteractionManager.runAfterInteractions(() => {
this.refresh(); this.refresh();
@ -42,7 +55,7 @@ export default class CommentList extends Component {
} }
async refresh() { async refresh() {
let comments = await Api.getDiaryComments(this.diaryId); let comments = await Api.getDiaryComments(this.state.diaryId);
if(comments && comments.length > 0) { if(comments && comments.length > 0) {
if (comments.length > 1) { if (comments.length > 1) {
comments = comments.reverse(); comments = comments.reverse();
@ -59,6 +72,10 @@ export default class CommentList extends Component {
} }
_onUserIconPress(comment) { _onUserIconPress(comment) {
if(this.state.selfInfo.id == comment.user_id) {
return;
}
Navigation.push(this.props.componentId, { Navigation.push(this.props.componentId, {
component: { component: {
name: 'User', name: 'User',
@ -114,6 +131,8 @@ export default class CommentList extends Component {
} }
render() { render() {
let selfInfo = this.state.selfInfo;
return ( return (
<View style={localStyle.container}> <View style={localStyle.container}>
<FlatList ref={(r) => this.list = r} <FlatList ref={(r) => this.list = r}
@ -127,7 +146,11 @@ export default class CommentList extends Component {
renderItem={({item}) => { renderItem={({item}) => {
return ( return (
<Touchable onPress={() => this._onCommentPress(item)}> <Touchable onPress={() => this._onCommentPress(item)}>
<Comment comment={item} editable={this.editable} <Comment comment={item}
isMyDiary={this.state.isMine}
isMyComment={selfInfo.id == item.user_id}
expired={this.state.expired}
onUserIconPress={() => this._onUserIconPress(item)} onUserIconPress={() => this._onUserIconPress(item)}
onCommentAction={() => this._onCommentAction(item)}> onCommentAction={() => this._onCommentAction(item)}>
</Comment> </Comment>

View file

@ -19,11 +19,11 @@ export default class DiaryBrief extends Component {
super(props); super(props);
this.state = { this.state = {
diary: props.diary diary: props.diary,
}
this.expired = props.expired || false; isMine: props.isMine || false,
this.editable = props.editable || false; expired: props.expired || false
}
this.showField = ['userIcon', 'userName', 'subject', 'createdTime']; this.showField = ['userIcon', 'userName', 'subject', 'createdTime'];
if(props.showField && props.showField.length > 0) { if(props.showField && props.showField.length > 0) {
@ -51,6 +51,9 @@ export default class DiaryBrief extends Component {
return null; return null;
} }
let isMine = this.state.isMine;
let expired = this.state.expired;
let user = diary.user; let user = diary.user;
return ( return (
@ -91,13 +94,13 @@ export default class DiaryBrief extends Component {
<DiaryIconOkB diaryId={diary.id} <DiaryIconOkB diaryId={diary.id}
count={diary.like_count} count={diary.like_count}
active={diary.liked} active={diary.liked}
clickable={!this.expired} clickable={!this.state.expired}
refreshBack={this.refreshDiary.bind(this)} refreshBack={this.refreshDiary.bind(this)}
></DiaryIconOkB> ></DiaryIconOkB>
</View> </View>
<View style={{flex: 1}} /> <View style={{flex: 1}} />
{ {
this.editable isMine && !expired
? <TouchableOpacity onPress={this.onDiaryAction.bind(this)}> ? <TouchableOpacity onPress={this.onDiaryAction.bind(this)}>
<Ionicons name="ios-more" size={24} <Ionicons name="ios-more" size={24}
color={Color.inactiveText} color={Color.inactiveText}

View file

@ -18,15 +18,30 @@ export default class DiaryFull extends Component {
this.state = { this.state = {
diary: props.diary, diary: props.diary,
editable: props.editable || false, selfInfo: props.selfInfo,
isMine: props.isMine || false,
expired: props.expired || false expired: props.expired || false
} }
this.showField = ['userIcon', 'userName', 'subject', 'createdTime'];
if(props.showField && props.showField.length > 0) {
this.showField = props.showField
}
} }
refreshDiaryContent(diary) { show(field) {
if(diary) { return this.showField.indexOf(field) >= 0;
this.setState({diary})
} }
componentWillReceiveProps(nextProps) {
this.setState({
diary: nextProps.diary,
selfInfo: nextProps.selfInfo,
isMine: nextProps.isMine || false,
expired: nextProps.expired || false
});
} }
async refreshComment() { async refreshComment() {
@ -76,12 +91,12 @@ export default class DiaryFull extends Component {
return ( return (
<View> <View>
<View style={localStyle.box}> <View style={localStyle.box}>
{user && user.iconUrl {user && user.iconUrl && this.show('userIcon')
? <UserIcon iconUrl={user.iconUrl} onPress={this._onUserIconPress.bind(this)}></UserIcon> : null} ? <UserIcon iconUrl={user.iconUrl} onPress={this._onUserIconPress.bind(this)}></UserIcon> : null}
<View style={localStyle.body}> <View style={localStyle.body}>
<View style={localStyle.title}> <View style={localStyle.title}>
{user && user.name {user && user.name && this.show('userName')
? ( <Text style={localStyle.titleName} numberOfLines={1}> ? ( <Text style={localStyle.titleName} numberOfLines={1}>
{user.name} {user.name}
</Text> </Text>
@ -112,10 +127,10 @@ export default class DiaryFull extends Component {
</View> </View>
<CommentList ref={(r) => this.commentList = r} <CommentList ref={(r) => this.commentList = r}
diaryId={diary.id}
editable={this.state.editable}
onUserIconPress={this._onUserIconPress.bind(this)}
{...this.props} {...this.props}
diaryId={diary.id}
isMine={this.state.isMine}
expired={this.state.expired}
></CommentList> ></CommentList>
</View> </View>

View file

@ -30,7 +30,7 @@ export default class DiaryList extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.editable = props.editable || false; this.isMine = props.isMine || false;
this.dataSource = props.dataSource; this.dataSource = props.dataSource;
this.state = { this.state = {
@ -95,7 +95,7 @@ export default class DiaryList extends Component {
diary: diary, diary: diary,
user: diary.user, user: diary.user,
editable: this.editable, showField: this.props.showField,
refreshBack: this.refreshOne.bind(this, index) refreshBack: this.refreshOne.bind(this, index)
} }
} }
@ -199,7 +199,7 @@ export default class DiaryList extends Component {
render() { render() {
if(!this.state.mounting && (!this.state.diaries || this.state.diaries.length == 0)) { if(!this.state.mounting && (!this.state.diaries || this.state.diaries.length == 0)) {
let message = this.editable let message = this.isMine
? '今天还没有写日记,马上写一篇吧' ? '今天还没有写日记,马上写一篇吧'
: '今天还没有人写日记'; : '今天还没有人写日记';
return ( return (
@ -227,7 +227,6 @@ export default class DiaryList extends Component {
<DiaryBrief {...this.props} <DiaryBrief {...this.props}
diary={item} diary={item}
showField={this.props.showField} showField={this.props.showField}
editable={this.editable}
onDiaryPress={this._onDiaryPress.bind(this, index)} onDiaryPress={this._onDiaryPress.bind(this, index)}
onUserIconPress={() => this._onUserIconPress(item)} onUserIconPress={() => this._onUserIconPress(item)}

View file

@ -9,7 +9,7 @@ import {
ActivityIndicator ActivityIndicator
} from 'react-native'; } from 'react-native';
import {Navigation} from 'react-native-navigation'; import {Navigation} from 'react-native-navigation';
import moment from 'moment' import moment from 'moment';
import Api from '../../util/api'; import Api from '../../util/api';
import Color from '../../style/color'; import Color from '../../style/color';
@ -30,7 +30,7 @@ export default class NotebookDiaryList extends Component {
super(props); super(props);
this.notebook = props.notebook; this.notebook = props.notebook;
this.editable = props.editable || false; this.isMine = props.isMine || false;
this.dataSource = new NotebookDiaryData(); this.dataSource = new NotebookDiaryData();
this.state = { this.state = {
@ -186,9 +186,9 @@ export default class NotebookDiaryList extends Component {
}, },
passProps: { passProps: {
diary: diary, diary: diary,
editable: this.editable, showField: ['createdTime'],
expired: this.notebook.isExpired,
expired: this.notebook.isExpired,
refreshBack: this.refreshOne.bind(this, index) refreshBack: this.refreshOne.bind(this, index)
} }
} }
@ -201,6 +201,7 @@ export default class NotebookDiaryList extends Component {
} }
let expired = this.notebook.isExpired; let expired = this.notebook.isExpired;
let isMine = this.isMine;
return ( return (
<View style={localStyle.container}> <View style={localStyle.container}>
@ -218,6 +219,7 @@ export default class NotebookDiaryList extends Component {
diary={rowData.item} diary={rowData.item}
showField={['createdTime']} showField={['createdTime']}
expired={expired} expired={expired}
isMine={isMine}
onDiaryPress={this._onDiaryPress.bind(this, rowData.index)} onDiaryPress={this._onDiaryPress.bind(this, rowData.index)}

View file

@ -86,7 +86,7 @@ export default class NotebookList extends Component {
}, },
passProps: { passProps: {
notebook: notebook, notebook: notebook,
editable: !this.state.user isMine: !this.state.user
} }
} }
}); });

View file

@ -3,7 +3,7 @@ import {StyleSheet, Text, View} from 'react-native';
import Ionicons from 'react-native-vector-icons/Ionicons'; import Ionicons from 'react-native-vector-icons/Ionicons';
import Touchable from '../touchable'; import Touchable from '../touchable';
import Color from '../../style/color' import Color from '../../style/color';
function unique(array) { function unique(array) {

View file

@ -51,8 +51,6 @@ export default class NotificationList extends Component {
}, []); }, []);
console.log('notifications:', reducedNoti);
this.setState({ this.setState({
notifications: reducedNoti notifications: reducedNoti
}); });
@ -77,8 +75,7 @@ export default class NotificationList extends Component {
} }
}, },
passProps: { passProps: {
diaryId: msg.link_id, diaryId: msg.link_id
editable: true
} }
} }
}); });

View file

@ -10,11 +10,12 @@ import {
} from 'react-native'; } from 'react-native';
import {Navigation} from 'react-native-navigation'; import {Navigation} from 'react-native-navigation';
import KeyboardSpacer from "react-native-keyboard-spacer"; import KeyboardSpacer from "react-native-keyboard-spacer";
import {Button} from 'react-native-elements';
import Color from '../style/color'; import Color from '../style/color';
import {Icon} from '../style/icon'; import {Icon} from '../style/icon';
import Msg from '../util/msg'; import Msg from '../util/msg';
import Api from '../util/api' import Api from '../util/api';
import Event from '../util/event'; import Event from '../util/event';
import DiaryFull from '../component/diary/diaryFull'; import DiaryFull from '../component/diary/diaryFull';
@ -22,6 +23,16 @@ import DiaryAction from '../component/diary/diaryAction';
import CommentInput from '../component/comment/commentInput'; import CommentInput from '../component/comment/commentInput';
function getTodayStr() {
let now = new Date();
let year = now.getFullYear();
let month = now.getMonth() + 1;
let date = now.getDate();
return year + '-' + (month > 9 ? month : '0' + month) + '-' + date;
}
export default class DiaryDetailPage extends Component { export default class DiaryDetailPage extends Component {
constructor(props) { constructor(props) {
@ -35,9 +46,13 @@ export default class DiaryDetailPage extends Component {
diary: props.diary, diary: props.diary,
user: props.user, user: props.user,
editable: props.editable || false, isMine: false,
todayCreated: false,
expired: props.expired || false, expired: props.expired || false,
needScrollToBottom: false
needScrollToBottom: false,
error: null
} }
} }
@ -48,22 +63,17 @@ export default class DiaryDetailPage extends Component {
} }
} }
if(!passProps.expired) {
topBar.rightButtons = [{
id: 'navButtonMore',
icon: Icon.navButtonMore,
color: Color.primary // android
}]
}
return { return {
topBar topBar
}; };
} }
navigationButtonPressed({buttonId}) { navigationButtonPressed({buttonId}) {
if(this.state.editable || this.state.diary.user_id == this.state.selfInfo.id) { if(!this.state.selfInfo || !this.state.diary) {
return;
}
if(this.state.isMine) {
let componentId = this.props.componentId; let componentId = this.props.componentId;
DiaryAction.action(componentId, this.state.diary, { DiaryAction.action(componentId, this.state.diary, {
onDelete: () => { onDelete: () => {
@ -87,14 +97,13 @@ export default class DiaryDetailPage extends Component {
} }
componentDidMount() { componentDidMount() {
if(!this.state.diary && this.state.diaryId) {
this.refreshDiary();
}
Api.getSelfInfoByStore() Api.getSelfInfoByStore()
.then(user => { .then(user => {
this.setState({ this.setState({
selfInfo: user selfInfo: user
}, () =>{
this.refreshDiary(this.state.diary);
}); });
}).done(); }).done();
@ -117,34 +126,67 @@ export default class DiaryDetailPage extends Component {
this.commentListener.remove(); this.commentListener.remove();
} }
refreshDiary() { async refreshDiary(diary) {
if(!diary) {
let diaryId = this.state.diaryId; let diaryId = this.state.diaryId;
if(!diaryId) { if(!diaryId) {
diaryId = this.state.diary.id; diaryId = this.state.diary.id;
} }
Api.getDiary(diaryId) try {
.then(result => { diary = await Api.getDiary(diaryId);
if(!result) { } catch(e) {
throw { this.setState({
message: 'get diary no result' error: e
});
return;
} }
} }
this.props.refreshBack(result); let isMine = this.state.selfInfo.id == diary.user_id;
this.diaryFull.refreshDiaryContent(result);
}) let createdTime = diary.created;
.done(); let todayCreated = getTodayStr() == createdTime.substring(0, createdTime.indexOf(' '));
this.setState({
diary,
isMine,
todayCreated
}, () => {
if(this.props.refreshBack) {
this.props.refreshBack(diary);
}
if(todayCreated || (this.props.expired && !isMine)) {
Navigation.mergeOptions(this.props.componentId, {
topBar: {
rightButtons: [{
id: 'navButtonMore',
icon: Icon.navButtonMore,
color: Color.primary // android
}]
}
});
}
});
} }
render() { render() {
if(!this.state.selfInfo || !this.state.diary) { if(this.state.error) {
return null; return (
} <View style={localStyle.container}>
<Text style={localStyle.text}>{'日记加载失败:('}</Text>
<Button fontSize={14} borderRadius={999} backgroundColor={Color.primary}
title={'刷新一下'}
onPress={() => this.refreshDiary()} />
</View>
);
let isMine = false; } else if(!this.state.selfInfo || !this.state.diary) {
if(this.state.selfInfo.id == this.state.diary.user_id) { return null;
isMine = true;
} }
return ( return (
@ -162,14 +204,15 @@ export default class DiaryDetailPage extends Component {
<DiaryFull ref={(r) => this.diaryFull = r} <DiaryFull ref={(r) => this.diaryFull = r}
{...this.props} {...this.props}
diary={this.state.diary} diary={this.state.diary}
editable={this.state.editable || isMine} selfInfo={this.state.selfInfo}
expired={this.state.expired} isMine={this.state.isMine}
expired={this.state.expired || !this.state.todayCreated}
></DiaryFull> ></DiaryFull>
</ScrollView> </ScrollView>
{ {
!this.state.expired ? ( this.state.todayCreated ? (
<CommentInput ref={(r) => this.commentInput = r} <CommentInput ref={(r) => this.commentInput = r}
diary={this.state.diary} diary={this.state.diary}
selfInfo={this.state.selfInfo} selfInfo={this.state.selfInfo}
@ -189,5 +232,14 @@ const localStyle = StyleSheet.create({
wrap: { wrap: {
flex: 1, flex: 1,
flexDirection: 'column' flexDirection: 'column'
},
container: {
alignItems:'center',
justifyContent: 'center',
height: '100%'
},
text: {
paddingBottom: 15,
color: Color.text
} }
}); });

View file

@ -22,7 +22,7 @@ export default class NotebookDetailPage extends Component {
} }
} }
if(passProps.editable) { if(passProps.isMine) {
topBar.rightButtons = [{ topBar.rightButtons = [{
id: 'navButtonNotebookSetting', id: 'navButtonNotebookSetting',
icon: Icon.navButtonNotebookSetting, icon: Icon.navButtonNotebookSetting,

View file

@ -192,15 +192,17 @@ export default class UserPage extends Component {
/>, />,
diary: () => <DiaryList diary: () => <DiaryList
ref={(r) => this.diaryList = r} ref={(r) => this.diaryList = r}
{...this.props}
dataSource={this.dataSource} dataSource={this.dataSource}
showField={['subject', 'createdTime']} showField={['subject', 'createdTime']}
editable={!this.user} isMine={!this.user}
{...this.props}
/>, />,
notebook: () => <NotebookList notebook: () => <NotebookList
ref={(r) => this.notebookList = r} ref={(r) => this.notebookList = r}
user={this.user}
{...this.props} {...this.props}
user={this.user}
/> />
}); });