查看商品

pages/groupbuying_details/index.vue

@@ -267,10 +267,18 @@
 			</view>
 		</uni-popup>
 
-<!--			<popup :show="addGoodPopupShow" @close="addGoodPopupShow = false">-->
-<!--				<detail :goodsInfo="goods"></detail>-->
 
-<!--			</popup>-->
+		<view v-if="lookGoods" class="lookGoods flex-col" @click="toGoods(storeInfo.goodsList[0].id)">
+			<view class="lookGoodsImageView">
+				<image class="lookGoodsImage" :src="storeInfo.goodsList[0].goodsCover" mode="scaleToFill" />
+			</view>
+			<view class="lookGoodsTextView ">
+				<text class="lookGoodsText">查看商品</text>
+			</view>
+			<view class="lookGoodsNumberView">
+				<text class="lookGoodsNumber">{{storeInfo.goodsList.length}}</text>
+			</view>
+		</view>
 
 	</view>
 </template>
@@ -363,6 +371,8 @@ export default {
 	data () {
 		let that = this;
 		return {
+			lookGoods:true,
+			firstGoodsTop:0,
 			timeData:{},
 			scrollLeft: 0,
 			scrollLeftOld: 0,
@@ -651,6 +661,12 @@ export default {
 	},
 	methods: {
 
+		getFirstGoodsTop(id){
+			uni.createSelectorQuery().select("#goods"+id).boundingClientRect(data =>{
+				this.firstGoodsTop = Math.round(data.top);
+			}).exec();
+		},
+
 		toGoods(id){
 			console.log(id)
 			uni.createSelectorQuery().select("#goods"+id).boundingClientRect(data =>{
@@ -801,6 +817,12 @@ export default {
 			);
 		},
 		scroll (e) {
+			if (e.detail.scrollTop >= this.firstGoodsTop){
+				this.lookGoods=false
+			}
+			if (e.detail.scrollTop <= this.firstGoodsTop){
+				this.lookGoods=true
+			}
 			var that = this,
 				scrollY = e.detail.scrollTop;
 			var opacity = scrollY / 200;
@@ -961,8 +983,9 @@ export default {
       let that = this;
       console.log(that.id)
       detailGroupon({grouponId: that.id}).then((res) => {
-        that.storeInfo = res.data
+          that.storeInfo = res.data
 		  this.isShowBottom = this.getIsShowBottom(res.data.grouponEndTime)
+		  this.getFirstGoodsTop(res.data.goodsList[0].id);
 		  if (this.isShowBottom ){
 			  this.bottomHeight = '150rpx'
 			  console.log(this.bottomHeight,this.isShowBottom)
@@ -2686,7 +2709,48 @@ action-sheet-item {
 		margin: 0 10rpx;
 		vertical-align: super;
 	}
-
+	.lookGoods{
+		background-color: white;
+		width: 200rpx;
+		height: 250rpx;
+		border-radius: 4rpx;
+		overflow: hidden;
+		padding: 4rpx 4rpx;
+		position:fixed;
+		bottom:60px;
+		right:5px;
+		z-index: 99;
+		border: 1px solid #999999;
+	}
+	.lookGoodsImageView{
+		width: 192rpx;
+		height: 192rpx;
+		border-radius: 4rpx;
+		overflow: hidden;
+	}
+	.lookGoodsImage{
+		width: 196rpx;
+		height: 196rpx;
+	}
+	.lookGoodsTextView{
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+		margin-top: 4rpx;
+	}
+	.lookGoodsNumberView{
+		border-radius: 5rpx;
+		height: 40rpx;
+		width: 60rpx;
+		text-align: center;
+		background-color: #999999;
+		color: white;
+		font-size: 30rpx;
+		line-height: 40rpx;
+		position:absolute;
+		top: 0rpx;
+		right: 0rpx;
+	}
 	.page{
 		height: auto !important;
 		padding: 1rpx;