w-front-end / select_good · Commits

Commit 689fc107392959bafcfcdab8b05e912d129c91f7

Authored by 王强
1 parent 015f004b

优选库——优选首页接口对接完成~

Inline Side-by-side
Showing 3 changed files with 77 additions and 213 deletions
src/components/columnListBox/columnListBox.vue
  View file @689fc10
1 <template> 1 <template>
2 - <div class="column-list-box" v-if="lists && lists.list && lists.list.length"> 2 + <div class="column-list-box" v-if="lists && ((lists.list && lists.list.length) || (lists.length))">
3 <slot name="title-box"></slot> 3 <slot name="title-box"></slot>
4 <div class="box"> 4 <div class="box">
5 5
@@ -7,7 +7,7 @@ @@ -7,7 +7,7 @@
7 <div class="left-box"> 7 <div class="left-box">
8 8
9 <!-- 数组内奇数，index是偶数 --> 9 <!-- 数组内奇数，index是偶数 -->
10 - <div class="item-box" v-if="!(index % 2)" v-for="(item, index) in lists.list" :key="index"> 10 + <div class="item-box" v-if="!(index % 2)" v-for="(item, index) in lists.list || lists" :key="index">
11 11
12 <!-- 商品组件 --> 12 <!-- 商品组件 -->
13 <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary" 13 <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary"
@@ -20,7 +20,7 @@ @@ -20,7 +20,7 @@
20 <div class="right-box"> 20 <div class="right-box">
21 21
22 <!-- 数组内偶数，index是奇数 --> 22 <!-- 数组内偶数，index是奇数 -->
23 - <div class="item-box" v-if="index % 2" v-for="(item, index) in lists.list" :key="index"> 23 + <div class="item-box" v-if="index % 2" v-for="(item, index) in lists.list || lists" :key="index">
24 24
25 <!-- 商品组件 --> 25 <!-- 商品组件 -->
26 <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary" 26 <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary"
src/components/swiper3dCom/swiper3dCom.vue
  View file @689fc10
@@ -10,7 +10,7 @@ @@ -10,7 +10,7 @@
10 <div class="carousel-3d-box"> 10 <div class="carousel-3d-box">
11 <carousel-3d :autoplay="setOptions.autoplay" :autoplayTimeout="setOptions.autoplayTimeout" :autoplayHoverPause="setOptions.autoplayHoverPause" :display="setOptions.display" :width="getWidth()" :height="getHeight()" :inverseScaling="1000" :onMainSlideClick="onMainSlideClick"> 11 <carousel-3d :autoplay="setOptions.autoplay" :autoplayTimeout="setOptions.autoplayTimeout" :autoplayHoverPause="setOptions.autoplayHoverPause" :display="setOptions.display" :width="getWidth()" :height="getHeight()" :inverseScaling="1000" :onMainSlideClick="onMainSlideClick">
12 <slide :index="index" v-for="(item, index) in items" :key="index"> 12 <slide :index="index" v-for="(item, index) in items" :key="index">
13 - <img :src="item.img" class="img" /> 13 + <img :src="item.simg" class="img" />
14 </slide> 14 </slide>
15 </carousel-3d> 15 </carousel-3d>
16 </div> 16 </div>
src/pages/optimization2/optimization2.vue
  View file @689fc10
