修改首页轮播图 review by 黄敬囿

@@ -28,6 +28,7 @@
 		"crypt": "0.0.2",
 		"index": "^0.4.0",
 		"is-buffer": "^2.0.3",
+		"lodash": "^4.17.11",
 		"nervjs": "^1.3.0",
 		"querystringify": "^2.1.0",
 		"redux": "^4.0.0",

 .category {
     border-top: 1px solid #eee;
     margin-top: 40px;
+    padding: 0 40px;
 
     .floor-header {
         margin-top: 20px;

 import Taro, {Component} from '@tarojs/taro';
-import {Swiper, SwiperItem, Navigator, Image, Button} from '@tarojs/components';
-import {getImgUrl} from '../../utils';
+import { Swiper, SwiperItem, Navigator, Image, Button, ScrollView } from '@tarojs/components';
+import {getImgUrl, debounce} from '../../utils';
+const _ = require('lodash');
 import './index.scss';
 import router from '../../router/index';
 
@@ -8,7 +9,9 @@ export default class Focus extends Component {
     constructor(props) {
         super(props);
 
-        this.state = {};
+        this.state = {
+          focusID: 'focus0'
+        };
     }
 
     static defaultProps = {
@@ -17,11 +20,15 @@ export default class Focus extends Component {
 
     componentWillMount() {}
 
-    componentDidMount() {}
+    componentDidMount() {
+
+    }
 
     componentWillUnmount() {}
 
-    componentDidShow() {}
+    componentDidShow() {
+
+    }
 
     componentDidHide() {}
 
@@ -29,23 +36,49 @@ export default class Focus extends Component {
       router.goUrl(item.url);
     }
 
+    onScroll(e) {
+      console.log(e.detail);
+      console.log(e);
+      console.log((e.detail.scrollLeft / 335).toFixed(0));
+      let index = (e.detail.scrollLeft / 335).toFixed(0);
+      _.debounce(this.changeIndex.bind(this), 1, { index });
+    }
+
+    changeIndex(index) {
+        this.setState({
+            focusID: `focus${index}`
+        })
+    }
+
     render() {
         let {floor} = this.props;
+        let { focusID } = this.state;
 
         return (
-            <Swiper
-                className='index-swiper'
-            >
-                {
-                    floor.map((item, index) => {
-                        return (
-                            <SwiperItem key={index}>
-                              <Image onClick={this.goToResource.bind(this, item)} src={getImgUrl(item.src, 670, 280)} mode="aspectFill" />
-                            </SwiperItem>
-                        )
-                    })
-                }
-            </Swiper>
+        <View className='swiper-bg'>  
+          <ScrollView
+              scrollX
+              className='index-swiper'
+              scrollIntoView = { focusID }
+              onScroll={this.onScroll}
+              scrollWithAnimation
+          >
+              {
+                  floor.map((item, index) => {
+                      return (
+                        <Image 
+                          key={ index } 
+                          id={ 'focus' + index } 
+                          onClick={ this.goToResource.bind(this, item) } 
+                          src={ getImgUrl(item.src, 670, 280) } 
+                          mode="aspectFill"
+                          />
+                      )
+                  })
+              }
+              <View className="noneView"></View>
+          </ScrollView>
+        </View>
         )
     }
 }
\ No newline at end of file

-.index-swiper {
-    width: 670px;
+.swiper-bg {
     height: 280px;
+    width: 100%;
     margin-top: 20px;
+    overflow: hidden;
+    .index-swiper {
+        padding-left: 40px;
+        width: 100%;
+        height: 300px;
+        display: flex;
+        flex-direction: row;
+        flex-wrap: nowrap;
+        white-space: nowrap;
 
-    image {
-        width: 670px;
-        height: 280px;
+        &::-webkit-scrollbar {
+            display: none;
+            width: 0;
+            height: 0;
+            color: transparent;
+        }
+    
+        image {
+            width: 670px;
+            height: 280px;
+            margin-right: 20px;
+        }
+
+        .noneView {
+            width: 60px;
+            height: 280px;
+            display: inline-block;
+        }
+    
     }
-}
\ No newline at end of file
+}

 .hot-series {
     margin-top: 40px;
+    padding: 0 40px;
 
     .title {
         font-family: PingFang-SC-Medium;

@@ -36,6 +36,7 @@ export default class Resources extends Component {
 			floors.map(floor => {
 				return (
 					<View
+            catchtouchmove="ture"
 						className={
 							floor.template_name === 'tfGoodsList' ? 'resource-item no-right-padding' : 'resource-item'
 						}

@@ -4,7 +4,7 @@
 
 
 .resource-item {
-  padding: 0 40px;
+  padding: 0;
 }
 
 .resource-item.no-sides-padding {

@@ -25,7 +25,6 @@ export default {
       return Promise.reject(`路由规则未匹配到: ${name}`);
     }
     query = query || {};
-    console.log(query);
 
     const routerFn = router[jumpType] || router.navigateTo;
     return routerFn({
@@ -74,11 +73,21 @@ export default {
         break;
       }
       case OPEN_BY_TYPE.GO_ORDER_DETAIL: {
-        this.go('orderDetail', params);
+        let userInfo = Taro.getStorageSync('userInfo');
+        if (userInfo && userInfo.uid && userInfo.session_key) {
+          this.go('orderDetail', params);
+        } else {
+          this.go('nativeLogin');
+        }
         break;
       }
       case OPEN_BY_TYPE.GO_ORDER_LIST: {
-        this.go(OPEN_BY_TYPE.GO_ORDER_LIST, params);
+        let userInfo = Taro.getStorageSync('userInfo');
+        if (userInfo && userInfo.uid && userInfo.session_key) {
+          this.go(OPEN_BY_TYPE.GO_ORDER_LIST, params);
+        } else {
+          this.go('nativeLogin');
+        }
         break;
       }
       default: break;