feat(second): 移除log reviewed by tao.huang
Showing
4 changed files
with
27 additions
and
17 deletions
@@ -52,18 +52,17 @@ | @@ -52,18 +52,17 @@ | ||
52 | </div> | 52 | </div> |
53 | <span class="iconfont iconright"></span> | 53 | <span class="iconfont iconright"></span> |
54 | </div> | 54 | </div> |
55 | - <div class="fixed-footer"> | ||
56 | - <cube-button class="buy active" @click="buy">购买 <span class="price">¥{{info.price}}</span></cube-button> | ||
57 | - </div> | ||
58 | </LayoutScroll> | 55 | </LayoutScroll> |
56 | + <div class="fixed-footer"> | ||
57 | + <cube-button class="buy active" @click="buy">购买 <span class="price">¥{{info.price}}</span></cube-button> | ||
58 | + </div> | ||
59 | </LayoutApp> | 59 | </LayoutApp> |
60 | </template> | 60 | </template> |
61 | 61 | ||
62 | <script> | 62 | <script> |
63 | import { Button, Slide } from 'cube-ui'; | 63 | import { Button, Slide } from 'cube-ui'; |
64 | -import { mapState } from 'vuex' | 64 | +import { mapState, mapActions } from 'vuex' |
65 | import ImgSize from '@/components/img-size'; | 65 | import ImgSize from '@/components/img-size'; |
66 | - | ||
67 | // const info = { | 66 | // const info = { |
68 | // "brandName": "NIKE", | 67 | // "brandName": "NIKE", |
69 | // "colorName": "黑色", | 68 | // "colorName": "黑色", |
@@ -115,6 +114,10 @@ export default { | @@ -115,6 +114,10 @@ export default { | ||
115 | // console.log('mounted', this.info); | 114 | // console.log('mounted', this.info); |
116 | }, | 115 | }, |
117 | activated() { | 116 | activated() { |
117 | + if (this.$refs.pageScroll) { | ||
118 | + this.$refs.pageScroll.scrollTop = 0; | ||
119 | + } | ||
120 | + this.fetchDetailById({ skup: this.skup }) | ||
118 | this.refresh(); | 121 | this.refresh(); |
119 | }, | 122 | }, |
120 | deactivated() {}, | 123 | deactivated() {}, |
@@ -123,6 +126,8 @@ export default { | @@ -123,6 +126,8 @@ export default { | ||
123 | // beforeRouteLeave(to, from, next) {}, | 126 | // beforeRouteLeave(to, from, next) {}, |
124 | destroyed() {}, | 127 | destroyed() {}, |
125 | methods: { | 128 | methods: { |
129 | + ...mapActions('second',['fetchDetailById']), | ||
130 | + | ||
126 | refresh() { | 131 | refresh() { |
127 | this.$refs.slide && this.$refs.slide.refresh && this.$refs.slide.refresh(); | 132 | this.$refs.slide && this.$refs.slide.refresh && this.$refs.slide.refresh(); |
128 | }, | 133 | }, |
@@ -155,7 +160,9 @@ export default { | @@ -155,7 +160,9 @@ export default { | ||
155 | /* 定义局部样式,添加外围容器,scss嵌套尽量不要超过三层,会影响查找器性能 */ | 160 | /* 定义局部样式,添加外围容器,scss嵌套尽量不要超过三层,会影响查找器性能 */ |
156 | <style rel='stylesheet/scss' lang='scss' scoped> | 161 | <style rel='stylesheet/scss' lang='scss' scoped> |
157 | @import '@/pages/product/product-detail.scss'; | 162 | @import '@/pages/product/product-detail.scss'; |
158 | -/* .second-detail-wrap {} */ | 163 | +.second-detail-wrap { |
164 | + padding-bottom: 120px; | ||
165 | +} | ||
159 | 166 | ||
160 | .ellipsis { | 167 | .ellipsis { |
161 | white-space: nowrap; | 168 | white-space: nowrap; |
@@ -277,9 +284,10 @@ export default { | @@ -277,9 +284,10 @@ export default { | ||
277 | 284 | ||
278 | // fixed-footer | 285 | // fixed-footer |
279 | .fixed-footer { | 286 | .fixed-footer { |
280 | - position: sticky; | 287 | + position: fixed; |
281 | bottom: 0; | 288 | bottom: 0; |
282 | display: flex; | 289 | display: flex; |
290 | + width: 100%; | ||
283 | height: 120px; | 291 | height: 120px; |
284 | padding: 16px 30px; | 292 | padding: 16px 30px; |
285 | box-shadow: 0 0 4px rgba(0, 0, 0, 0.08); | 293 | box-shadow: 0 0 4px rgba(0, 0, 0, 0.08); |
@@ -39,11 +39,13 @@ | @@ -39,11 +39,13 @@ | ||
39 | <LayoutScroll | 39 | <LayoutScroll |
40 | ref="scrolllist" | 40 | ref="scrolllist" |
41 | @pulling-up="fetchList(isMore)" | 41 | @pulling-up="fetchList(isMore)" |
42 | - v-if="productsList.length" | ||
43 | - class="list-scroll-bg" | 42 | + :loading="{noMore: !isMore}" |
43 | + v-if="productList.length" | ||
44 | + class="product-list" | ||
44 | > | 45 | > |
45 | - <SecondList :list="productsList"></SecondList> | 46 | + <SecondList :list="productList"></SecondList> |
46 | </LayoutScroll> | 47 | </LayoutScroll> |
48 | + <!-- <EmptyList class="empty-wrapper product-list" :tip="`暂无数据`" v-show="productList.isEmpty" /> --> | ||
47 | </LayoutApp> | 49 | </LayoutApp> |
48 | <FilterList | 50 | <FilterList |
49 | :visible.sync="filterModalVisible" | 51 | :visible.sync="filterModalVisible" |
@@ -58,6 +60,7 @@ | @@ -58,6 +60,7 @@ | ||
58 | import { mapState, mapActions, createNamespacedHelpers } from "vuex"; | 60 | import { mapState, mapActions, createNamespacedHelpers } from "vuex"; |
59 | import SecondList from "./components/second-list"; | 61 | import SecondList from "./components/second-list"; |
60 | import FilterList from './components/filter-list'; | 62 | import FilterList from './components/filter-list'; |
63 | +import EmptyList from '@/components/ufo-no-item'; | ||
61 | 64 | ||
62 | export default { | 65 | export default { |
63 | name: 'UfoSecondSellListPage', | 66 | name: 'UfoSecondSellListPage', |
@@ -153,7 +156,7 @@ export default { | @@ -153,7 +156,7 @@ export default { | ||
153 | } | 156 | } |
154 | }, | 157 | }, |
155 | computed: { | 158 | computed: { |
156 | - ...mapState('second', ["productsList", "isMore"]), | 159 | + ...mapState('second', ["productList", "isMore"]), |
157 | 160 | ||
158 | // 因为接口未返回pageTitle产品名称,从已有商品详情页state获取 | 161 | // 因为接口未返回pageTitle产品名称,从已有商品详情页state获取 |
159 | ...mapState('product', ["selectedProductInfo"]), | 162 | ...mapState('product', ["selectedProductInfo"]), |
@@ -165,6 +168,7 @@ export default { | @@ -165,6 +168,7 @@ export default { | ||
165 | components: { | 168 | components: { |
166 | SecondList, | 169 | SecondList, |
167 | FilterList, | 170 | FilterList, |
171 | + EmptyList | ||
168 | } | 172 | } |
169 | }; | 173 | }; |
170 | </script> | 174 | </script> |
@@ -182,8 +186,7 @@ export default { | @@ -182,8 +186,7 @@ export default { | ||
182 | padding-right: 38px; | 186 | padding-right: 38px; |
183 | z-index: 999; | 187 | z-index: 999; |
184 | background: #fff; | 188 | background: #fff; |
185 | - position: sticky; | ||
186 | - top: 0; | 189 | + position: absolute; |
187 | } | 190 | } |
188 | .filter-tab { | 191 | .filter-tab { |
189 | display: flex; | 192 | display: flex; |
@@ -23,7 +23,7 @@ export function defaultState () { | @@ -23,7 +23,7 @@ export function defaultState () { | ||
23 | 23 | ||
24 | // 筛选列表 | 24 | // 筛选列表 |
25 | filterData: [], | 25 | filterData: [], |
26 | - productsList: [], | 26 | + productList: [], |
27 | page: 1, | 27 | page: 1, |
28 | pageTotal: 0, | 28 | pageTotal: 0, |
29 | isMore: false, | 29 | isMore: false, |
@@ -44,15 +44,14 @@ export default { | @@ -44,15 +44,14 @@ export default { | ||
44 | })); | 44 | })); |
45 | 45 | ||
46 | if (isReset) { | 46 | if (isReset) { |
47 | - state.productsList = product_list; | 47 | + state.productList = product_list; |
48 | } else { | 48 | } else { |
49 | - state.productsList = state.productsList.push(...product_list); | 49 | + state.productList = state.productList.push(...product_list); |
50 | } | 50 | } |
51 | } | 51 | } |
52 | }, | 52 | }, |
53 | 53 | ||
54 | [Types.UPDATE_PRODUCT_FILTER](state, { filter }) { | 54 | [Types.UPDATE_PRODUCT_FILTER](state, { filter }) { |
55 | - console.log(filter); | ||
56 | state.filterData = filter; | 55 | state.filterData = filter; |
57 | } | 56 | } |
58 | }; | 57 | }; |
-
Please register or login to post a comment