@@ -38,7 +38,7 @@ @@ -38,7 +38,7 @@
38 <div class="list-box"> 38 <div class="list-box">
39 39
40 <!-- 商品展示样式 2 --> 40 <!-- 商品展示样式 2 -->
41 - <goods-item-2 class="item" v-for="(item, index) in goodsLists" :key="index" @jump="toDiscountList(item)" 41 + <goods-item-2 class="item" v-for="(item, index) in discountLists" :key="index" @jump="toDiscountList(item)"
42 :item="item" 42 :item="item"
43 pid="4"> 43 pid="4">
44 44
@@ -60,9 +60,9 @@ @@ -60,9 +60,9 @@
60 </div> 60 </div>
61 61
62 <!-- 品质优选 --> 62 <!-- 品质优选 -->
63 - <div class="shop-list-box" ref="optimizationBox" v-if="shopLists && shopLists.length"> 63 + <div class="shop-list-box" ref="optimizationBox" v-if="quality && quality.length">
64 64
65 - <div class="section shop-list" v-for="(items, index) in shopLists" :key="index" @click="toOptimizationList(items)"> 65 + <div class="section shop-list" v-for="(items, index) in quality" :key="index" @click="toOptimizationList(items)">
66 66
67 <!-- 头图 --> 67 <!-- 头图 -->
68 <div class="header-img-box"> 68 <div class="header-img-box">
@@ -86,8 +86,8 @@ @@ -86,8 +86,8 @@
86 86
87 <!-- 3D轮播 --> 87 <!-- 3D轮播 -->
88 <swiper-3d-com @onMainSlideClick="toHotSaleList" 88 <swiper-3d-com @onMainSlideClick="toHotSaleList"
89 - :items="swiper3dItems"  
90 - :options="swiper3dOptions"> 89 + :items="sales"
  90 + :options="salesOptions">
91 </swiper-3d-com> 91 </swiper-3d-com>
92 </div> 92 </div>
93 93
@@ -105,7 +105,7 @@ @@ -105,7 +105,7 @@
105 <div class="list-box"> 105 <div class="list-box">
106 106
107 <!-- 商品展示样式 2 --> 107 <!-- 商品展示样式 2 -->
108 - <goods-item-2 class="item" v-for="(item, index) in goodsLists" :key="index" @jump="pointsMore" 108 + <goods-item-2 class="item" v-for="(item, index) in pointsLists" :key="index" @jump="pointsMore"
109 :item="item" 109 :item="item"
110 pid="5"> 110 pid="5">
111 </goods-item-2> 111 </goods-item-2>
@@ -131,8 +131,8 @@ @@ -131,8 +131,8 @@
131 </text-title-box> 131 </text-title-box>
132 132
133 <!-- 商品样式 7 列表 --> 133 <!-- 商品样式 7 列表 -->
134 - <column-list-box class="column-list-box" v-if="likeLists && likeLists.list && likeLists.list.length" @jump="toDetail" @primary="primary"  
135 - :lists="likeLists" 134 + <column-list-box class="column-list-box" v-if="likeLists && likeLists.list && likeLists.list.length && likeLists.list[likeNum] && likeLists.list[likeNum].length" @jump="toDetail" @primary="primary"
  135 + :lists="likeLists.list[likeNum]"
136 com="7"> 136 com="7">
137 </column-list-box> 137 </column-list-box>
138 </div> 138 </div>
@@ -168,12 +168,14 @@ @@ -168,12 +168,14 @@
168 title: "", // 标题 168 title: "", // 标题
169 backs: null, // 后退按钮组 169 backs: null, // 后退按钮组
170 navs: null, // 导航 170 navs: null, // 导航
171 - goodsLists: null, // 折扣专区数据  
172 - shopLists: null, // 品质优选  
173 - swiper3dItems: null, // 3D轮播数据数组  
174 - swiper3dOptions: null, // 3D轮播配置选项 171 + discountLists: null, // 折扣专区数据
  172 + quality: null, // 品质优选
  173 + salesOptions: null, // 热销排行选项
  174 + sales: null, // 热销排行数据
175 points: null, // 用户积分 175 points: null, // 用户积分
176 - likeLists: null // 猜你喜欢列表 176 + pointsLists: null, // 积分商城数据
  177 + likeLists: null, // 猜你喜欢列表
  178 + likeNum: 0 // 猜你喜欢二维数组当前显示的下标
