<template>
  <div>
    <list ref="list" @selection="selection" @qtyChange="qtyChange">
      <template v-slot:del="scope">
        <on-del :data="scope.data" @onSuccess="onSuccess"></on-del>
      </template>
    </list>
    <total ref="total" :data="selectedProduct" @onSuccess="onSuccess"></total>
  </div>
</template>

<script>
import list from './modules/list'
import onDel from './modules/del'
import total from './modules/total'
export default {
  components:{
    list,
    onDel,
    total
  },
  data () {
    return {
      selectedProduct:[]
    }
  },
  methods:{
    onSuccess () {
      this.$refs['list'].listData()
    },
    selection (val) {
      this.selectedProduct = val
      this.$refs['total'].totalPrice(val)
    },
    qtyChange () {
      this.$refs['total'].totalPrice(this.selectedProduct)
    }
  }
}

</script>
<style>
</style>