<template>
<view class="module-box" :style="'margin-bottom: ' + meta.margin_bottom + 'px'" v-if="suitData && suitData.length">
    <view class="module-title" data-src="/pages/store/mealList/mealList" @tap="_jumpImg">
        <span>推荐套餐</span>
        <span>
            更多
            <text class="iconfont icon-gengduo"></text>
        </span>
    </view>
    <view v-for="(items, idx) in suitData" :key="idx">
        <view class="module-content">
            <view class="meal_list">
                <view class="store_list" v-for="(item, index) in items.associate.items" :key="index" >
					
                    <view @tap="jumpToDetail" :data-id="item.goods.id">
                        <image class="slide-image" :src="item.goods.img"></image>
                        <view class="description">{{item.goods.name}}</view>
                    </view>
                </view>
            </view>
        </view>
        <view class="meal-price" :data-suitid="items.associate_id" @tap="_jumpMeal">
            搭配套餐价=<text>￥{{items.associate.total}}</text>/<text>￥{{items.associate.origin_total}}</text>
        </view>

    </view>
</view>
</template>
<script>

export default {
  data() {
    return {};
  },

   options: {
    addGlobalClass: true
  },
   
	props: {
	  suitData: {
		type: Array,
		value: ''
	  },
	  show: {
		type: Number,
		value: ''
	  },
	  meta: {
		type: Object,
		value: ""
	  },
   },
    //组件的方法
    methods: {
      _jumpImg(e) {
        var src = e.currentTarget.dataset.src;
        if (!src || src == 'uto_miniprogram') return;
        wx.navigateTo({
          url: src
        });
      },

      _jumpMeal(e) {
		console.log(this.suitData);
        var id = e.currentTarget.dataset.suitid;
        wx.navigateTo({
          url: `/pages/store/meal/meal?id=${id}`
        });
      }
    },
};
</script>

<style rel="stylesheet/less" lang="less">
@import "index-suit";
</style>