|
@@ -61,6 +61,19 @@
|
61
|
61
|
</li>
|
62
|
62
|
<li :hidden="navActive !== 2" class="customer-card">
|
63
|
63
|
<div class="list-box">
|
|
64
|
+ <div class="search-bar flex-h">
|
|
65
|
+ <span>共15位客户</span>
|
|
66
|
+ <van-checkbox v-model="checked">
|
|
67
|
+ 我推荐的客户(8人)
|
|
68
|
+ <img
|
|
69
|
+ slot="icon"
|
|
70
|
+ slot-scope="props"
|
|
71
|
+ :src="props.checked ? icon.active : icon.normal"
|
|
72
|
+ style="width:.25rem;height:.25rem"
|
|
73
|
+ >
|
|
74
|
+ </van-checkbox>
|
|
75
|
+ <i class="iconfont icon-sousuo search-icon" @click="searchMask"></i>
|
|
76
|
+ </div>
|
64
|
77
|
<customerCard v-for="(item,index) in cardList" :key="index" :data='item' @share='share'></customerCard>
|
65
|
78
|
</div>
|
66
|
79
|
</li>
|
|
@@ -76,6 +89,13 @@
|
76
|
89
|
@confirm="selectCase"
|
77
|
90
|
value-key="value"
|
78
|
91
|
/>
|
|
92
|
+ <div v-if="!mask" class="search-mask">
|
|
93
|
+ <div class="mask-top">
|
|
94
|
+ <input type="text">
|
|
95
|
+ <i class="iconfont icon-sousuo search-icon" @click="searchMask"></i>
|
|
96
|
+ </div>
|
|
97
|
+ <div class="mask-bottom"></div>
|
|
98
|
+ </div>
|
79
|
99
|
</div>
|
80
|
100
|
</template>
|
81
|
101
|
|
|
@@ -84,6 +104,8 @@ import caseTableItem from '../../../components/caseTableItem/index'
|
84
|
104
|
import topCaseInfo from '../../../components/topCaseInfo/index'
|
85
|
105
|
import myCard from '../../../components/myCard/myCard'
|
86
|
106
|
import customerCard from '../../../components/customerCard/customerCard'
|
|
107
|
+import active from '../../../common/icon/check-box-checked.png'
|
|
108
|
+import normal from '../../../common/icon/check-box-empty.png'
|
87
|
109
|
import { mapState, createNamespacedHelpers } from 'vuex'
|
88
|
110
|
const { mapActions: actions } = createNamespacedHelpers('app')
|
89
|
111
|
const { mapActions: caseTableActions } = createNamespacedHelpers('placeOrderForCoffee')
|
|
@@ -93,7 +115,13 @@ export default {
|
93
|
115
|
name: '',
|
94
|
116
|
data () {
|
95
|
117
|
return {
|
96
|
|
- navActive: 1,
|
|
118
|
+ icon: {
|
|
119
|
+ active: active,
|
|
120
|
+ normal: normal
|
|
121
|
+ },
|
|
122
|
+ mask: false,
|
|
123
|
+ navActive: 2,
|
|
124
|
+ checked: true,
|
97
|
125
|
cutNavList: [{
|
98
|
126
|
value: '城咖啡',
|
99
|
127
|
id: '1',
|
|
@@ -199,6 +227,9 @@ export default {
|
199
|
227
|
},
|
200
|
228
|
share (item) {
|
201
|
229
|
console.log(item)
|
|
230
|
+ },
|
|
231
|
+ searchMask () {
|
|
232
|
+ this.mask = true
|
202
|
233
|
}
|
203
|
234
|
}
|
204
|
235
|
}
|
|
@@ -206,5 +237,5 @@ export default {
|
206
|
237
|
|
207
|
238
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
208
|
239
|
<style lang="scss" scoped>
|
209
|
|
-@import "page.scss";
|
|
240
|
+@import 'page.scss';
|
210
|
241
|
</style>
|