177 } 179 }
178 }, 180 },
179 components: { 181 components: {
@@ -199,7 +201,7 @@ @@ -199,7 +201,7 @@
199 201
200 // 添加后退按钮组“后退”和“分享”按钮 202 // 添加后退按钮组“后退”和“分享”按钮
201 this.$set(this, 'backs', { 203 this.$set(this, 'backs', {
202 - title: '优选', 204 + title: this.title,
203 funcs: { 205 funcs: {
204 back: { 206 back: {
205 icon: "static/img/icon_back.png" 207 icon: "static/img/icon_back.png"
@@ -214,16 +216,14 @@ @@ -214,16 +216,14 @@
214 }); 216 });
215 } 217 }
216 218
217 -  
218 -  
219 // 优选页面接口 219 // 优选页面接口
220 - // this.fansShopMessageList(); 220 + this.index();
221 221
222 222
223 223
224 224
225 - // 临时，初始化店铺列表数据  
226 - this.$set(this, 'goodsLists', [ 225 + // 临时，初始化折扣专区数据
  226 + this.$set(this, 'discountLists', [
227 { 227 {
228 ads: "广告语", 228 ads: "广告语",
229 id: "9519164", 229 id: "9519164",
@@ -280,151 +280,25 @@ @@ -280,151 +280,25 @@
280 } 280 }
281 ]); 281 ]);
282 282
283 -  
284 -  
285 - // 临时，初始化店铺列表数据  
286 - this.$set(this, 'shopLists', [  
287 - {  
288 - header_img: 'static/img/box_banner.jpg',  
289 - list: [  
290 - {  
291 - ads: "广告语",  
292 - id: "9519164",  
293 - price: "5.01",  
294 - prices: "6.00",  
295 - shop_type: "1",  
296 - simg: "http://wjjseller.cnlive.com/uploads/05ac5ee31c3bb363d95072559d205bd8.png",  
297 - title: "L'OCCITANE/欧舒丹 芍药花香润手霜 30ML 30ml"  
298 - },  
299 - {  
300 - ads: "广告语",  
301 - id: "9519164",  
302 - price: "5.01",  
303 - prices: "6.00",  
304 - shop_type: "1",  
305 - simg: "http://wjjseller.cnlive.com/uploads/05ac5ee31c3bb363d95072559d205bd8.png",  
306 - title: "L'OCCITANE/欧舒丹 芍药花香润手霜 30ML 30ml"  
307 - },  
308 - {  
309 - ads: "广告语",  
310 - id: "9519164",  
311 - price: "5.01",  
312 - prices: "6.00",  
313 - shop_type: "1",  
314 - simg: "http://wjjseller.cnlive.com/uploads/05ac5ee31c3bb363d95072559d205bd8.png",  
315 - title: "L'OCCITANE/欧舒丹 芍药花香润手霜 30ML 30ml"  
316 - }  
317 - ]  
318 - }  
319 - ]);  
320 -  
321 -  
322 -  
323 - // 临时，3D轮播参数设置  
324 - this.$set(this, 'swiper3dItems', [  
325 - {  
326 - img: 'static/img/hot_img_01.png'  
327 - },  
328 - {  
329 - img: 'static/img/hot_img_01.png'  
330 - },  
331 - {  
332 - img: 'static/img/hot_img_01.png'  
333 - }  
334 - ]);  
335 - this.$set(this, 'swiper3dOptions', { 283 + // 热销排行背景图
  284 + this.$set(this, 'salesOptions', {
336 bg: 'static/img/hot_img_bg.png' 285 bg: 'static/img/hot_img_bg.png'
337 }); 286 });
338 287
339 -  
340 -  
341 - // 临时，用户积分数据设置 288 + // 用户积分数据设置
342 this.$set(this, 'points', { 289 this.$set(this, 'points', {
343 key: '我的积分', 290 key: '我的积分',
344 - value: '9850', 291 + value: '0',
345 moreText: '查看更多', 292 moreText: '查看更多',
346 icon: 'static/img/icon_more_arrow_right.png' 293 icon: 'static/img/icon_more_arrow_right.png'
347 }); 294 });
348 -  
349 -  
350 -  
351 - // 临时，猜你喜欢产品列表  
352 - this.$set(this, 'likeLists', {  
353 - list: [  
354 - {  
355 - activity: "0",  
356 - activity_desc: "",  
357 - addtime: "1604544867",  
358 - ads: "23123",  
359 - code: "160454486791776561000",  
360 - id: "9525539",  
361 - price: "0.01",  
362 - prices: "0.00",  
363 - shop_type: "1",  
364 - simg: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2020/11/05/5fa3695e39ae6.png",  
365 - stock: "10",  
366 - stoptime: "0",  
367 - title: "aabbsdf350ml"  
368 - },  
369 - {  
370 - activity: "0",  
371 - activity_desc: "",  
372 - addtime: "1604544867",  
373 - ads: "23123",  
374 - code: "160454486791776561000",  
375 - id: "9525539",  
376 - price: "0.01",  
377 - prices: "0.00",  
378 - shop_type: "1",  
379 - simg: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2020/11/05/5fa3695e39ae6.png",  
380 - stock: "0",  
381 - stoptime: "0",  
382 - title: "aabbsdf350ml"  
383 - },  
384 - {  
385 - activity: "0",  
386 - activity_desc: "",  
387 - addtime: "1604544867",  
388 - ads: "23123",  
389 - code: "160454486791776561000",  
390 - id: "9525539",  
391 - price: "0.01",  
392 - prices: "0.00",  
393 - shop_type: "1",  
394 - simg: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2020/11/05/5fa3695e39ae6.png",  
395 - stock: "10",  
396 - stoptime: "0",  
397 - title: "aabbsdf350ml"  
398 - },  
399 - {  
400 - activity: "0",  
401 - activity_desc: "",  
402 - addtime: "1604544867",  
403 - ads: "23123",  
404 - code: "160454486791776561000",  
405 - id: "9525539",  
406 - price: "0.01",  
407 - prices: "0.00",  
408 - shop_type: "1",  
409 - simg: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2020/11/05/5fa3695e39ae6.png",  
410 - stock: "10",  
411 - stoptime: "0",  
412 - title: "aabbsdf350ml"  
413 - }  
414 - ]  
415 - });  
416 -  
417 -  
418 -  
419 -  
420 -  
421 }, 295 },
422 methods: { 296 methods: {
423 297
424 /** 298 /**
425 * 优选页面接口 299 * 优选页面接口
426 */ 300 */
427 - fansShopMessageList() { 301 + index() {
428 302
429 // 校验登录 303 // 校验登录
430 if (this.$parent.checkLogin()) { 304 if (this.$parent.checkLogin()) {
@@ -432,10 +306,10 @@ @@ -432,10 +306,10 @@
432 // 加载中提示 306 // 加载中提示
433 Indicator.open("加载中..."); 307 Indicator.open("加载中...");
434 308
435 - // 获取证书请求接口  
436 - this.http("/Api/" + this.getApiVersion().dynamic + "/fansShopMessageList", {  
437 - uid: this.getStore("uid")  
438 - }, this.fansShopMessageListCallback, { 309 + // 请求接口
  310 + this.http("/Api/" + this.getApiVersion().good + "/index", {
  311 + uid: this.getStore("uid") || 0
  312 + }, this.indexCallback, {
439 method: "POST" 313 method: "POST"
440 }); 314 });
441 } 315 }
@@ -446,7 +320,7 @@ @@ -446,7 +320,7 @@
446 * @param {Object} res [服务器返回数据] 320 * @param {Object} res [服务器返回数据]
447 * @param {Object} ext [扩展参数] 321 * @param {Object} ext [扩展参数]
448 */ 322 */
449 - fansShopMessageListCallback(res, ext) { 323 + indexCallback(res, ext) {
450 324
451 // 加载完成 325 // 加载完成
452 Indicator.close(); 326 Indicator.close();
@@ -459,73 +333,54 @@ @@ -459,73 +333,54 @@
459 333
460 /* 获取优选库“优选”数据 开始 */ 334 /* 获取优选库“优选”数据 开始 */
461 335
462 -  
463 -  
464 - /* 获取优选库“优选”数据 结束 */  
465 -  
466 - } else if (res.code == 400) { 336 + // 判断品质优选是否有数据
  337 + if (datas.quality && datas.quality.length) {
467 338
468 - // 获取优选失败  
469 - Toast(res.message);  
470 - } else {  
471 -  
472 - // 获取优选失败  
473 - Toast("获取优选失败");  
474 - }  
475 - }, 339 + // 设置品质优选数据
  340 + this.$set(this, 'quality', [
  341 + {
  342 + header_img: 'static/img/box_banner.jpg',
  343 + list: datas.quality
  344 + }
  345 + ]);
  346 + }
476 347
477 - /**  
478 - * 商品列表  
479 - * @param {Int} groupId [平台分类id]  
480 - * @param {Int} page [页码]  
481 - * @param {String} CALL_STATUS [何处触发请求]  
482 - */  
483 - shopGoodsList(groupId, page) { 348 + // 判断是否有热销商品
  349 + if (datas.sale && datas.sale.length) {
484 350
485 - // 校验必填参数  
486 - if (groupId && page) { 351 + // 热销排行数据
  352 + this.$set(this, 'sales', datas.sale);
  353 + }
487 354
488 - // 加载中  
489 - this.$set(this.paging, "loading", true); 355 + // 设置用户积分
  356 + this.$set(this.points, 'value', datas.grade);
490 357
491 - // 获取证书请求接口  
492 - this.http("/Api/" + this.getApiVersion().index + "/shopNewGoodsList", {  
493 - groupid: groupId,  
494 - page: page  
495 - }, this.shopGoodsListCallback, {  
496 - method: "POST"  
497 - }  
498 - );  
499 - }  
500 - }, 358 + // 判断是否有积分商城
  359 + if (datas.integral_goods && datas.integral_goods.length) {
501 360
502 - /**  
503 - * 商品列表回调  
504 - * @param {Object} res [服务器返回数据]  
505 - * @param {Object} ext [扩展参数]  
506 - */  
507 - shopGoodsListCallback(res, ext) {  
508 -  
509 - // 返回处理  
510 - if (res.code == 200) {  
511 -  
512 - // 解构数据  
513 - let { data: datas } = res; 361 + // 热销排行数据
  362 + this.$set(this, 'pointsLists', datas.integral_goods);
  363 + }
514 364
515 - /* 获取商品列表数据 开始 */ 365 + // 判断是否有猜你喜欢
  366 + if (datas.recommend_goods && datas.recommend_goods.length) {
516 367
517 - 368 + // 猜你喜欢产品列表
  369 + this.$set(this, 'likeLists', {
  370 + list: datas.recommend_goods
  371 + });
  372 + }
518 373
519 - /* 获取商品列表数据 结束 */ 374 + /* 获取优选库“优选”数据 结束 */
520 375
521 } else if (res.code == 400) { 376 } else if (res.code == 400) {
522 377
523 - // 获取最新上架列表失败 378 + // 获取优选失败
524 Toast(res.message); 379 Toast(res.message);
525 } else { 380 } else {
526 381
527 - // 获取最新上架列表失败  
528 - Toast("获取最新上架列表失败"); 382 + // 获取优选失败
  383 + Toast("获取数据失败");
529 } 384 }
530 }, 385 },
531 386
@@ -627,7 +482,9 @@ @@ -627,7 +482,9 @@
627 // 设置跳转参数 482 // 设置跳转参数
628 let params = { 483 let params = {
629 url: 'pointsMall', 484 url: 'pointsMall',
630 - query: {} 485 + query: {
  486 + uid: this.getStore('uid') || 0
  487 + }
631 }; 488 };
632 489
633 // 页面跳转 490 // 页面跳转
@@ -641,8 +498,15 @@ @@ -641,8 +498,15 @@
641 */ 498 */
642 changeGoods(item) { 499 changeGoods(item) {
643 500
644 - console.log('changeGoods', item); 501 + // 设置数组下标
  502 + this.$set(this, 'likeNum', ++this.likeNum);
645 503
  504 + // 判断如果超出数组下标，设置为0，循环数组
  505 + if (this.likeNum >= this.likeLists.list.length) {
  506 +
  507 + // 初始化数组下标
  508 + this.$set(this, 'likeNum', 0);
  509 + }
646 }, 510 },
647 511
648 /** 512 /**