hlm_pl_mall_h5/pages/home/goodsdetail/child/InfoBuy.vue

<!-- Buy.vue -->
<template>
	<view class="div main-content" v-if="detailInfo">
	<flex-line :is-link="true" :show-border="true" @click.native="changeCartState()">
		<view class="div"
			:class="{'isopacity':!activeBuy}"
		>
			<view class="p" v-if="number <= 0 && chooseinfo.ids.length <= 0">
				请选择购买{{ chooseinfo.specification.join(',') }}数量分类
			</view>
			<view class="p" v-if="number <= 0 && chooseinfo.ids.length > 0">
				已选{{ chooseinfo.specification.join(',') }},数量{{ number + 1 }}
			</view>
			<view class="p" v-if="number > 0 && chooseinfo.ids.length <= 0">
				已选数量{{ number }}
			</view>
			<view class="p" v-if="number > 0 && chooseinfo.ids.length > 0">
				已选{{ chooseinfo.specification.join(',') }},数量{{ number }}
			</view>
		</view>

	</flex-line>
	</view>
</template>

<script>
import { mapState, mapMutations } from 'vuex'
import flexLine from '../../../flexLine'
export default {
  data () {
    return {}
  },
components:{flexLine},
  computed: {
    ...mapState({
      number: state => state.goodsdetail.number,
      detailInfo: state => state.goodsdetail.detailInfo,
      chooseinfo: state => state.goodsdetail.chooseinfo
    }),
	activeBuy: function () {
	  if (this.detailInfo.goods_storage > 0) {
	    return true
	  } else {
	    return false
	  }
	},
  },

  created () {},

  watch: {
    detailInfo: function (value) {
      this.setSpecification()
    }
  },

  methods: {
    ...mapMutations({
      saveCartState: 'saveCartState',
      saveChooseInfo: 'saveChooseInfo',
      changeType: 'changeType'
    }),


    changeCartState () {
      this.saveCartState(true)
      this.changeType('加入购物车')
    },

    setSpecification () {
      if (this.detailInfo && this.detailInfo.properties) {
        let data = this.detailInfo.properties
        let arrays = []
        for (let i = 0; i <= data.length - 1; i++) {
          arrays.push(data[i].name)
        }
        this.saveChooseInfo({ specification: arrays, ids: [] })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
	.main-content{padding:0 $pageSpace;background-color: #fff;}
.isopacity {
			opacity: 0.5;
		}
</style>