顶部按键 下拉加载功能

src/app.js

@@ -42,7 +42,8 @@ class App extends Component {
       navigationBarBackgroundColor: '#fff',
       navigationBarTitleText: 'WeChat',
       navigationBarTextStyle: 'black',
-      enablePullDownRefresh:true
+     // enablePullDownRefresh:true
+     onReachBottomDistance: 0
     }
     ,
 

src/app.scss

@@ -4,6 +4,8 @@ $themeColor: #FF7142;
 $linearOrange:linear-gradient(to right, #FF7142, #FF7142);
 $linearDarkRed:linear-gradient(to right, #d9534f, #d9534f);;
 $linearGreen:linear-gradient(to right, #5cb85c, #5cb85c);;
+$linearBlue:linear-gradient(to right, #337ab7, #337ab7);
+
 
 .input-index--at-input__title{
     font-weight: bold
@@ -39,6 +41,20 @@ $linearGreen:linear-gradient(to right, #5cb85c, #5cb85c);;
     background:$linearOrange;
     margin:20px auto
 }
+.button-blue{
+    color:white;
+    font-size: 28px;
+    background:$linearBlue;
+    margin:20px auto
+}
+.blur{
+    opacity: 0.5;
+}
+
+// .button-blue-mini{
+//     color:white;
+//     background:$linearBlue;
+// }
 .button-no-margin{
     margin:10px 0
 }

src/component/bottomNav/bottomNav.js

@@ -32,7 +32,6 @@ class bottomNav extends Component {
         })
 
         let path = this.state.otherData[value].url
-        console.log('path',path)
         Taro.navigateTo({
             url: path,
         })

src/component/copyrightComponent/copyrightComponent.js

@@ -20,10 +20,6 @@ class CopyrightComponent extends Component {
                     <View className='title'>
                         Copyright  &copy; 晨丰全屋定制商城 闽ICP备16007300号-2
                 </View>
-
-                </View>
-                <View className='gap'>
-
                 </View>
             </View>
         )

src/component/copyrightComponent/copyrightComponent.scss

@@ -1,6 +1,7 @@
 .copyright-box{
     
         padding:0 20px;
+        margin:5% 0;
         .title{
             text-align: center;
             line-height: 100px;
@@ -9,7 +10,3 @@
         }
     
 }
-.gap{
-       
-        height:150px;
-    }

src/component/filteredShopComponent/filteredShopComponent.js

@@ -198,6 +198,7 @@ class recommondShop extends Component {
                 <Image className='goods-img' onClick={this.goToShop.bind(this, this.props.shop)} mode='aspectFit' style='max-height: 100%; max-width: 100%;' src={URL.Base + item.goods_url} />
             </View>
         }) : null
+
         //  优惠卷和咨询元素
         // const voucherModalElement = <AtModal className='voucher-modal' isOpened={this.state.isOpenVoucher}>
         //     <AtModalHeader>优惠卷须知：</AtModalHeader>
@@ -277,13 +278,13 @@ class recommondShop extends Component {
 
                     <View className='button-container' style='margin-right:5px'>
                         {voucherLeft ? <View className='button' onClick={this.isOpenVoucher.bind(this)} >
-                            <Button size='mini' className='button-blue'>
+                            <Button size='mini' className='button-blue-mini'>
                                 优惠卷</Button>
-                        </View> : <View className='button'  >
+                        </View> : <View className='button blur'  >
-                                <Button disabled={true} size='mini' className='button-blue'>优惠卷</Button>
+                                <Button size='mini' className='button-blue-mini'>优惠卷</Button>
                             </View>}
-                        <View className='button' onClick={this.isOpenConsult.bind(this)} >
+                        <View className='button contult-button' onClick={this.isOpenConsult.bind(this)} >
-                            <Button size='mini' className='button-blue'>
+                            <Button size='mini' className='button-blue-mini'>
                                 询价</Button>
                         </View>
 

src/component/filteredShopComponent/filteredShopComponent.scss

@@ -36,16 +36,22 @@ $linearBlue:linear-gradient(to right, #337ab7, #337ab7);
           //  padding:20px 0;
           margin-top:2%;
             .button{
-                flex:1;
                // margin-left:2%;
                 text-align: center;
-                margin-left:8%;
+                margin-left:25%;
             }
-            .button-blue{
+            .blur{
-                color:white;
+                opacity: 0.5;
+            }
+            .contult-button{
+                margin-left:5%;
+            }
+            .button-blue-mini{
                 font-size: 22px;
+                color:white;
                 background:$linearBlue;
             }
+         
         }
         .title{
             flex:1;

src/component/filteredShopComponent/voucherPosterComponent/voucherPosterComponent.js

@@ -17,7 +17,7 @@ class VoucherPoster extends Component {
     this.state = {
       voucherName: '',
       voucherPhone: '',
-     voucherPosterImage:'background-image:url('+URL.Base+'/Public/images/store/m_yhq.png);'
+      voucherPosterImage: 'background-image:url(' + URL.Base + '/Public/images/store/m_yhq.png);'
     }
   }
   // api 购买咨询 BuyConsult
@@ -44,7 +44,12 @@ class VoucherPoster extends Component {
       .then(res => {
         console.log('购买咨询请求成功', res)
         if (res.statusCode === 200) {
-          Taro.showToast({ title: '咨询成功', icon: 'success' })
+          Taro.showToast({ title: '领取成功', icon: 'success',duration:1500})
+      
+            setTimeout(() => {
+              this.passDataToParent()
+            }, 1500);
+          
         } else {
           Taro.showToast({ title: res.data.err_msg, icon: 'none' })
 
@@ -59,26 +64,21 @@ class VoucherPoster extends Component {
   }
   //名字输入
   handleNameChange(value) {
-    this.setState({ voucherName: value })
+    this.setState({ voucherName: value.detail.value })
   }
   //号码输入
   handlePhoneChange(value) {
-    this.setState({ voucherPhone: value })
+    this.setState({ voucherPhone:  value.detail.value })
   }
   passDataToParent() {
     this.props.onPassDataToChild(false)
   }
   componentDidMount() {
-    console.log('poster did mount')
     this.setState({
       voucherName: Taro.getStorageSync('user_identity').username,
       voucherPhone: Taro.getStorageSync('user_identity').userphone,
     })
   }
-  componentWillReceiveProps(nextProps) {
-    console.log(this.props, nextProps)
-  }
-
   componentWillUnmount() { }
 
   componentDidShow() { }
@@ -90,14 +90,10 @@ class VoucherPoster extends Component {
     return (
       <View className='voucherEventPopUpComponent'>
 
-
         {/* <!-- The Modal --> */}
         <View className='modal myModal' style={this.props.isVoucherPoster ? 'display:block' : 'display:none'}>
           <View className='modal-content'   >
-          
+            <View className=' absolute container' style={this.state.voucherPosterImage} >
-
-
-            <View className=' absolute container'  style={this.state.voucherPosterImage}>
               <View className='close-icon ' onClick={this.passDataToParent.bind(this)}>
                 <AtIcon value='close-circle' size='30' color='#3F536E'></AtIcon>
               </View>
@@ -108,19 +104,19 @@ class VoucherPoster extends Component {
               <View className='input-name ' >
 
                 <View className='title'> <Text>联系人：</Text></View>
-                <Input class='input-info' type='text' value={this.state.voucherName} onChange={this.handleNameChange.bind(this)} />
+                <Input class='input-info' type='text' value={this.state.voucherName} onInput={this.handleNameChange.bind(this)} />
               </View>
               <View className='input-number ' >
 
                 <View className='title'> <Text>联系电话：</Text></View>
-                <Input class='input-info' type='text' value={this.state.voucherPhone} onChange={this.handleNumberChange.bind(this)} />
+                <Input class='input-info' type='text' value={this.state.voucherPhone} onInput={this.handleNumberChange.bind(this)} />
               </View>
               <View className='tips'>
                 {this.props.voucherResponseMsg}
               </View>
 
               <View className='button ' >
-                <Button size='default' className='button-orange' onClick={this.onClickUploadGoods.bind(this)}>预约领取</Button>
+                <Button size='default' className='button-orange' onClick={this.voucherModalConfirm.bind(this)}>预约领取</Button>
               </View>
               <View className='declare '>
 

src/component/filteredShopComponent/voucherPosterComponent/voucherPosterComponent.scss

@@ -30,12 +30,16 @@ $linearOrange:linear-gradient(to right, #FF7142, #FF7142);
     animation-duration: 0.4s;
     height:80%;
     overflow-y: scroll;
+   
    .absolute{
     position:absolute;
+    
    }
    .container{
        top:0px;
        background-size:100% 100%;
+       min-height:100%;
+
 
     .close-icon{
         margin-left:88%;
@@ -43,7 +47,7 @@ $linearOrange:linear-gradient(to right, #FF7142, #FF7142);
 
     }
     .voucher-left{
-        margin-top:55%;
+        margin-top:40%;
         width: 100%;
         text-align: center;
         color:white;
@@ -71,7 +75,7 @@ $linearOrange:linear-gradient(to right, #FF7142, #FF7142);
         }
         .input-info{
             flex:2;
-            margin-top:1.5%
+            margin-top:3.5%
         }
 
     }
@@ -92,7 +96,7 @@ $linearOrange:linear-gradient(to right, #FF7142, #FF7142);
        }
        .input-info{
            flex:2;
-           margin-top:1.5%
+           margin-top:3.5%
        }
 
    }

src/component/scrollToTopComponent/scrollToTopComponent.js

@@ -0,0 +1,56 @@
+//scrollToTopComponent
+import Taro, { Component } from '@tarojs/taro'
+import { View, Text } from '@tarojs/components'
+import { AtIcon } from 'taro-ui'
+
+
+import './scrollToTopComponent.scss'
+
+
+
+
+class ScrollToTopComponent extends Component {
+    config = {
+        navigationBarTitleText: '顶部'
+    }
+
+    scrollToTop() {
+        Taro.pageScrollTo({
+            scrollTop: 0,
+            duration: 300
+        })
+    }
+
+    onPageScroll(location) {
+       console.log(location)
+      }
+
+
+    componentDidMount() {
+
+    }
+    componentWillReceiveProps(nextProps) {
+        // console.log(this.props, nextProps)
+    }
+
+    componentWillUnmount() { }
+
+    componentDidShow() { }
+
+    componentDidHide() { }
+
+    render() {
+        return (
+            <View className='scrollToTopComponent' onClick={this.scrollToTop.bind(this)}>
+                <View className='box'>
+                    <AtIcon value='chevron-up' size='20' color='#3F536E'></AtIcon>
+                    <View>顶部</View>
+
+                </View>
+
+            </View>
+        )
+    }
+}
+
+export default ScrollToTopComponent

src/component/scrollToTopComponent/scrollToTopComponent.scss

@@ -0,0 +1,18 @@
+.scrollToTopComponent{
+    height:100rpx;
+    width:100rpx;
+    border: 1px solid #ddd;
+    background-color: white;
+    border-radius:50%;
+    text-align:center;
+    position:fixed;
+    bottom:8%;
+    right:5%;
+    font-size:25rpx;
+    .box{
+        margin-top:6%;
+
+    }
+
+    
+}

src/pages/allDemanding/allDemanding.js

@@ -1,6 +1,6 @@
 import Taro, { Component } from '@tarojs/taro'
 import { View, Text, Image, Button } from '@tarojs/components'
-import { AtInput, AtButton, Picker, AtIcon, AtModal, AtToast, AtModalHeader, AtModalContent, AtModalAction, AtPagination } from 'taro-ui'
+import { AtInput, Picker, AtIcon, AtModal, AtToast, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
 import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
 
 import InteractionComponent from '../../component/interactionComponent/interactionComponent'
@@ -11,7 +11,8 @@ import './allDemanding.scss'
 import eyeIcon from '../../icons/eye.png'
 
 
-let currentPage = 1
+let loadMorePageIndex = 1 // 底部加载接口请求参数
+
 class AllDemanding extends Component {
     config = {
         navigationBarTitleText: '全部业主需求'
@@ -30,15 +31,17 @@ class AllDemanding extends Component {
             grabOrderId: '',//抢到订单的id
             isGrabOrderSuccess: false,// 是否显示轻提示
             grabOrderSuccess: '无法显示绑定后的字段',// 抢单成功返回字段
-            totalDemandings: 0,
+            currentPage: 1,
-            currentPage: 1
+            isAddToList: false,// / 请求业主需求的时候是否添加到旧列表里
 
 
         }
     }
 
     // 搜索业主需求函数
-    searchDemanding({ curr_page = 1, page_count = 10,
+    searchDemanding({
+        curr_page = 1,
+        page_count = 10,
         sd_title = this.state.title,
         state = this.state.demandingStateSelected.id,
         update_dateL = this.state.startDateSel,
@@ -67,12 +70,20 @@ class AllDemanding extends Component {
             }
         })
             .then(res => {
-
                 Taro.hideLoading()
                 if (res.data.err_msg === 'success') {
-                    const total = Number(res.data.count)
+                    if (res.data.supplys.length) {
-                    this.setState({ supplys: res.data.supplys, totalDemandings: total })
+                        if (this.state.isAddToList) {
-
+                            this.setState({ supplys: this.state.supplys.concat(res.data.supplys) })
+                        } else {
+                            this.setState({ supplys: res.data.supplys })
+                        }
+                    } else {
+                        Taro.showToast({
+                            title: '没有更多了',
+                            icon: 'none'
+                        })
+                    }
                 } else {
                     Taro.showToast({
                         title: res.data.err_msg,
@@ -80,8 +91,6 @@ class AllDemanding extends Component {
                         duration: 1500
                     })
                 }
-
-
             })
     }
 
@@ -182,7 +191,8 @@ class AllDemanding extends Component {
         })
         this.setState({ currentPage: type.current, }, () => {
             this.searchDemanding({
-                curr_page: this.state.currentPage, page_count: 10,
+                curr_page: this.state.currentPage,
+                page_count: 10,
                 sd_title: this.state.title,
                 state: this.state.demandingStateSelected.id,
                 update_dateL: this.state.startDateSel,
@@ -210,6 +220,18 @@ class AllDemanding extends Component {
 
     componentDidHide() { }
 
+    // 底部加载
+    onReachBottom() {
+        Taro.showLoading({
+            title: '加载中'
+        })
+        loadMorePageIndex += 1
+        this.setState({ isAddToList: true }, () => {
+            this.searchDemanding({ curr_page: loadMorePageIndex })
+        })
+
+    }
+
     render() {
         // 提示模态弹窗element
 
@@ -249,7 +271,7 @@ class AllDemanding extends Component {
                         {item.state_name === '在用' ? <View className='button' onClick={this.grabOrder.bind(this, item.sd_id)}>
                             <Button size='mini' className='button-orange'>抢单</Button>
                         </View> : <View className='button' >
-                                <Button  size='mini' disabled={true} className='button-orange'> 已抢单</Button>
+                                <Button size='mini' className='button-orange blur'> 已抢单</Button>
                             </View>
                         }
                     </View>
@@ -332,16 +354,7 @@ class AllDemanding extends Component {
                 <View className='demanding-box'>
                     {allDemandingElementArray}
                 </View>
-                <View className='pagination-box'>
-                    <AtPagination
-                        total={this.state.totalDemandings}
-                        pageSize={10}
-                        current={this.state.currentPage}
-                        onPageChange={this.state.paginationNav.bind(this)}
-                    >
-                    </AtPagination>
                
-                </View>
                 <CopyrightComponent></CopyrightComponent>
             </View>
         )

src/pages/allDemanding/allDemanding.scss

@@ -61,7 +61,7 @@ $themeColor: #FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 120px;
     
     .button{

src/pages/goods/goods.js

@@ -6,6 +6,7 @@ import CopyrightComponent from '../../component/copyrightComponent/copyrightComp
 
 import URL from '../../serviceAPI.config'
 import './goods.scss'
+
 class Goods extends Component {
 
     config = {

src/pages/goodsPublish/goodsPublish.js

@@ -1,6 +1,7 @@
 import Taro, { Component } from '@tarojs/taro'
 import { View, Text, Button } from '@tarojs/components'
 import { AtInput, AtImagePicker, AtTextarea, AtForm } from 'taro-ui'
+import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
 
 
 import ShopTypeInteractionComp from '../../component/shopTypeInteractionComp/shopTypeInteractionComp'
@@ -358,7 +359,7 @@ class GoodsPublish extends Component {
 
                 </View>
 
-                <copyrightComponent></copyrightComponent>
+                <CopyrightComponent></CopyrightComponent>
 
             </View>
         )

src/pages/goodsPublish/goodsPublish.scss

@@ -76,7 +76,7 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 120px;
     .button{
         flex:1;

src/pages/home/home.js

@@ -1,12 +1,16 @@
 import Taro, { Component } from '@tarojs/taro'
 import { View, Button, Text, Swiper, SwiperItem, Image, } from '@tarojs/components'
-import { AtModal, AtModalHeader, AtModalContent, AtModalAction, AtLoadMore } from 'taro-ui'
+import { AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
 import FilteredShopComponent from '../../component/filteredShopComponent/filteredShopComponent'
 import BottomNav from '../../component/bottomNav/bottomNav'
+import ScrollToTopComponent from '../../component/scrollToTopComponent/scrollToTopComponent'
+import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
+
 import URL from '../../serviceAPI.config'
 import './home.scss'
 
-let currentPage = 1
+
+let loadMorePageIndex = 1 // 底部加载接口请求参数
 class Home extends Component {
 
   config = {
@@ -24,24 +28,22 @@ class Home extends Component {
       otherData: [], // 底部导航栏
       isOpen: false, // 抢单消息提示
       grabOrderId: '',//抢到订单的id
-      isMore: 'noMore',// 加载更多店铺
       userName: '',//用户名字
       userPhone: '',// 用户电话
-
+      isShowTopNav: false,
     }
   }
 
-  onPullDownRefresh() {
+  // onPullDownRefresh() {
-    Taro.showLoading({ title: '加载中' })
+  //   Taro.showLoading({ title: '加载中' })
 
-    this.login().then(() => {
+  //   this.login().then(() => {
-      this.getShops({})
+  //     this.getShops({})
-      this.getHomeCategoriesInfo()
+  //     this.getHomeCategoriesInfo()
-    }).catch(err => console.log('微信登入失败：', err))
+  //   }).catch(err => console.log('微信登入失败：', err))
-
-    Taro.stopPullDownRefresh()
-  }
 
+  //   Taro.stopPullDownRefresh()
+  // }
 
 
   //api得到首页的信息
@@ -76,7 +78,7 @@ class Home extends Component {
   }
   // api 得到推荐商店的信息 
   getShops({ parent_supply_class = 0, supply_class = '-1', supply_level = 1, curr_page = 1,
-    page_count = 20, action = "2" }) {
+    page_count = 5, action = "2" }) {
     Taro.request({
       url: URL.ShopSupplyShops,
       method: 'POST',
@@ -101,12 +103,12 @@ class Home extends Component {
         Taro.hideLoading()
         if (res.data.err_msg === 'success') {
           if (res.data.shops.length) {
-            this.setState({ shopsDetails: this.state.shopsDetails.concat(res.data.shops), isMore: 'more' }, () => {
+            this.setState({ shopsDetails: this.state.shopsDetails.concat(res.data.shops) })
-            })
-
           } else {
-            this.setState({ isMore: 'noMore' }, () => {
+            Taro.showToast({
-              console.log('ismore?', this.state.isMore)
+              title: '没有更多了',
+              icon: 'none',
+              duration: 1500
             })
           }
 
@@ -273,7 +275,7 @@ class Home extends Component {
     const childClass = item.class_id
     this.setState({ subCate: item.children })
     Taro.showLoading({
-      title:'加载中'
+      title: '加载中'
     })
     this.getShopsInfo({ parent_supply_class: parentClass, supply_class: childClass })
 
@@ -284,7 +286,7 @@ class Home extends Component {
     const childClass = item.class_id
     // this.getShops(item.parent_class_id, item.class_id, 2)
     Taro.showLoading({
-      title:'加载中'
+      title: '加载中'
     })
     this.getShopsInfo({ parent_supply_class: parentClass, supply_class: childClass, supply_level: 2 })
   }
@@ -294,7 +296,6 @@ class Home extends Component {
       duration: 300
     })
     this.onClickParentCate(item)
-
   }
   // 转到其他页面
   goToAllDemandingPage() {
@@ -317,15 +318,7 @@ class Home extends Component {
     // 确认抢单之后
     this.GrabDemand({ demandId: this.state.grabOrderId })
   }
-  // 向上拉升延迟一秒加载数据
-  handleLoadMore() {
-    this.setState({ isMore: 'loading' })
-    setTimeout(() => {
-      currentPage += 1
-      this.getShops({ curr_page: currentPage })
 
-    }, 1000);
-  }
 
   // 导航去抢单页面
   goToGrabOrderPage(orderId) {
@@ -334,7 +327,7 @@ class Home extends Component {
       url: '/pages/grabOrderPage/grabOrderPage?orderId=' + orderId
     })
   }
-  goToMyNeedsPublish(){
+  goToMyNeedsPublish() {
     Taro.navigateTo({
 
       url: '/pages/myNeedsPublish/myNeedsPublish'
@@ -368,6 +361,25 @@ class Home extends Component {
     console.log(e.detail.userInfo)
     console.log(e.detail.rawData)
   }
+  // 页面位置
+  onPageScroll(location) {
+    if (location.scrollTop <= 300&&this.state.isShowTopNav) {
+      this.setState({ isShowTopNav: false })
+    } else if(location.scrollTop >300&&!this.state.isShowTopNav) {
+      this.setState({ isShowTopNav: true })
+    }
+  }
+  // 底部加载
+  onReachBottom() {
+    Taro.showLoading({
+      title: '加载中'
+    })
+    setTimeout(() => {
+      loadMorePageIndex += 1
+      this.getShops({ curr_page: loadMorePageIndex })
+    }, 1000);
+  }
+
 
 
 
@@ -383,10 +395,6 @@ class Home extends Component {
       <AtModalAction> <Button onClick={this.handleGrabModalCancel.bind(this)}>取消</Button> <Button className='orange' onClick={this.handleGrabConfirm.bind(this)}>确定</Button> </AtModalAction>
     </AtModal>
 
-
-
-
-
     const demandingElemensArray = this.state.demanding.length ? this.state.demanding.map((item, index) => {
       return <SwiperItem key={index} >
         <View className='demanding-item' >
@@ -555,25 +563,22 @@ class Home extends Component {
 
           <View className='shop-box'>
             {shopCollectionElementsArray}
-
-            <AtLoadMore
-              onClick={this.handleLoadMore.bind(this)}
-              status={this.state.isMore}
-              loadingText='加载中'
-              noMoreText='没有更多了'
-            />
-
           </View>
+          {this.state.isShowTopNav ? <ScrollToTopComponent ></ScrollToTopComponent> : null}
+
+          <CopyrightComponent></CopyrightComponent>
           <View className='gap'>
 
           </View>
 
+
         </View>
         <View className='bottom-nav-box'>
           <BottomNav otherData={this.state.otherData} />
         </View>
 
 
+
       </View>
     )
   }

src/pages/myDemandSupplyEdit/myDemandSupplyEdit.scss

@@ -25,7 +25,7 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 120px;
     .button{
         flex:1;

src/pages/myGoodList/myGoodList.js

@@ -1,14 +1,13 @@
 import Taro, { Component } from '@tarojs/taro'
-import { View, Radio,Button } from '@tarojs/components'
+import { View, Radio, Button } from '@tarojs/components'
-import { AtInput, Text, AtIcon, Picker, Image, AtPagination, AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
+import { AtInput, Text, AtIcon, Picker, Image, AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
 import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
 import URL from '../../serviceAPI.config'
 
 
 import './myGoodList.scss'
 
-
+let loadMorePageIndex = 1 // 底部加载接口请求参数
-
 class MyGoodList extends Component {
   config = {
     navigationBarTitleText: '商品列表'
@@ -37,12 +36,13 @@ class MyGoodList extends Component {
       myGoodListTotal: 0,// 后台的商品总数
       currentPage: 1,
       goodsStateParam: 1,//商品状态参数
-      pageCountParam: 5,// 商品数量参数
+      pageCountParam: 2,// 商品数量参数
       currPageParam: 1,// 当前页面 参数
       isCheckAll: false,// 是否checked
       goodsIdList: [],//商品Id 列表
       isOpenDeleteModal: false,// 是否显示删除模态框
       isOpenOffStockModal: false,// 是否显示下架模态框
+      isAddToList: false,// 是否下拉加载 如果是 就添加商品到我的商品列表
 
 
 
@@ -126,25 +126,32 @@ class MyGoodList extends Component {
       if (res.statusCode === 200) {
         console.log('我的商品列表', JSON.parse(res.data))
         const data = JSON.parse(res.data)
-        if (data.goods) {
+        Taro.hideLoading()
+        if (data.goods.length) {
           data.goods.forEach(item => {
             item.checked = false
           });
           const goodCount = Number(data.goodsCount)
+          if (this.state.isAddToList) {
+            this.setState({ myGoodList: this.state.myGoodList.concat(data.goods) }, () => {
+              this.setState({ isAddToList: false })
+            })
+          } else {
             this.setState({
               myGoodList: data.goods,
               myGoodListTotal: goodCount
             })
 
           }
-
+        } else {
-
+          Taro.showToast({
-
+            title: '没有更多了',
+            icon: 'none'
+          })
+        }
       } else {
         console.log('我的商品列表获取失败')
       }
-
-
     })
 
   }
@@ -158,7 +165,6 @@ class MyGoodList extends Component {
     goodsSalesL = this.state.minimumSold,
     goodsSalesU = this.state.maximumSold,
     shopClassID = this.state.productId,
-
     goodsState = this.state.goodsStateParam,
     pageCount = this.state.pageCountParam,
     currPage = this.state.currPageParam,
@@ -300,7 +306,7 @@ class MyGoodList extends Component {
     Taro.showLoading({
       title: '加载中',
     })
-    this.setState({ currentPage: 1 ,isCheckAll:false}, () => {
+    this.setState({ currentPage: 1, isCheckAll: false }, () => {
       this.getGoodListResultApi({})
     })
   }
@@ -318,7 +324,7 @@ class MyGoodList extends Component {
       productCateSelected: { id: '', name: '全部类目' },
     }, () => {
 
-      this.setState({isCheckAll:false,currentPage: 1},()=>{
+      this.setState({ isCheckAll: false, currentPage: 1 }, () => {
         this.getMyGoodListApi({})
       })
       Taro.showToast({
@@ -414,19 +420,20 @@ class MyGoodList extends Component {
     }
     else {
       this.setState({
-        isCheckAll:true
+        isCheckAll: true
-      },()=>{
+      }, () => {
-       this.setState({isCheckAll:false})
+        this.setState({ isCheckAll: false })
       })
       Taro.showToast({
         title: '全选无效',
         icon: 'none',
         duration: 1500
-      }).then(()=>{
+      }).then(() => {
 
       })
 
-    }}
+    }
+  }
 
 
   // 单个商品选择
@@ -479,13 +486,20 @@ class MyGoodList extends Component {
       url: '/pages/myGoodsEdit/myGoodsEdit?id=' + goodId
     })
   }
-    goToGoodspage(goodId){
+  // 导航到商品发布页面
+
+  goToGoodsPublishPage() {
+    Taro.navigateTo({
+      url: '/pages/goodsPublish/goodsPublish'
+    })
+  }
+  goToGoodspage(goodId) {
     Taro.navigateTo({
       url: '/pages/goods/goods?id=' + goodId
     })
   }
 
-    DeleteConfirm(){
+  DeleteConfirm() {
     this.setState({
       isOpenDeleteModal: false
     })
@@ -497,12 +511,12 @@ class MyGoodList extends Component {
     });
     this.deleteGood({ goodsID: checkedGoodsId })
   }
-    deleteModalClose(){
+  deleteModalClose() {
     this.setState({
       isOpenDeleteModal: false
     })
   }
-    OffStockConfirm(){
+  OffStockConfirm() {
 
     this.setState({
       isOpenOffStockModal: false
@@ -515,7 +529,7 @@ class MyGoodList extends Component {
     });
     this.changeGoodState({ goodsID: checkedGoodsId })
   }
-    offStockModalClose(){
+  offStockModalClose() {
     this.setState({
       isOpenOffStockModal: false
     })
@@ -535,6 +549,20 @@ class MyGoodList extends Component {
 
   componentDidHide() { }
 
+  // 底部加载
+  onReachBottom() {
+    Taro.showLoading({
+      title: '加载中'
+    })
+
+    loadMorePageIndex += 1
+    this.setState({ isAddToList: true }, () => {
+      this.getMyGoodListApi({ currPage: loadMorePageIndex })
+    })
+
+
+  }
+
   render() {
 
     //等待接口数据  
@@ -674,10 +702,16 @@ class MyGoodList extends Component {
               <AtIcon value='search' size='12' color='white'></AtIcon>
               搜索</Button>
           </View>
-            <View className='button' onClick={this.emptyButtonHanlder.bind(this)}>
+          <View className='button' onClick={this.goToGoodsPublishPage.bind(this)}>
             <Button className='button-green' size='mini'>
+            <AtIcon value='add' size='12' color='white'></AtIcon>
+              新增</Button>
+          </View>
+          <View className='button' onClick={this.emptyButtonHanlder.bind(this)}>
+            <Button className='button-dark-red' size='mini'>
            
-                清空条件</Button>
+            <AtIcon value='trash' size='12' color='white'></AtIcon>
+              清空</Button>
           </View>
         </View>
 
@@ -692,11 +726,11 @@ class MyGoodList extends Component {
           <View className='sub-filter'>
             <Radio className='radio' checked={this.state.isCheckAll} onClick={this.checkAllHandler.bind(this)}>全选</Radio>
             <View className='button' onClick={this.deleteGoodsHandler.bind(this)}>
-                <Button  size='mini' className='button-orange'>
+              <Button size='mini' className='button-dark-red'>
                 删除</Button>
             </View>
             <View className='button' onClick={this.offStockGoodHandler.bind(this)}>
-                <Button  size='mini' className='button-green'>
+              <Button size='mini' className='button-blue'>
                 下架</Button>
             </View>
           </View>
@@ -704,28 +738,13 @@ class MyGoodList extends Component {
 
 
         <View className='mygoodlist-container'>
-
+          {goodListElementArray}
-            {this.state.myGoodList.length ? goodListElementArray : <View className='nomore' >
+        </View >
-              没有更多了....
-    </View >}
-
-
-          </View>
-          <View className='pagination-box'>
-            <AtPagination
-              total={this.state.myGoodListTotal}
-              pageSize={5}
-              current={this.state.currentPage}
-              onPageChange={this.state.paginationNav.bind(this)}
-            >
-            </AtPagination>
-
-          </View>
 
         <CopyrightComponent></CopyrightComponent>
       </View>
     )
   }
-  }
+}
 
-  export default MyGoodList
+export default MyGoodList

src/pages/myGoodList/myGoodList.scss

@@ -131,6 +131,9 @@ $themeColor:#FF7142;
         .button-box1{
             flex:1;
             margin-top: 7%;
+            .button-orange{
+                font-size: 27rpx
+            }
     }
     .good-container-a{
         flex:3;
@@ -167,6 +170,7 @@ $themeColor:#FF7142;
         }
         
         
+           
         }
     
         

src/pages/myGoodsEdit/myGoodsEdit.js

@@ -3,6 +3,7 @@ import { View, Text } from '@tarojs/components'
 import { AtInput, AtImagePicker, AtTextarea, Button, } from 'taro-ui'
 
 import ShopTypeInteractionComp from '../../component/shopTypeInteractionComp/shopTypeInteractionComp'
+import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
 
 import URL from '../../serviceAPI.config'
 
@@ -16,7 +17,7 @@ class MyGoodsEdit extends Component {
     constructor() {
         super(...arguments)
         this.state = {
-            shopTypeSelected:{name:'全部',id:''},
+            shopTypeSelected: { name: '全部', id: '' },
             shopTypeList: {},//店铺分类列表
             productName: '',
             productPrice: '',
@@ -56,7 +57,7 @@ class MyGoodsEdit extends Component {
                     for (let key in this.state.shopTypeList) {
                         for (let item of this.state.shopTypeList[key].c) {
                             if (item.id === shopTypeId) {
-                                shopTypeSelected = {name:item.n,id:item.id}
+                                shopTypeSelected = { name: item.n, id: item.id }
                             }
                         }
                     }
@@ -387,7 +388,8 @@ class MyGoodsEdit extends Component {
                     {/* 店铺分类 */}
                     <ShopTypeInteractionComp url={URL.GetShopCategoryList}
                       selectedValue={this.state.shopTypeSelected}
-                    onPassDataToChild={this.getDataFromShopChild.bind(this)}></ShopTypeInteractionComp>
+                      onPassDataToChild={this.getDataFromShopChild.bind(this)}
+                    ></ShopTypeInteractionComp>
                     {/* 店铺分类结束  */}
 
                     <View className='description-box'>
@@ -417,7 +419,8 @@ class MyGoodsEdit extends Component {
                     </View>
                 </View>
 
-                <copyrightComponent></copyrightComponent>
+
+                <CopyrightComponent></CopyrightComponent>
 
             </View>
         )

src/pages/myGoodsEdit/myGoodsEdit.scss

@@ -76,7 +76,7 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 120px;
     .button{
         flex:1;

src/pages/myNeeds/myNeeds.js

@@ -1,7 +1,7 @@
 //myNeeds
 import Taro, { Component } from '@tarojs/taro'
 import { View, Text, Button } from '@tarojs/components'
-import { AtInput, Picker, AtIcon, AtModal, AtModalHeader, AtModalContent, AtModalAction, AtPagination } from 'taro-ui'
+import { AtInput, Picker, AtIcon, AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
 import URL from '../../serviceAPI.config'
 
 import InteractionComponent from '../../component/interactionComponent/interactionComponent'
@@ -10,6 +10,7 @@ import CopyrightComponent from '../../component/copyrightComponent/copyrightComp
 
 import './myNeeds.scss'
 
+let loadMorePageIndex = 1 // 底部加载接口请求参数
 
 class MyNeeds extends Component {
   
@@ -38,6 +39,8 @@ class MyNeeds extends Component {
       currentPage: 1,
       needsItem: '',// 确认框提示时 使用的供求名
       isDeleteModal:false,
+      isAddToList: false,// 请求需求的时候是否添加到旧列表里
+
 
     }
   }
@@ -45,7 +48,7 @@ class MyNeeds extends Component {
 
   //请求我的需求列表 api GetMyNeedsList
   getMyNeedsList({ curr_page = 1,
-    page_count = 20,
+    page_count = 10,
     sd_type = '4',
     sd_title = '',
     update_dateL = '',
@@ -84,15 +87,37 @@ class MyNeeds extends Component {
         'X-Requested-With': 'XMLHttpRequest'
       }
     }).then(res => {
-      if (res.data.err_msg === "success") {
-        // 判断是否有res.data.supplys ， 如果没有就是空数组[]
       Taro.hideLoading()
       console.log('我的需求列表', res)
+      if (res.data.err_msg === "success") {
+        if(res.data.supplys.length){
+          if(this.state.isAddToList){
+            this.setState({
+              allNeedsList:this.state.allNeedsList.concat(res.data.supplys)
+            },()=>{
+                this.setState({isAddToList:false})
+            })
 
+          }else{
             this.setState({
               allNeedsList: res.data.supplys || [],
               totalNeeds: Number(res.data.count)
             })
+
+          }
+           
+
+        }else{
+          Taro.showToast({
+            title: '没有更多了',
+            icon: 'none'
+        })
+        }
+      }else{
+        Taro.showToast({
+          title: res.data.err_msg,
+          icon: 'none'
+      })
       }
     })
 
@@ -144,7 +169,7 @@ class MyNeeds extends Component {
     Taro.showLoading({ title: '加载中' }).then(() => {
       setTimeout(() => {
         this.getMyNeedsList({
-          curr_page: this.currentPage,
+          curr_page: this.state.currentPage,
           page_count: this.state.pageCount,
           sd_type: this.state.needsTypeSelected.id,
           sd_title: this.state.title,
@@ -228,24 +253,7 @@ class MyNeeds extends Component {
   }
 
 
-  // 翻页导航
+
-  paginationNav(type) {
-    Taro.showLoading({
-      title:'加载中'
-    })
-    this.setState({ currentPage: type.current, }, () => {
-      this.getMyNeedsList({
-        curr_page: this.state.currentPage,
-        page_count: this.state.pageCount,
-        sd_type: this.state.needsTypeSelected.id,
-        sd_title: this.state.title,
-        update_dateL: this.state.startDateSel,
-        update_dateU: this.state.endDateSel,
-        class_id: this.state.industryTypeSelected.id,
-        state: this.state.needsStateSelected.id
-      })
-    })
-  }
 
 
   componentDidMount() {
@@ -262,6 +270,18 @@ class MyNeeds extends Component {
 
   componentDidHide() { }
 
+   // 底部加载
+   onReachBottom() {
+    Taro.showLoading({
+        title: '加载中'
+    })
+    loadMorePageIndex += 1
+    this.setState({ isAddToList: true }, () => {
+        this.getMyNeedsList({ curr_page: loadMorePageIndex })
+    })
+
+}
+
 
   getDataFromChild(value){
     console.log('从子组件传回来的值',value)
@@ -408,17 +428,8 @@ class MyNeeds extends Component {
             没有更多了....
     </View >}
 
-        <View className='pagination-box'>
-          <AtPagination
-            total={this.state.totalNeeds}
-            pageSize={10}
-            current={this.state.currentPage}
-            onPageChange={this.state.paginationNav.bind(this)}
-          >
-          </AtPagination>
        
-        </View>
+        <CopyrightComponent ></CopyrightComponent>
-        <CopyrightComponent name='Wallace'></CopyrightComponent>
 
       </View>
     )

src/pages/myNeeds/myNeeds.scss

@@ -88,9 +88,9 @@ $themeColor:#FF7142;
     .button{
         flex:1;
         text-align: center;
-       
+    }
-
+    .button-orange, .button-dark-red,.button-green{
-       
+        font-size:28rpx;
     }
 }
 

src/pages/myNeedsEdit/myNeedsEdit.scss

@@ -25,7 +25,7 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 120px;
     .button{
         flex:1;

src/pages/myNeedsPublish/myNeedsPublish.scss

@@ -25,7 +25,7 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 120px;
     .button{
         flex:1;

src/pages/myNeedsView/myNeedsView.scss

@@ -15,22 +15,24 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 20px;
     
+    
     .button{
         flex:1;
         text-align: center;
-       // margin:2%;
+        .button-green{
-       // justify-content:center;
+            font-size: 25rpx;
 
-        .at-button--primary{
-            background-color:$themeColor;
-            border:1PX solid $themeColor;
         }
-        .button-a{
+        .button-orange{
-             background-color:#d9534f;
+            font-size: 25rpx;
-            border:1PX solid #d9534f;
+
+        }
+        .button-dark-red{
+            font-size: 25rpx;
+
         }
     }
 }

src/pages/mySupplyDemand/mySupplyDemand.js

@@ -1,6 +1,6 @@
 import Taro, { Component } from '@tarojs/taro'
 import { View, Text, Button } from '@tarojs/components'
-import { AtInput, Picker, AtIcon, AtModal, AtModalHeader, AtModalContent, AtModalAction, AtPagination } from 'taro-ui'
+import { AtInput, Picker, AtIcon, AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
 import URL from '../../serviceAPI.config'
 
 import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
@@ -8,6 +8,7 @@ import CopyrightComponent from '../../component/copyrightComponent/copyrightComp
 
 import './mySupplyDemand.scss'
 
+let loadMorePageIndex = 1 // 底部加载接口请求参数
 
 class MySupplyDemand extends Component {
 
@@ -30,8 +31,6 @@ class MySupplyDemand extends Component {
             demandSupplyId: '',// 删除我的供求时的供求id
             totalDemandSupply: 0,//所有供求
             currentPage: 1 //当前页数
-
-
         }
     }
     //获取我的供求列表API
@@ -53,11 +52,31 @@ class MySupplyDemand extends Component {
                 'X-Requested-With': 'XMLHttpRequest'
             }
         }).then(res => {
+            Taro.hideLoading()
+            console.log('我的供求列表', res)
             if (res.data.err_msg === "success") {
                 // 判断是否有res.data.supplys ， 如果没有就是空数组[]
-                Taro.hideLoading()
+                if (res.data.supplys.length) {
-                const totalCount = Number(res.data.count)
+                    if (this.state.isAddToList) {
-                this.setState({ allDemandSupply: res.data.supplys || [], totalDemandSupply: totalCount })
+                        this.setState({ allDemandSupply: this.state.allDemandSupply.concat(res.data.supplys) }, () => {
+                            this.setState({ isAddToList: false })
+                        })
+                    } else {
+                        this.setState({ allDemandSupply: res.data.supplys || [], totalDemandSupply: res.data.count })
+                    }
+                } else {
+                    Taro.showToast({
+                        title: '没有更多了',
+                        icon: 'none'
+                    })
+                }
+
+            } else {
+                Taro.showToast({
+                    title: res.data.err_msg,
+                    icon: 'none',
+                    duration: 1500
+                })
             }
         })
 
@@ -264,6 +283,18 @@ class MySupplyDemand extends Component {
 
     componentDidHide() { }
 
+    // 底部加载
+    onReachBottom() {
+        Taro.showLoading({
+            title: '加载中'
+        })
+        loadMorePageIndex += 1
+        this.setState({ isAddToList: true }, () => {
+            this.getMySupplyDemand({ curr_page: loadMorePageIndex })
+        })
+
+    }
+
     render() {
 
 
@@ -413,16 +444,7 @@ class MySupplyDemand extends Component {
                 <View className='info-box'>
                     {demandSupplyElementArray}
                 </View>
-                <View className='pagination-box'>
-                    <AtPagination
-                        total={this.state.totalDemandSupply}
-                        pageSize={10}
-                        current={this.state.currentPage}
-                        onPageChange={this.state.paginationNav.bind(this)}
-                    >
-                    </AtPagination>
                
-                </View>
 
 
 

src/pages/mySupplyDemand/mySupplyDemand.scss

@@ -80,21 +80,9 @@ $themeColor:#FF7142;
         flex:1;
         text-align: center;
        
-
-        .at-button--primary{
-            background-color:$themeColor;
-            border:1PX solid $themeColor;
-        }
-        .button-a{
-           
-             background-color:#5cb85c;
-            border:1PX solid #5cb85c;
-        }
-        .button-b{
-           
-            background-color:#d9534f;
-           border:1PX solid #d9534f;
     }
+    .button-orange, .button-dark-red,.button-green{
+        font-size:28rpx;
     }
 }
 

src/pages/shop/shop.js

@@ -1,6 +1,6 @@
 import Taro, { Component } from '@tarojs/taro'
 import { View, Button, Text, Image } from '@tarojs/components'
-import { AtTag, AtIcon, AtPagination, } from 'taro-ui'
+import { AtTag, AtIcon, } from 'taro-ui'
 import URL from '../../serviceAPI.config'
 
 
@@ -8,7 +8,8 @@ import './shop.scss'
 import ShopItem from '../../component/shopItemComponent/shopItemComponent'
 import BottomNav from '../../component/bottomNav/bottomNav'
 import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
-import ShopDescription from '../shopDescription/shopDescription';
+
+let loadMorePageIndex = 1 // 底部加载接口请求参数
 
 class Shop extends Component {
     // 项目配置
@@ -42,10 +43,7 @@ class Shop extends Component {
                 price: false,
                 popularity: false,
             },
-
             filterCondition: '',// 筛选条件
-            total: 0,// 信息条数
-            currentPage: 1,// 当前页
             isShowShopAllCate: false,
             shopAllInnerCate: '',// 店铺内部分类
             isBlurWindow: false,
@@ -54,7 +52,7 @@ class Shop extends Component {
             otherType: [],//侧边其他类型
             widthType: [],// 侧边宽度类型
             checkedFilterIdList: [],//已选的筛选id
-           
+            isAddToList: false,// 请求店铺商品的时候是否添加到旧列表里
             // 下面是函数的默认参数
             curr_page: 1,
             page_count: 10,
@@ -63,7 +61,6 @@ class Shop extends Component {
             config_id: 4,
             shop_class_id: '',
             order: '',
-            currPage: 1,
             goods_class_id: '',
             goodsSpec: [],
             goodsParam: [],
@@ -222,11 +219,25 @@ class Shop extends Component {
             }
         })
             .then(res => {
-                console.log('searchGood',res)
+                console.log('searchGood', res)
                 Taro.hideLoading()
-                this.setState({ shopItem: res.data.goods, total: res.data.goodsCount, filterCondition: order }, () => {
+                if (res.data.goods.length) {
-
+                    if (this.state.isAddToList) {
+                        this.setState({
+                            shopItem: this.state.shopItem.concat(res.data.goods)
+                        }, () => {
+                            this.setState({ isAddToList: false })
                         })
+                    } else {
+                        this.setState({ shopItem: res.data.goods, filterCondition: order })
+                    }
+                } else {
+                    Taro.showToast({
+                        title: '没有更多了',
+                        icon: 'none'
+                    })
+                }
+
 
             })
     }
@@ -524,7 +535,7 @@ class Shop extends Component {
     componentDidMount() {
 
         Taro.showLoading({ title: '加载中' })
-        console.log('this.$router.params.id',this.$router.params.id)
+        console.log('this.$router.params.id', this.$router.params.id)
         //页面加载之后 得到指定店铺的商品 和 筛选标签
         this.goodsSearch({ shop_id: this.$router.params.id }) // 加载店铺商品
         this.getSearchParams({})// 加载筛选项
@@ -537,6 +548,18 @@ class Shop extends Component {
 
     componentDidHide() { }
 
+    // 底部加载
+    onReachBottom() {
+        Taro.showLoading({
+            title: '加载中'
+        })
+        loadMorePageIndex += 1
+        this.setState({ isAddToList: true }, () => {
+            this.goodsSearch({ curr_page: loadMorePageIndex })
+        })
+
+    }
+
     render() {
 
         const ShopItemElementsArray = this.state.shopItem.length ? this.state.shopItem.map((item, index) => {
@@ -633,12 +656,12 @@ class Shop extends Component {
                     <View className='filter-box'>
                         {this.state.checkedFilterIdList.length ? <View className='title'>已选择</View> : null}
                         <View className='button-box'>{checkedFilterElementsArray}</View>
-                        {this.state.mainType.length?<View className='title'>分类</View>:null}
+                        {this.state.mainType.length ? <View className='title'>分类</View> : null}
                         <View className='button-box'>{goodsClassElementsArray}</View>
-                        {this.state.goodType.length?<View className='title'>商品类型</View>:null}
+                        {this.state.goodType.length ? <View className='title'>商品类型</View> : null}
                         <View className='button-box'>{goodsTypeElementsArray}</View>
                         {goodsParamElementsArray}
-                        {this.state.widthType.length?<View className='title'>宽度</View>:null}
+                        {this.state.widthType.length ? <View className='title'>宽度</View> : null}
                         <View className='button-box'>{widthnessElementsArray}</View>
 
                         <View className='confirm-button'>
@@ -654,16 +677,7 @@ class Shop extends Component {
             <View className='container'>
                 {ShopItemElementsArray}
             </View>
-            <View className='pagination'>
 
-                <AtPagination
-                  total={Number(this.state.total)}
-                  pageSize={10}
-                  current={this.state.currentPage}
-                  onPageChange={this.handleOnPageChange.bind(this)}
-                >
-                </AtPagination>
-            </View>
         </View>
         // 店铺详情
         const shopDescriptionElement = <View className='shop-description'>
@@ -689,6 +703,7 @@ class Shop extends Component {
                 <View className='description'>
                     <Text className='title-sub'>店铺介绍：</Text>
                     <Text className='detail'>{this.state.shopDescription}</Text>
+                   
                 </View>
 
             </View>

src/pages/shop/shop.scss

@@ -212,6 +212,10 @@ $themeColor:#FF7142;
     .description{
         margin-top: 5%;
         margin-left: 15%;
+    height: auto;
+    word-wrap:break-word;
+    word-break:break-all;
+    overflow: hidden;
         .title-sub{
             font-weight: bold
         }

src/pages/supplyDemandPublish/supplyDemandPublish.js

@@ -30,8 +30,6 @@ class SupplyDemand extends Component {
             content: '',
             pickerImageUrl: [], // 上传的图片
             ImagesInfo: [],// 后台传回来的图片信息
-   
-            
         }
     }
 

src/pages/supplyDemandPublish/supplyDemandPublish.scss

@@ -25,7 +25,7 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 120px;
     .button{
         flex:1;

src/pages/supplyDemandView/supplyDemandView.scss

@@ -18,7 +18,7 @@ $themeColor:#FF7142;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin: 40px 0;
+    margin: 40px 0 0;
     padding: 0 20px;
     
     .button{

src/todo list.txt

@@ -1,36 +1,789 @@
 todo list：
 首页：
 商品发布页面：
-    商品分类三级联动 // 有bug
-    店铺分类选项 二级联动// 需要修改
-    商品价格无法设定为数字 // 有bug
 
 供求发布页面
-    联系电话无法设置为数字 // 有bug  type=‘password’ 可以
 全部业主需求页面：
-    行业分类--等待后台接口--搜索   二级联动--
-
 我的供求页面：
-    
-
 我的商品列表页面
-    商品价格无法设定为数字 // 有bug
-
  商品编辑页面
-    店铺分类--二级联动
 
-我的需求列表页面
+我的需求列表页面:
- 搜索栏的 行业分类--三级联动
 接口问题：
 优惠卷和询价
-
-
 bug： 商品编辑 增加图片后 图片顺序乱了
-    我的商品 删除提示
 
 
 
 
 等待后台--- 单个我的商品页面的图片顺序，单个我的需求页面的接口, 当个我哦的需求编辑页面的接口
 
+import Taro, { Component } from '@tarojs/taro'
+import { View, Radio, Button } from '@tarojs/components'
+import { AtInput, Text, AtIcon, Picker, Image, AtPagination, AtModal, AtModalHeader, AtModalContent, AtModalAction } from 'taro-ui'
+import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
+import URL from '../../serviceAPI.config'
 
+
+import Taro, { Component } from '@tarojs/taro'
+import { View, Button, Text, Image } from '@tarojs/components'
+import { AtTag, AtIcon, AtPagination, } from 'taro-ui'
+import URL from '../../serviceAPI.config'
+
+
+import './shop.scss'
+import ShopItem from '../../component/shopItemComponent/shopItemComponent'
+import BottomNav from '../../component/bottomNav/bottomNav'
+import CopyrightComponent from '../../component/copyrightComponent/copyrightComponent'
+import ShopDescription from '../shopDescription/shopDescription';
+
+let currentPage = 1
+
+class Shop extends Component {
+    // 项目配置
+    config = {
+        navigationBarTitleText: '店铺'
+    }
+    constructor() {
+        super(...arguments)
+        this.state = {
+            isShopDetailsOn: false, // 是否显示店铺说明页面
+            shopItem: [],         // 所有商品
+            value: '',           // 搜索框的值   
+            shopId: '',          // 店铺的id
+            shopName: '',          // 店铺名
+            FilterText: '',        // 筛选的可选项  
+            filterBar: ['all', 'amount', 'newProduct', 'price', 'popularity'], //筛选选项
+            filterBarKeys: { all: '综合排序', amount: '销量', newProduct: '新品', price: '价格', popularity: '人气' }, // 筛选选项对应值
+            selectedFilterValue: 0,   //筛选项
+            isShowFilter: false,        //是否显示侧边筛选
+            showShopHomePage: true,// 是否显示首页页面 
+            shopDescriptionData: '',// 店铺详情信息
+            shopName: '',//店铺名称
+            shopAddress: '',//店铺地址
+            contactName: '',//联系人
+            contactNumber: '',//联系电话
+            shopDescription: '',//店铺简介
+            filterOptions: {
+                all: true,
+                amount: false,
+                newProduct: false,
+                price: false,
+                popularity: false,
+            },
+            filterCondition: '',// 筛选条件
+            total: 0,// 信息条数
+            currentPage: 1,// 当前页
+            isShowShopAllCate: false,
+            shopAllInnerCate: '',// 店铺内部分类
+            isBlurWindow: false,
+            mainType: [],// 侧边筛选分类
+            goodType: [],//侧边商品类型
+            otherType: [],//侧边其他类型
+            widthType: [],// 侧边宽度类型
+            checkedFilterIdList: [],//已选的筛选id
+            isAddToList:false,// 请求店铺商品的时候是否添加到旧列表里
+            // 下面是函数的默认参数
+            curr_page: 1,
+            page_count: 10,
+            shop_name: false,
+            shop_id: this.$router.params.id,
+            config_id: 4,
+            shop_class_id: '',
+            order: '',
+            currPage: 1,
+            goods_class_id: '',
+            goodsSpec: [],
+            goodsParam: [],
+            goodsParamExt: [],
+
+        }
+    }
+
+    // api 得到筛选的标签请求
+    getSearchParams({
+        shop_name = this.state.shop_name,
+        shop_id = this.state.shop_id,
+        shop_class_id = this.state.shop_class_id,
+        goods_class_id = this.state.goods_class_id,
+        class_filter = this.state.class_filter,
+        goods_type = this.state.goods_type,
+        goodsSpec = this.state.goodsSpec,
+        goodsParam = this.state.goodsParam,
+        goodsParamExt = this.state.goodsParamExt }) {
+        Taro.request({
+            url: URL.GetSearchParam,
+            method: 'POST',
+            dataType: 'json',
+            data: {
+                goods: JSON.stringify({
+                    shop_name: shop_name,
+                    shop_id: shop_id,
+                    shop_class_id: shop_class_id,
+                    goods_class_id: goods_class_id,
+                    class_filter: class_filter,
+                    goods_type: goods_type,
+
+                }),
+                goodsSpec: JSON.stringify(goodsSpec),
+                goodsParam: JSON.stringify(goodsParam),
+                goodsParamExt: JSON.stringify(goodsParamExt),
+
+            },
+            header: {
+                'content-type': 'application/x-www-form-urlencoded',
+                'X-Requested-With': 'XMLHttpRequest'
+            }
+        })
+            .then(res => {
+                if (res.statusCode === 200) {
+                    console.log('筛选项目成功', res)
+                    Taro.hideLoading()
+                    this.formatFilterData(res.data).then(data => {
+                        this.setState({
+                            sideFilterdata: data,
+                            mainType: data.mainType || [],
+                            goodType: data.goodType || [],
+                            otherType: data.otherType || [],
+                            widthType: data.widthType || [],
+                        })
+                        console.log('formated data', data)
+                    })
+                } else {
+                    console.log('筛选项目获取失败')
+                }
+
+
+
+            })
+    }
+
+    async formatFilterData(data) {
+        const formatedFilterOptions = {}
+        //侧边筛选分类
+        if (data.goods_class) {
+            let typeArray = []
+            data.goods_class.forEach(item => {
+                typeArray.push({ id: item.class_id, name: item.class_name, checked: false })
+            });
+            formatedFilterOptions.mainType = typeArray
+        }
+        //侧边筛选商品类型
+        if (data.goods_type) {
+            // console.log('数据',data.goods_type)
+            let goodTypeArray = []
+            Object.keys(data.goods_type).forEach(key => {
+                goodTypeArray.push({ id: data.goods_type[key].goods_type_id, name: data.goods_type[key].goods_type_ch_name, checked: false })
+            });
+            formatedFilterOptions.goodType = goodTypeArray
+        }
+        //侧边筛选其他类型
+        if (data.goodsParam) {
+            let goodsParamArray = []
+
+            Object.keys(data.goodsParam).forEach(key => {
+                const value = data.goodsParam[key]
+                const subArray = value.param_value.map(item => {
+                    return { id: value.param_id, name: item, checked: false }
+                })
+                goodsParamArray.push({ [value.param_name]: subArray })
+            });
+            formatedFilterOptions.otherType = goodsParamArray
+        }
+        //侧边筛选宽度类型
+        if (data.goodsParamExt) {
+            let goodsParamExtArray = []
+            Object.keys(data.goodsParamExt).forEach(key => {
+                const value = data.goodsParamExt[key]
+                const keyId = value.param_id
+                Object.keys(value.param_value).forEach(item => {
+                    const name = value.param_value[item].value_desc
+                    const value1 = value.param_value[item]
+
+                    goodsParamExtArray.push({ name: name, value: value1, checked: false, id: keyId })
+                });
+            });
+            formatedFilterOptions.widthType = goodsParamExtArray
+
+        }
+
+        return formatedFilterOptions
+    }
+
+
+    // api 得到所有的产品请求
+    goodsSearch({
+        curr_page = this.state.curr_page,
+        page_count = this.state.page_count,
+        shop_name = this.state.shop_name,
+        shop_id = this.state.shop_id,
+        config_id = this.state.config_id,
+        shop_class_id = this.state.shop_class_id,
+        order = this.state.order,
+        goods_class_id = this.state.goods_class_id,
+        goodsSpec = this.state.goodsSpec,
+        goodsParam = this.state.goodsParam,
+        goodsParamExt = this.state.goodsParamExt }) {
+        Taro.request({
+            url: URL.GoodsSearch,
+            method: 'POST',
+            dataType: 'json',
+            data: {
+                goods: JSON.stringify({
+                    curr_page: curr_page,
+                    page_count: page_count,
+                    shop_name: shop_name,
+                    shop_id: shop_id,
+                    config_id: config_id,
+                    shop_class_id: shop_class_id,
+                    order: order,
+                    goods_class_id: goods_class_id,
+                }),
+                goodsRegion: JSON.stringify({}),
+                goodsSpec: JSON.stringify(goodsSpec),
+                goodsParam: JSON.stringify(goodsParam),
+                goodsParamExt: JSON.stringify(goodsParamExt),
+            },
+            header: {
+                'content-type': 'application/x-www-form-urlencoded',
+                'X-Requested-With': 'XMLHttpRequest'
+            }
+        })
+            .then(res => {
+                console.log('searchGood', res)
+                Taro.hideLoading()
+                this.setState({ shopItem: res.data.goods, total: res.data.goodsCount, filterCondition: order }, () => {
+
+                })
+
+            })
+    }
+
+    // api 得到店铺详情请求
+    getShopDescription({ shopID = 808 }) {
+        Taro.request({
+            url: URL.ShopDescription,
+            method: 'POST',
+            dataType: 'json',
+            data: {
+                shopID: shopID,
+            },
+            header: {
+                'content-type': 'application/x-www-form-urlencoded',
+            }
+        })
+            .then(res => {
+                Taro.hideLoading()
+
+                this.setState({
+                    shopDescriptionData: res.data,
+                    shopName: res.data.data.shop_name,
+                    shopAddress: res.data.data.shop_address,
+                    contactName: res.data.userRes.name,
+                    contactNumber: res.data.userRes.phone,
+                    shopDescription: res.data.data.shop_desc
+                }, () => {
+                    // console.log(this.state.shopDescriptionData)
+                })
+
+            }
+            )
+    }
+    // api 获取店铺内的店铺分类请求 GetShopCategoryList
+    getShopInnerCate({ id = 808 }) {
+        Taro.request({
+            url: URL.GetShopCategoryList,
+            method: 'POST',
+            dataType: 'json',
+            data: {
+                id: id,
+            },
+            header: {
+                'content-type': 'application/x-www-form-urlencoded',
+                'X-Requested-With': 'XMLHttpRequest'
+            }
+        })
+            .then(res => {
+                if (res.statusCode === 200) {
+                    Taro.hideLoading()
+
+                    const originalData = res.data.data
+                    const sortedData = []
+                    for (let item in originalData) {
+                        let each = originalData[item]
+                        each['id'] = item
+                        sortedData.push(each)
+                    }
+                    // console.log('sorteddata', sortedData)
+                    this.setState({ shopAllInnerCate: sortedData })
+
+                } else {
+                    console.log('获取店铺内部分类失败')
+                }
+
+
+            }
+            )
+    }
+
+
+
+
+    // 产品排序
+    accendingDescending(value) {
+        Taro.showLoading({ title: '加载中' })
+        this.setState({ selectedFilterValue: value })
+        if (value == 0) {
+            this.setState({
+                currentPage: 1,
+                filterOptions: {
+                    all: true,
+                    amount: false,
+                    newProduct: false,
+                    price: false,
+                    popularity: false
+                }
+            }
+            )
+            this.goodsSearch({})
+        }
+        if (value == 1) {
+            this.setState({
+                currentPage: 1,
+                filterOptions: {
+                    all: false,
+                    amount: !this.state.filterOptions.amount,
+                    newProduct: false,
+                    price: false,
+                    popularity: false
+                }
+            }, () => {
+                this.state.filterOptions.amount ? this.goodsSearch({ order: "g.sales_volume desc" }) : this.goodsSearch({ order: "g.sales_volume" })
+            }
+            )
+        }
+        if (value == 2) {
+            this.setState({
+                currentPage: 1,
+                filterOptions: {
+                    all: false,
+                    amount: false,
+                    newProduct: !this.state.filterOptions.newProduct,
+                    price: false,
+                    popularity: false
+                }
+            }, () => {
+                this.state.filterOptions.newProduct ? this.goodsSearch({ order: "g.create_date desc" }) : this.goodsSearch({ order: "g.create_date" })
+            }
+            )
+
+        }
+        if (value == 3) {
+
+            this.setState({
+                currentPage: 1,
+                filterOptions: {
+                    all: false,
+                    amount: false,
+                    newProduct: false,
+                    price: !this.state.filterOptions.price,
+                    popularity: false
+                }
+            }, () => {
+                this.state.filterOptions.price ? this.goodsSearch({ order: "g.goods_price desc" }) : this.goodsSearch({ order: "g.goods_price" })
+            }
+            )
+
+        }
+        if (value == 4) {
+
+            this.setState({
+                currentPage: 1,
+                filterOptions: {
+                    all: false,
+                    amount: false,
+                    newProduct: false,
+                    price: false,
+                    popularity: !this.state.filterOptions.popularity
+                }
+            }, () => {
+                this.state.filterOptions.popularity ? this.goodsSearch({ order: "g.browse_times desc", }) : this.goodsSearch({ order: "g.browse_times" })
+
+            }
+            )
+
+        }
+    }
+    // 是否显示侧边筛选
+    showAndHideFilter() {
+        this.setState({ isShowFilter: !this.state.isShowFilter })
+    }
+    // 选择侧边筛选的标签
+    selectTag(name) {
+        const id = name.name
+        Taro.showLoading({ title: '加载中' })
+        // 处理分类筛选项
+        const newMainType = this.state.mainType.map((item) => {
+            if (item.id === id) {
+                item.checked = !item.checked
+                setTimeout(() => {
+                    this.setState({ goods_class_id: id, checkedFilterIdList: this.state.checkedFilterIdList.concat([item]) }, () => {
+                        this.getSearchParams({ goods_class_id: this.state.goods_class_id })
+                        this.goodsSearch({ goods_class_id: this.state.goods_class_id })
+                    })
+                }, 1000);
+            }
+            return item
+        })
+        // 处理商品类型筛选项
+        const newGoodType = this.state.goodType.map((item) => {
+            if (item.id === id) {
+                item.checked = !item.checked
+
+                setTimeout(() => {
+                    this.setState({ goods_type: id, checkedFilterIdList: this.state.checkedFilterIdList.concat([item]) }, () => {
+                        this.getSearchParams({ goods_type: this.state.goods_type })
+                        this.goodsSearch({ goods_type: this.state.goods_type })
+                    })
+
+                }, 1000);
+            }
+            return item
+        })
+        // 处理其他筛选项
+        const newOtherType = this.state.otherType.map(item => {
+            const value = Object.values(item)[0]
+            for (let each in value) {
+                if (value[each].name === id) {
+                    value[each].checked = !value[each].checked
+
+                    setTimeout(() => {
+
+                        this.setState({ checkedFilterIdList: this.state.checkedFilterIdList.concat(value[each]), goodsParam: [{ param_id: value[each].name.id, param_value: value[each].name }] }, () => {
+                            this.getSearchParams({ goodsParam: this.state.goodsParam })
+                            this.goodsSearch({ goodsParam: this.state.goodsParam })
+                        })
+                    }, 1000);
+                }
+            }
+            return item
+        })
+        // 处理宽度筛选项
+        const newWidthType = this.state.widthType.map((item) => {
+            if (item.name === id) {
+                item.checked = !item.checked
+                setTimeout(() => {
+                    this.setState({ checkedFilterIdList: this.state.checkedFilterIdList.concat(item), goodsParamExt: [{ param_id: item.id, param_ext: [item.value] }] }, () => {
+                        this.getSearchParams({ goodsParamExt: this.state.goodsParamExt })
+                        this.goodsSearch({ goodsParamExt: this.state.goodsParamExt })
+                    })
+                }, 1000);
+            }
+            return item
+        })
+        this.setState({ mainType: newMainType, goodType: newGoodType, widthType: newWidthType, otherType: newOtherType }, () => {
+            // console.log(this.state.mainType)
+        })
+    }
+
+    handleOnPageChange(value) {
+        Taro.showLoading({ title: '加载中' })
+        this.goodsSearch({ curr_page: value.current, order: this.state.filterCondition })
+    }
+    showHomePage() {
+        this.setState({ showShopHomePage: true })
+    }
+    showDescriptionPage() {
+        this.setState({ showShopHomePage: false })
+    }
+    isShowShopAllCate() {
+        this.setState({ isShowShopAllCate: !this.state.isShowShopAllCate, isBlurWindow: true })
+
+    }
+    handleShopInnerCate(id) {
+
+        Taro.showLoading({ title: '加载中' })
+        this.setState({
+            isShowShopAllCate: false, isBlurWindow: false
+        })
+        this.goodsSearch({ shop_class_id: id, shop_id: this.$router.params.id })
+
+    }
+    // 确认筛选
+    submitFilter() {
+        this.setState({ isShowFilter: false })
+    }
+
+    //重置按键筛选
+    resetFilterList() {
+
+        Taro.showLoading({ title: '加载中' })
+        this.setState({
+            checkedFilterIdList: [], curr_page: 1,
+            page_count: 10,
+            shop_name: false,
+            shop_id: 1305,
+            config_id: 4,
+            shop_class_id: '',
+            order: '',
+            currPage: 1,
+            goods_class_id: '',
+            goodsSpec: [],
+            goodsParam: [],
+            goodsParamExt: [],
+        }, () => {
+            this.getSearchParams({})
+            this.goodsSearch({})
+        })
+
+
+    }
+
+    // 关闭背景window
+    closeBgWindow() {
+        this.setState({
+            isShowShopAllCate: false, isBlurWindow: false
+        })
+    }
+
+    componentWillMount() {
+
+    }
+    componentDidMount() {
+
+        Taro.showLoading({ title: '加载中' })
+        console.log('this.$router.params.id', this.$router.params.id)
+        //页面加载之后 得到指定店铺的商品 和 筛选标签
+        this.goodsSearch({ shop_id: this.$router.params.id }) // 加载店铺商品
+        this.getSearchParams({})// 加载筛选项
+        this.getShopDescription({ shopID: this.$router.params.id }) // 加载店铺说明
+        // this.getSearchBarkeyWords()
+        this.getShopInnerCate({ id: this.$router.params.id })
+    }
+
+    componentDidShow() { }
+
+    componentDidHide() { }
+
+     // 底部加载
+  onReachBottom() {
+    Taro.showLoading({
+      title: '加载中'
+    })
+
+    currentPage += 1
+    this.setState({ isAddToList: true }, () => {
+      this.goodsSearch({ curr_Page: currentPage })
+    })
+
+
+  }
+
+    render() {
+
+        const ShopItemElementsArray = this.state.shopItem.length ? this.state.shopItem.map((item, index) => {
+            return <View key={index} className='shop-item' >
+                <ShopItem item={item}></ShopItem>
+            </View>
+        }) : null
+
+        const filterElementsArray = this.state.filterBar.map((item, index) => {
+            let isTure = this.state.filterOptions[item]
+
+            return <View key={index} onClick={this.accendingDescending.bind(this, index)} className={index === this.state.selectedFilterValue ? 'filter-title actived' : 'filter-title'}>
+                <Text className='text'>
+                    {this.state.filterBarKeys[item]}
+                </Text>
+                {index !== 0 && index !== 5 && (isTure ? <AtIcon value='chevron-down' size='10' color='#F00'></AtIcon> : <AtIcon value='chevron-up' size='10' color='#F00'></AtIcon>)}
+            </View>
+        })
+        // 侧边已选项
+        const checkedFilterElementsArray = this.state.checkedFilterIdList.map((item, index) => {
+            return <AtTag style='margin-left:5px' key={index}
+                name={item.id}
+                type='primary'
+                active={item.checked}
+            //onClick={this.selectTag.bind(this)}
+            >{item.name}</AtTag>
+        })
+
+
+
+        // 侧边筛选的分类项
+        const goodsClassElementsArray = this.state.mainType.map((item, index) => {
+            return <AtTag style='margin-left:5px' key={index}
+                name={item.id}
+                type='primary'
+                active={item.checked}
+                onClick={this.selectTag.bind(this)}
+            >{item.name}</AtTag>
+        })
+        // 侧边筛选的商品类型项
+        const goodsTypeElementsArray = this.state.goodType.map((item, index) => {
+            return <AtTag style='margin-left:5px' key={index}
+                name={item.id}
+                type='primary'
+                active={item.checked}
+                onClick={this.selectTag.bind(this)}
+            >{item.name}</AtTag>
+        })
+
+        // 侧边筛选的其他项
+        const goodsParamElementsArray = this.state.otherType.map((item, index) => {
+            let titleKey = Object.keys(item)[0]
+            let values = item[titleKey]
+            return <View key={index}><View className='title' >{titleKey}</View>
+                {values.map((subItem, subIndex) => {
+                    let name = subItem.name
+                    let isCheck = subItem.checked
+                    return <View className='button-box' key={subIndex}>
+                        <AtTag style='margin-left:5px'
+                            name={name}
+                            type='primary'
+                            active={isCheck}
+                            onClick={this.selectTag.bind(this)}
+                        >{name}</AtTag>
+                    </View>
+                })}
+            </View>
+        })
+
+        //  侧边筛选宽度选项
+        const widthnessElementsArray = this.state.widthType.map((item, index) => {
+            return <AtTag style='margin-left:5px' key={index}
+                name={item.name}
+                type='primary'
+                active={item.checked}
+                onClick={this.selectTag.bind(this)}
+            >{item.name}</AtTag>
+        })
+        // 店铺页面/店铺主页
+        const shopHomepageElement = <View className='shop-home-page'>
+            <View className='filter-box'>
+                {filterElementsArray}
+                <View onClick={this.showAndHideFilter.bind(this)} className='filter-title' >
+                    <Text className='text'>
+                        筛选
+                        </Text>
+
+                </View>
+            </View>
+            <View className={this.state.isShowFilter ? 'side-filter show' : 'side-filter'}>
+                <View className='left' onClick={this.showAndHideFilter.bind(this)}></View>
+                {/* 侧边筛选 */}
+                <View className='right'>
+                    <View className='filter-box'>
+                        {this.state.checkedFilterIdList.length ? <View className='title'>已选择</View> : null}
+                        <View className='button-box'>{checkedFilterElementsArray}</View>
+                        {this.state.mainType.length ? <View className='title'>分类</View> : null}
+                        <View className='button-box'>{goodsClassElementsArray}</View>
+                        {this.state.goodType.length ? <View className='title'>商品类型</View> : null}
+                        <View className='button-box'>{goodsTypeElementsArray}</View>
+                        {goodsParamElementsArray}
+                        {this.state.widthType.length ? <View className='title'>宽度</View> : null}
+                        <View className='button-box'>{widthnessElementsArray}</View>
+
+                        <View className='confirm-button'>
+                            <Button className='button' type='primary' size='mini' style='background-color:#FF7142' onClick={this.submitFilter.bind(this)} >确认</Button>
+                            <Button className='button' type='primary' size='mini' style='background-color:#5cb85c' onClick={this.resetFilterList.bind(this)}>重置</Button>
+                            <View className='gap'></View>
+                        </View>
+                    </View>
+                </View>
+
+            </View>
+            {/* 店铺的商品列表 */}
+            <View className='container'>
+                {ShopItemElementsArray}
+            </View>
+            {/* <View className='pagination'>
+
+                <AtPagination
+                    total={Number(this.state.total)}
+                    pageSize={10}
+                    current={this.state.currentPage}
+                    onPageChange={this.handleOnPageChange.bind(this)}
+                >
+                </AtPagination>
+            </View> */}
+        </View>
+        // 店铺详情
+        const shopDescriptionElement = <View className='shop-description'>
+            <View className='img-box'>
+                <Image src={URL.Base + 'Public/images/shop/bg_banner.png'} mode='scaleToFill' style='width: 100%;height:150px;' />
+                <View className='content'>
+                    <View className='shop-name'>
+                        {this.state.shopName}
+                    </View>
+                    <View className='shop-address'>
+                        {this.state.shopAddress}
+                    </View>
+                    <View className='contact'>
+                        <Text className='contact-name'>联系人:{this.state.contactName}</Text>
+                        <Text className='contact-number'>联系电话：{this.state.contactNumber}</Text>
+                    </View>
+                </View>
+            </View>
+            <View className='shop-description2'>
+                <View className='title'>
+                    店铺简介
+                </View>
+                <View className='description'>
+                    <Text className='title-sub'>店铺介绍：</Text>
+                    <Text className='detail'>{this.state.shopDescription}</Text>
+                </View>
+
+            </View>
+            <View className='description-img'>
+                <View className='img-box'> <Image mode='aspectFit' src={URL.Base + 'Public/images/shop/bg_banner.png'} style='max-width: 100%; max-height:100%;' /></View>
+                <View className='img-box'> <Image mode='aspectFit' src={URL.Base + 'Public/images/shop/bg_banner.png'} style='max-width: 100%;max-height:100%;' /></View>
+                <View className='img-box'> <Image mode='aspectFit' src={URL.Base + 'Public/images/shop/bg_banner.png'} style='max-width: 100%;max-height:100%;' /></View>
+            </View>
+        </View>
+
+        const shopAllCateElementArray = this.state.shopAllInnerCate.map((item, index) => {
+            return <View key={index} className='item' onClick={this.handleShopInnerCate.bind(this, item.id)}> <Text>{item.n}</Text> </View>
+        })
+        return (
+            <View className='shop'  >
+
+                <View onClick={this.state.closeBgWindow.bind(this)} className={this.state.isBlurWindow ? 'show-blur' : ''}></View>
+                <View className='banner-box'>
+                    <Image src={URL.Base + 'Public/visual_editing/img/ksh_bg.jpg'} mode='scaleToFill' style='width: 100%;height:120px; ' />
+                    <View className='shop-name'>{this.state.shopName}</View>
+                </View>
+                <View className='nav-box'>
+                    <View className='nav'>
+                        <View className='shop-cate' onClick={this.isShowShopAllCate.bind(this)}>
+                            <Text className='text'>
+                                店铺全部分类
+                            </Text>
+                            <AtIcon value='menu' size='10' color='white'></AtIcon>
+                        </View>
+                        <View className={this.state.isShowShopAllCate ? 'shopcate-selection show' : 'shopcate-selection'}>
+                            {shopAllCateElementArray}</View>
+                        <View className='homepage-link' onClick={this.showHomePage.bind()}>
+                            <Text className='text'>
+                                首页
+                            </Text>
+                        </View>
+                        <View className='shoppage-link' onClick={this.showDescriptionPage.bind()}>
+                            <Text className='text'>
+                                店铺说明
+                            </Text>
+                        </View>
+                    </View>
+                </View>
+                {/* 显示店铺首页或者店铺详情 */}
+                {this.state.showShopHomePage ? shopHomepageElement : shopDescriptionElement}
+                <CopyrightComponent></CopyrightComponent>
+
+                <View className='bottom-nav-box'>
+                    <BottomNav otherData={{ menu: [{ name: '首页' }, { name: '分类' }, { name: '购物车' }, { name: '教程软件' }, { name: '更多' }] }} />
+                </View>
+            </View>
+        )
+    }
+}
+
+export default Shop