Authored by 孙凯

review 奥莱UI 添加toast review by zhanglixia

... ... @@ -137,6 +137,7 @@ export default class ActivityCell extends React.Component {
let id = data.id;
let price = promotionName&&promotionName.length>2?promotionName.substring(0,promotionName.length-2):''
let priceString = promotionName&&promotionName.length>2?promotionName.substring(promotionName.length-2,promotionName.length):''
let startLeftTime = data.startLeftTime;
return (
<View style={styles.container}>
... ... @@ -144,8 +145,16 @@ export default class ActivityCell extends React.Component {
activeOpacity={1}
style={{width: backgroundWidth, height: backgroundHeight}}
onPress={() => {
let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.outletactivity","params":{"activity_id":"${id}"}}`;
this.props.onPressProduct && this.props.onPressProduct(url);
if (startLeftTime <= 0) {
if (this.state.showString == '活动已结束') {
this.props.showToast && this.props.showToast('活动已结束,敬请期待。');
}else {
let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.outletactivity","params":{"activity_id":"${id}"}}`;
this.props.onPressProduct && this.props.onPressProduct(url);
}
}else {
this.props.showToast && this.props.showToast('活动还未开始,敬请期待');
}
}}
>
<YH_Image
... ...
... ... @@ -24,6 +24,8 @@ export default class Outlet extends Component {
let {
categoryList,
isShowToast,
toastMessage,
} = this.props;
if (!categoryList) {
... ... @@ -44,6 +46,8 @@ export default class Outlet extends Component {
tabLabel={name}
key={'OutletPageListView' + i}
resource = {item}
toastMessage = {toastMessage}
isShowToast = {isShowToast}
getOutletHomeResource = {this.props.getOutletHomeResource}
getOutletActivityList = {this.props.getOutletActivityList}
onPressProduct = {this.props.onPressProduct}
... ... @@ -51,6 +55,8 @@ export default class Outlet extends Component {
setActivityFliter = {this.props.setActivityFliter}
onPressFilter = {this.props.onPressFilter}
onEndReached = {this.props.onEndReached}
showToast = {this.props.showToast}
hideToastMessage = {this.props.hideToastMessage}
/>
);
})}
... ...
... ... @@ -21,6 +21,7 @@ import ProductFliter from './ProductFliter';
import BrandProductListCell from '../../../common/components/ListCell/ProductListCell';
import ActivityCell from './ActivityCell';
import NoActivityView from './NoActivityView';
import Prompt from '../../../coupon/components/coupon/Prompt';
export default class OutletPageListView extends Component {
constructor(props) {
... ... @@ -100,7 +101,6 @@ export default class OutletPageListView extends Component {
}
renderRow(rowData, sectionID, rowID, highlightRow) {
// console.log(rowData.toJS());
if (sectionID == 'outletHomeReource') {
if (rowData.get('template_name') == 'NL2R') {
return(<OutletThreeImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
... ... @@ -108,7 +108,7 @@ export default class OutletPageListView extends Component {
return(<OutletSwiper resource={rowData} onPressProduct={this.props.onPressProduct}/>);
}else if (rowData.get('template_name') == 'single_image') {
return(<OutletSingleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
}else if (rowData.get('template_name') == 'double_image') {
}else if (rowData.get('template_name') == 'small_pic') {
return(<OutletDoubleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
}else if (rowData.get('template_name') == 'recommend_content_five') {
return(<OutletRecommendFive resource={rowData} onPressProduct={this.props.onPressProduct}/>);
... ... @@ -118,7 +118,7 @@ export default class OutletPageListView extends Component {
// return(<TripleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
}
}else if (sectionID == 'activityList') {
return(<ActivityCell resource={rowData} key = {rowID + 'activityList'} onPressProduct={this.props.onPressProduct}/>);
return(<ActivityCell resource={rowData} key = {rowID + 'activityList'} showToast={this.props.showToast} onPressProduct={this.props.onPressProduct}/>);
}else if (sectionID == 'activityMore') {
if (rowData == 'more') {
let sourceIcon = require('../../../brandStore/image/filter/brandstore_filter_arrow_down_normal.png');
... ... @@ -152,11 +152,16 @@ export default class OutletPageListView extends Component {
let {
resource,
tabLabel,
toastMessage,
isShowToast,
} = this.props;
if (!resource) {
return null;
}
let needShowToast = isShowToast;
let showToastMessage = toastMessage;
let title = tabLabel;
let isFetching_homeResource = resource.get('isFetching')?resource.get('isFetching'):false;
let honeResource = resource.get('honeResource');
... ... @@ -219,6 +224,11 @@ export default class OutletPageListView extends Component {
}
}}
/>
{needShowToast ? <Prompt
text={showToastMessage}
duration={3000}
onPromptHidden={this.props.hideToastMessage}
/> : null}
</View>
);
}
... ...
... ... @@ -7,10 +7,10 @@ export default keyMirror({
SET_CHANNEL: null,
SET_SERVICE_HOST: null,
SET_CATEGORYID: null,
HIDE_TOAST: null,
SET_ACTIVITY_FLITER: null,
SET_FLITER: null,
SHOW_TOAST: null,
GET_CATEGORY_REQUEST: null,
GET_CATEGORY_SUCCESS: null,
GET_CATEGORY_FAILURE: null,
... ...
... ... @@ -47,6 +47,8 @@ class OutletContainer extends Component {
this._getOutletActivityList = this._getOutletActivityList.bind(this);
this._onEndReached = this._onEndReached.bind(this);
this._setActivityFliter = this._setActivityFliter.bind(this);
this._showToast = this._showToast.bind(this);
this._hideToastMessage = this._hideToastMessage.bind(this);
}
componentDidMount() {
... ... @@ -89,6 +91,13 @@ class OutletContainer extends Component {
ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
}
_showToast(value){
this.props.actions.showToastMessage(value);
}
_hideToastMessage(){
this.props.actions.hideToastMessage();
}
_onPressFilter(content_code,value,categoryNavigationItem){
this.props.actions.onPressFilter(content_code,value);
... ... @@ -102,11 +111,15 @@ class OutletContainer extends Component {
let {
categoryList,
isShowToast,
toastMessage,
} = this.props.outlet;
return (
<Outlet
categoryList = {categoryList}
isShowToast = {isShowToast}
toastMessage = {toastMessage}
getOutletHomeResource = {this._getOutletHomeResource}
setActivityFliter = {this._setActivityFliter}
getOutletActivityList = {this._getOutletActivityList}
... ... @@ -114,6 +127,8 @@ class OutletContainer extends Component {
onPressProductListProduct = {this._onPressProductListProduct}
onPressFilter = {this._onPressFilter}
onEndReached = {this._onEndReached}
showToast = {this._showToast}
hideToastMessage = {this._hideToastMessage}
/>
);
}
... ...
... ... @@ -11,7 +11,8 @@ const {
SET_ACTIVITY_FLITER,
SET_FLITER,
SHOW_TOAST,
HIDE_TOAST,
GET_CATEGORY_REQUEST,
GET_CATEGORY_SUCCESS,
GET_CATEGORY_FAILURE,
... ... @@ -261,3 +262,17 @@ export function onPressFilter(content_code,value) {
payload: {'value':value,'content_code':content_code}
};
}
export function showToastMessage(value) {
return {
type: SHOW_TOAST,
payload: value
};
}
export function hideToastMessage() {
return {
type: HIDE_TOAST,
};
}
... ...
... ... @@ -9,6 +9,8 @@ let InitialState = Record({
error: null,
list: List(),
})),
isShowToast: false,
toastMessage: '',
});
export default InitialState;
... ...
... ... @@ -6,7 +6,8 @@ import Immutable, {Map} from 'immutable';
const {
SET_ACTIVITY_FLITER,
SET_FLITER,
SHOW_TOAST,
HIDE_TOAST,
GET_CATEGORY_REQUEST,
GET_CATEGORY_SUCCESS,
GET_CATEGORY_FAILURE,
... ... @@ -219,6 +220,10 @@ export default function outletReducer(state=initialState, action) {
})
return state.setIn(['categoryList', 'list'], Immutable.fromJS(categoryList.list))
}
case SHOW_TOAST:
return state.set('isShowToast', true).set('toastMessage', action.payload)
case HIDE_TOAST:
return state.set('isShowToast', false).set('toastMessage', '')
}
return state;
... ...
... ... @@ -213,7 +213,7 @@ let styles = StyleSheet.create({
height: imageHeigth,
position: 'absolute',
marginTop: -imageHeigth,
backgroundColor: 'rgba(0,0,0,.2)'
backgroundColor: 'rgba(0,0,0,.15)'
},
header: {
justifyContent: 'flex-end',
... ...