w-front-end / select_good · Commits

Commit 77790617c4d9b77d76694f20322287f4833d371b

Authored by 王强
1 parent 8da13bdd

购好物，运营需求修改中~

Inline Side-by-side
Showing 28 changed files with 1538 additions and 544 deletions
src/components/backSearchBox/backSearchBox.less 0 → 100644
  View file @7779061
  1 +@charset "UTF-8";
  2 +
  3 +.back-search-box {
  4 + background-color: transparent;
  5 + width: 100%;
  6 + height: 93px;
  7 + .box {
  8 + position: relative;
  9 + display: flex;
  10 + justify-content: space-between;
  11 + align-items: center;
  12 + width: auto;
  13 + height: 100%;
  14 + padding: 0 30px;
  15 + .buttons-box {
  16 + display: flex;
  17 + justify-content: space-between;
  18 + align-items: center;
  19 + // width: 100%;
  20 + height: 100%;
  21 + .back {
  22 + display: block;
  23 + width: 38px;
  24 + height: 38px;
  25 + }
  26 + }
  27 + .search-container {
  28 + background-color: #F6F6F6;
  29 + border-radius: 28.5px;
  30 + width: 642px;
  31 + height: 58px;
  32 + .search-box {
  33 + display: flex;
  34 + justify-content: flex-start;
  35 + align-items: center;
  36 + margin: 0 auto;
  37 + width: 602px;
  38 + height: 100%;
  39 + .icon-box {
  40 + width: 32px;
  41 + height: 32px;
  42 + .icon-search {
  43 + display: block;
  44 + width: 32px;
  45 + height: 32px;
  46 + }
  47 + }
  48 + .line {
  49 + background-color: #999999;
  50 + margin: 0 20px;
  51 + width: 1px;
  52 + height: 22px;
  53 + }
  54 + .text {
  55 + color: #B4B4B4;
  56 + font-size: 26px;
  57 + font-weight: 400;
  58 + }
  59 + }
  60 + }
  61 + }
  62 +}
src/components/backSearchBox/backSearchBox.vue 0 → 100644
  View file @7779061
  1 +<template>
  2 + <div class="back-search-box" v-if="backs">
  3 + <div class="box">
  4 + <div class="buttons-box" v-if="backs && backs.funcs && backs.funcs.back && backs.funcs.back.icon">
  5 + <img :src="backs.funcs.back.icon" class="back" @click="back" />
  6 + </div>
  7 + <div class="search-container" @click="toSearch">
  8 + <div class="search-box">
  9 + <div class="icon-box">
  10 + <img src="static/img/icon_search.png" class="icon-search" />
  11 + </div>
  12 + <div class="line"></div>
  13 + <div class="text" v-if="backs.funcs.search && backs.funcs.search.text">{{backs.funcs.search.text}}</div>
  14 + </div>
  15 + </div>
  16 + </div>
  17 + </div>
  18 +</template>
  19 +
  20 +<script>
  21 + export default {
  22 + name: 'backSearchBox',
  23 + data: function () {
  24 + return {
  25 +
  26 + }
  27 + },
  28 + props: ["backs"],
  29 + methods: {
  30 +
  31 + /**
  32 + * 返回
  33 + */
  34 + back() {
  35 + this.$emit('back');
  36 + },
  37 +
  38 + /**
  39 + * 搜索框跳转
  40 + */
  41 + toSearch() {
  42 + this.$emit('toSearch');
  43 + }
  44 + }
  45 + }
  46 +</script>
  47 +
  48 +<!-- Add "scoped" attribute to limit CSS to this component only -->
  49 +<style rel="stylesheet/less" lang="less">
  50 + @import './backSearchBox';
  51 +</style>
0 \ No newline at end of file 52 \ No newline at end of file
src/components/countDownCom/countDownCom.less
  View file @7779061
@@ -20,6 +20,9 @@ @@ -20,6 +20,9 @@
20 color: #333333; 20 color: #333333;
21 font-size: 20px; 21 font-size: 20px;
22 border-radius: 4px; 22 border-radius: 4px;
  23 + &.big-block {
  24 + width: 60px;
  25 + }
23 &.transparent { 26 &.transparent {
24 background-color: transparent; 27 background-color: transparent;
25 } 28 }
@@ -38,6 +41,9 @@ @@ -38,6 +41,9 @@
38 height: 36px; 41 height: 36px;
39 color: #FFFFFF; 42 color: #FFFFFF;
40 font-size: 25px; 43 font-size: 25px;
  44 + &.big-block {
  45 + width: 60px;
  46 + }
41 &.transparent { 47 &.transparent {
42 background-color: transparent; 48 background-color: transparent;
43 color: #333333; 49 color: #333333;
@@ -58,6 +64,9 @@ @@ -58,6 +64,9 @@
58 color: #FFFFFF; 64 color: #FFFFFF;
59 font-size: 20px; 65 font-size: 20px;
60 font-weight: 400; 66 font-weight: 400;
  67 + &.big-block {
  68 + width: 60px;
  69 + }
61 } 70 }
62 .colon { 71 .colon {
63 color: rgba(189, 164, 127, 1); 72 color: rgba(189, 164, 127, 1);
@@ -75,6 +84,9 @@ @@ -75,6 +84,9 @@
75 color: #FCF7F1; 84 color: #FCF7F1;
76 font-size: 20px; 85 font-size: 20px;
77 font-weight: 400; 86 font-weight: 400;
  87 + &.big-block {
  88 + width: 60px;
  89 + }
78 } 90 }
79 .colon { 91 .colon {
80 color: #3C3C3C; 92 color: #3C3C3C;
@@ -92,6 +104,9 @@ @@ -92,6 +104,9 @@
92 color: #FFFFFF; 104 color: #FFFFFF;
93 font-size: 20px; 105 font-size: 20px;
94 font-weight: 400; 106 font-weight: 400;
  107 + &.big-block {
  108 + width: 60px;
  109 + }
95 } 110 }
96 .colon { 111 .colon {
97 color: #633531; 112 color: #633531;
src/components/countDownCom/countDownCom.vue
  View file @7779061
@@ -2,12 +2,13 @@ @@ -2,12 +2,13 @@
2 <div class="count-down-com" v-if="time"> 2 <div class="count-down-com" v-if="time">
3 <van-count-down class="count-down" :class="'style-' + sty" :time="time" @finish="finish"> 3 <van-count-down class="count-down" :class="'style-' + sty" :time="time" @finish="finish">
4 <template v-slot="timeData"> 4 <template v-slot="timeData">
5 - <div class="container" v-if="timeData.days > 0"> 5 + <div class="container" v-if="timeData.days > 0 && type != 'h'">
6 <span class="block transparent">{{ timeData.days }}</span> 6 <span class="block transparent">{{ timeData.days }}</span>
7 <span class="colon">天</span> 7 <span class="colon">天</span>
8 </div> 8 </div>
9 <div class="container"> 9 <div class="container">
10 - <span class="block">{{ timeData.hours }}</span> 10 + <span class="block" :class="{'big-block': ((timeData.days * 24) + timeData.hours) >= 100}" v-if="type == 'h'">{{ (timeData.days * 24) + timeData.hours }}</span>
  11 + <span class="block" v-else>{{ timeData.hours }}</span>
11 <span class="colon" v-if="sty == '2' || sty == '5'">时</span> 12 <span class="colon" v-if="sty == '2' || sty == '5'">时</span>
12 <span class="colon" v-else>:</span> 13 <span class="colon" v-else>:</span>
13 <span class="block">{{ timeData.minutes }}</span> 14 <span class="block">{{ timeData.minutes }}</span>
@@ -36,7 +37,7 @@ @@ -36,7 +37,7 @@
36 37
37 } 38 }
38 }, 39 },
39 - props: ["time", "sty"], 40 + props: ["time", "sty", 'type'],
40 methods: { 41 methods: {
41 42
42 /** 43 /**
src/components/darenListBox/darenListBox.vue
  View file @7779061
@@ -8,7 +8,7 @@ @@ -8,7 +8,7 @@
8 8
9 <!-- 循环输出达人动态列表 --> 9 <!-- 循环输出达人动态列表 -->
10 <div class="item-box" :class="{borderBottom:lists.length>1}" v-for="(item, index) in lists" :key="index"> 10 <div class="item-box" :class="{borderBottom:lists.length>1}" v-for="(item, index) in lists" :key="index">
11 - <daren-list-com @userJump="userJump" @jump="jump" @goodsJump="goodsJump" @goodsPrimary="goodsPrimary" 11 + <daren-list-com @userJump="userJump" @jump="jump" @goodsJump="goodsJump" @goodsPrimary="goodsPrimary" @fansShop="fansShop" @toDarenShop="toDarenShop"
12 :item="item"> 12 :item="item">
13 </daren-list-com> 13 </daren-list-com>
14 </div> 14 </div>
@@ -64,7 +64,21 @@ @@ -64,7 +64,21 @@
64 */ 64 */
65 goodsPrimary(item) { 65 goodsPrimary(item) {
66 this.$emit("goodsPrimary", item); 66 this.$emit("goodsPrimary", item);
67 - } 67 + },
  68 +
  69 + /**
  70 + * 关注达人
  71 + */
  72 + fansShop(item) {
  73 + this.$emit('fansShop', item);
  74 + },
  75 +
  76 + /**
  77 + * 跳转达人店铺页面
  78 + */
  79 + toDarenShop(item) {
  80 + this.$emit('toDarenShop', item);
  81 + }
68 } 82 }
69 } 83 }
70 </script> 84 </script>
src/components/darenListCom/darenListCom.less
  View file @7779061
@@ -12,9 +12,33 @@ @@ -12,9 +12,33 @@
12 12
13 } 13 }
14 .top-right { 14 .top-right {
15 - color: #666666;  
16 - font-size: 26px;  
17 - font-weight: 400; 15 + display: flex;
  16 + justify-content: flex-end;
  17 + align-items: center;
  18 + .day, .date {
  19 + color: #666666;
  20 + font-size: 26px;
  21 + font-weight: 400;
  22 + & + .daren-shop-btn, & + .fans-btn {
  23 + margin-left: 30px;
  24 + }
  25 + }
  26 + .daren-shop-btn {
  27 + padding: 6px 34px;
  28 + color: #FC1541;
  29 + font-size: 26px;
  30 + font-weight: 400;
  31 + border: 1px solid #FC1541;
  32 + border-radius: 26px;
  33 + }
  34 + .fans-btn {
  35 + padding: 6px 34px;
  36 + color: #FC1541;
  37 + font-size: 26px;
  38 + font-weight: 400;
  39 + border: 1px solid #FC1541;
  40 + border-radius: 26px;
  41 + }
18 } 42 }
19 } 43 }
20 .intro-box { 44 .intro-box {
src/components/darenListCom/darenListCom.vue
  View file @7779061
@@ -16,6 +16,12 @@ @@ -16,6 +16,12 @@
16 {{getDatetime(item.addtime, item.time).day}} 16 {{getDatetime(item.addtime, item.time).day}}
17 </div> 17 </div>
18 <div class="date">{{getDatetime(item.addtime, item.time).date}}</div> 18 <div class="date">{{getDatetime(item.addtime, item.time).date}}</div>
  19 + <div class="daren-shop-btn" v-if="item.shop_user.is_fans == '1'" @click.stop.prevent="toDarenShop(item)">
  20 + 进店
  21 + </div>
  22 + <div class="fans-btn" v-else @click.stop.prevent="fansShop(item)">
  23 + 关注
  24 + </div>
19 </div> 25 </div>
20 </div> 26 </div>
21 27
@@ -30,7 +36,7 @@ @@ -30,7 +36,7 @@
30 <!-- 达人图片展示（单独组建处理，宫格形式） --> 36 <!-- 达人图片展示（单独组建处理，宫格形式） -->
31 <palace-grid 37 <palace-grid
32 :grids="{ 38 :grids="{
33 - list:imgArr 39 + list:imgArr
34 }"> 40 }">
35 </palace-grid> 41 </palace-grid>
36 </div> 42 </div>
@@ -53,6 +59,7 @@ @@ -53,6 +59,7 @@
53 59
54 <!-- 商品标签组建 --> 60 <!-- 商品标签组建 -->
55 <div class="goods"> 61 <div class="goods">
  62 +
56 <!-- goodsItem_4 --> 63 <!-- goodsItem_4 -->
57 <goods-item-4 @jump="goodsJump" @primary="goodsPrimary" 64 <goods-item-4 @jump="goodsJump" @primary="goodsPrimary"
58 :item="item.goods"> 65 :item="item.goods">
@@ -251,6 +258,21 @@ @@ -251,6 +258,21 @@
251 goodsPrimary(item) { 258 goodsPrimary(item) {
252 this.$emit("goodsPrimary", item); 259 this.$emit("goodsPrimary", item);
253 }, 260 },
  261 +
  262 + /**
  263 + * 关注达人
  264 + */
  265 + fansShop(item) {
  266 + this.$emit('fansShop', item);
  267 + },
  268 +
  269 + /**
  270 + * 跳转达人店铺页面
  271 + */
  272 + toDarenShop(item) {
  273 + this.$set(item, "type", "2");
  274 + this.$emit('toDarenShop', item);
  275 + }
254 } 276 }
255 } 277 }
256 </script> 278 </script>
src/components/dresserList/dresserList.less
  View file @7779061
