demo.vue 2.41 KB
<template lang="html">
  <div class="">
    <div class="check-head" style="margin: 0 0 0 10px">
      <check-all :value.sync="isAll" @click.native="selectAll(isAll)">全部商品</check-all>
      <p style="display: inline-block">
        (<span style="color: #8fb5de">{{currSum}}</span>/<span>{{totalSum}}</span>)
      </p>
    </div>
    <demo
      @listChange="listCheckerChange"
      v-for="item in data"
      :id="item.id"
      :name="item.name"
      :key="item.id"
      :list="item.list"
      :isCheckAll="item.isCheck"
      :currItemCount="item.currItemCount"
      :itemTotal="item.itemTotal"
      :listCount="testCount"></demo>
  </div>
</template>

<script>
import Demo from 'components/checkBox/index'
import CheckAll from 'components/isCheckAll/index'
export default {
  components: { Demo, CheckAll },
  data () {
    return {
      testCount: null,
      isAll: false,
      currSum: 0,
      totalSum: null,
      data: [
        {
          isCheck: true,
          id: '123a',
          name: '蔬菜类',
          currItemCount: 0,
          itemTotal: 4,
          list: [
            {
              key: '1',
              value: '什锦冷菜'
            },
            {
              key: '2',
              value: '经典冷盘甜小菜心太软'
            },
            {
              key: '3',
              value: '凉拌黑木耳'
            },
            {
              key: '4',
              value: '私房飘香酱牛肉'
            }
          ]
        },
        {
          isCheck: false,
          id: '852a',
          name: '肉类',
          currItemCount: 0,
          itemTotal: 5,
          list: [
            {
              key: 'b',
              value: '咸水鸭',
              isSelected: true
            },
            {
              key: 'c',
              value: '酱香牛肉'
            },
            {
              key: 'd',
              value: '羊肉'
            },
            {
              key: 'e',
              value: '凉拌猪耳朵'
            },
            {
              key: 'g',
              value: '海蜇头'
            }
          ]
        }
      ]
    }
  },
  mounted () {
    this.totalSum = _.sum(_.map(this.data, 'itemTotal'))
  },
  methods: {
    selectAll (val) {
      console.warn(val);
    },
    listCheckerChange (val) {
      this.testCount = val.length
      // console.warn(this.testCount);
    }
  }
}
</script>

<style lang="css">
</style>