w-front-end / select_good · Commits

Commit cc852a3f758a00057831a120c2ad8e60593a0174

Authored by zhiyangdu
1 parent 03e5a21f

数据绑定

Inline Side-by-side
Showing 4 changed files with 28 additions and 158 deletions
src/components/darenListCom/darenListCom.vue
  View file @cc852a3
1 <template> 1 <template>
2 - <div class="daren-list-com" v-if="item && (item.intro || item.img || item.goods)"> 2 + <div class="daren-list-com" v-if="item && (item.title || item.img || item.goods || item.shop_user)">
3 <div class="box" @click.stop.prevent @click="jump(item)"> 3 <div class="box" @click.stop.prevent @click="jump(item)">
4 <div class="top-box" v-if="item.user" @click.stop.prevent @click="userJump(item)"> 4 <div class="top-box" v-if="item.user" @click.stop.prevent @click="userJump(item)">
5 <div class="top-left"> 5 <div class="top-left">
6 6
7 <!-- 用户头像/昵称 --> 7 <!-- 用户头像/昵称 -->
8 <user-avatar class="user-avatar-box" 8 <user-avatar class="user-avatar-box"
9 - :users="item.user"> 9 + :users="item.shop_user">
10 </user-avatar> 10 </user-avatar>
11 </div> 11 </div>
12 <div class="top-right"> 12 <div class="top-right">
13 13
14 <!-- 发布时间 --> 14 <!-- 发布时间 -->
15 - {{item.createtime}} 15 + {{item.time}}
16 </div> 16 </div>
17 </div> 17 </div>
18 18
19 <!-- 动态简介 --> 19 <!-- 动态简介 -->
20 - <div class="intro-box" v-if="item.intro">  
21 - {{item.intro}} 20 + <div class="intro-box" v-if="item.title">
  21 + {{item.title}}
22 </div> 22 </div>
23 23
24 <!-- 中间图片部分 --> 24 <!-- 中间图片部分 -->
25 <div class="center-box" v-if="item.img"> 25 <div class="center-box" v-if="item.img">
26 - 26 +
27 <!-- 达人图片展示（单独组建处理，宫格形式） --> 27 <!-- 达人图片展示（单独组建处理，宫格形式） -->
28 <palace-grid 28 <palace-grid
29 - :grids="item.img"> 29 + :grids="{
  30 + list:item.img
  31 + }">
30 </palace-grid> 32 </palace-grid>
31 </div> 33 </div>
32 34
33 <!-- 底部部分 --> 35 <!-- 底部部分 -->
34 <div class="bottom-box" v-if="item.goods"> 36 <div class="bottom-box" v-if="item.goods">
35 - 37 +
36 <!-- 热门信息 --> 38 <!-- 热门信息 -->
37 - <div class="hot-info-box" v-if="item.hot"> 39 + <div class="hot-info-box" v-if="item&&item.comment_content&&item.comment_content.content">
38 <div class="hot-img-box"> 40 <div class="hot-img-box">
39 - <img :src="item.hot.simg" class="hot-img" mode="heightFix" /> 41 + <img :src="item.goods.simg" class="hot-img" mode="heightFix" />
40 </div> 42 </div>
41 <div class="line"></div> 43 <div class="line"></div>
42 <div class="info"> 44 <div class="info">
43 - {{item.hot.info}} 45 + {{item.comment_content.content}}
44 </div> 46 </div>
45 </div> 47 </div>
46 - 48 +
47 <div class="goods-box"> 49 <div class="goods-box">
48 50
49 <!-- 商品标签组建 --> 51 <!-- 商品标签组建 -->
50 - <div class="goods" v-for="(goodsItem, goodsIndex) in item.goods" :key="goodsIndex">  
51 - 52 + <div class="goods">
52 <!-- goodsItem_4 --> 53 <!-- goodsItem_4 -->
53 <goods-item-4 @jump="goodsJump" @primary="goodsPrimary" 54 <goods-item-4 @jump="goodsJump" @primary="goodsPrimary"
54 - :item="goodsItem"> 55 + :item="item.goods">
55 </goods-item-4> 56 </goods-item-4>
56 </div> 57 </div>
57 </div> 58 </div>
@@ -59,17 +60,17 @@ @@ -59,17 +60,17 @@
59 <!-- 评论/点赞/查看按钮 --> 60 <!-- 评论/点赞/查看按钮 -->
60 <div class="comment-like-view-box"> 61 <div class="comment-like-view-box">
61 <div class="left"> 62 <div class="left">
62 - 63 +
63 <!-- 评论 --> 64 <!-- 评论 -->
64 - <div class="comment-box" v-if="item.comment_num"> 65 + <div class="comment-box" v-if="item.comment">
65 <img src="static/img/icon_daren_list_comment.png" class="icon-img" /> 66 <img src="static/img/icon_daren_list_comment.png" class="icon-img" />
66 - <div class="number">{{item.comment_num}}</div> 67 + <div class="number">{{item.comment}}</div>
67 </div> 68 </div>
68 69
69 <!-- 点赞 --> 70 <!-- 点赞 -->
70 - <div class="like-box" v-if="item.like_num"> 71 + <div class="like-box" v-if="item.upper">
71 <img src="static/img/icon_daren_list_like.png" class="icon-img" /> 72 <img src="static/img/icon_daren_list_like.png" class="icon-img" />
72 - <div class="number">{{item.like_num}}</div> 73 + <div class="number">{{item.upper}}</div>
73 </div> 74 </div>
74 </div> 75 </div>
75 <div class="right"> 76 <div class="right">
src/components/palaceGrid/palaceGrid.vue
  View file @cc852a3
