<!-- recommend.vue -->
<template>
	<view class="div ui-recommend-wrapper" v-if="commendList.length > 0">

		<view class="div title">为你推荐</view>
		<view class="div list-wrap">
			<view class="div goods-list double-column"
				 :index="index"
				 v-for="(item, index) in commendList"
				 v-bind:key="index">
				<index-prod-item
						:item="item"
						class="goods-item"
				></index-prod-item>
			</view>
		</view>
	</view>
</template>

<script>
import { urlencode } from '@/util/common'
import { mapState, mapMutations } from 'vuex'
import IndexProdItem from '../IndexProdItem'
export default {
  data () {
    return {
      list: [],
      indicatorArray: [],
      currentIndex: 0
    }
  },
components:{IndexProdItem},
  created () {
  },

  computed: {
    ...mapState({
      commendList: state => state.pointsgoods.commendList,
      currentProductId: state => state.pointsgoods.currentProductId
    }),

    getItemStyle: function () {
      const res = uni.getSystemInfoSync()
      var width = res.windowWidth
      var height = res.windowHeight
      let itemWidth = (width - 30 - 16) / 3
      let itemHeight = itemWidth
      return "width:"+itemWidth +"px;height:"+itemHeight +"px"
    }
  },

  methods: {

    goDetail (id) {
      let data = Object.assign({}, { id: id })
      uni.navigateTo({ url: '/pages/home/pointsgoods/Detail'+'?'+urlencode( { pgoods_id: id } )})
    }
  }
}
</script>

<style lang="scss" scoped>
	.ui-recommend-wrapper {
		background: #ffffff;
		margin-top:$pageSpace;
		margin-bottom:$pageSpace;
		.title{text-align: center;position:relative;font-size:$mainFontSize;color:#000;font-weight:700;padding-top:.5rem;padding-bottom:1rem;}
	}
	.goods-list.double-column {width:50%;}
	.goods-list.double-column .goods-item{margin-right:$pageSpace;margin-bottom: 10px;box-shadow: 0 2px 4px #ececec;}
	.list-wrap {width: 100%;padding-left:$pageSpace;box-sizing: border-box;display: flex;flex-wrap: wrap;}
</style>
