demo.vue
2.41 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<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>