<template>
	<view>
		<view class="main">
			<view class="mainLine">
				<view class="goodsItem" v-for="(v,i) in list" v-if='v.showr' @click="goGoods(v)">
					<view>
						<image :src="v.picUrl" mode="" class="goodsImg" v-if="v.picUrl"></image>
						<image src="../../static/img/noimg.png" mode="" class="goodsImg" v-else></image>
					</view>
					<view class="goodsItemRight">
						<view class="goodsItemName">{{v.goodsName}}</view>
						<view class="goodsItemBottom">
							<view class="goodssalePrice">
								<span>￥{{v.salePrice}}</span>
								<span class="goodsNum">x{{v.qty}}</span>
							</view>
							<view class="replaceBtn" @click.stop="replace(v)">更换</view>
						</view>
					</view>
				</view>
				<nodata v-if="list.length==0&&isload"></nodata>
			</view>
		</view>
	</view>
</template>

<script>
import nodata from '@/components/nodata/nodata.vue'	
export default {
	components: {
	     
		  nodata
	},
	data() {
		return {
			title: 'Hello',
			packageGoodsID:'',
			shopId:'',
			list:'',
			isload:false,
		}
	},
	onLoad(opt) {
       /* this.packageGoodsID=opt.packageGoodsID; */
		this.shopId=uni.getStorageSync("shopData").shopId;
		this.list=uni.getStorageSync("replaceDataList")
		//this.getData()
	},
	methods: {
		getData(){
			uni.showLoading({ });
			this.$http('miniApp/packageMiniAppController/queryPackageReplaceGoods', {
			  packageGoodsID:this.packageGoodsID,
			  shopID:this.shopId
			 },'GET').then(res => {
				  uni.hideLoading();
				  this.isload=true;
				  this.list=res.data;	
			})
		},
		replace(v){
			console.log(v)
			/* if(v.listImg.length>0){
				v.picUrl=v.listImg[0].url
			} */
			
			uni.setStorage({
				key: 'replaceData',
				data: v,
				success: function () {
					uni.navigateBack({
						delta:1
					})
				}
			}); 
		},
		goGoods(item){
			uni.setStorage({
				key: 'goodsreplaceData',
				data: item,
				success: function () {
					/* uni.navigateBack({
						delta:1
					}) */
					uni.navigateTo({
						url:'../goods/goodsDetail?goodsId='+item.mGoodsID+'&type=1'+'&typeIndex=2&maintain=2'
					})
				}
			}); 
			
		},
        login(){
			uni.navigateTo({
				url:'../login/login'
			})
		}
	}
}
</script>

<style scoped>
	.main{
		padding: 24rpx;
	}
	.mainLine{
		
	}
	.goodsItem{
		display: flex;
		padding: 15rpx 0;
		border-bottom:  1px solid #EEEEEE;
	}
	.goodsItem:last-child{
	 border: none;
	}
	.goodsItemRight{
		width: 520rpx;
		padding-left: 20rpx;
		display: flex;
		flex-direction:column;
		justify-content: space-between;
	}
	.goodsItemBottom{
		display: flex;
		justify-content: space-between;
	}
	.goodsItemName{
		font-size: 26rpx;
		color: #3C3C3C;
	}
	.goodssalePrice{
		font-size: 32rpx;font-weight: 500;color: #FF4F00;
	}
	.goodsNum{
		font-size: 24rpx;font-weight: 400;color: #999999;
		padding-left: 50rpx;
	}
	.goodsImg{
		width: 120rpx;height: 120rpx;
	}
	.replaceBtn{
		color: #FF4F00;
		font-size:24rpx;}
</style>
