Showing
7 changed files
with
56 additions
and
12 deletions
@@ -19,13 +19,14 @@ | @@ -19,13 +19,14 @@ | ||
19 | <div class="right-content"> | 19 | <div class="right-content"> |
20 | <Scroll> | 20 | <Scroll> |
21 | <div v-for="(itemSub, index) in categorySubList" :key="index"> | 21 | <div v-for="(itemSub, index) in categorySubList" :key="index"> |
22 | - <p class="sub-title">————{{itemSub.name}}————</p> | 22 | + <p class="sub-title">——— {{itemSub.name}} ———</p> |
23 | <div class="category-sub-root"> | 23 | <div class="category-sub-root"> |
24 | - <div class="item-imge-div" | 24 | + <div class="item-div" |
25 | v-for="(item, index) in itemSub.sub" | 25 | v-for="(item, index) in itemSub.sub" |
26 | :key="index" | 26 | :key="index" |
27 | :data-id="item.id" | 27 | :data-id="item.id" |
28 | > | 28 | > |
29 | + <div class="item-imge-div" @click="goProductList(item)"> | ||
29 | <ImgSize | 30 | <ImgSize |
30 | class="item-imge" | 31 | class="item-imge" |
31 | :src="item.image" | 32 | :src="item.image" |
@@ -33,6 +34,11 @@ | @@ -33,6 +34,11 @@ | ||
33 | :height="60" | 34 | :height="60" |
34 | /> | 35 | /> |
35 | </div> | 36 | </div> |
37 | + <!-- <div v-if="item.isShow" class="item-a-div"> --> | ||
38 | + <a v-if="item.isShow" class="item-a-div" :href="item.link"></a> | ||
39 | + <!-- </div> --> | ||
40 | + | ||
41 | + </div> | ||
36 | </div> | 42 | </div> |
37 | </div> | 43 | </div> |
38 | </Scroll> | 44 | </Scroll> |
@@ -75,6 +81,16 @@ export default { | @@ -75,6 +81,16 @@ export default { | ||
75 | } | 81 | } |
76 | } | 82 | } |
77 | }, | 83 | }, |
84 | + goProductList(item) { | ||
85 | + let key = item.linkType; | ||
86 | + let value = item.id; | ||
87 | + this.$router.push({ | ||
88 | + name: "List", | ||
89 | + params: { | ||
90 | + key : value | ||
91 | + }, | ||
92 | + }); | ||
93 | + } | ||
78 | }, | 94 | }, |
79 | computed: { | 95 | computed: { |
80 | ...mapState(['categoryParent','categorySubList']), | 96 | ...mapState(['categoryParent','categorySubList']), |
@@ -128,20 +144,30 @@ export default { | @@ -128,20 +144,30 @@ export default { | ||
128 | align-content: flex-start; | 144 | align-content: flex-start; |
129 | } | 145 | } |
130 | .sub-title{ | 146 | .sub-title{ |
131 | - /* background-color: brown; */ | ||
132 | font-size: 24px; | 147 | font-size: 24px; |
133 | color: #000; | 148 | color: #000; |
134 | text-align: center; | 149 | text-align: center; |
135 | } | 150 | } |
136 | - .item-imge-div { | 151 | + .item-div { |
152 | + position: relative; | ||
137 | display: flex; | 153 | display: flex; |
138 | flex: 0 0 33%; | 154 | flex: 0 0 33%; |
139 | height: 150px; | 155 | height: 150px; |
140 | align-items: center; | 156 | align-items: center; |
141 | justify-content: center; | 157 | justify-content: center; |
142 | } | 158 | } |
159 | + .item-imge-div { | ||
160 | + position:absolute; | ||
161 | + z-index: 1; | ||
162 | + } | ||
143 | .item-imge { | 163 | .item-imge { |
144 | object-fit: contain; | 164 | object-fit: contain; |
145 | } | 165 | } |
166 | + .item-a-div{ | ||
167 | + position:absolute; | ||
168 | + width: 100%; | ||
169 | + height: 100%; | ||
170 | + z-index: 99; | ||
171 | + } | ||
146 | 172 | ||
147 | </style> | 173 | </style> |
@@ -2,7 +2,7 @@ | @@ -2,7 +2,7 @@ | ||
2 | <LayoutApp :show-back="true"> | 2 | <LayoutApp :show-back="true"> |
3 | <Scroll :scrollEvents="['scroll']" :options="scrollOptions" @scroll="scroll" | 3 | <Scroll :scrollEvents="['scroll']" :options="scrollOptions" @scroll="scroll" |
4 | @pulling-up="onPullingUp"> | 4 | @pulling-up="onPullingUp"> |
5 | - <ProductList :list="favoriteProductList"></ProductList> | 5 | + <ProductList :list="favoriteProductList.list"></ProductList> |
6 | </Scroll> | 6 | </Scroll> |
7 | </LayoutApp> | 7 | </LayoutApp> |
8 | </template> | 8 | </template> |
@@ -49,12 +49,9 @@ export default { | @@ -49,12 +49,9 @@ export default { | ||
49 | } | 49 | } |
50 | } | 50 | } |
51 | }, | 51 | }, |
52 | + | ||
52 | computed: { | 53 | computed: { |
53 | ...mapState(['favoriteProductList']), | 54 | ...mapState(['favoriteProductList']), |
54 | - // getFa(){ | ||
55 | - // let length = this.favoriteProductList.product_list.lenght; | ||
56 | - // console.log("length:"+length) | ||
57 | - // }, | ||
58 | }, | 55 | }, |
59 | }; | 56 | }; |
60 | </script> | 57 | </script> |
1 | <template> | 1 | <template> |
2 | - <div class="notice-root"> | 2 | + <div class="notice-root" > |
3 | <p class="notice-content">【税率调整】您的商品AIR JORDAN 4 RESET PUSH NONEKJG 2017已经被用户下单,请及时发货</p> | 3 | <p class="notice-content">【税率调整】您的商品AIR JORDAN 4 RESET PUSH NONEKJG 2017已经被用户下单,请及时发货</p> |
4 | <div class="time"> | 4 | <div class="time"> |
5 | <time> 2018.08.08 17:20</time> | 5 | <time> 2018.08.08 17:20</time> |
1 | <template> | 1 | <template> |
2 | <div class="notice-root"> | 2 | <div class="notice-root"> |
3 | + <a :href="data.url"> | ||
3 | <p class="notice-content">{{data.name}}</p> | 4 | <p class="notice-content">{{data.name}}</p> |
4 | <div class="time"> | 5 | <div class="time"> |
5 | <time> {{data.createTime}}</time> | 6 | <time> {{data.createTime}}</time> |
6 | </div> | 7 | </div> |
7 | <div class="item-split-line"/> | 8 | <div class="item-split-line"/> |
9 | + </a> | ||
8 | </div> | 10 | </div> |
9 | </template> | 11 | </template> |
10 | 12 |
@@ -29,6 +29,21 @@ export default function() { | @@ -29,6 +29,21 @@ export default function() { | ||
29 | 29 | ||
30 | addCategorySubList(state, {data}) { | 30 | addCategorySubList(state, {data}) { |
31 | if(data && data.category){ | 31 | if(data && data.category){ |
32 | + let subList = []; | ||
33 | + data.category.forEach(val => { | ||
34 | + if(val && val.sub){ | ||
35 | + val.sub.forEach(item => { | ||
36 | + if(item.linkType === 'h5'){ | ||
37 | + item.isShow = true; | ||
38 | + }else { | ||
39 | + item.isShow = false; | ||
40 | + } | ||
41 | + }) | ||
42 | + } | ||
43 | + | ||
44 | + // console.log(val) | ||
45 | + // subList.push(val); | ||
46 | + }); | ||
32 | state.categorySubList = data.category; | 47 | state.categorySubList = data.category; |
33 | } | 48 | } |
34 | }, | 49 | }, |
@@ -45,6 +60,7 @@ export default function() { | @@ -45,6 +60,7 @@ export default function() { | ||
45 | type: 1,//表示 品牌 | 60 | type: 1,//表示 品牌 |
46 | linkType: '', | 61 | linkType: '', |
47 | link: '', | 62 | link: '', |
63 | + isShow: false, | ||
48 | } | 64 | } |
49 | sub.push(subItem); | 65 | sub.push(subItem); |
50 | }); | 66 | }); |
@@ -10,11 +10,15 @@ export default function() { | @@ -10,11 +10,15 @@ export default function() { | ||
10 | page: 1, | 10 | page: 1, |
11 | pageTotal: 0, | 11 | pageTotal: 0, |
12 | recId: '', | 12 | recId: '', |
13 | - favoriteProductList: [], | 13 | + favoriteProductList: { |
14 | + list:[] | ||
15 | + }, | ||
14 | }, | 16 | }, |
15 | mutations: { | 17 | mutations: { |
16 | addList(state, { data }) { | 18 | addList(state, { data }) { |
19 | + console.log(data) | ||
17 | if(data && data.product_list){ | 20 | if(data && data.product_list){ |
21 | + // data.product_list. | ||
18 | let list = state.favoriteProductList.list.concat(data.product_list); | 22 | let list = state.favoriteProductList.list.concat(data.product_list); |
19 | Vue.set(state.favoriteProductList, "list", list); | 23 | Vue.set(state.favoriteProductList, "list", list); |
20 | } | 24 | } |
-
Please register or login to post a comment