UI修改及首页Bug修复 review by 黄敬囿

 .hot-series {
-    margin-top: 40px;
+    margin-top: 60px;
     padding: 0 40px;
 
     .title {

@@ -50,6 +50,9 @@ export default class Classify extends Component {
     render () {
         let {tabs, actived, brandList} = this.state;
         let num = brandList.length - brandList.length % 3;
+        if (brandList.length % 3 === 0) {
+            num = num - 3;
+        }
         return (
             <ScrollView
                 className='classify-page'

@@ -42,8 +42,32 @@ export default class Index extends Component {
 	}
 
 	config = {
-		navigationBarTitleText: 'UFO'
-	};
+    navigationBarTitleText: 'UFO',
+    enablePullDownRefresh: true,
+    backgroundTextStyle: "dark",
+    onReachBottomDistance: 50
+  };
+  
+  onPullDownRefresh() {
+    let filterMenu = this.props.filterMenu;
+    this.getProductData(filterMenu).then(isFinish => {
+      Taro.stopPullDownRefresh();
+    });
+  }
+
+  onReachBottom() {
+    let { filterMenu } = this.props;
+    let { page } = this.state;
+    let type = filterMenu.indexType;
+
+    console.log('onReachBottom: ', type);
+
+    if (!this.state.stopLoading[type]) {
+      this.setState({ page: Object.assign(page, { [type]: page[type] + 1 }) }, () => {
+        this.getProductData();
+      });
+    }
+  }
 
   componentDidMount() {
     let obj = {
@@ -66,13 +90,15 @@ export default class Index extends Component {
     });
   }
 
-  componentWillReceiveProps(nextProps) {
+  componentWillReceiveProps(nextProps, oldProps) {
     let curType = nextProps.filterMenu.indexType;
+    let oldCurType = oldProps && oldProps.filterMenu && oldProps.filterMenu.indexType;
     let { productList } = this.state;
 
-    console.log(curType);
-    if (productList[curType].length === 0) {
-      this.getProductData(nextProps.filterMenu);
+    if (curType !== oldCurType) {
+      if (productList[curType].length === 0) {
+        this.getProductData(nextProps.filterMenu);
+      }
     }
   }
 
@@ -90,10 +116,9 @@ export default class Index extends Component {
       type: type,
       page: page[type]
     }).then(ret => {
-      console.log(ret);
       if (ret && ret.code === 200) {
         let list = ret.data && ret.data.product_list || [];
-
+        
         if (list.length === 0) {
           this.setState({
             stopLoading: Object.assign(stopLoading, { [type]: true })
@@ -104,7 +129,10 @@ export default class Index extends Component {
           });
         }
       }
-    })
+      return true;
+    }).catch(error => {
+      return false;
+    });
   }
 
   onScrollToLower() {
@@ -121,6 +149,8 @@ export default class Index extends Component {
     }
   }
 
+  
+
 	// gotoNative() {
 	// 	Taro.navigateTo({
 	// 		url: '/pages/nativeTest/nativeTest'
@@ -160,7 +190,7 @@ export default class Index extends Component {
 		let list = productList[filterMenu.indexType] || [];
 
 		return (
-			<ScrollView
+			<View
 				className='index-page'
 				scrollY
 				scrollWithAnimation
@@ -181,7 +211,7 @@ export default class Index extends Component {
         }
         
         <Image className="goYohoBuy" onClick={this.goYohoBuyMinApp.bind(this)} src={goYohoBuy} mode="aspectFill" />
-			</ScrollView>
+			</View>
 		)
 	}
 }

@@ -9,7 +9,9 @@
   display: flex;
   flex-direction: row;
   margin-top: 70rpx;
-  justify-content: space-evenly;
+  justify-content: space-between;
+  margin-left: 90rpx;
+  margin-right: 90rpx;
 }
 .type-item {
   font-family: PingFang-SC-Regular;
@@ -63,7 +65,7 @@
 }
 
 .latest-message {
-  margin: 85rpx 0 0 40rpx;
+  margin: 80rpx 0 0 34rpx;
   color: #000;
   font-family: PingFang-SC-Semibold;
   font-size: 40rpx;
@@ -76,7 +78,7 @@
   padding:0rpx 40rpx;
 }
 .cell .content {
-  margin-top: 40rpx;
+  margin-top: 34rpx;
   font-family: PingFang-SC-Regular;
   color: #000;
   font-size: 28rpx;

@@ -67,7 +67,7 @@
         }
 
         &.mt {
-            margin-top: 60px;
+            margin-top: 98px;
         }
     }
 }
\ No newline at end of file