@@ -6,7 +6,7 @@ @@ -6,7 +6,7 @@
6 <van-image 6 <van-image
7 class="img" 7 class="img"
8 fit="cover" 8 fit="cover"
9 - :src="item.img" 9 + :src="item.img || item"
10 /> 10 />
11 <!--<img v-lazy="item.img" mode="widthFix" />--> 11 <!--<img v-lazy="item.img" mode="widthFix" />-->
12 </div> 12 </div>
src/components/userAvatarBox/userAvatarBox.vue
  View file @cc852a3
@@ -2,10 +2,10 @@ @@ -2,10 +2,10 @@
2 <div class="user-avatar-box" v-if="users" @click="jump(users)"> 2 <div class="user-avatar-box" v-if="users" @click="jump(users)">
3 <div class="box"> 3 <div class="box">
4 <div class="avatar-box"> 4 <div class="avatar-box">
5 - <img v-lazy="users.simg" class="avatar-img" /> 5 + <img v-lazy="users.logo" class="avatar-img" />
6 </div> 6 </div>
7 <div class="nickname"> 7 <div class="nickname">
8 - {{users.nickname}} 8 + {{users.title}}
9 </div> 9 </div>
10 </div> 10 </div>
11 </div> 11 </div>
@@ -16,12 +16,12 @@ @@ -16,12 +16,12 @@
16 name: "userAvatar", 16 name: "userAvatar",
17 data: function () { 17 data: function () {
18 return { 18 return {
19 - 19 +
20 } 20 }
21 }, 21 },
22 props: ["users"], 22 props: ["users"],
23 methods: { 23 methods: {
24 - 24 +
25 /** 25 /**
26 * 点击跳转事件绑定 26 * 点击跳转事件绑定
27 */ 27 */
@@ -35,4 +35,4 @@ @@ -35,4 +35,4 @@
35 <!-- Add "scoped" attribute to limit CSS to this component only --> 35 <!-- Add "scoped" attribute to limit CSS to this component only -->
36 <style rel="stylesheet/less" lang="less"> 36 <style rel="stylesheet/less" lang="less">
37 @import './userAvatarBox'; 37 @import './userAvatarBox';
38 -</style>  
39 \ No newline at end of file 38 \ No newline at end of file
  39 +</style>
src/pages/newDaren/newDaren.vue
  View file @cc852a3
@@ -24,138 +24,7 @@ @@ -24,138 +24,7 @@
24 </horiz-list> 24 </horiz-list>
25 <!-- 达人动态列表 --> 25 <!-- 达人动态列表 -->
26 <daren-list-box class="daren-list" @userJump="userJump" @jump="jump" @goodsJump="goodsJump" @goodsPrimary="goodsPrimary" 26 <daren-list-box class="daren-list" @userJump="userJump" @jump="jump" @goodsJump="goodsJump" @goodsPrimary="goodsPrimary"
27 - :lists="[  
28 - {  
29 - user: {  
30 - simg: 'static/img/6.png',  
31 - nickname: '欧阳娜娜'  
32 - },  
33 - createtime: '123分钟前',  
34 - intro: '盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域',  
35 - img: {  
36 - list: [  
37 - {  
38 - img: 'static/img/banner-02.jpg'  
39 - }  
40 - ]  
41 - },  
42 - hot: {  
43 - simg: 'static/img/icon_popular_comment.png',  
44 - info: '口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～'  
45 - },  
46 - goods: [  
47 - {  
48 - simg: 'static/img/pic_3.jpg',  
49 - title: '臻溪国奖茯全金花黑茶',  
50 - price: '288.00'  
51 - }  
52 - ],  
53 - comment_num: '11100',  
54 - like_num: '123'  
55 - },  
56 - {  
57 - user: {  
58 - simg: 'static/img/6.png',  
59 - nickname: '欧阳娜娜'  
60 - },  
61 - createtime: '123分钟前',  
62 - img: {  
63 - list: [  
64 - {  
65 - img: 'static/img/banner-03.jpg'  
66 - }  
67 - ]  
68 - },  
69 - hot: {  
70 - simg: 'static/img/icon_popular_comment.png',  
71 - info: '口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～'  
72 - },  
73 - goods: [  
74 - {  
75 - simg: 'static/img/pic_3.jpg',  
76 - title: '臻溪国奖茯全金花黑茶',  
77 - price: '288.00'  
78 - }  
79 - ],  
80 - comment_num: '11100',  
81 - like_num: '123'  
82 - },  
83 - {  
84 - user: {  
85 - simg: 'static/img/6.png',  
86 - nickname: '欧阳娜娜'  
87 - },  
88 - createtime: '123分钟前',  
89 - intro: '盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域',  
90 - hot: {  
91 - simg: 'static/img/icon_popular_comment.png',  
92 - info: '口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～口红很赞的哦，颜色很漂亮的显得肤色特别白嫩～'  
93 - },  
94 - goods: [  
95 - {  
96 - simg: 'static/img/pic_3.jpg',  
97 - title: '臻溪国奖茯全金花黑茶',  
98 - price: '288.00'  
99 - },  
100 - {  
101 - simg: 'static/img/pic_2.jpg',  
102 - title: '臻溪国奖茯全金花黑茶',  
103 - price: '288.00'  
104 - },  
105 - {  
106 - simg: 'static/img/pic_1.jpg',  
107 - title: '臻溪国奖茯全金花黑茶',  
108 - price: '288.00'  
109 - },  
110 - {  
111 - simg: 'static/img/pic_3.jpg',  
112 - title: '臻溪国奖茯全金花黑茶',  
113 - price: '288.00'  
114 - },  
115 - {  
116 - simg: 'static/img/pic_2.jpg',  
117 - title: '臻溪国奖茯全金花黑茶',  
118 - price: '288.00'  
119 - },  
120 - {  
121 - simg: 'static/img/pic_1.jpg',  
122 - title: '臻溪国奖茯全金花黑茶',  
123 - price: '288.00'  
124 - }  
125 - ],  
126 - comment_num: '11100',  
127 - like_num: '123'  
128 - },  
129 - {  
130 - user: {  
131 - simg: 'static/img/6.png',  
132 - nickname: '欧阳娜娜'  
133 - },  
134 - createtime: '123分钟前',  
135 - intro: '盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域盆地是地球表面（岩石圈表面）相对长时期沉降的区域，因整个地形外观与盆子相似而得名。换言之盆地是基底表面相对于海拔盆地是地球表面相对长时期沉降的区域',  
136 - img: {  
137 - list: [  
138 - {  
139 - img: 'static/img/banner-02.jpg'  
140 - }  
141 - ]  
142 - },  
143 - goods: [  
144 - {  
145 - simg: 'static/img/pic_3.jpg',  
146 - title: '臻溪国奖茯全金花黑茶',  
147 - price: '288.00'  
148 - },  
149 - {  
150 - simg: 'static/img/pic_1.jpg',  
151 - title: '臻溪国奖茯全金花黑茶',  
152 - price: '288.00'  
153 - }  
154 - ],  
155 - comment_num: '11100',  
156 - like_num: '123'  
157 - }  
158 - ]"> 27 + :lists="shopFnsDynamic">
159 28
160 <!-- 最新动态标题 --> 29 <!-- 最新动态标题 -->
161 <text-title-box slot="title-box" @more="newDarenDynamicsMore" 30 <text-title-box slot="title-box" @more="newDarenDynamicsMore"