mobile / YH_RNComponent · Commits

Go to a project

Authored by shangjf
Commit d1c032699fbbebd484cd248edab4a73d96f704b9 1 parent d789ccb0 master ... 6.7.0_0.49 6.7.1_0.49 6.7.4_0.49 6.7.5_0.49 6.8.7_message 6.9.5_msg 6.9.9_invite V0125_Date V1115_Date V1130_Date V1217_Date V1230_Date V6.10.1 V6.10.2 V6.7.9_dev V6.8.6 V6.8.7 V6.8.7_upgrades V6.8.9 V6.9.1 V6.9.2 V6.9.3 V6.9.5 V6.9.6 V6.9.6_Alliance V6.9.7 V6.9.8 V6.9.8_shoudan V6.9.9 V9.30_Date exception feature/rn_update61 gerry/v6.9.14_panicBuying gerry/v6.9.16_bugfixed v6.10.0 v6.9.10 v6.9.11 v6.9.12 v6.9.13 v6.9.14 v6.9.16 v6.9.17 v6.9.19 v6.9.20 v6.9.21 v6.9.22 v6.9.24 6.9.8 6.9.7 6.9.6 6.9.4 6.9.2 6.9.1 6.8.9 6.8.8 6.8.4 6.8.3 6.8.2 6.7.9 6.7.8 6.7.7 6.6.4 5.5.1 5.4.1 5.4 v6.7.5 v6.7.1 v6.2.0 v6.1.0 v5.6.2 v5.6.0 v5.5.2 v5.5.0 v5.4.1 v5.4.0 ios-5.4.0 V6.8.6 V6.8.5 V6.8.1

站内信添加复制删除功能 review by 于良