@@ -29,10 +29,9 @@ @@ -29,10 +29,9 @@
29 } 29 }
30 .desc{ 30 .desc{
31 max-height:63px; 31 max-height:63px;
32 - font-size:24px;  
33 - font-weight:400;  
34 - color:rgba(102,102,102,1);  
35 - line-height:33px; 32 + color: #333333;
  33 + font-size: 28px;
  34 + font-weight: bold;
36 margin-top: 10px; 35 margin-top: 10px;
37 display: -webkit-box; 36 display: -webkit-box;
38 -webkit-line-clamp: 2; 37 -webkit-line-clamp: 2;
src/components/dresserList/dresserList.vue
  View file @7779061
1 <template> 1 <template>
2 <div v-if="dresserList && dresserList.length"> 2 <div v-if="dresserList && dresserList.length">
3 <div class="item_box" v-for="(item,index) in dresserList" :key="index" @click="toDetail(item)"> 3 <div class="item_box" v-for="(item,index) in dresserList" :key="index" @click="toDetail(item)">
4 - <img class="head_portrait" v-lazy="item.user_img || item.logo" /> 4 + <img v-lazy="item.user_img || item.logo" class="head_portrait" />
5 <div class="user_info"> 5 <div class="user_info">
6 - <div class="name"> 6 + <!-- <div class="name">
7 {{item.title}} 7 {{item.title}}
8 - </div> 8 + </div> -->
9 <div class="desc"> 9 <div class="desc">
10 - {{item.user_title || item.titles}} 10 + {{item.user_title || item.titles || item.title}}
11 </div> 11 </div>
12 </div> 12 </div>
13 <div v-if="item.is_fans"> 13 <div v-if="item.is_fans">
src/components/goodsItem_10/goodsItem_10.less 0 → 100644
  View file @7779061
  1 +@charset "UTF-8";
  2 +
  3 +.goods-item-10-box {
  4 + background-color: #ffffff;
  5 + padding: 20px 0;
  6 + width: 173px;
  7 + height: auto;
  8 + border-radius: 8px;
  9 + .top-box {
  10 + position: relative;
  11 + .img-box {
  12 + display: flex;
  13 + justify-content: center;
  14 + align-items: center;
  15 + background-color: #F9F9F9;
  16 + margin: 0 auto;
  17 + width: 143px;
  18 + height: 143px;
  19 + border-radius: 8px;
  20 + overflow: hidden;
  21 + .simg {
  22 + display: block;
  23 + width: 143px;
  24 + height: 143px;
  25 + }
  26 + }
  27 + }
  28 + .content-box {
  29 + margin: 0 auto;
  30 + width: 143px;
  31 + .price-box {
  32 + display: flex;
  33 + justify-content: center;
  34 + align-items: baseline;
  35 + margin-top: 20px;
  36 + .symbol {
  37 + color: #FC1541;
  38 + font-size: 24px;
  39 + }
  40 + .price {
  41 + color: #FC1541;
  42 + font-size: 24px;
  43 + white-space: nowrap;
  44 + text-overflow: ellipsis;
  45 + overflow: hidden;
  46 + & + .prices {
  47 + margin-left: 8px;
  48 + }
  49 + }
  50 + .prices {
  51 + color: #BEBEBE;
  52 + font-size: 18px;
  53 + text-decoration: line-through;
  54 + white-space: nowrap;
  55 + text-overflow: ellipsis;
  56 + overflow: hidden;
  57 + }
  58 + }
  59 + }
  60 +
  61 + &.pid-2 { // 排名样式
  62 + .content-box {
  63 + .price-box {
  64 + justify-content: center;
  65 + .price {
  66 + & + .price-text {
  67 + margin-left: 2px;
  68 + }
  69 + }
  70 + .price-text {
  71 + color: #333333;
  72 + font-size: 20px;
  73 + font-weight: 400;
  74 + }
  75 + }
  76 + }
  77 + }
  78 +}
src/components/goodsItem_10/goodsItem_10.vue 0 → 100644
  View file @7779061
  1 +<template>
  2 + <div class="goods-item-10-box" :class="'pid-' + pid" v-if="item" @click="jump(item)">
  3 + <div class="top-box">
  4 + <div class="img-box">
  5 + <img v-lazy="item.simg + SIGN.SMALL" class="simg" />
  6 + </div>
  7 + <slot name="flag"></slot>
  8 + </div>
  9 + <div class="content-box">
  10 +
  11 + <div class="price-box" v-if="pid == '1'">
  12 + <div class="symbol">¥</div>
  13 + <div class="price">{{item.price}}</div>
  14 + <!-- <div class="prices" v-if="(pid == '1') && item.prices && parseFloat(item.prices) > 0 && parseFloat(item.prices) > parseFloat(item.price)">¥{{item.prices}}</div> -->
  15 + </div>
  16 +
  17 + <div class="price-box" v-if="pid == '2'">
  18 + <div class="price">{{item.price}}</div>
  19 + <div class="price-text">积分</div>
  20 + </div>
  21 + </div>
  22 + </div>
  23 +</template>
  24 +
  25 +<script>
  26 + export default {
  27 + name: 'goodsItem10',
  28 + data: function () {
  29 + return {
  30 +
  31 + }
  32 + },
  33 + props: ["item", "pid"],
  34 + methods: {
  35 +
  36 + /**
  37 + * 点击跳转
  38 + * @param {object} item [数据对象]
  39 + */
  40 + jump (item) {
  41 + this.$emit("jump", item);
  42 + }
  43 + }
  44 + }
  45 +</script>
  46 +
  47 +<!-- Add "scoped" attribute to limit CSS to this component only -->
  48 +<style rel="stylesheet/less" lang="less" scoped>
  49 + @import './goodsItem_10';
  50 +</style>
src/components/horizList/horizList.vue
  View file @7779061
@@ -22,6 +22,11 @@ @@ -22,6 +22,11 @@
22 事件： 22 事件：
23 @jump：整个点击跳转事件 23 @jump：整个点击跳转事件
24 @primary：右下角红色主按钮点击事件，已阻止事件冒泡 24 @primary：右下角红色主按钮点击事件，已阻止事件冒泡
  25 +
  26 + com=10：goodsItem_10组件，pid: 1，价格，原价；2、积分信息
  27 + 事件：
  28 + @jump：整个点击跳转事件
  29 +
25 com=tab：titleSubTitleCom组件，无pid参数 30 com=tab：titleSubTitleCom组件，无pid参数
26 事件： 31 事件：
27 @changeTab：切换tab事件 32 @changeTab：切换tab事件
@@ -48,6 +53,12 @@ @@ -48,6 +53,12 @@
48 :item="item"> 53 :item="item">
49 </goods-item-3> 54 </goods-item-3>
50 55
  56 + <!-- 商品展示样式 10 -->
  57 + <goods-item-10 v-if="com == '10'" @jump="jump"
  58 + :item="item"
  59 + :pid="pid">
  60 + </goods-item-10>
  61 +
51 <!--菜单--> 62 <!--菜单-->
52 <swiper-item v-if="com == '4'" @jump="jump" 63 <swiper-item v-if="com == '4'" @jump="jump"
53 :item="item"> 64 :item="item">
@@ -83,6 +94,7 @@ @@ -83,6 +94,7 @@
83 import goodsItem1 from "@/components/goodsItem_1/goodsItem_1"; 94 import goodsItem1 from "@/components/goodsItem_1/goodsItem_1";
84 import goodsItem2 from "@/components/goodsItem_2/goodsItem_2"; 95 import goodsItem2 from "@/components/goodsItem_2/goodsItem_2";
85 import goodsItem3 from "@/components/goodsItem_3/goodsItem_3"; 96 import goodsItem3 from "@/components/goodsItem_3/goodsItem_3";
  97 + import goodsItem10 from '@/components/goodsItem_10/goodsItem_10.vue';
86 import swiperItem from "@/components/swiperItem/swiperItem"; 98 import swiperItem from "@/components/swiperItem/swiperItem";
87 import shopDarenHot from "@/components/shopDarenHot/shopDarenHot"; 99 import shopDarenHot from "@/components/shopDarenHot/shopDarenHot";
88 import titleSubTitleCom from "@/components/titleSubTitleCom/titleSubTitleCom"; 100 import titleSubTitleCom from "@/components/titleSubTitleCom/titleSubTitleCom";
@@ -101,6 +113,7 @@ @@ -101,6 +113,7 @@
101 goodsItem1, 113 goodsItem1,
102 goodsItem2, 114 goodsItem2,
103 goodsItem3, 115 goodsItem3,
  116 + goodsItem10,
104 swiperItem, 117 swiperItem,
105 shopDarenHot, 118 shopDarenHot,
106 titleSubTitleCom, 119 titleSubTitleCom,
src/components/swiper/swiper.vue
  View file @7779061
1 <template> 1 <template>
2 <div class="swiper-box" :class="{'points-mall-swiper':isPointsMall}" v-if="swipers && swipers.length"> 2 <div class="swiper-box" :class="{'points-mall-swiper':isPointsMall}" v-if="swipers && swipers.length">
3 - <swipe class="swipe" :autoplay="5000" :touchable="swipers.length===1 ? false : true" :show-indicators="options && options.showIndicators !== undefined ? options.showIndicators : showIndicators" @change="onChange"> 3 + <swipe class="swipe" :autoplay="5000" :touchable="swipers.length === 1 ? false : true" :show-indicators="options && options.showIndicators !== undefined ? options.showIndicators : showIndicators" @change="onChange">
4 <swipe-item class="swipe-item" v-for="(item, index) in swipers" :key="index"> 4 <swipe-item class="swipe-item" v-for="(item, index) in swipers" :key="index">
5 <div class="item" @click="$parent.$parent.gotoDetail(item)"> 5 <div class="item" @click="$parent.$parent.gotoDetail(item)">
6 <div class="img-box"> 6 <div class="img-box">
@@ -8,16 +8,17 @@ @@ -8,16 +8,17 @@
8 <img v-else v-lazy="item.simg + SIGN.BIG" class="img" mode="widthFix" /> 8 <img v-else v-lazy="item.simg + SIGN.BIG" class="img" mode="widthFix" />
9 </div> 9 </div>
10 </div> 10 </div>
  11 +
11 <!-- 展示播放按钮 --> 12 <!-- 展示播放按钮 -->
12 <div @click="playNow(item.to)" v-if="item.type == 22" class="play-button-box"> 13 <div @click="playNow(item.to)" v-if="item.type == 22" class="play-button-box">
13 <img src="static/img/play_dark.png" class="play-button-img" /> 14 <img src="static/img/play_dark.png" class="play-button-img" />
14 </div> 15 </div>
15 </swipe-item> 16 </swipe-item>
16 - <template v-if="isPointsMall" #indicator> 17 + <template v-if="isPointsMall" #indicator>
17 <div class="custom-indicator"> 18 <div class="custom-indicator">
18 - {{ current + 1 }}/{{swipers.length}} 19 + {{ current + 1 }}/{{swipers.length}}
19 </div> 20 </div>
20 - </template> 21 + </template>
21 </swipe> 22 </swipe>
22 </div> 23 </div>
23 </template> 24 </template>
@@ -54,7 +55,7 @@ export default { @@ -54,7 +55,7 @@ export default {
54 * @param {String} videoUrl [数据对象] 55 * @param {String} videoUrl [数据对象]
55 */ 56 */
56 playNow(videoUrl) { 57 playNow(videoUrl) {
57 - debugger 58 +
58 // 判断App内 59 // 判断App内
59 if (this.isCNLive.value) { 60 if (this.isCNLive.value) {
60 61
src/components/textTitleBox/textTitleBox.less
  View file @7779061
@@ -59,4 +59,30 @@ @@ -59,4 +59,30 @@
59 } 59 }
60 } 60 }
61 } 61 }
  62 + &.style-3 {
  63 + .box {
  64 + .title-box {
  65 + display: contents;
  66 + color: #666666;
  67 + font-size: 30px;
  68 + font-weight: 500;
  69 + }
  70 + .more-box {
  71 + background-color: #F7B500;
  72 + padding: 3px 20px;
  73 + border-radius: 26px;
  74 + .more-text {
  75 +
  76 + color: #FFFFFF;
  77 + font-size: 26px;
  78 + font-weight: 500;
  79 + line-height: 37px;
  80 + }
  81 + .icon-img {
  82 + width: 8px;
  83 + height: 12px;
  84 + }
  85 + }
  86 + }
  87 + }
62 } 88 }
63 \ No newline at end of file 89 \ No newline at end of file
src/pages/fansShopMessageList/fansShopMessageList.vue
  View file @7779061
@@ -9,16 +9,14 @@ @@ -9,16 +9,14 @@
9 <!-- 下拉刷新 --> 9 <!-- 下拉刷新 -->
10 <!-- <van-pull-refresh v-model="isLoading" pulling-text="下拉刷新..." loosing-text="释放刷新" loading-text="加载中..." success-text="刷新成功" @refresh="onRefresh"> --> 10 <!-- <van-pull-refresh v-model="isLoading" pulling-text="下拉刷新..." loosing-text="释放刷新" loading-text="加载中..." success-text="刷新成功" @refresh="onRefresh"> -->
11 11
12 - <!-- 已关注达人列表 --> 12 + <!-- 关注达人列表 -->
13 <div class="item_box"> 13 <div class="item_box">
14 - <div  
15 - v-infinite-scroll="loadMore"  
16 - infinite-scroll-disabled="loading"  
17 - :infinite-scroll-distance="list.length">  
18 - <!-- 达人列表组件 -->  
19 - <dresserList @toDetail="toDetail"  
20 - :dresserList="list">  
21 - </dresserList> 14 + <div v-infinite-scroll="loadMore" infinite-scroll-disabled="loading" :infinite-scroll-distance="list.length">
  15 +
  16 + <!-- 达人列表组件 -->
  17 + <dresserList @toDetail="toDetail"
  18 + :dresserList="list">
  19 + </dresserList>
