cate-resource-box.vue
2.1 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
<template>
<div class="cate-res" :class="{'fix-ios-top': needFix}">
<div class="top-space" v-if="needFix"></div>
<div class="fixed-top">
<brand-search></brand-search>
<tab :page="page" class="fixed-tab"></tab>
</div>
<resources :content-code="contentCode" class="fixed-resource"></resources>
</div>
</template>
<style>
.cate-res {
.channel-tab {
top: 88px;
}
.resources {
padding-top: 174px;
.recommend-content-five {
margin-top: 0;
}
}
.fixed-top {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
height: 168px;
}
.fixed-tab {
position: fixed;
top: 88px;
z-index: 999;
}
}
.fix-ios-top {
.top-space {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 20px;
background-color: #fff;
z-index: 999;
}
.fixed-top {
padding-top: 20px;
}
.fixed-tab {
margin-top: 20px;
}
.fixed-resource {
margin-top: 20px;
}
}
</style>
<script>
import contentCode from 'content-code';
import qs from 'yoho-qs';
import cookie from 'yoho-cookie';
import yoho from 'yoho';
import tab from 'channel/tab.vue';
import resources from 'component/resources/index.vue';
import brandSearch from 'channel/brand-search.vue';
const detaultChannel = qs.channel || cookie.get('_Channel') || 'men';
export default {
data() {
return {
page: 'cate',
contentCode: contentCode.cate[detaultChannel],
needFix: false
};
},
components: {
tab,
resources,
brandSearch
},
created() {
if (yoho.isiOS) {
this.needFix = true;
}
}
};
</script>