| | |
| | | <input type="text" value="flushDom" v-if="false" /> |
| | | <top-bar selectedTitleIndex="shop" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar> |
| | | <view class="search"> |
| | | <u-search class="nav-search" @blur='searchGoods' v-model="searchInfo" placeholder="搜索商品" |
| | | <u-search class="nav-search" @change='searchGoods' v-model="searchInfo" placeholder="搜索商品" |
| | | :show-action="false"></u-search> |
| | | </view> |
| | | <view style="display: flex;padding: 32rpx;box-sizing: border-box;height: 100%;"> |
| | |
| | | </scroll-view> |
| | | |
| | | </view> |
| | | <view class="goodsInfos"> |
| | | <scroll-view :scroll-y="true" :show-scrollbar="false"> |
| | | <view class="goodsInfos" style="position: relative;"> |
| | | <scroll-view :scroll-y="true" :show-scrollbar="false" style="height: 100%;" @scrolltolower="loadMoreData()"> |
| | | |
| | | <view class="goodsItem" v-for="item in goodsList" :key="item.id" |
| | | @click.prevent="goToGoodsInfo(item.id)" |
| | | style="display: flex;align-items: flex-start;justify-content: flex-start;margin: 10rpx 0;"> |
| | | <view class="pic"> |
| | | style="display: flex;align-items: flex-start;justify-content: flex-start;margin: 10rpx 0; |
| | | box-sizing: border-box; "> |
| | | <view class="pic" style="position: relative;"> |
| | | <image :src="item.thumbnail" mode="aspectFill" |
| | | style="height: 150rpx;width: 150rpx;border-radius: 24rpx;"> |
| | | </image> |
| | | <text style="background-color: #f92e20;color: #fff; |
| | | font-weight: bold;border-radius: 12rpx;padding: 5rpx; |
| | | margin-right: 15rpx;position: absolute;top: 0;left: 0;" v-if="item.salesModel==='PRESALE'">预售</text> |
| | | </view> |
| | | <view class="goodsContent" style="display: flex;align-items: flex-start;justify-content: space-between; |
| | | margin-left: 10rpx;flex-direction: column;width: 100%;"> |
| | | <view class="goodsName"> |
| | | <text style="background-color: #f92e20;color: #fff; |
| | | font-weight: bold;border-radius: 12rpx;padding: 5rpx; |
| | | margin-right: 15rpx;">预售</text> |
| | | <text>{{item.goodsName}}</text> |
| | | </view> |
| | | |
| | | <view |
| | | style="display: flex; justify-content: space-between;align-items:center; 100%;margin-top: 32rpx;width: 100%;"> |
| | | <view class="goodsPrice">¥{{item.price}}</view> |
| | |
| | | @click.stop="miousCardNum($event,item.id)"> |
| | | <uni-icons type="minus" size="30" color="#96a6bc"></uni-icons> |
| | | </view> |
| | | <input v-show="item.cardNum&&item.cardNum>0" :maxlength="2" type="number" |
| | | <input v-show="item.cardNum&&item.cardNum>0" @click.stop="" :maxlength="2" type="number" |
| | | confirm-type="numeric" style="width: 50rpx;text-align: center;" |
| | | v-model="item.cardNum" :disabled="true" /> |
| | | <view style="padding: 20rpx 20rpx 20rpx 0;" |
| | |
| | | </view> |
| | | </view> |
| | | </scroll-view> |
| | | </view> |
| | | <view @click="gotoCardList()" style="position: absolute;bottom: 120rpx; right: 32rpx;"> |
| | | <div class="settlement" >去购物车结算</div> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | canGoToCarList:false, |
| | | nums:10, |
| | | searchInfo: '', |
| | | //商品列表 |
| | | goodsList: [], |
| | |
| | | pageSize: 12, |
| | | pageNumber: 1, |
| | | categoryId: null, |
| | | canFilter: true |
| | | canFilter: true, |
| | | needFilterPre:true |
| | | }, |
| | | } |
| | | }, |
| | | methods: { |
| | | gotoCardList(){ |
| | | uni.navigateTo({ |
| | | url:'/pages/cusbar/cart/cartList' |
| | | }) |
| | | }, |
| | | addCardNum(e, id) { |
| | | this.goodsList.forEach(item => { |
| | | if (item.id === id) { |
| | |
| | | this.getGoodsParam.keyword = keyWard |
| | | this.getGoodsParam.pageNumber = 1 |
| | | this.getGoodsParam.categoryId = '' |
| | | this.goodsList = []; |
| | | await this.getgoodsData(); |
| | | }, |
| | | confirm() {}, |
| | |
| | | }, |
| | | goToGoodsInfo(id) { |
| | | const item = this.goodsList.find(item => id === item.id); |
| | | console.log(item) |
| | | uni.navigateTo({ |
| | | url: `/pages/product/goods?id=${item.id}&goodsId=${item.goodsId}` |
| | | }); |
| | | }, |
| | | //触底获取数据 |
| | | async loadMoreData() { |
| | | console.log("触底加载------------》",this.maxPages) |
| | | if (this.getGoodsParam.pageNumber < this.maxPages) { |
| | | this.getGoodsParam.pageNumber++; |
| | | await this.getgoodsData() |
| | |
| | | const cardInfos = await getCarts(); |
| | | // 处理购物车信息 |
| | | let cardMap = new Map(); |
| | | this.canGoToCarList = cardInfos.data.result.cartList.length>0 |
| | | cardInfos.data.result.cartList.forEach(item => { |
| | | |
| | | item.skuList.forEach(sku => { |
| | |
| | | item.cardNum = cardItem.num; |
| | | } |
| | | }) |
| | | this.goodsList = goodsList.data.result.records; |
| | | this.goodsList = [...this.goodsList,...goodsList.data.result.records]; |
| | | this.maxPages = goodsList.data.result.pages |
| | | console.log('this.goodsList----------------------->',JSON.stringify(goodsList.data.result)) |
| | | |
| | | }, |
| | | async chooseCategory(id) { |
| | |
| | | overflow: hidden; |
| | | |
| | | } |
| | | |
| | | .settlement { |
| | | width: 180rpx; |
| | | height: 70rpx; |
| | | line-height: 70rpx; |
| | | background: linear-gradient(91deg, $light-color 1%, $aider-light-color 99%); |
| | | border-radius: 900rpx; |
| | | text-align: center; |
| | | color: #fff; |
| | | margin-right: 10rpx; |
| | | } |
| | | |
| | | .navigatorMenue { |
| | | margin-left: -32rpx; |