22 </div> 20 </div>
23 </div> 21 </div>
24 <!-- </van-pull-refresh> --> 22 <!-- </van-pull-refresh> -->
@@ -36,15 +34,8 @@ @@ -36,15 +34,8 @@
36 data() { 34 data() {
37 return { 35 return {
38 title: "", 36 title: "",
  37 + backs: null, // nav导航条数据
39 isLoading: false, // 下拉刷新控制 38 isLoading: false, // 下拉刷新控制
40 - backs: { // nav导航条数据  
41 - title: "已关注达人",  
42 - funcs: {  
43 - back: {  
44 - icon: "static/img/icon_back.png"  
45 - }  
46 - }  
47 - },  
48 list: [], // 达人列表 39 list: [], // 达人列表
49 loading: false // 上拉加载控制 40 loading: false // 上拉加载控制
50 } 41 }
@@ -56,10 +47,23 @@ @@ -56,10 +47,23 @@
56 created() { 47 created() {
57 48
58 // 设置标题 49 // 设置标题
59 - this.$set(this, "title", "已关注达人"); 50 + this.$set(this, "title", "关注达人列表");
  51 +
  52 + // nav导航条数据
  53 + this.$set(this, 'backs', {
  54 + title: this.title,
  55 + funcs: {
  56 + back: {
  57 + icon: "static/img/icon_back.png"
  58 + }
  59 + }
  60 + });
60 61
61 // 获取关注人列表 62 // 获取关注人列表
62 - this.fansShopMessageList(); 63 + // this.fansShopMessageList();
  64 +
  65 + // 获取关注人列表2
  66 + this.fansShopList();
63 }, 67 },
64 methods: { 68 methods: {
65 69
@@ -87,8 +91,8 @@ @@ -87,8 +91,8 @@
87 // 请求接口 91 // 请求接口
88 this.http("/Api/" + this.getApiVersion().dynamic + "/fansShopMessageList", { 92 this.http("/Api/" + this.getApiVersion().dynamic + "/fansShopMessageList", {
89 uid: this.getStore("uid") 93 uid: this.getStore("uid")
90 - },this.fansShopMessageListCallback, {  
91 - method: "post" 94 + }, this.fansShopMessageListCallback, {
  95 + method: "POST"
92 }); 96 });
93 } 97 }
94 }, 98 },
@@ -112,10 +116,62 @@ @@ -112,10 +116,62 @@
112 // 解构数据 116 // 解构数据
113 let {data: datas} = res; 117 let {data: datas} = res;
114 118
115 - /*获取裂变数据*/ 119 + /* 获取列表数据 开始 */
  120 +
  121 + // 设置标题
  122 + this.$set(this, "list", datas.list);
  123 +
  124 + /* 获取列表数据 结束 */
  125 +
  126 + }
  127 + },
  128 +
  129 + /**
  130 + * 已关注达人列表2
  131 + */
  132 + fansShopList () {
  133 +
  134 + // 校验登录
  135 + if (this.$parent.checkLogin()) {
  136 +
  137 + // 加载中提示
  138 + Indicator.open('加载中...');
  139 +
  140 + // 请求接口
  141 + this.http("/Api/" + this.getApiVersion().dynamic + "/fansShopList", {
  142 + uid: this.getStore("uid")
  143 + }, this.fansShopListCallback, {
  144 + method: "POST"
  145 + });
  146 + }
  147 + },
  148 +
  149 + /**
  150 + * 已关注达人列表2回调
  151 + * @param {object} res [服务器返回数据]
  152 + * @param {object} ext [扩展参数]
  153 + */
  154 + fansShopListCallback(res, ext) {
  155 +
  156 + // 加载完成
  157 + Indicator.close();
  158 +
  159 + // 下拉刷新结束
  160 + this.$set(this, "isLoading", false);
  161 +
  162 + // 返回处理
  163 + if (res.code == 200) {
  164 +
  165 + // 解构数据
  166 + let {data: datas} = res;
  167 +
  168 + /* 获取列表数据 开始 */
116 169
117 // 设置标题 170 // 设置标题
118 this.$set(this, "list", datas.list); 171 this.$set(this, "list", datas.list);
  172 +
  173 + /* 获取列表数据 结束 */
  174 +
119 } 175 }
120 }, 176 },
121 177
@@ -138,8 +194,10 @@ @@ -138,8 +194,10 @@
138 * @param {object} item [数据对象] 194 * @param {object} item [数据对象]
139 */ 195 */
140 toDetail(item) { 196 toDetail(item) {
  197 +
141 // 判断并调用通用跳转 198 // 判断并调用通用跳转
142 if (typeof this.$parent.gotoDetail === "function") { 199 if (typeof this.$parent.gotoDetail === "function") {
  200 +
143 // 设置跳转达人个人主页用户数据 201 // 设置跳转达人个人主页用户数据
144 Object.assign(item, { 202 Object.assign(item, {
145 type: "5", 203 type: "5",
src/pages/mall/mall.vue
  View file @7779061
1 <template> 1 <template>
2 <div class="mall-box"> 2 <div class="mall-box">
  3 +
3 <!-- 下拉刷新 --> 4 <!-- 下拉刷新 -->
4 <!-- <van-pull-refresh v-model="isLoading" pulling-text="下拉刷新..." loosing-text="释放刷新" loading-text="加载中..." success-text="刷新成功" @refresh="onRefresh"> --> 5 <!-- <van-pull-refresh v-model="isLoading" pulling-text="下拉刷新..." loosing-text="释放刷新" loading-text="加载中..." success-text="刷新成功" @refresh="onRefresh"> -->
5 <!-- nav --> 6 <!-- nav -->
  7 +
6 <!-- H5唤起App组件 --> 8 <!-- H5唤起App组件 -->
7 - <call-app-box  
8 - class="call-app-box"  
9 - :style="'padding-top: ' + $parent.top.value + 'px'"  
10 - ref="callApp"  
11 - v-if="!isCNLive.value"  
12 - :callApps="$parent.callApps"  
13 - > 9 + <call-app-box class="call-app-box" :style="'padding-top: ' + $parent.top.value + 'px'" ref="callApp" v-if="!isCNLive.value"
  10 + :callApps="$parent.callApps">
14 </call-app-box> 11 </call-app-box>
15 - <back-box  
16 - v-if="$parent.isBack && isCNLive.value"  
17 - class="back-box"  
18 - :style="'padding-top: ' + $parent.top.value + 'px'"  
19 - @back="back"  
20 - :backs="backs"  
21 - > 12 +
  13 + <back-box class="back-box" :style="'padding-top: ' + $parent.top.value + 'px'" v-if="$parent.isBack && isCNLive.value" @back="back"
  14 + :backs="backs">
22 </back-box> 15 </back-box>
  16 +
23 <!--轮播--> 17 <!--轮播-->
24 - <swiper  
25 - :style="  
26 - 'margin-top:' +  
27 - ($parent.isBack && isCNLive.value ? 62 : 10) +  
28 - 'px'  
29 - "  
30 - v-if="banner" 18 + <swiper :style="'margin-top:' + ($parent.isBack && isCNLive.value ? 62 : 10) + 'px'" v-if="banner"
31 :swipers="banner" 19 :swipers="banner"
32 :options="{ 20 :options="{
33 showIndicators: true 21 showIndicators: true
34 - }"  
35 - > 22 + }">
36 </swiper> 23 </swiper>
37 24
38 <!--导航--> 25 <!--导航-->
39 - <horiz-list  
40 - class="components-box"  
41 - v-if="navs && navs.length"  
42 - @jump="jump" 26 + <horiz-list class="components-box" v-if="navs && navs.length" @jump="jump"
43 :lists="navs" 27 :lists="navs"
44 - com="4"  
45 - > 28 + com="4">
46 </horiz-list> 29 </horiz-list>
47 30
48 <!-- 遍历ads，输出列表数据 --> 31 <!-- 遍历ads，输出列表数据 -->
49 <div class="ads-box"> 32 <div class="ads-box">
50 <div class="ads" v-for="(item, index) in ads" :key="index"> 33 <div class="ads" v-for="(item, index) in ads" :key="index">
  34 +
51 <!--优惠专区--> 35 <!--优惠专区-->
52 - <discountZone  
53 - v-if="item.style == '1'"  
54 - @more="toDetail"  
55 - @toDetail="toDetail"  
56 - :discountZoneInfo="item"  
57 - > 36 + <discountZone v-if="item.style == '1'" @more="toDetail" @toDetail="toDetail"
  37 + :discountZoneInfo="item">
58 </discountZone> 38 </discountZone>
59 39
60 <!--天天特惠--> 40 <!--天天特惠-->
61 - <preferential  
62 - v-if="item.style == '2'"  
63 - @more="toDetail"  
64 - @toDetail="toDetail"  
65 - :preferentialInfo="item"  
66 - > 41 + <preferential v-if="item.style == '2'" @more="toDetail" @toDetail="toDetail"
  42 + :preferentialInfo="item">
67 </preferential> 43 </preferential>
68 44
69 <!--视听专区--> 45 <!--视听专区-->
70 - <videoArea  
71 - v-if="item.style == '13'"  
72 - @more="toDetail"  
73 - @toDetail="toDetail"  
74 - :videoAreaInfo="item"  
75 - > 46 + <videoArea v-if="item.style == '13'" @more="toDetail" @toDetail="toDetail"
  47 + :videoAreaInfo="item">
76 </videoArea> 48 </videoArea>
77 49
78 <!-- style_7组件 --> 50 <!-- style_7组件 -->
79 - <style-7  
80 - v-if="item.style == '7'"  
81 - @more="toDetail"  
82 - @bannerJump="toDetail"  
83 - @jump="jump"  
84 - @addCart="addCart"  
85 - :styles="item"  
86 - > 51 + <style-7 v-if="item.style == '7'" @more="toDetail" @bannerJump="toDetail" @jump="jump" @addCart="addCart"
  52 + :styles="item">
87 </style-7> 53 </style-7>
88 </div> 54 </div>
89 - <tabBox  
90 - v-if="tabbar" 55 +
  56 + <tabBox v-if="tabbar"
91 :tabbar="tabbar" 57 :tabbar="tabbar"
92 - :tabbarBackgroud="tabbarBackgroud"  
93 - ></tabBox> 58 + :tabbarBackgroud="tabbarBackgroud">
  59 + </tabBox>
94 </div> 60 </div>
95 <!-- </van-pull-refresh> --> 61 <!-- </van-pull-refresh> -->
96 </div> 62 </div>
97 </template> 63 </template>
98 64
99 <script> 65 <script>
100 -// 引入组件  
101 -import { Toast, Indicator } from "mint-ui";  
102 -import callAppBox from "@/components/callAppBox/callAppBox";  
103 -import swiper from "@/components/swiper/swiper";  
104 -import swiperItem from "@/components/swiperItem/swiperItem";  
105 -import discountZone from "@/components/discountZone/discountZone";  
106 -import preferential from "@/components/preferential/preferential";  
107 -import videoArea from "@/components/videoArea/videoArea";  
108 -import style7 from "@/components/style_7/style_7";  
109 -import horizList from "@/components/horizList/horizList";  
110 -import tabBox from "@/components/tabBox/tabBox";  
111 -import backBox from "@/components/backBox/backBox";  
112 -export default {  
113 - name: "mall",  
114 - data() {  
115 - return {  
116 - title: "", // 标题  
117 - isLoading: false, // 下拉刷新控制  
118 - banner: null, // banner  
119 - navs: null, // 导航  
120 - ads: null, // 列表  
121 - tabbar: null, // tabbar嵌套组件  
122 - tabbarBackgroud: null, // 整体tabbar背景  
123 - backs: null // 后退按钮组  
124 - };  
125 - },  
126 - components: {  
127 - swiper,  
128 - swiperItem,  
129 - discountZone,  
130 - preferential,  
131 - videoArea,  
132 - style7,  
133 - horizList,  
134 - tabBox,  
135 - backBox,  
136 - callAppBox  
137 - },  
138 - created() {  
139 - // 获取优选库精选活动  
140 - this.activityAd();  
141 - // // 判断是否在App内  
142 - // 设置后退按钮组  
143 - this.$set(this, "backs", {  
144 - title: ""  
145 - });  
146 66
147 - // 判断是否在App内  
148 - if (this.$parent.isCNLive.value) {  
149 - // 添加后退按钮组“后退”和“分享”按钮  
150 - Object.assign(this.backs, {  
151 - funcs: {  
152 - back: {  
153 - icon: "static/img/icon_back.png"  
154 - },  
155 - funcArray: [  
156 - {  
157 - icon: "static/img/icon_share.png",  
158 - func: this.toShare  
159 - }  
160 - ]  
161 - }  
162 - });  
163 - }  
164 - },  
165 - mounted() {  
166 - // 唤起详情页  
167 - if (typeof this.$parent.getOpenApp === "function") {  
168 - this.$parent.getOpenApp({  
169 - type: 38,  
170 - id: this.$route.query.id || 0,  
171 - url: "",  
172 - ext: this.$parent.isBack ? JSON.stringify({"isBack":'true'}) : ""  
173 - });  
174 - } 67 + // 引入组件
  68 + import { Toast, Indicator } from "mint-ui";
  69 + import callAppBox from "@/components/callAppBox/callAppBox";
  70 + import swiper from "@/components/swiper/swiper";
  71 + import swiperItem from "@/components/swiperItem/swiperItem";
  72 + import discountZone from "@/components/discountZone/discountZone";
  73 + import preferential from "@/components/preferential/preferential";
  74 + import videoArea from "@/components/videoArea/videoArea";
  75 + import style7 from "@/components/style_7/style_7";
  76 + import horizList from "@/components/horizList/horizList";
  77 + import tabBox from "@/components/tabBox/tabBox";
  78 + import backBox from "@/components/backBox/backBox";
175 79
176 - // 分享详情页  
177 - if (typeof this.$parent.getShareData === "function") {  
178 - this.$parent.getShareData({  
179 - type: 38,  
180 - id: this.$route.query.id || 0,  
181 - url: "",  
182 - ext: this.$parent.isBack ? JSON.stringify({"isBack":'true'}) : "" 80 + export default {
  81 + name: "mall",
  82 + data() {
  83 + return {
  84 + title: "", // 标题
  85 + isLoading: false, // 下拉刷新控制
  86 + banner: null, // banner
  87 + navs: null, // 导航
  88 + ads: null, // 列表
  89 + tabbar: null, // tabbar嵌套组件
  90 + tabbarBackgroud: null, // 整体tabbar背景
  91 + backs: null // 后退按钮组
  92 + };
  93 + },
  94 + components: {
  95 + swiper,
  96 + swiperItem,
  97 + discountZone,
  98 + preferential,
  99 + videoArea,
  100 + style7,
  101 + horizList,
  102 + tabBox,
  103 + backBox,
  104 + callAppBox
  105 + },
  106 + created() {
  107 +
  108 + // 获取优选库精选活动
  109 + this.activityAd();
  110 +
  111 + // 设置后退按钮组
  112 + this.$set(this, "backs", {
  113 + title: ""
183 }); 114 });
184 - }  
185 - // let schemeParams = this.$parent.schemeParams;  
186 - // // 判断如果是分享链接没有isBack=true在后面加上isBack=true；为了在app内打开可以展示  
187 - // if (!schemeParams.isBack) {  
188 - // // 设置参数  
189 - // this.$parent.schemeParams = this.$parent.schemeParams + "&isBack=true";  
190 - // }  
191 - },  
192 - methods: {  
193 - // 下拉刷新  
194 - // onRefresh() {  
195 115
196 - // // 下拉刷新中  
197 - // this.$set(this, "isLoading", true); 116 + // 判断是否在App内
  117 + if (this.$parent.isCNLive.value) {
198 118
199 - // // 获取优选库精选活动  
200 - // this.activityAd();  
201 - // },  
202 - /**  
203 - * 后退  
204 - */  
205 - back() {  
206 - // App内  
207 - if (this.isCNLive.value) {  
208 - // 调用App，返回按键  
209 - if (  
210 - window.webkit &&  
211 - window.webkit.messageHandlers &&  
212 - window.webkit.messageHandlers.pop  
213 - ) {  
214 - // App内，iOS销毁WebView  
215 - window.webkit.messageHandlers.pop.postMessage({ body: {} });  
216 - } else if (window.obj && window.obj.finish) {  
217 - // App内，Android销毁WebView  
218 - window.obj.finish();  
219 - }  
220 - } else {  
221 - // 后退  
222 - window.history.go(-1); 119 + // 添加后退按钮组“后退”和“分享”按钮
  120 + Object.assign(this.backs, {
  121 + funcs: {
  122 + back: {
  123 + icon: "static/img/icon_back.png"
  124 + },
  125 + funcArray: [
  126 + {
  127 + icon: "static/img/icon_share.png",
  128 + func: this.toShare
  129 + }
  130 + ]
  131 + }
  132 + });
223 } 133 }
224 }, 134 },
225 - /**  
226 - * 分享  
227 - */  
228 - toShare() {  
229 - // 判断分享  
230 - if (typeof this.$parent.toShare === "function") {  
231 - this.$parent.toShare(38, this.$route.query.id || 0); 135 + mounted() {
  136 +
  137 + // 唤起详情页
  138 + if (typeof this.$parent.getOpenApp === "function") {
  139 + this.$parent.getOpenApp({
  140 + type: 38,
  141 + id: this.$route.query.id || 0,
  142 + url: "",
  143 + ext: this.$parent.isBack ? JSON.stringify({"isBack":'true'}) : ""
  144 + });
232 } 145 }
  146 +
  147 + // 分享详情页
  148 + if (typeof this.$parent.getShareData === "function") {
  149 + this.$parent.getShareData({
  150 + type: 38,
  151 + id: this.$route.query.id || 0,
  152 + url: "",
  153 + ext: this.$parent.isBack ? JSON.stringify({"isBack":'true'}) : ""
  154 + });
  155 + }
  156 + // let schemeParams = this.$parent.schemeParams;
  157 + // // 判断如果是分享链接没有isBack=true在后面加上isBack=true；为了在app内打开可以展示
  158 + // if (!schemeParams.isBack) {
  159 + // // 设置参数
  160 + // this.$parent.schemeParams = this.$parent.schemeParams + "&isBack=true";
  161 + // }
233 }, 162 },
234 - /**  
235 - * 获取优选库精选活动  
236 - */  
237 - activityAd() {  
238 - // 加载中提示  
239 - Indicator.open("加载中..."); 163 + methods: {
  164 + // 下拉刷新
  165 + // onRefresh() {
  166 +
  167 + // // 下拉刷新中
  168 + // this.$set(this, "isLoading", true);
240 169
241 - // 获取证书请求接口  
242 - this.http(  
243 - "/Api/" + this.getApiVersion().index + "/activityAd",  
244 - {  
245 - id: this.$route.query.id  
246 - },  
247 - this.activityAdCallback,  
248 - {  
249 - method: "post" 170 + // // 获取优选库精选活动
  171 + // this.activityAd();
  172 + // },
  173 + /**
  174 + * 后退
  175 + */
  176 + back() {
  177 + // App内
  178 + if (this.isCNLive.value) {
  179 + // 调用App，返回按键
  180 + if (
  181 + window.webkit &&
  182 + window.webkit.messageHandlers &&
  183 + window.webkit.messageHandlers.pop
  184 + ) {
  185 + // App内，iOS销毁WebView
  186 + window.webkit.messageHandlers.pop.postMessage({ body: {} });
  187 + } else if (window.obj && window.obj.finish) {
  188 + // App内，Android销毁WebView
  189 + window.obj.finish();
  190 + }
  191 + } else {
  192 + // 后退
  193 + window.history.go(-1);
250 } 194 }
251 - );  
252 - }, 195 + },
  196 + /**
  197 + * 分享
  198 + */
  199 + toShare() {
  200 + // 判断分享
  201 + if (typeof this.$parent.toShare === "function") {
  202 + this.$parent.toShare(38, this.$route.query.id || 0);
  203 + }
  204 + },
  205 + /**
  206 + * 获取优选库精选活动
  207 + */
  208 + activityAd() {
  209 + // 加载中提示
  210 + Indicator.open("加载中...");
  211 +
  212 + // 获取证书请求接口
  213 + this.http(
  214 + "/Api/" + this.getApiVersion().index + "/activityAd",
  215 + {
  216 + id: this.$route.query.id
  217 + },
  218 + this.activityAdCallback,
  219 + {
  220 + method: "post"
  221 + }
  222 + );
  223 + },
253 224
254 - /**  
255 - * 获取优选库精选活动回调  
256 - * @param {object} res [服务器返回数据]  
257 - * @param {object} ext [扩展参数]  
258 - */  
259 - activityAdCallback(res, ext) {  
260 - // 加载完成  
261 - Indicator.close(); 225 + /**
  226 + * 获取优选库精选活动回调
  227 + * @param {object} res [服务器返回数据]
  228 + * @param {object} ext [扩展参数]
  229 + */
  230 + activityAdCallback(res, ext) {
  231 + // 加载完成
  232 + Indicator.close();
262 233
263 - // 下拉刷新结束  
264 - this.$set(this, "isLoading", false); 234 + // 下拉刷新结束
  235 + this.$set(this, "isLoading", false);
265 236
266 - // 返回处理  
267 - if (res.code == 200) {  
268 - // 解构数据  
269 - let { data: datas } = res; 237 + // 返回处理
  238 + if (res.code == 200) {
  239 + // 解构数据
  240 + let { data: datas } = res;
270 241
271 - /* 获取优选库精选活动数据 开始 */ 242 + /* 获取优选库精选活动数据 开始 */
272 243
273 - // 设置标题  
274 - this.$set(this, "title", datas.title); 244 + // 设置标题
  245 + this.$set(this, "title", datas.title);
275 246
276 - // 设置banner数据  
277 - if (datas.banner && datas.banner.length) {  
278 - this.$set(this, "banner", datas.banner);  
279 - } 247 + // 设置banner数据
  248 + if (datas.banner && datas.banner.length) {
  249 + this.$set(this, "banner", datas.banner);
  250 + }
280 251
281 - // 设置navs数据  
282 - if (datas.navs && datas.navs.length) {  
283 - this.$set(this, "navs", datas.navs);  
284 - } 252 + // 设置navs数据
  253 + if (datas.navs && datas.navs.length) {
  254 + this.$set(this, "navs", datas.navs);
  255 + }
285 256
286 - // 设置ads数据  
287 - if (datas.ads && datas.ads.length) {  
288 - this.$set(this, "ads", datas.ads); 257 + // 设置ads数据
  258 + if (datas.ads && datas.ads.length) {
  259 + this.$set(this, "ads", datas.ads);
  260 + }
  261 + // 设置tabbar数据
  262 + if (datas.tabbar && datas.tabbar.length) {
  263 + this.$set(this, "tabbar", datas.tabbar);
  264 + }
  265 + // 设置tabbarBackgroud数据
  266 + if (datas.color && datas.color.length) {
  267 + this.$set(this, "tabbarBackgroud", datas.color);
  268 + }
  269 + /* 获取优选库精选活动数据 结束 */
  270 + } else if (res.code == 400) {
  271 + // 获取优选库精选活动失败
  272 + Toast(res.message);
  273 + } else {
  274 + // 获取优选库精选活动失败
  275 + Toast("获取优选库精选活动失败");
289 } 276 }
290 - // 设置tabbar数据  
291 - if (datas.tabbar && datas.tabbar.length) {  
292 - this.$set(this, "tabbar", datas.tabbar); 277 + },
  278 +
  279 + /**
  280 + * 调用通用跳转
  281 + * @param {object} item [通用跳转对象]
  282 + */
  283 + toDetail(item) {
  284 + // 判断是否有通用跳转函数
  285 + if (typeof this.$parent.gotoDetail === "function") {
  286 + // 调用通用跳转
  287 + this.$parent.gotoDetail(item);
293 } 288 }
294 - // 设置tabbarBackgroud数据  
295 - if (datas.color && datas.color.length) {  
296 - this.$set(this, "tabbarBackgroud", datas.color); 289 + },
  290 +
  291 + /**
  292 + * style7跳转
  293 + * @param {object} item [数据对象]
  294 + */
  295 + jump(item) {
  296 + // 判断并调用通用跳转
  297 + if (typeof this.$parent.gotoDetail === "function") {
  298 + // 构造跳转详情页参数
  299 + let options = {
  300 + type: "2",
  301 + to: item.id,
  302 + shop_type: item.shop_type
  303 + };
  304 +
  305 + this.$parent.gotoDetail(options);
297 } 306 }
298 - /* 获取优选库精选活动数据 结束 */  
299 - } else if (res.code == 400) {  
300 - // 获取优选库精选活动失败  
301 - Toast(res.message);  
302 - } else {  
303 - // 获取优选库精选活动失败  
304 - Toast("获取优选库精选活动失败");  
305 - }  
306 - }, 307 + },
307 308
308 - /**  
309 - * 调用通用跳转  
310 - * @param {object} item [通用跳转对象]  
311 - */  
312 - toDetail(item) {  
313 - // 判断是否有通用跳转函数  
314 - if (typeof this.$parent.gotoDetail === "function") {  
315 - // 调用通用跳转  
316 - this.$parent.gotoDetail(item); 309 + /**
  310 + * 加入购物车
  311 + * @param {object} item [数据对象]
  312 + */
  313 + addCart(item) {
  314 + // 通用跳转
  315 + this.jump(item);
317 } 316 }
318 }, 317 },
319 -  
320 - /**  
321 - * style7跳转  
322 - * @param {object} item [数据对象]  
323 - */  
324 - jump(item) {  
325 - // 判断并调用通用跳转  
326 - if (typeof this.$parent.gotoDetail === "function") {  
327 - // 构造跳转详情页参数  
328 - let options = {  
329 - type: "2",  
330 - to: item.id,  
331 - shop_type: item.shop_type 318 + head: {
  319 + title() {
  320 + return {
  321 + inner: this.title
332 }; 322 };
333 -  
334 - this.$parent.gotoDetail(options);  
335 } 323 }
336 }, 324 },
337 -  
338 - /**  
339 - * 加入购物车  
340 - * @param {object} item [数据对象]  
341 - */  
342 - addCart(item) {  
343 - // 通用跳转  
344 - this.jump(item);  
345 - }  
346 - },  
347 - head: {  
348 - title() {  
349 - return {  
350 - inner: this.title  
351 - };  
352 - }  
353 - },  
354 - watch: {  
355 - // 设置页面标题  
356 - title(newVal) {  
357 - if (  
358 - this.$store.state.browser.toLowerCase() == "qq" &&  
359 - this.$store.state.deviceType.toLowerCase() == "iphone"  
360 - ) {  
361 - this.$iFrame.insertIFrame(newVal);  
362 - } else {  
363 - this.$emit("updateHead"); 325 + watch: {
  326 + // 设置页面标题
  327 + title(newVal) {
  328 + if (
  329 + this.$store.state.browser.toLowerCase() == "qq" &&
  330 + this.$store.state.deviceType.toLowerCase() == "iphone"
  331 + ) {
  332 + this.$iFrame.insertIFrame(newVal);
  333 + } else {
  334 + this.$emit("updateHead");
  335 + }
364 } 336 }
365 } 337 }
366 } 338 }
367 -};  
368 </script> 339 </script>
369 340
370 <!-- Add "scoped" attribute to limit CSS to this component only --> 341 <!-- Add "scoped" attribute to limit CSS to this component only -->
371 <style rel="stylesheet/less" lang="less" scoped> 342 <style rel="stylesheet/less" lang="less" scoped>
372 -@import "mall"; 343 + @import "mall";
373 </style> 344 </style>
src/pages/mall2/mall2.less
  View file @7779061
@@ -3,25 +3,69 @@ @@ -3,25 +3,69 @@
3 .mall-box { 3 .mall-box {
4 background-color: #F6F6F6; 4 background-color: #F6F6F6;
5 min-height: 100vh; 5 min-height: 100vh;
6 - .call-app-box { 6 + .navs-box {
7 position: fixed; 7 position: fixed;
8 top: 0; 8 top: 0;
9 z-index: 100; 9 z-index: 100;
10 - }  
11 - .back-box {  
12 - position: fixed;  
13 - top: 0;  
14 - z-index: 100;  
15 - background: linear-gradient(180deg, rgba(0, 0, 0, 0.39) 0%, rgba(0, 0, 0, 0) 100%); 10 + width: 100%;
  11 + height: auto;
  12 + .call-app-box {
  13 + position: fixed;
  14 + top: 0;
  15 + z-index: 100;
  16 + }
  17 + .back-box {
  18 + // background: linear-gradient(180deg, rgba(0, 0, 0, 0.39) 0%, rgba(0, 0, 0, 0) 100%);
  19 + background: #ffffff;
  20 + width: 100%;
  21 + }
  22 + .tabs-box {
  23 + display: flex;
  24 + justify-content: center;
  25 + align-items: center;
  26 + background-color: #ffffff;
  27 + width: 100%;
  28 + height: 78px;
  29 + border-top: 1px solid #E6E6E6;
  30 + .tab {
  31 + flex: 1;
  32 + & + .tab {
  33 + border-left: 1px solid #E6E6E6;
  34 + }
  35 + .title {
  36 + text-align: center;
  37 + color: #999999;
  38 + font-size: 32px;
  39 + font-weight: 500;
  40 + }
  41 + .line {
  42 + background-color: transparent;
  43 + margin: 10px auto 0 auto;
  44 + width: 30px;
  45 + height: 4px;
  46 + border-radius: 4px;
  47 +
  48 + }
  49 + &.active {
  50 + .title {
  51 + color: #4A4A4A;
  52 + font-weight: bold;
  53 + }
  54 + .line {
  55 + background-color: #FC1541;
  56 + }
  57 + }
  58 + }
  59 + }
16 } 60 }
17 .pl { 61 .pl {
18 background-color: transparent; 62 background-color: transparent;
19 width: 100%; 63 width: 100%;
20 &.is-open-app { 64 &.is-open-app {
21 - height: 122px; 65 + height: 200px;
22 } 66 }
23 &.is-cnlive { 67 &.is-cnlive {
24 - height: 93px; 68 + height: 171px;
25 } 69 }
26 } 70 }
27 .main-box { 71 .main-box {
src/pages/mall2/mall2.vue
  View file @7779061
1 <template> 1 <template>
2 <div class="mall-box"> 2 <div class="mall-box">
3 3
4 - <!-- H5唤起App组件 -->  
5 - <call-app-box class="call-app-box" ref="callApp" v-if="!isCNLive.value && $parent.isOpenApp.value"  
6 - :callApps="$parent.callApps">  
7 - </call-app-box>  
8 -  
9 - <!-- 后退导航 -->  
10 - <back-box class="back-box" :style="'padding-top: ' + $parent.top.value + 'px'" v-if="isCNLive.value && $route.query.showBack == true" @back="back"  
11 - :backs="backs">  
12 - </back-box> 4 + <!-- Nav导航 -->
  5 + <div class="navs-box" :class="{'hide': $route.query.hideBack == true}" :style="'padding-top: ' + $parent.top.value + 'px'" v-if="showNavs">
  6 +
  7 + <!-- H5唤起App组件 -->
  8 + <call-app-box class="call-app-box" ref="callApp" v-if="!isCNLive.value && $parent.isOpenApp.value"
  9 + :callApps="$parent.callApps">
  10 + </call-app-box>
  11 +
  12 + <!-- 后退导航 -->
  13 + <back-box class="back-box" ref="backBox" v-if="!isWeChat.value" @back="back"
  14 + :backs="backs">
  15 + </back-box>
  16 +
  17 + <!-- 国内品牌和境外品牌切换tabs -->
  18 + <div class="tabs-box">
  19 + <div class="tab" :class="{'active': isActiveTab == 1}" @click="changeTabs(1)">
  20 + <div class="title">国内</div>
  21 + <div class="line"></div>
  22 + </div>
  23 + <div class="tab" :class="{'active': isActiveTab == 2}" @click="changeTabs(2)">
  24 + <div class="title">境外</div>
  25 + <div class="line"></div>
  26 + </div>
  27 + </div>
  28 + </div>
13 29
14 <!-- pl --> 30 <!-- pl -->
15 - <div class="pl" :class="{'is-cnlive': isCNLive.value && $route.query.showBack == true, 'is-open-app': $parent.isOpenApp.value}"></div> 31 + <div class="pl" :class="{'hide': $route.query.hideBack == true, 'is-cnlive': !isWeChat.value, 'is-open-app': $parent.isOpenApp.value}" :style="'padding-top: ' + $parent.top.value + 'px'" v-if="!isWeChat.value && showNavs"></div>
16 32
17 <!-- 主区域 --> 33 <!-- 主区域 -->
18 <div class="main-box"> 34 <div class="main-box">
@@ -94,12 +110,14 @@ @@ -94,12 +110,14 @@
94 return { 110 return {
95 title: "", // 标题 111 title: "", // 标题
96 backs: null, // 后退按钮组 112 backs: null, // 后退按钮组
  113 + isActiveTab: 0, // 当前活动tab
97 CALL_STATUS: { 114 CALL_STATUS: {
98 INIT: "init", // 初始化页面 115 INIT: "init", // 初始化页面
99 REFRESH: "refresh", // 刷新页面 116 REFRESH: "refresh", // 刷新页面
100 LOAD_MORE: "loadMore" // 加载更多 117 LOAD_MORE: "loadMore" // 加载更多
101 }, 118 },
102 navs: null, // 导航 119 navs: null, // 导航
  120 + showNavs: false, // 是否显示其它频道跳转，默认不显示
103 shopListsPage: {}, // 店铺商品列表分页相关参数 121 shopListsPage: {}, // 店铺商品列表分页相关参数
104 shopLists: null // 店铺商品列表 122 shopLists: null // 店铺商品列表
105 }; 123 };
@@ -116,15 +134,36 @@ @@ -116,15 +134,36 @@
116 // 设置标题 134 // 设置标题
117 this.$set(this, 'title', '旗舰店'); 135 this.$set(this, 'title', '旗舰店');
118 136
  137 + // 设置活动标签
  138 + this.$set(this, 'isActiveTab', this.$route.query.type || 1);
  139 +
119 // 旗舰店swiper 140 // 旗舰店swiper
120 this.flagship(); 141 this.flagship();
121 142
122 // 旗舰店店铺商品 143 // 旗舰店店铺商品
123 this.flagshipList(); 144 this.flagshipList();
124 145
125 - // 判断是否在App内 146 + // 判断在App内
126 if (this.isCNLive.value) { 147 if (this.isCNLive.value) {
127 148
  149 + // 判断App版本，判断是否显示积分商城模块
  150 + if (typeof this.$parent.compareVersion === 'function') {
  151 +
  152 + // 获取平台版本
  153 + let version = this.$route.query.version;
  154 +
  155 + // 根据平台，判断是否符合版本，显示搜索和其它导航菜单
  156 + if ((this.isiPhone.value && this.$parent.compareVersion(version, '1.9.6')) || (this.isAndroid.value && this.$parent.compareVersion(version, '1.8.3.1'))) {
  157 +
  158 + // 设置显示导航模块
  159 + this.$set(this, 'showNavs', true);
  160 + }
  161 + }
  162 + }
  163 +
  164 + // 判断是否在App内
  165 + if (!this.isWeChat.value) {
  166 +
128 // 添加后退按钮组“后退”和“分享”按钮 167 // 添加后退按钮组“后退”和“分享”按钮
129 this.$set(this, 'backs', { 168 this.$set(this, 'backs', {
130 title: this.title, 169 title: this.title,
@@ -175,6 +214,36 @@ @@ -175,6 +214,36 @@
175 }, 214 },
176 215
177 /** 216 /**
  217 + * 切换tab
  218 + * @param {Number} activeTab [被选择的tab]
  219 + */
  220 + changeTabs(activeTab) {
  221 +
  222 + // 判断是否有切换操作
  223 + if (activeTab != this.isActiveTab) {
  224 +
  225 + // 设置type
  226 + Object.assign(this.$route.query, {
  227 + type: activeTab
  228 + });
  229 +
  230 + // 设置活动tab项目
  231 + this.$set(this, 'isActiveTab', activeTab);
  232 +
  233 + /* 重新加载页面数据 开始 */
  234 +
  235 + // 旗舰店swiper
  236 + this.flagship();
  237 +
  238 + // 旗舰店店铺商品
  239 + this.flagshipList();
  240 +
  241 + /* 重新加载页面数据 结束 */
  242 +
  243 + }
  244 + },
  245 +
  246 + /**
178 * 旗舰店swiper 247 * 旗舰店swiper
179 */ 248 */
180 flagship() { 249 flagship() {
src/pages/newDaren/newDaren.less
  View file @7779061
@@ -2,4 +2,26 @@ @@ -2,4 +2,26 @@
2 2
3 .daren-list { 3 .daren-list {
4 margin: 30px 0; 4 margin: 30px 0;
  5 + .call-app-box {
  6 + position: fixed;
  7 + top: 0;
  8 + z-index: 100;
  9 + }
  10 + .back-box {
  11 + position: fixed;
  12 + top: 0;
  13 + z-index: 100;
  14 + // background: linear-gradient(180deg, rgba(0, 0, 0, 0.39) 0%, rgba(0, 0, 0, 0) 100%);
  15 + background: #fff;
  16 + }
  17 + .pl {
  18 + background-color: transparent;
  19 + width: 100%;
  20 + &.is-open-app {
  21 + height: 122px;
  22 + }
  23 + &.is-cnlive {
  24 + height: 93px;
  25 + }
  26 + }
5 } 27 }
6 \ No newline at end of file 28 \ No newline at end of file
src/pages/newDaren/newDaren.vue
  View file @7779061
1 <template> 1 <template>
2 <div class="daren-list"> 2 <div class="daren-list">
3 3
  4 + <!-- H5唤起App组件 -->
  5 + <call-app-box class="call-app-box" ref="callApp" v-if="!isCNLive.value && $parent.isOpenApp.value"
  6 + :callApps="$parent.callApps">
  7 + </call-app-box>
  8 +
  9 + <!-- 后退导航 -->
  10 + <back-box class="back-box" :class="{'hide': $route.query.hideBack == true}" :style="'padding-top: ' + $parent.top.value + 'px'" ref="backBox" v-if="!isWeChat.value" @back="back"
  11 + :backs="backs">
  12 + </back-box>
  13 +
  14 + <!-- pl -->
  15 + <div class="pl" :class="{'hide': $route.query.hideBack == true, 'is-cnlive': isCNLive.value, 'is-open-app': $parent.isOpenApp.value}" :style="'padding-top: ' + $parent.top.value + 'px'" v-if="!isWeChat.value"></div>
  16 +
4 <!--轮播--> 17 <!--轮播-->
5 <!-- <swiper v-if="banner" 18 <!-- <swiper v-if="banner"
6 :swipers="banner" 19 :swipers="banner"
@@ -13,26 +26,46 @@ @@ -13,26 +26,46 @@
13 <!--达人信息--> 26 <!--达人信息-->
14 <!-- <shop-daten-top v-if="shopDatenTop" @userJump="userJump" :shopDatenTop="shopDatenTop"></shop-daten-top> --> 27 <!-- <shop-daten-top v-if="shopDatenTop" @userJump="userJump" :shopDatenTop="shopDatenTop"></shop-daten-top> -->
15 28
16 - <!-- 已关注达人列表（4条） -->  
17 - <!-- 已关注达人 -->  
18 - <div v-if="dresserList&&dresserList.length">  
19 -  
20 - <!-- 标题 -->  
21 - <text-title-box @more="h5More"  
22 - :titles="{  
23 - title: '已关注达人动态',  
24 - more: true  
25 - }">  
26 - </text-title-box>  
27 -  
28 - <!-- 已关注达人列表（4条） -->  
29 - <div>  
30 - <!-- 达人列表组件 -->  
31 - <dresserList @toDetail="toDetail"  
32 - :dresserList="dresserList">  
33 - </dresserList>  
34 - </div> 29 + <!-- 已关注达人动态列表（4条） -->
  30 + <!-- <div v-if="dresserList&&dresserList.length"> -->
  31 +
  32 + <!-- 标题 -->
  33 + <!-- <text-title-box @more="h5More"
  34 + :titles="{
  35 + title: '已关注达人动态',
  36 + more: true
  37 + }">
  38 + </text-title-box> -->
  39 +
  40 + <!-- 已关注达人动态列表（4条） -->
  41 + <!-- <div> -->
  42 + <!-- 达人列表组件 -->
  43 + <!-- <dresserList @toDetail="toDetail"
  44 + :dresserList="dresserList">
  45 + </dresserList>
35 </div> 46 </div>
  47 + </div> -->
  48 +
  49 + <!-- 已关注达人列表（4条） -->
  50 + <div v-if="dresserList&&dresserList.length">
  51 +
  52 + <!-- 标题 -->
  53 + <text-title-box @more="h5More"
  54 + :titles="{
  55 + title: '关注达人列表',
  56 + more: true
  57 + }">
  58 + </text-title-box>
  59 +
  60 + <!-- 已关注达人列表（4条） -->
  61 + <div>
  62 + <!-- 达人列表组件 -->
  63 + <dresserList @toDetail="toDetail"
  64 + :dresserList="dresserList">
  65 + </dresserList>
  66 + </div>
  67 + </div>
  68 +
36 <!--推荐达人--> 69 <!--推荐达人-->
37 70
38 <!-- 最新动态标题 --> 71 <!-- 最新动态标题 -->
@@ -40,8 +73,7 @@ @@ -40,8 +73,7 @@
40 :titles="{ 73 :titles="{
41 title: '推荐达人', 74 title: '推荐达人',
42 more: true 75 more: true
43 - }"  
44 - > 76 + }">
45 </text-title-box> 77 </text-title-box>
46 78
47 <!--导航--> 79 <!--导航-->
@@ -65,13 +97,8 @@ @@ -65,13 +97,8 @@
65 </daren-list-box> 97 </daren-list-box>
66 98
67 <div class="item_box"> 99 <div class="item_box">
68 - <div  
69 - infinite-scroll-immediate-check="true"  
70 - v-infinite-scroll="getNewDynamicList"  
71 - infinite-scroll-disabled="loading"  
72 - :infinite-scroll-distance="50">  
73 -  
74 - <daren-list-box class="daren-list" @userJump="userJump" @jump="jump" @goodsJump="goodsJump" @goodsPrimary="goodsPrimary" 100 + <div infinite-scroll-immediate-check="true" v-infinite-scroll="getNewDynamicList" infinite-scroll-disabled="loading" :infinite-scroll-distance="50">
  101 + <daren-list-box class="daren-list" @userJump="userJump" @jump="jump" @goodsJump="goodsJump" @goodsPrimary="goodsPrimary" @fansShop="fansShop" @toDarenShop="userJump"
75 :lists="shopFnsDynamic"> 102 :lists="shopFnsDynamic">
76 103
77 <!--最新达人动态--> 104 <!--最新达人动态-->
@@ -79,8 +106,7 @@ @@ -79,8 +106,7 @@
79 :titles="{ 106 :titles="{
80 title: '最新达人动态', 107 title: '最新达人动态',
81 more: false 108 more: false
82 - }"  
83 - > 109 + }">
84 </text-title-box> 110 </text-title-box>
85 </daren-list-box> 111 </daren-list-box>
86 </div> 112 </div>
@@ -92,6 +118,8 @@ @@ -92,6 +118,8 @@
92 118
93 // 引入组件 119 // 引入组件
94 import { Toast, Indicator } from "mint-ui"; 120 import { Toast, Indicator } from "mint-ui";
  121 +import callAppBox from "@/components/callAppBox/callAppBox";
  122 +import backBox from "@/components/backBox/backBox";
95 import swiper from "@/components/swiper/swiper"; 123 import swiper from "@/components/swiper/swiper";
96 import darenListBox from "@/components/darenListBox/darenListBox"; 124 import darenListBox from "@/components/darenListBox/darenListBox";
97 import textTitleBox from "@/components/textTitleBox/textTitleBox"; 125 import textTitleBox from "@/components/textTitleBox/textTitleBox";
@@ -103,30 +131,48 @@ export default { @@ -103,30 +131,48 @@ export default {
103 name: "darenList", 131 name: "darenList",
104 data () { 132 data () {
105 return { 133 return {
106 - title: "", // 标题  
107 - isLoading: false, // 下拉刷新中  
108 - shopDatenTop: null, // 置顶达人信息  
109 - banner: [], // 轮播  
110 - dresserList: null, // 已关注达人  
111 - shopDarenHot: null, // 达人推荐列表  
112 - fansDaren: null, // 已关注达人动态  
113 - shopFnsDynamic: null, // 达人动态  
114 - loading: false, // 加载  
115 - pages: 0 // 分页 134 + title: "", // 标题
  135 + backs: null, // 后退按钮组
  136 + isLoading: false, // 下拉刷新中
  137 + shopDatenTop: null, // 置顶达人信息
  138 + banner: [], // 轮播
  139 + // dresserList: null, // 已关注达人动态列表
  140 + dresserList: null, // 已关注达人列表
  141 + shopDarenHot: null, // 达人推荐列表
  142 + fansDaren: null, // 已关注达人动态
  143 + shopFnsDynamic: null, // 达人动态
  144 + loading: false, // 加载
  145 + pages: 0 // 分页
116 } 146 }
117 }, 147 },
118 components: { 148 components: {
119 - darenListBox,  
120 - textTitleBox,  
121 - swiper,  
122 - shopDatenTop,  
123 - horizList,  
124 - dresserList 149 + callAppBox,
  150 + backBox,
  151 + darenListBox,
  152 + textTitleBox,
  153 + swiper,
  154 + shopDatenTop,
  155 + horizList,
  156 + dresserList
125 }, 157 },
126 created () { 158 created () {
127 -  
128 - // 设置标题  
129 - this.$set(this, "title", "达人"); 159 +
  160 + // 设置标题
  161 + this.$set(this, "title", "达人");
  162 +
  163 + // 判断是否在App内
  164 + if (this.isCNLive.value) {
  165 +
  166 + // 添加后退按钮组“后退”和“分享”按钮
  167 + this.$set(this, 'backs', {
  168 + title: this.title,
  169 + funcs: {
  170 + back: {
  171 + icon: "static/img/icon_back.png"
  172 + }
  173 + }
  174 + });
  175 + }
130 176
131 // 获取优选库精选活动 177 // 获取优选库精选活动
132 this.newDarenIndex(); 178 this.newDarenIndex();
@@ -151,20 +197,21 @@ export default { @@ -151,20 +197,21 @@ export default {
151 * 达人最新动态 197 * 达人最新动态
152 */ 198 */
153 getNewDynamicList () { 199 getNewDynamicList () {
154 - this.loading = true;  
155 - this.pages++  
156 - // 加载中提示  
157 - Indicator.open("加载中...");  
158 -  
159 - // 获取证书请求接口  
160 - this.http("/Api/" + this.getApiVersion().dynamic + "/getNewDynamicList", {  
161 - uid: this.$route.query.uid,  
162 - page: this.pages,  
163 - type: 1  
164 - }, this.getNewDynamicListCallback, {  
165 - method: "post"  
166 - }  
167 - ); 200 +
  201 + this.loading = true;
  202 + this.pages++
  203 +
  204 + // 加载中提示
  205 + Indicator.open("加载中...");
  206 +
  207 + // 获取证书请求接口
  208 + this.http("/Api/" + this.getApiVersion().dynamic + "/getNewDynamicList", {
  209 + uid: this.$route.query.uid,
  210 + page: this.pages,
  211 + type: 1
  212 + }, this.getNewDynamicListCallback, {
  213 + method: "post"
  214 + });
168 }, 215 },
169 216
170 /** 217 /**
@@ -173,46 +220,53 @@ export default { @@ -173,46 +220,53 @@ export default {
173 * @param {object} ext [扩展参数] 220 * @param {object} ext [扩展参数]
174 */ 221 */
175 getNewDynamicListCallback (res, ext) { 222 getNewDynamicListCallback (res, ext) {
176 -  
177 - // 加载完成  
178 - Indicator.close();  
179 -  
180 - // 返回处理  
181 - if (res.code == 200) {  
182 - // 解构数据  
183 - let { data: datas } = res;  
184 - // 设置shopFnsDynamic达人动态数据  
185 -  
186 - if (datas.list && datas.list.length) {  
187 - // 隐藏加载圈  
188 - this.loading = false;  
189 - if (this.pages > 1) {  
190 - this.$set(this, "shopFnsDynamic", [...this.shopFnsDynamic, ...datas.list]);  
191 - } else {  
192 - this.$set(this, "shopFnsDynamic", datas.list);  
193 - }  
194 - // 将视频地址加入到图片数组中  
195 - if (this.shopFnsDynamic && this.shopFnsDynamic.length > 0) {  
196 - for (let item of this.shopFnsDynamic) {  
197 - // 将视频图片加入图片数组，方便循环输出  
198 - if (item.video_img) {  
199 - this.$set(item, "img", [...[item.video_img], ...item.img]);  
200 - } 223 +
  224 + // 加载完成
  225 + Indicator.close();
  226 +
  227 + // 返回处理
  228 + if (res.code == 200) {
  229 +
  230 + // 解构数据
  231 + let { data: datas } = res;
  232 +
  233 + // 设置shopFnsDynamic达人动态数据
  234 +
  235 + if (datas.list && datas.list.length) {
  236 +
  237 + // 隐藏加载圈
  238 + this.loading = false;
  239 + if (this.pages > 1) {
  240 + this.$set(this, "shopFnsDynamic", [...this.shopFnsDynamic, ...datas.list]);
  241 + } else {
  242 + this.$set(this, "shopFnsDynamic", datas.list);
  243 + }
  244 +
  245 + // 将视频地址加入到图片数组中
  246 + if (this.shopFnsDynamic && this.shopFnsDynamic.length > 0) {
  247 + for (let item of this.shopFnsDynamic) {
  248 +
  249 + // 将视频图片加入图片数组，方便循环输出
  250 + if (item.video_img) {
  251 + this.$set(item, "img", [...[item.video_img], ...item.img]);
  252 + }
  253 + }
  254 + }
201 } 255 }
202 - }  
203 - }  
204 - /* 获取达人动态数据 结束 */  
205 256
206 - } else if (res.code == 400) { 257 + /* 获取达人动态数据 结束 */
207 258
208 - // 获取达人动态失败  
209 - Toast(res.message);  
210 - } else {  
211 -  
212 - // 获取优选库精选活动失败  
213 - Toast("获取达人动态失败");  
214 - } 259 + } else if (res.code == 400) {
  260 +
  261 + // 获取达人动态失败
  262 + Toast(res.message);
  263 + } else {
  264 +
  265 + // 获取优选库精选活动失败
  266 + Toast("获取达人动态失败");
  267 + }
215 }, 268 },
  269 +
216 // 下拉刷新 270 // 下拉刷新
217 // onRefresh() { 271 // onRefresh() {
218 272
@@ -266,8 +320,9 @@ export default { @@ -266,8 +320,9 @@ export default {
266 320
267 // 获取“达人列表数据” 321 // 获取“达人列表数据”
268 if (datas.list && datas.list.length) { 322 if (datas.list && datas.list.length) {
269 - // 设置“达人列表数据”数据  
270 - this.$set(this, "dresserList", datas.list.filter((item, index, arr) => { return index < 4 })); 323 +
  324 + // 设置“达人列表数据”数据
  325 + this.$set(this, "dresserList", datas.list.filter((item, index, arr) => { return index < 4 }));
271 } 326 }
272 327
273 // 设置banner数据 328 // 设置banner数据
@@ -283,6 +338,7 @@ export default { @@ -283,6 +338,7 @@ export default {
283 if (datas.shop_daren_hot && datas.shop_daren_hot.length) { 338 if (datas.shop_daren_hot && datas.shop_daren_hot.length) {
284 this.$set(this, "shopDarenHot", datas.shop_daren_hot); 339 this.$set(this, "shopDarenHot", datas.shop_daren_hot);
285 } 340 }
  341 +
286 // 设置fansDaren已关注达人动态数据 342 // 设置fansDaren已关注达人动态数据
287 343
288 if (datas.shop_fans_dynamic && datas.shop_fans_dynamic.length) { 344 if (datas.shop_fans_dynamic && datas.shop_fans_dynamic.length) {
@@ -312,18 +368,20 @@ export default { @@ -312,18 +368,20 @@ export default {
312 * 关注/取消关注达人 368 * 关注/取消关注达人
313 */ 369 */
314 fansShop (item) { 370 fansShop (item) {
315 - Indicator.open("加载中...");  
316 - // 判断必要参数  
317 - if (item.id && this.$route.query.uid) { 371 +
  372 + Indicator.open("加载中...");
  373 +
  374 + // 判断必要参数
  375 + if (item.id && this.$route.query.uid) {
  376 +
318 // 请求接口 377 // 请求接口
319 this.http("/Api/" + this.getApiVersion().dynamic + "/fansShop", { 378 this.http("/Api/" + this.getApiVersion().dynamic + "/fansShop", {
320 - id: item.id || 0,  
321 - uid: this.$route.query.uid || 0 379 + id: (item.shop_user ? item.shop_user.id : item.id) || 0,
  380 + uid: this.$route.query.uid || 0
322 }, this.fansShopCallback, { 381 }, this.fansShopCallback, {
323 method: "post", 382 method: "post",
324 item 383 item
325 - }  
326 - ); 384 + });
327 } 385 }
328 }, 386 },
329 387
@@ -333,30 +391,50 @@ export default { @@ -333,30 +391,50 @@ export default {
333 * @param {object} ext [扩展参数] 391 * @param {object} ext [扩展参数]
334 */ 392 */
335 fansShopCallback (res, ext) { 393 fansShopCallback (res, ext) {
  394 +
  395 + // 加载完成
  396 + Indicator.close();
  397 +
  398 + if (res.code) {
  399 +
  400 + // 设置已关注
  401 + if (ext.item.is_fans) {
  402 + if (ext.item.is_fans == "0") {
  403 +
  404 + // 关注达人
  405 + this.$set(ext.item, "is_fans", "1");
  406 + Toast("关注成功");
  407 + } else if (ext.item.is_fans == "1") {
  408 +
  409 + // 取消关注达人
  410 + this.$set(ext.item, "is_fans", "0");
  411 + Toast("取消关注成功");
  412 + }
  413 + } else if (ext.item.shop_user) {
  414 +
  415 + if (ext.item.shop_user.is_fans == '0') {
  416 +
  417 + // 关注达人
  418 + this.$set(ext.item.shop_user, "is_fans", "1");
  419 + Toast("关注成功");
  420 + } else {
  421 +
  422 + // 取消关注达人
  423 + this.$set(ext.item.shop_user, "is_fans", "0");
  424 + Toast("取消关注成功");
  425 + }
  426 + }
  427 + } else if (res.statusCode === 200 && res.data.code == 400) {
336 428
337 - // 加载完成  
338 - Indicator.close();  
339 - if (res.code) {  
340 - // 设置已关注  
341 - if (ext.item.is_fans == "0") {  
342 - // 关注达人  
343 - this.$set(ext.item, "is_fans", "1");  
344 - Toast("关注成功"); 429 + // 关注失败
  430 + Toast(res.data.message);
345 } else { 431 } else {
346 - // 取消关注达人  
347 - this.$set(ext.item, "is_fans", "0");  
348 - Toast("取消关注成功");  
349 - }  
350 - } else if (res.statusCode === 200 && res.data.code == 400) {  
351 432
352 - // 关注失败  
353 - Toast(res.data.message);  
354 - } else {  
355 -  
356 - // 关注失败  
357 - Toast("关注失败");  
358 - } 433 + // 关注失败
  434 + Toast("关注失败");
  435 + }
359 }, 436 },
  437 +
360 /** 438 /**
361 * 调用通用跳转 439 * 调用通用跳转
362 * @param {object} item [通用跳转对象] 440 * @param {object} item [通用跳转对象]
@@ -382,6 +460,15 @@ export default { @@ -382,6 +460,15 @@ export default {
382 // 判断是否有通用跳转函数 460 // 判断是否有通用跳转函数
383 if (typeof this.$parent.gotoDetail === "function") { 461 if (typeof this.$parent.gotoDetail === "function") {
384 462
  463 + // 设置跳转达人个人主页用户数据
  464 + Object.assign(item, {
  465 + type: "5",
  466 + to: (this.mode == "prod") ?
  467 + "https://managemall.cnlive.com/html/preferred-library/1/#/pages/darenProfile/darenProfile?from=redirect" + "&id=" + (item.user_id) + (this.getStore("uid") ? "&uid=" + this.getStore("uid") : "") :
  468 + "https://wjjshop.cnlive.com/html/preferred-library/1/#/pages/darenProfile/darenProfile?from=redirect"+ "&id=" + (item.user_id) + (this.getStore("uid") ? "&uid=" + this.getStore("uid") : ""),
  469 + shop_type: ""
  470 + });
  471 +
385 // 调用通用跳转 472 // 调用通用跳转
386 this.$parent.gotoDetail(item); 473 this.$parent.gotoDetail(item);
387 } 474 }
@@ -513,6 +600,23 @@ export default { @@ -513,6 +600,23 @@ export default {
513 // 调用通用跳转 600 // 调用通用跳转
514 this.$parent.gotoDetail(item); 601 this.$parent.gotoDetail(item);
515 } 602 }
  603 + },
  604 +
  605 + /**
  606 + * 后退
  607 + */
  608 + back() {
  609 +
  610 + // 判断是否有处理函数
  611 + if (typeof this.$parent.back === 'function') {
  612 +
  613 + // 后退
  614 + this.$parent.back();
  615 + } else {
  616 +
  617 + // 后退
  618 + window.history.go(-1);
  619 + }
516 } 620 }
517 }, 621 },
518 head: { 622 head: {
src/pages/optimization2/optimization2.less
  View file @7779061
@@ -14,6 +14,13 @@ @@ -14,6 +14,13 @@
14 z-index: 100; 14 z-index: 100;
15 background: linear-gradient(180deg, rgba(0, 0, 0, 0.39) 0%, rgba(0, 0, 0, 0) 100%); 15 background: linear-gradient(180deg, rgba(0, 0, 0, 0.39) 0%, rgba(0, 0, 0, 0) 100%);
16 } 16 }
  17 + .back-search-box {
  18 + position: fixed;
  19 + top: 0;
  20 + z-index: 100;
  21 + // background: linear-gradient(180deg, rgba(0, 0, 0, 0.39) 0%, rgba(0, 0, 0, 0) 100%);
  22 + background-color: #ffffff;
  23 + }
17 .pl { 24 .pl {
18 background-color: transparent; 25 background-color: transparent;
19 width: 100%; 26 width: 100%;
@@ -29,13 +36,29 @@ @@ -29,13 +36,29 @@
29 .section { 36 .section {
30 background-color: #ffffff; 37 background-color: #ffffff;
31 margin: 0 auto 40px auto; 38 margin: 0 auto 40px auto;
32 - width: 690px; 39 + width: 710px;
33 height: auto; 40 height: auto;
34 border-radius: 24px; 41 border-radius: 24px;
35 overflow: hidden; 42 overflow: hidden;
  43 + &.banner-box {
  44 +
  45 + }
  46 + &.page-list {
  47 + background-color: transparent;
  48 + margin-bottom: 0;
  49 + /deep/ .icon-swiper-box {
  50 + .icons-com {
  51 + .title {
  52 + color: #444;
  53 + font-size: 24px;
  54 + font-weight: 400;
  55 + }
  56 + }
  57 + }
  58 + }
36 &.shop-list { 59 &.shop-list {
37 /deep/ .text-bg-title-com { 60 /deep/ .text-bg-title-com {
38 - height: 76px; 61 + height: 70px;
39 } 62 }
40 .header-img-box { 63 .header-img-box {
41 width: 100%; 64 width: 100%;
@@ -79,6 +102,15 @@ @@ -79,6 +102,15 @@
79 &.hot-box { 102 &.hot-box {
80 103
81 } 104 }
  105 + &.sub-banner-box {
  106 + // width: 100%;
  107 + height: auto;
  108 + .sub-banner-img {
  109 + display: block;
  110 + width: 100%;
  111 + height: auto;
  112 + }
  113 + }
82 &.goods-list { 114 &.goods-list {
83 background-color: transparent; 115 background-color: transparent;
84 margin: 0 auto; 116 margin: 0 auto;
@@ -89,5 +121,57 @@ @@ -89,5 +121,57 @@
89 } 121 }
90 } 122 }
91 } 123 }
  124 + .section-col-2 {
  125 + display: flex;
  126 + justify-content: space-between;
  127 + align-items: center;
  128 + margin: 0 auto 40px auto;
  129 + width: 710px;
  130 + height: auto;
  131 + .section-2 {
  132 + background-color: #ffffff;
  133 + width: 346px;
  134 + height: auto;
  135 + border-radius: 24px;
  136 + overflow: hidden;
  137 + &.shop-list {
  138 + /deep/ .text-bg-title-com {
  139 + height: 70px;
  140 + }
  141 + .header-img-box {
  142 + width: 100%;
  143 + height: 100%;
  144 + .header-img {
  145 + display: block;
  146 + width: 100%;
  147 + height: 100%;
  148 + }
  149 + }
  150 + .list-box {
  151 + display: flex;
  152 + justify-content: space-between;
  153 + align-items: center;
  154 + .discount-flag {
  155 + position: absolute;
  156 + top: 4px;
  157 + left: 22px;
  158 + z-index: 1;
  159 + background: linear-gradient(90deg, #F9EE7A 0%, #FAD844 100%);
  160 + padding: 1px 8px;
  161 + color: #945A08;
  162 + font-size: 20px;
  163 + font-weight: 400;
  164 + border-radius: 6px;
  165 + }
  166 + }
  167 + .points-box {
  168 + /deep/ .box {
  169 + padding: 28px 0;
  170 + border-top: 1px solid #DCDCDC;
  171 + }
  172 + }
  173 + }
  174 + }
  175 + }
92 } 176 }
93 } 177 }
94 \ No newline at end of file 178 \ No newline at end of file
src/pages/optimization2/optimization2.vue
  View file @7779061
@@ -7,18 +7,101 @@ @@ -7,18 +7,101 @@
7 </call-app-box> 7 </call-app-box>
8 8
9 <!-- 后退导航 --> 9 <!-- 后退导航 -->
10 - <back-box class="back-box" :style="'padding-top: ' + $parent.top.value + 'px'" ref="backBox" v-if="isCNLive.value && $route.query.showBack == true" @back="back" 10 + <back-search-box class="back-search-box" :style="'padding-top: ' + $parent.top.value + 'px'" ref="backBox" v-if="!isWeChat.value && showSearch" @back="back" @toSearch="toSearch"
11 :backs="backs"> 11 :backs="backs">
12 - </back-box> 12 + </back-search-box>
  13 +
  14 + <!-- 后退导航 -->
  15 + <!-- <back-box class="back-box" :style="'padding-top: ' + $parent.top.value + 'px'" ref="backBox" v-if="isCNLive.value && $route.query.showBack == true" @back="back"
  16 + :backs="backs">
  17 + </back-box> -->
13 18
14 <!-- pl --> 19 <!-- pl -->
15 - <div class="pl" :class="{'is-cnlive': isCNLive.value && $route.query.showBack == true, 'is-open-app': $parent.isOpenApp.value}"></div> 20 + <div class="pl" :class="{'is-cnlive': !isWeChat.value, 'is-open-app': $parent.isOpenApp.value}" v-if="showSearch"></div>
16 21
17 <!-- 主区域 --> 22 <!-- 主区域 -->
18 <div class="main-box"> 23 <div class="main-box">
19 24
  25 + <!-- 主Banner -->
  26 + <div class="section banner-box" v-if="swipers && swipers.length">
  27 + <swiper-box
  28 + :swipers="swipers"
  29 + :options="{
  30 + showIndicators: true
  31 + }">
  32 + </swiper-box>
  33 + </div>
  34 +
  35 + <!-- 其它频道 -->
  36 + <div class="section page-list" v-if="swiperNavs && showNavs">
  37 +
  38 + <!-- 轮播展示其它频道 -->
  39 + <icon-swiper-box @jump="toPage"
  40 + :icons="swiperNavs">
  41 + </icon-swiper-box>
  42 + </div>
  43 +
20 <!-- 折扣专区 --> 44 <!-- 折扣专区 -->
21 - <div class="section shop-list" v-if="discountLists && discountLists.length"> 45 +
  46 + <!-- 折扣专区/积分商城 -->
  47 + <div class="section-col-2" v-if="showIntegral && pointsLists && pointsLists.length">
  48 +
  49 + <!-- 折扣专区 -->
  50 + <div class="section-2 shop-list" v-if="discountLists && discountLists.length">
  51 +
  52 + <!-- 标题 -->
  53 + <text-bg-title-com @more="toDiscountList"
  54 + :titles="{
  55 + bg: 'static/img/text_bg_title_bg_3.png'
  56 + }">
  57 +
  58 + <!-- 倒计时组件 -->
  59 + <count-down-com slot="extend" v-if="discountTime && discountTime > 0 && discountType == '1'"
  60 + :time="parseInt(discountTime) * 1000"
  61 + sty="4"
  62 + type='h'>
  63 + </count-down-com>
  64 + </text-bg-title-com>
  65 +
  66 + <!-- 商品列表 -->
  67 + <div class="list-box">
  68 +
  69 + <!-- 商品展示样式 10 -->
  70 + <goods-item-10 class="item" v-for="(item, index) in discountLists" :key="index" @jump="toDiscountList(item)"
  71 + :item="item"
  72 + pid="1">
  73 +
  74 + <!-- 折扣角标 -->
  75 + <div class="discount-flag" slot="flag" v-if="parseFloat(item.price) < parseFloat(item.prices)">
  76 + {{item.tag || getDiscount(item.price, item.prices)}}
  77 + </div>
  78 + </goods-item-10>
  79 + </div>
  80 + </div>
  81 +
  82 + <!-- 积分商城 -->
  83 + <div class="section-2 shop-list" ref="integralMallBox" v-if="showIntegral && pointsLists && pointsLists.length">
  84 +
  85 + <!-- 标题 -->
  86 + <text-bg-title-com
  87 + :titles="{
  88 + bg: 'static/img/text_bg_title_bg_4.png'
  89 + }">
  90 + </text-bg-title-com>
  91 +
  92 + <!-- 商品列表 -->
  93 + <div class="list-box">
  94 +
  95 + <!-- 商品展示样式 10 -->
  96 + <goods-item-10 class="item" v-for="(item, index) in pointsLists" :key="index" @jump="pointsMore"
  97 + :item="item"
  98 + pid="2">
  99 + </goods-item-10>
  100 + </div>
  101 + </div>
  102 + </div>
  103 +
  104 + <div class="section shop-list" v-else-if="discountLists && discountLists.length">
22 105
23 <!-- 标题 --> 106 <!-- 标题 -->
24 <text-bg-title-com @more="toDiscountList" 107 <text-bg-title-com @more="toDiscountList"
@@ -60,84 +143,108 @@ @@ -60,84 +143,108 @@
60 </div> --> 143 </div> -->
61 144
62 <!-- 积分商城 --> 145 <!-- 积分商城 -->
63 - <div class="section shop-list" ref="integralMallBox" v-if="showIntegral && pointsLists && pointsLists.length"> 146 + <!-- <div class="section shop-list" ref="integralMallBox" v-if="showIntegral && pointsLists && pointsLists.length"> -->
64 147
65 <!-- 标题 --> 148 <!-- 标题 -->
66 - <text-bg-title-com 149 + <!-- <text-bg-title-com
67 :titles="{ 150 :titles="{
68 - bg: 'static/img/text_bg_title_bg_2.png' 151 + bg: 'static/img/text_bg_title_bg_4.png'
69 }"> 152 }">
70 - </text-bg-title-com> 153 + </text-bg-title-com> -->
71 154
72 <!-- 商品列表 --> 155 <!-- 商品列表 -->
73 - <div class="list-box"> 156 + <!-- <div class="list-box"> -->
74 157
75 <!-- 商品展示样式 2 --> 158 <!-- 商品展示样式 2 -->
76 - <goods-item-2 class="item" v-for="(item, index) in pointsLists" :key="index" @jump="pointsMore" 159 + <!-- <goods-item-2 class="item" v-for="(item, index) in pointsLists" :key="index" @jump="pointsMore"
77 :item="item" 160 :item="item"
78 pid="5"> 161 pid="5">
79 </goods-item-2> 162 </goods-item-2>
80 - </div> 163 + </div> -->
81 164
82 <!-- 积分展示 --> 165 <!-- 积分展示 -->
83 - <more-com class="points-box" @more="pointsMore" 166 + <!-- <more-com class="points-box" @more="pointsMore"
84 :mores="points"> 167 :mores="points">
85 </more-com> 168 </more-com>
86 - </div> 169 + </div> -->
87 170
88 <!-- 品质优选 --> 171 <!-- 品质优选 -->
89 - <div class="shop-list-box" ref="optimizationBox" v-if="quality && quality.length"> 172 + <!-- <div class="shop-list-box" ref="optimizationBox" v-if="quality && quality.length">
90 173
91 - <div class="section shop-list" v-for="(items, index) in quality" :key="index" @click="toOptimizationList(items)"> 174 + <div class="section shop-list" v-for="(items, index) in quality" :key="index" @click="toOptimizationList(items)"> -->
92 175
93 <!-- 头图 --> 176 <!-- 头图 -->
94 - <div class="header-img-box"> 177 + <!-- <div class="header-img-box">
95 <img :src="items.header_img + SIGN.BIG" class="header-img" /> 178 <img :src="items.header_img + SIGN.BIG" class="header-img" />
96 - </div> 179 + </div> -->
97 180
98 <!-- 商品列表 --> 181 <!-- 商品列表 -->
99 - <div class="list-box"> 182 + <!-- <div class="list-box"> -->
100 183
101 <!-- 商品展示样式 2 --> 184 <!-- 商品展示样式 2 -->
102 - <goods-item-2 class="item" v-for="(item, i) in items.list" :key="i" 185 + <!-- <goods-item-2 class="item" v-for="(item, i) in items.list" :key="i"
103 :item="item" 186 :item="item"
104 pid="1"> 187 pid="1">
105 </goods-item-2> 188 </goods-item-2>
106 </div> 189 </div>
107 </div> 190 </div>
108 - </div> 191 + </div> -->
109 192
110 <!-- 热销排行 --> 193 <!-- 热销排行 -->
111 - <div class="section hot-box" ref="hotBox" @click="toHotSaleList"> 194 + <!-- <div class="section hot-box" ref="hotBox" @click="toHotSaleList"> -->
112 195
113 <!-- 3D轮播 --> 196 <!-- 3D轮播 -->
114 - <swiper-3d-com @onMainSlideClick="toHotSaleList" 197 + <!-- <swiper-3d-com @onMainSlideClick="toHotSaleList"
115 :items="sales" 198 :items="sales"
116 :options="salesOptions"> 199 :options="salesOptions">
117 </swiper-3d-com> 200 </swiper-3d-com>
  201 + </div> -->
  202 +
  203 + <!-- 热销排行 -->
  204 + <div class="section hot-box" ref="hotBox" v-if="sales && sales.length" @click="toHotSaleList">
  205 +
  206 + <!-- 商品样式 2 滑动 -->
  207 + <horiz-list class="components-box"
  208 + :lists="sales"
  209 + com="10"
  210 + pid="1">
  211 +
  212 + <!-- 标题 -->
  213 + <text-bg-title-com slot="title-box"
  214 + :titles="{
  215 + bg: 'static/img/text_bg_title_bg_5.png',
  216 + more: true
  217 + }">
  218 + </text-bg-title-com>
  219 + </horiz-list>
118 </div> 220 </div>
119 221
120 <!-- 猜你喜欢 --> 222 <!-- 猜你喜欢 -->
121 - <div class="section goods-list" ref="guessLikeBox"> 223 + <!-- <div class="section goods-list" ref="guessLikeBox"> -->
122 224
123 <!-- 标题 --> 225 <!-- 标题 -->
124 - <text-title-box @more='changeGoods' 226 + <!-- <text-title-box @more='changeGoods'
125 :titles="{ 227 :titles="{
126 title: '猜你喜欢', 228 title: '猜你喜欢',
127 more: true, 229 more: true,
128 moreText: '换一组', 230 moreText: '换一组',
129 icon: 'static/img/icon_refresh.png' 231 icon: 'static/img/icon_refresh.png'
130 }"> 232 }">
131 - </text-title-box> 233 + </text-title-box> -->
132 234
133 <!-- 商品样式 7 列表 --> 235 <!-- 商品样式 7 列表 -->
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" 236 + <!-- <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]" 237 :lists="likeLists.list[likeNum]"
136 com="7"> 238 com="7">
137 </column-list-box> 239 </column-list-box>
  240 + </div> -->
  241 +
  242 + <!-- 副Banner -->
  243 + <div class="section sub-banner-box" v-if="subBanner">
  244 + <img :src="subBanner.simg" class="sub-banner-img" @click="toBanner(subBanner)" />
138 </div> 245 </div>
139 246
140 - <!-- 推荐（瀑布流） --> 247 + <!-- 好物推荐（瀑布流） -->
141 <div class="section goods-list"> 248 <div class="section goods-list">
142 249
143 <!-- 上拉加载 --> 250 <!-- 上拉加载 -->
@@ -146,7 +253,7 @@ @@ -146,7 +253,7 @@
146 <!-- 标题 --> 253 <!-- 标题 -->
147 <text-title-box 254 <text-title-box
148 :titles="{ 255 :titles="{
149 - title: '推荐' 256 + title: '好物推荐'
150 }"> 257 }">
151 </text-title-box> 258 </text-title-box>
152 259
@@ -174,11 +281,16 @@ @@ -174,11 +281,16 @@
174 import { List } from "vant"; 281 import { List } from "vant";
175 import callAppBox from "@/components/callAppBox/callAppBox"; 282 import callAppBox from "@/components/callAppBox/callAppBox";
176 import backBox from "@/components/backBox/backBox"; 283 import backBox from "@/components/backBox/backBox";
  284 + import backSearchBox from "@/components/backSearchBox/backSearchBox";
  285 + import swiperBox from "@/components/swiper/swiper";
  286 + import iconSwiperBox from "@/components/iconSwiperBox/iconSwiperBox";
177 import textBgTitleCom from "@/components/textBgTitleCom/textBgTitleCom"; 287 import textBgTitleCom from "@/components/textBgTitleCom/textBgTitleCom";
178 import countDownCom from "@/components/countDownCom/countDownCom"; 288 import countDownCom from "@/components/countDownCom/countDownCom";
179 import goodsItem2 from "@/components/goodsItem_2/goodsItem_2"; 289 import goodsItem2 from "@/components/goodsItem_2/goodsItem_2";
  290 + import goodsItem10 from "@/components/goodsItem_10/goodsItem_10";
180 import iconsCom from "@/components/iconsCom/iconsCom"; 291 import iconsCom from "@/components/iconsCom/iconsCom";
181 import swiper3dCom from "@/components/swiper3dCom/swiper3dCom"; 292 import swiper3dCom from "@/components/swiper3dCom/swiper3dCom";
  293 + import horizList from "@/components/horizList/horizList";
182 import moreCom from "@/components/moreCom/moreCom"; 294 import moreCom from "@/components/moreCom/moreCom";
183 import textTitleBox from "@/components/textTitleBox/textTitleBox"; 295 import textTitleBox from "@/components/textTitleBox/textTitleBox";
184 import columnListBox from "@/components/columnListBox/columnListBox"; 296 import columnListBox from "@/components/columnListBox/columnListBox";
@@ -192,6 +304,8 @@ @@ -192,6 +304,8 @@
192 return { 304 return {
193 title: "", // 标题 305 title: "", // 标题
194 backs: null, // 后退按钮组 306 backs: null, // 后退按钮组
  307 + swipers: null, // 主Banner
  308 + swiperNavs: null, // 其它频道列表
195 navs: null, // 导航 309 navs: null, // 导航
196 discountType: null, // 折扣专区状态，0：未开始；1：进行中；2：已结束 310 discountType: null, // 折扣专区状态，0：未开始；1：进行中；2：已结束
197 discountTimeout: 0, // 倒计时超时时间计数 311 discountTimeout: 0, // 倒计时超时时间计数
@@ -200,11 +314,14 @@ @@ -200,11 +314,14 @@
200 quality: null, // 品质优选 314 quality: null, // 品质优选
201 salesOptions: null, // 热销排行选项 315 salesOptions: null, // 热销排行选项
202 sales: null, // 热销排行数据 316 sales: null, // 热销排行数据
  317 + showSearch: false, // 是否显示搜索，默认不显示
  318 + showNavs: false, // 是否显示其它频道跳转，默认不显示
203 showIntegral: false, // 是否显示积分商城模块，默认不显示 319 showIntegral: false, // 是否显示积分商城模块，默认不显示
204 points: null, // 用户积分 320 points: null, // 用户积分
205 pointsLists: null, // 积分商城数据 321 pointsLists: null, // 积分商城数据
206 likeLists: null, // 猜你喜欢列表 322 likeLists: null, // 猜你喜欢列表
207 likeNum: 0, // 猜你喜欢二维数组当前显示的下标 323 likeNum: 0, // 猜你喜欢二维数组当前显示的下标
  324 + subBanner: null, // 副Banner
208 shopGoodsLists: { // 推荐商品瀑布流 325 shopGoodsLists: { // 推荐商品瀑布流
209 loading: false, 326 loading: false,
210 loadingNow: false, 327 loadingNow: false,
@@ -245,11 +362,16 @@ @@ -245,11 +362,16 @@
245 components: { 362 components: {
246 callAppBox, 363 callAppBox,
247 backBox, 364 backBox,
  365 + backSearchBox,
  366 + swiperBox,
  367 + iconSwiperBox,
248 textBgTitleCom, 368 textBgTitleCom,
249 countDownCom, 369 countDownCom,
250 goodsItem2, 370 goodsItem2,
  371 + goodsItem10,
251 iconsCom, 372 iconsCom,
252 swiper3dCom, 373 swiper3dCom,
  374 + horizList,
253 moreCom, 375 moreCom,
254 textTitleBox, 376 textTitleBox,
255 columnListBox, 377 columnListBox,
@@ -261,7 +383,7 @@ @@ -261,7 +383,7 @@
261 this.$set(this, "title", "优选"); 383 this.$set(this, "title", "优选");
262 384
263 // 判断是否在App内 385 // 判断是否在App内
264 - if (this.isCNLive.value) { 386 + // if (this.isCNLive.value) {
265 387
266 // 添加后退按钮组“后退”和“分享”按钮 388 // 添加后退按钮组“后退”和“分享”按钮
267 this.$set(this, 'backs', { 389 this.$set(this, 'backs', {
@@ -270,6 +392,9 @@ @@ -270,6 +392,9 @@
270 back: { 392 back: {
271 icon: "static/img/icon_back.png" 393 icon: "static/img/icon_back.png"
272 }, 394 },
  395 + search: {
  396 + text: '请输入你要搜索的商品'
  397 + },
273 funcArray: [ 398 funcArray: [
274 { 399 {
275 icon: "static/img/icon_share.png", 400 icon: "static/img/icon_share.png",
@@ -278,7 +403,7 @@ @@ -278,7 +403,7 @@
278 ] 403 ]
279 } 404 }
280 }); 405 });
281 - } 406 + // }
282 407
283 // 优选页面接口 408 // 优选页面接口
284 this.index(); 409 this.index();
@@ -322,6 +447,65 @@ @@ -322,6 +447,65 @@
322 moreText: '查看更多', 447 moreText: '查看更多',
323 icon: 'static/img/icon_more_arrow_right.png' 448 icon: 'static/img/icon_more_arrow_right.png'
324 }); 449 });
  450 +
  451 +
  452 +
  453 +
  454 +
  455 +
  456 +
  457 + // 临时，主banner数据
  458 + this.$set(this, 'swipers', [
  459 + {
  460 + simg: 'http://wjjtest.ys2.cnliveimg.com/802/shop/img/2021/02/02/image1612245250790582774.jpg?imageMogr2/thumbnail/200/format/jpg'
  461 + },
  462 + {
  463 + simg: 'http://wjjseller.cnlive.com/uploads/780f7a0d12e152d5e35b3fff29bab5d2.jpg?imageMogr2/thumbnail/200/format/jpg'
  464 + },
  465 + {
  466 + simg: 'https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/12/13/5df26e0504e2f.jpg?imageMogr2/thumbnail/200/format/jpg'
  467 + }
  468 + ]);
  469 +
  470 +
  471 +
  472 +
  473 + // 临时，其它频道列表数据
  474 + this.$set(this, 'swiperNavs', [
  475 + [
  476 + {
  477 + logo: 'http://wjjtest.ys2.cnliveimg.com/802/shop/img/2020/05/14/image1589436270199176498.jpg',
  478 + title: '网家家自营'
  479 + },
  480 + {
  481 + simg: 'http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/04/5c2f1d6094223.jpg',
  482 + title: '环球优物'
  483 + },
  484 + {
  485 + logo: 'https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png',
  486 + title: '李宁旗舰店'
  487 + },
  488 + {
  489 + simg: 'https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/28/5cc53a6e07e67.jpg',
  490 + title: '扶贫精品'
  491 + }
  492 + ]
  493 + ]);
  494 +
  495 +
  496 +
  497 +
  498 +
  499 +
  500 + // 临时，副Banner
  501 + this.$set(this, 'subBanner', {
  502 + simg: 'https://img13.360buyimg.com/cms/jfs/t1/134990/3/16382/148271/5fb61708E49ceefbd/9356c854f878dbc0.jpg?imageMogr2/thumbnail/400/format/jpg'
  503 + });
  504 +
  505 +
  506 +
  507 +
  508 +
325 }, 509 },
326 methods: { 510 methods: {
327 511
@@ -425,33 +609,54 @@ @@ -425,33 +609,54 @@
425 this.$set(this, 'sales', datas.sale); 609 this.$set(this, 'sales', datas.sale);
426 } 610 }
427 611
  612 + // 判断在App内
  613 + if (this.isCNLive.value) {
  614 +
  615 + // 判断App版本，判断是否显示积分商城模块
  616 + if (typeof this.$parent.compareVersion === 'function') {
  617 +
  618 + // 获取平台版本
  619 + let version = this.$route.query.version;
  620 +
  621 + // 根据平台，判断是否符合版本，显示搜索和其它导航菜单
  622 + if ((this.isiPhone.value && this.$parent.compareVersion(version, '1.9.6')) || (this.isAndroid.value && this.$parent.compareVersion(version, '1.8.3.1'))) {
  623 +
  624 + // 设置显示搜索和其它导航菜单模块
  625 + this.$set(this, 'showSearch', true);
  626 + this.$set(this, 'showNavs', true);
  627 + }
  628 +
  629 + // 根据平台，判断是否符合版本，显示积分商城
  630 + if ((this.isiPhone.value && this.$parent.compareVersion(version, '1.9.1')) || (this.isAndroid.value && this.$parent.compareVersion(version, '1.7.3.3'))) {
  631 +
  632 + // 设置显示积分商城模块
  633 + this.$set(this, 'showIntegral', true);
  634 + }
  635 + }
  636 + }
  637 +
428 // 设置用户积分 638 // 设置用户积分
429 this.$set(this.points, 'value', datas.grade); 639 this.$set(this.points, 'value', datas.grade);
430 640
431 // 判断是否有积分商城 641 // 判断是否有积分商城
432 if (datas.integral_goods && datas.integral_goods.length) { 642 if (datas.integral_goods && datas.integral_goods.length) {
433 643
  644 + // 如果需要展示积分商城，并且折扣专区商品数量大于2，重新设置折扣专区模块商品数量
  645 + if (this.showIntegral && this.discountLists.length > 2) {
434 646
435 - // 判断在App内  
436 - if (this.isCNLive.value) { 647 + // 设置折扣专区模块产品数量为2个
  648 + this.$set(this, 'discountLists', [this.discountLists[0], this.discountLists[1]]);
  649 + }
437 650
438 - // 判断App版本，判断是否显示积分商城模块  
439 - if (typeof this.$parent.compareVersion === 'function') { 651 + // 积分商城数据
  652 + this.$set(this, 'pointsLists', datas.integral_goods);
440 653
441 - // 获取平台版本  
442 - let version = this.$route.query.version; 654 + // 判断积分商城模块数据大于2，只显示2个
  655 + if (this.pointsLists.length > 2) {
443 656
444 - // 根据平台，判断是否符合版本  
445 - if ((this.isiPhone.value && this.$parent.compareVersion(version, '1.9.1')) || (this.isAndroid.value && this.$parent.compareVersion(version, '1.7.3.3'))) {  
446 -  
447 - // 设置显示积分商城模块  
448 - this.$set(this, 'showIntegral', true);  
449 - }  
450 - } 657 + // 设置积分商城模块产品数量为2个
  658 + this.$set(this, 'pointsLists', [datas.integral_goods[0], datas.integral_goods[1]]);
451 } 659 }
452 -  
453 - // 热销排行数据  
454 - this.$set(this, 'pointsLists', datas.integral_goods);  
455 } else { 660 } else {
456 661
457 // 判断是否有积分商城 662 // 判断是否有积分商城
@@ -465,6 +670,9 @@ @@ -465,6 +670,9 @@
465 break; 670 break;
466 } 671 }
467 } 672 }
  673 +
  674 + // 设置隐藏积分商城模块
  675 + this.$set(this, 'showIntegral', false);
468 } 676 }
469 677
470 // 判断是否有猜你喜欢 678 // 判断是否有猜你喜欢
@@ -563,6 +771,32 @@ @@ -563,6 +771,32 @@
563 }, 771 },
564 772
565 /** 773 /**
  774 + * 跳转到其它模块
  775 + * @param {Object} item [通用跳转对象]
  776 + */
  777 + toPage(item) {
  778 +
  779 +
  780 + console.log('toPage', item);
  781 +
  782 +
  783 +
  784 + },
  785 +
  786 + /**
  787 + * Banner跳转
  788 + * @param {Object} item [跳转对象]
  789 + */
  790 + toBanner(item) {
  791 +
  792 +
  793 + console.log('toBanner', item);
  794 +
  795 +
  796 +
  797 + },
  798 +
  799 + /**
566 * 跳转折扣专区列表 800 * 跳转折扣专区列表
567 * @param {Object} item [通用跳转对象] 801 * @param {Object} item [通用跳转对象]
568 */ 802 */
@@ -742,6 +976,26 @@ @@ -742,6 +976,26 @@
742 }, 976 },
743 977
744 /** 978 /**
  979 + * 跳转搜索页面
  980 + */
  981 + toSearch() {
  982 +
  983 + // 跳转搜索页面（跳转封装）
  984 + if (typeof this.$parent.gotoDetail === 'function') {
  985 +
  986 + // 设置跳转参数
  987 + let params = {
  988 + type: '5',
  989 + to: window.location.origin + window.location.pathname + '#/search',
  990 + shop_type: ''
  991 + };
  992 +
  993 + // 页面跳转
  994 + this.$parent.gotoDetail(params);
  995 + }
  996 + },
  997 +
  998 + /**
745 * 分享 999 * 分享
746 */ 1000 */
747 toShare() { 1001 toShare() {
src/pages/search/search.less
  View file @7779061
@@ -22,6 +22,15 @@ @@ -22,6 +22,15 @@
22 height: 14px; 22 height: 14px;
23 } 23 }
24 } 24 }
  25 + .no-more {
  26 + padding: 30px 0;
  27 + color: #9B9B9B;
  28 + font-size: 26px;
  29 + font-weight: 400;
  30 + line-height: 37px;
  31 + text-align: center;
  32 + border-top: 1px solid #F2F2F2;
  33 + }
25 } 34 }
26 } 35 }
27 } 36 }
src/pages/search/search.vue
  View file @7779061
@@ -53,6 +53,11 @@ @@ -53,6 +53,11 @@
53 :titles="titles.food"> 53 :titles="titles.food">
54 </text-title-box> 54 </text-title-box>
55 </list-com> 55 </list-com>
  56 +
  57 + <!-- 显示没有更多了 -->
  58 + <div class="no-more" v-if="paging.finished">
  59 + 没有更多了～
  60 + </div>
56 </div> 61 </div>
57 </div> 62 </div>
58 63
@@ -88,11 +93,13 @@ @@ -88,11 +93,13 @@
88 paging: { // 分页参数，点击更多时需要用到 93 paging: { // 分页参数，点击更多时需要用到
89 loading: true, 94 loading: true,
90 page: 0, 95 page: 0,
91 - distance: 50 96 + distance: 50,
  97 + finished: false // 记载完成，显示没有更多了
92 }, 98 },
93 searchs: { // 搜索组件配置参数 99 searchs: { // 搜索组件配置参数
94 backgroundColor: "#FAFBFD", 100 backgroundColor: "#FAFBFD",
95 - borderColor: "#FC1541" 101 + borderColor: "#FC1541",
  102 + pl: '请输入您要搜索的商品/店铺'
96 }, 103 },
97 coordinate: { // 经纬度定位参数 104 coordinate: { // 经纬度定位参数
98 longitude: 0, 105 longitude: 0,
@@ -103,17 +110,20 @@ @@ -103,17 +110,20 @@
103 goods: { 110 goods: {
104 title: "", 111 title: "",
105 more: false, 112 more: false,
106 - style: '2' 113 + style: '3',
  114 + icon: 'static/img/icon_more_arrow_right_type_3.png'
107 }, 115 },
108 daren: { 116 daren: {
109 title: "", 117 title: "",
110 more: false, 118 more: false,
111 - style: '2' 119 + style: '3',
  120 + icon: 'static/img/icon_more_arrow_right_type_3.png'
112 }, 121 },
113 food: { 122 food: {
114 title: "", 123 title: "",
115 more: false, 124 more: false,
116 - style: '2' 125 + style: '3',
  126 + icon: 'static/img/icon_more_arrow_right_type_3.png'
117 } 127 }
118 }, 128 },
119 goodsLists: { // 商品数据 129 goodsLists: { // 商品数据
@@ -154,8 +164,12 @@ @@ -154,8 +164,12 @@
154 */ 164 */
155 loadMore() { 165 loadMore() {
156 166
157 - // 调用更多函数，处理loadMore逻辑  
158 - this.more(); 167 + // 判断是否完成，如果完成就不再加载
  168 + if (!this.paging.finished) {
  169 +
  170 + // 调用更多函数，处理loadMore逻辑
  171 + this.more();
  172 + }
159 }, 173 },
160 174
161 /** 175 /**
@@ -497,6 +511,9 @@ @@ -497,6 +511,9 @@
497 511
498 // 没有需要加载的内容，停止上拉加载 512 // 没有需要加载的内容，停止上拉加载
499 this.$set(this.paging, "loading", true); 513 this.$set(this.paging, "loading", true);
  514 +
  515 + // 加载完成，显示没有更多了
  516 + this.$set(this.paging, 'finished', true);
500 } 517 }
501 break; 518 break;
502 case this.displayPage.status.DAREN: // 达人搜素 519 case this.displayPage.status.DAREN: // 达人搜素
@@ -520,6 +537,9 @@ @@ -520,6 +537,9 @@
520 537
521 // 没有需要加载的内容，停止上拉加载 538 // 没有需要加载的内容，停止上拉加载
522 this.$set(this.paging, "loading", true); 539 this.$set(this.paging, "loading", true);
  540 +
  541 + // 加载完成，显示没有更多了
  542 + this.$set(this.paging, 'finished', true);
523 } 543 }
524 break; 544 break;
525 case this.displayPage.status.FOOD: // 美食搜素 545 case this.displayPage.status.FOOD: // 美食搜素
@@ -544,6 +564,9 @@ @@ -544,6 +564,9 @@
544 564
545 // 没有需要加载的内容，停止上拉加载 565 // 没有需要加载的内容，停止上拉加载
546 this.$set(this.paging, "loading", true); 566 this.$set(this.paging, "loading", true);
  567 +
  568 + // 加载完成，显示没有更多了
  569 + this.$set(this.paging, 'finished', true);
547 } 570 }
548 break; 571 break;
549 } 572 }
static/img/icon_more_arrow_right_type_3.png 0 → 100644
View file @7779061

146 Bytes
static/img/text_bg_title_bg_3.png 0 → 100644
View file @7779061

9.01 KB
static/img/text_bg_title_bg_4.png 0 → 100644
View file @7779061

12.5 KB
static/img/text_bg_title_bg_5.png 0 → 100644
View file @7779061

15.4 KB