Inline Side-by-side
Showing 14 changed files with 282 additions and 82 deletions
... ... @@ -24,7 +24,7 @@ export default class EmptyContent extends Component {
text = '会员等级变更提醒、会员生日福利';
break;
case '2':
text = '新注册用户提示新人专享优惠券信息';
text = '我的优惠券、红包、有货币';
break;
case '3':
text = '没有收到任何关于你的消息';
... ...
... ... @@ -10,6 +10,7 @@ import ReactNative, {
Dimensions,
InteractionManager,
Platform,
Clipboard,
} from 'react-native';
import LoadMoreIndicator from '../../../common/components/LoadMoreIndicator';
... ... @@ -20,6 +21,7 @@ import MessageListSmallIconCell from './MessageListSmallIconCell';
import MessageListBigIconCell from './MessageListBigIconCell';
import MessageListTextCell from './MessageListTextCell';
import MessageListOrderCell from './MessageListOrderCell';
import YH_ToolTips from '../../../common/components/YH_ToolTips'
export default class MessageList extends Component {
constructor(props) {
... ... @@ -29,8 +31,19 @@ export default class MessageList extends Component {
rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
});
this.loadMessageListCell = this.loadMessageListCell.bind(this);
this.onLongPressListItem = this.onLongPressListItem.bind(this);
this._copy = this._copy.bind(this);
this._delete = this._delete.bind(this);
this.showToolTip = this.showToolTip.bind(this);
this.state = {showToolTips: false,index:0}
}
componentDidMount() {
}
onLongPressListItem(itemData, index) {
this.setState({showToolTips: true, index: index});
}
loadMessageListCell(rowData, rowID) {
... ... @@ -46,15 +59,21 @@ export default class MessageList extends Component {
case 205:
case 206:
case 207:
case 208:
case 209:
{
return(
<MessageListSmallIconCell
itemData={rowData}
onPressListItem={(itemData) =>{
this.props.onPressListItem && this.props.onPressListItem(itemData, rowID)
<MessageListSmallIconCell
itemData={rowData}
onPressListItem={(itemData) =>{
this.setState({showToolTips: false});
this.props.onPressListItem && this.props.onPressListItem(itemData, rowID)
}
}
}
/>
onLongPressListItem={(itemData) =>{
this.onLongPressListItem(itemData,rowID);
}}
/>
);
}
break;
... ... @@ -66,9 +85,13 @@ export default class MessageList extends Component {
<MessageListBigIconCell
itemData={rowData}
onPressListItem={(itemData) =>{
this.setState({showToolTips: false});
this.props.onPressListItem && this.props.onPressListItem(itemData, rowID)
}
}
onLongPressListItem={(itemData) =>{
this.onLongPressListItem(itemData,rowID);
}}
/>
);
}
... ... @@ -80,14 +103,19 @@ export default class MessageList extends Component {
case 304:
case 305:
case 402:
case 404:
{
return(
<MessageListOrderCell
itemData={rowData}
onPressListItem={(itemData) =>{
this.setState({showToolTips: false});
this.props.onPressListItem && this.props.onPressListItem(itemData, rowID)
}
}
onLongPressListItem={(itemData) =>{
this.onLongPressListItem(itemData,rowID);
}}
/>
);
}
... ... @@ -99,6 +127,9 @@ export default class MessageList extends Component {
return(
<MessageListTextCell
itemData={rowData}
onLongPressListItem={(itemData) =>{
this.onLongPressListItem(itemData);
}}
/>
);
}
... ... @@ -110,13 +141,47 @@ export default class MessageList extends Component {
}
}
_copy(rowData) {
this.setState({showToolTips: false});
let copyString = rowData.get('title','') + ' ' +rowData.get('body',{}).get('content','');
Clipboard.setString(copyString);
}
_delete(rowData) {
this.setState({showToolTips: false});
this.props.deleteListItem && this.props.deleteListItem(rowData);
}
showToolTip(rowID, rowData) {
let {showToolTips, index} = this.state;
let show = (index == rowID) && showToolTips;
if (show) {
return(
<YH_ToolTips
style={styles.tips}
actions={[{text: '复制', onPress:() =>{
this._copy(rowData);
}},
{text: '删除', onPress:() =>{
this._delete(rowData);
}}]}
isShow={showToolTips}
itemData={rowData}
/>
);
}else {
<View />
}
}
renderRow(rowData, sectionID, rowID) {
return (
<View style= {styles.cellContainer}>
<MessageListCellHeader
timestamp= {rowData.get('create_date')}
/>
{this.loadMessageListCell(rowData,rowID)}
{this.loadMessageListCell(rowData,rowID)}
{this.showToolTip(rowID, rowData)}
</View>
);
}
... ... @@ -180,5 +245,10 @@ let styles = StyleSheet.create({
backgroundColor: 'transparent',
flexDirection: 'column',
justifyContent: 'flex-start',
},
tips: {
position: 'absolute',
top: 10,
left: 0
}
});
... ...
... ... @@ -8,6 +8,7 @@ import ReactNative, {
StyleSheet,
Dimensions,
Platform,
TouchableOpacity,
} from 'react-native';
import MessageListCellFooter from './MessageListCellFooter'
... ... @@ -25,26 +26,32 @@ export default class MessageListBigIconCell extends Component {
imageUri = imageUri.replace('{width}', width).replace('{height}', iconHeight).replace('{mode}',2);
return(
<View style={styles.container}>
<View style={styles.titleContainer}>
<Text
numberOfLines={2}
style={styles.titleStyle}
>
{itemData.get('title')}
</Text>
</View>
<Image
style={styles.iconStyle}
source={{uri: imageUri}}
/>
<View style={styles.descContainer}>
<Text
numberOfLines={2}
style={styles.detail}
>
{content}
</Text>
</View>
<TouchableOpacity
onLongPress={() =>{
this.props.onLongPressListItem && this.props.onLongPressListItem(itemData);
}}
>
<View style={styles.titleContainer}>
<Text
numberOfLines={2}
style={styles.titleStyle}
>
{itemData.get('title')}
</Text>
</View>
<Image
style={styles.iconStyle}
source={{uri: imageUri}}
/>
<View style={styles.descContainer}>
<Text
numberOfLines={2}
style={styles.detail}
>
{content}
</Text>
</View>
</TouchableOpacity>
<MessageListCellFooter
onPressListItem={this.props.onPressListItem}
itemData={itemData}
... ...
... ... @@ -8,6 +8,7 @@ import ReactNative, {
StyleSheet,
Dimensions,
Platform,
TouchableOpacity,
} from 'react-native';
import MessageListCellFooter from './MessageListCellFooter'
... ... @@ -25,26 +26,32 @@ export default class MessageListOrderCell extends Component {
return(
<View style={styles.container}>
<View style={styles.contentContainer}>
<Text
numberOfLines={2}
style={styles.titleStyle}
>
{itemData.get('title')}
</Text>
<View style={styles.descStyle}>
<Image
style={styles.iconStyle}
source={{uri: imageUri}}
/>
<TouchableOpacity
onLongPress={() =>{
this.props.onLongPressListItem && this.props.onLongPressListItem(itemData);
}}
>
<View style={styles.contentContainer}>
<Text
style={styles.detail}
numberOfLines={3}
numberOfLines={2}
style={styles.titleStyle}
>
{content}
{itemData.get('title')}
</Text>
<View style={styles.descStyle}>
<Image
style={styles.iconStyle}
source={{uri: imageUri}}
/>
<Text
style={styles.detail}
numberOfLines={3}
>
{content}
</Text>
</View>
</View>
</View>
</TouchableOpacity>
<MessageListCellFooter
onPressListItem={this.props.onPressListItem}
itemData={itemData}
... ...
... ... @@ -8,14 +8,18 @@ import ReactNative, {
StyleSheet,
Dimensions,
Platform,
TouchableOpacity,
} from 'react-native';
import MessageListCellFooter from './MessageListCellFooter'
import YH_ToolTips from '../../../common/components/YH_ToolTips'
export default class MessageListSmallIconCell extends Component {
constructor(props) {
super(props);
}
render() {
let itemData = this.props.itemData;
let body = itemData.get('body');
... ... @@ -24,26 +28,32 @@ export default class MessageListSmallIconCell extends Component {
imageUri = imageUri.replace('{width}', 50).replace('{height}', 50).replace('{mode}',2);
return(
<View style={styles.container}>
<View style={styles.contentContainer}>
<Text
numberOfLines={2}
style={styles.titleStyle}
>
{itemData.get('title')}
</Text>
<View style={styles.descStyle}>
<Image
style={styles.iconStyle}
source={{uri: imageUri}}
/>
<TouchableOpacity
onLongPress={() =>{
this.props.onLongPressListItem && this.props.onLongPressListItem(itemData);
}}
>
<View style={styles.contentContainer}>
<Text
style={styles.detail}
numberOfLines={3}
numberOfLines={2}
style={styles.titleStyle}
>
{content}
{itemData.get('title')}
</Text>
<View style={styles.descStyle}>
<Image
style={styles.iconStyle}
source={{uri: imageUri}}
/>
<Text
style={styles.detail}
numberOfLines={3}
>
{content}
</Text>
</View>
</View>
</View>
</TouchableOpacity>
<MessageListCellFooter
onPressListItem={this.props.onPressListItem}
itemData={itemData}
... ...
... ... @@ -8,6 +8,7 @@ import ReactNative, {
StyleSheet,
Dimensions,
Platform,
TouchableOpacity
} from 'react-native';
export default class MessageListTextCell extends Component {
... ... @@ -20,20 +21,26 @@ export default class MessageListTextCell extends Component {
let body = itemData.get('body');
let content = body ? body.get('content','') : '';
return(
<View style={styles.container}>
<Text
numberOfLines={2}
style={styles.titleStyle}
>
{itemData.get('title')}
</Text>
<Text
style={styles.detail}
>
{content}
</Text>
<View style={styles.separator}/>
</View>
<TouchableOpacity
onLongPress={() =>{
this.props.onLongPressListItem && this.props.onLongPressListItem(itemData);
}}
>
<View style={styles.container}>
<Text
numberOfLines={2}
style={styles.titleStyle}
>
{itemData.get('title')}
</Text>
<Text
style={styles.detail}
>
{content}
</Text>
<View style={styles.separator}/>
</View>
</TouchableOpacity>
)
}
}
... ...
... ... @@ -14,6 +14,7 @@ import ReactNative, {
RefreshControl,
} from 'react-native';
import TimerMixin from 'react-timer-mixin';
import MessageCell from './MessageCell';
export default class Message extends Component {
... ... @@ -32,14 +33,18 @@ export default class Message extends Component {
trigggePullToRefresh() {
if (Platform.OS === 'ios') {
InteractionManager.runAfterInteractions(() => {
this.timer = TimerMixin.setTimeout(() => {
this.listView && this.listView.getScrollResponder().startPullToRefresh();
});
}, 0);
} else {
this.props.onRefresh && this.props.onRefresh();
}
}
componentWillUnmount() {
this.timer && TimerMixin.clearTimeout(this.timer);
}
renderRow(rowData: object, sectionID: number, rowID: number) {
return (
<MessageCell
... ... @@ -64,7 +69,7 @@ export default class Message extends Component {
<View style={styles.container}>
{
Platform.OS === 'ios' ?
Platform.OS === 'ios' ?
<ListView
ref={(c) => {
this.listView = c;
... ... @@ -102,7 +107,7 @@ export default class Message extends Component {
/>
}
/>
}
}
</View>
);
}
... ...
... ... @@ -23,7 +23,7 @@ export default class MessageCell extends Component {
if (msgNumber <= 0) {
return null;
}
msgNumber = msgNumber > 9 ? '9+' : msgNumber;
return (
<View style={styles.unreadMsgContainer}>
<Text style={styles.unreadMsg}>
... ... @@ -43,7 +43,7 @@ export default class MessageCell extends Component {
text = isEmpty ? '会员等级变更提醒、会员生日福利' : content;
break;
case 2:
text = isEmpty ? '新注册用户提示新人专享优惠券信息' : content;
text = isEmpty ? '我的优惠券、红包、有货币' : content;
break;
case 3:
text = isEmpty ? '没有收到任何关于你的消息' : content;
... ...
... ... @@ -18,4 +18,7 @@ export default keyMirror({
MESSAGE_LIST_SUCCESS: null,
MESSAGE_LIST_FAILURE: null,
DELETE_MESSAGE_LIST_ITEM_REQUEST: null,
DELETE_MESSAGE_LIST_ITEM_SUCCESS: null,
DELETE_MESSAGE_LIST_ITEM_FAILURE: null,
});
... ...
... ... @@ -49,6 +49,7 @@ class MessageListContainer extends Component {
this.onEndReached = this.onEndReached.bind(this);
this.onPressListItem = this.onPressListItem.bind(this);
this.onPressEmptyItem = this.onPressEmptyItem.bind(this);
this.deleteListItem = this.deleteListItem.bind(this);
}
componentDidMount() {
... ... @@ -94,6 +95,11 @@ class MessageListContainer extends Component {
NativeModules.YH_CommonHelper.logEvent('YB_MESS_LOOK_AROUND_C', param);
}
deleteListItem(item) {
let messageId = item.get('id','')
this.props.actions.deleteMessage(messageId);
}
render() {
let {list} = this.props;
return (
... ... @@ -103,6 +109,7 @@ class MessageListContainer extends Component {
onEndReached={this.onEndReached}
onPressListItem={this.onPressListItem}
onPressEmptyItem={this.onPressEmptyItem}
deleteListItem={this.deleteListItem}
/>
</View>
);
... ...
... ... @@ -11,6 +11,10 @@ const {
MESSAGE_LIST_SUCCESS,
MESSAGE_LIST_FAILURE,
DELETE_MESSAGE_LIST_ITEM_REQUEST,
DELETE_MESSAGE_LIST_ITEM_SUCCESS,
DELETE_MESSAGE_LIST_ITEM_FAILURE,
} = require('../../constants/actionTypes').default;
... ... @@ -48,6 +52,26 @@ export function messageListFailure(error) {
};
}
export function deleteMessageRequest(list) {
return {
type: DELETE_MESSAGE_LIST_ITEM_REQUEST,
payload: list
};
}
export function deleteMessageSuccess() {
return{
type: DELETE_MESSAGE_LIST_ITEM_SUCCESS,
};
}
export function deleteMessageFailure(error) {
return{
type: DELETE_MESSAGE_LIST_ITEM_FAILURE,
payload: error
};
}
export function messageList() {
return (dispatch, getState) => {
let {app, list} = getState();
... ... @@ -106,3 +130,37 @@ function parseMessageList(json) {
total,
};
}
export function deleteMessage(messageId) {
return (dispatch, getState) => {
let {app, list} = getState();
list = list.list.toJS();
for (var i = 0; i < list.length; i++) {
let item = list[i];
let msgID = item.id;
if (msgID === messageId) {
list.splice(i,1);
break;
}
}
let deleteItem = (sourcePage) => {
dispatch(deleteMessageRequest(list));
return new MessageListService(app.host).deleteMessage(sourcePage,messageId)
.then(json => {
dispatch(deleteMessageSuccess(messageId));
})
.catch(error => {
dispatch(deleteMessageFailure(error));
});
}
ReactNative.NativeModules.YH_CommonHelper.sourcePage('YH_RNMessageViewController')
.then(result=> {
let sourcePage = result[0]?result[0]:'';
deleteItem(sourcePage);
}).catch(error=> {
deleteItem('');
})
};
}
... ...
... ... @@ -11,6 +11,10 @@ const {
MESSAGE_LIST_SUCCESS,
MESSAGE_LIST_FAILURE,
DELETE_MESSAGE_LIST_ITEM_REQUEST,
DELETE_MESSAGE_LIST_ITEM_SUCCESS,
DELETE_MESSAGE_LIST_ITEM_FAILURE,
} = require('../../constants/actionTypes').default;
const initialState = new InitialState;
... ... @@ -58,6 +62,11 @@ export default function listReducer(state=initialState, action) {
.set('shouldShowEmpty', true);
}
case DELETE_MESSAGE_LIST_ITEM_REQUEST: {
let list = action.payload;
return state.set('list', Immutable.fromJS(list));
}
}
return state;
... ...
... ... @@ -13,7 +13,7 @@ let defaults = Immutable.fromJS([
{
id: 2,
inboxCatName: '我的资产',
content: '新注册用户提示新人专享优惠券信息',
content: '我的优惠券、红包、有货币',
unReadCount:0,
createTime:''
},
... ... @@ -27,7 +27,7 @@ let defaults = Immutable.fromJS([
{
id: 4,
inboxCatName: '其他',
content: '没有收到任何系统给消息',
content: '没有收到任何系统消息',
unReadCount:0,
createTime:''
},
... ...
... ... @@ -30,4 +30,21 @@ export default class MessageListService {
throw(error);
});
}
async deleteMessage(fromPage, messageId) {
return await this.api.post({
url: '',
body: {
fromPage,
id: messageId,
method:'app.inbox.delmessage',
}
})
.then((json) => {
return json;
})
.catch((error) => {
throw(error);
});
}
}
... ...