w-front-end / select_good · Commits

Commit 3d71e834420b1c8488e10e5de0ea36c6eace437d

Authored by 王强
1 parent 099b82ee

折扣专区对接~

Inline Side-by-side
Showing 3 changed files with 72 additions and 270 deletions
src/components/goodsItem_8/goodsItem_8.vue
  View file @3d71e83
... ... @@ -10,8 +10,8 @@
10 10 <div class="content-box">
11 11 <div class="top-box">
12 12 <div class="title">{{item.title}}</div>
13   - <!-- <div class="sub-title">{{item.ads}}</div> -->
14   - <div class="sub-title">已售出&nbsp;{{item.num}}&nbsp;件</div>
  13 + <div class="sub-title" v-if="sty == '2'">已售出&nbsp;{{item.num}}&nbsp;件</div>
  14 + <div class="sub-title" v-else>{{item.ads}}</div>
15 15 </div>
16 16 <div class="bottom-box">
17 17 <div class="price-box">
... ... @@ -22,7 +22,7 @@
22 22 </div>
23 23 <div class="icon-box" @click.stop.prevent="primary(item)">
24 24 <img src="static/img/icon_list_arrow_right.png" class="icon-img" v-if="sty == 2" />
25   - <div class="btn btn-disabled" v-else-if="item.stock == '0'">已抢光</div>
  25 + <div class="btn btn-disabled" v-else-if="sty == '1' && (item.num == '2' || (item.num == '1' && item.stock == '0'))">已抢光</div>
26 26 <img src="static/img/icon_shopping_cart_active.png" class="icon-img" v-else />
27 27  
28 28 <!-- 限购几件，不能再加入购物车展示效果，灰度图片 -->
... ...
src/pages/discountList/discountList.less
  View file @3d71e83
1 1 @charset "UTF-8";
2 2  
3 3 .discount-list-page {
4   - background-color: #FFF6E5;
  4 + background-color: #ffffff;
5 5 min-height: 100vh;
6 6 .call-app-box {
7 7 position: fixed;
... ...
src/pages/discountList/discountList.vue
  View file @3d71e83
1 1 <template>
2   - <div class="discount-list-page">
  2 + <div class="discount-list-page" :style="{'backgroundColor': datas && datas.discount_color ? datas.discount_color : ''}">
3 3  
4 4 <!-- H5唤起App组件 -->
5 5 <call-app-box class="call-app-box" ref="callApp" v-if="!isCNLive.value && $parent.isOpenApp.value"
... ... @@ -23,20 +23,20 @@
23 23 </div>
24 24  
25 25 <!-- 倒计时 -->
26   - <div class="count-down-box">
  26 + <div class="count-down-box" v-if="datas && datas.discount_time && datas.discount_time > 0">
27 27 <div class="text">
28 28 距离活动结束仅剩
29 29 </div>
30 30  
31 31 <!-- 倒计时组件 -->
32 32 <count-down-com slot="extend"
33   - :time="new Date().getTime() + 10000000 - new Date().getTime()"
  33 + :time="datas.discount_time"
34 34 sty="5">
35 35 </count-down-com>
36 36 </div>
37 37  
38 38 <!-- 商品列表 -->
39   - <div class="section goods-list">
  39 + <div class="section goods-list" v-if="goodsLists && goodsLists.length">
40 40  
41 41 <!-- 商品列表 -->
42 42 <goods-item-8 v-for="(item, index) in goodsLists" :key="index" @jump="toDetail" @primary="primary"
... ... @@ -45,7 +45,7 @@
45 45  
46 46 <!-- 折扣角标 -->
47 47 <div class="discount-flag" slot="flag">
48   - 5折
  48 + {{getDiscount(item.price, item.prices)}}折
49 49 </div>
50 50 </goods-item-8>
51 51 </div>
... ... @@ -84,10 +84,23 @@
84 84 return {
85 85 title: "", // 标题
86 86 backs: null, // 后退按钮组
87   - goodsLists: null, // 商品列表
  87 + datas: null, // 接口数据
  88 + goodsLists: null // 商品列表
  89 + }
  90 + },
  91 + computed: {
88 92  
  93 + /**
  94 + * 计算折扣
  95 + */
  96 + getDiscount() {
  97 + return (price, prices) => {
89 98  
  99 + // 售价/原价
  100 + let x = (price * 100) / (prices * 100);
90 101  
  102 + return (Math.floor(x * 100) / 100) * 10;
  103 + }
91 104 }
92 105 },
93 106 components: {
... ... @@ -107,6 +120,7 @@
107 120  
108 121 // 添加后退按钮组“后退”和“分享”按钮
109 122 this.$set(this, 'backs', {
  123 + title: this.title,
110 124 funcs: {
111 125 back: {
112 126 icon: "static/img/icon_back.png"
... ... @@ -119,270 +133,35 @@
119 133 ]
120 134 }
121 135 });
122   -
123   - // 设置标题
124   - this.$set(this.backs, 'title', '折扣专区');
125 136 }
126 137  
127   -
128   -
129   - // 优选页面接口
130   - // this.fansShopMessageList();
131   -
132   -
133   - // 临时，初始化列表数据
134   - this.$set(this, 'goodsLists', [
135   - {
136   - ads: "专区特供超值商品",
137   - id: "9524815",
138   - price: "50.00",
139   - prices: "300.00",
140   - stock: "10",
141   - shop: {
142   - id: "57",
143   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
144   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
145   - title: "李宁旗舰店",
146   - titles: "专区特供超值商品"
147   - },
148   - shop_type: "1",
149   - shopid: "57",
150   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
151   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
152   - },
153   - {
154   - ads: "专区特供超值商品",
155   - id: "9524815",
156   - price: "50.00",
157   - prices: "20.00",
158   - stock: "10",
159   - shop: {
160   - id: "57",
161   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
162   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
163   - title: "李宁旗舰店",
164   - titles: "专区特供超值商品"
165   - },
166   - shop_type: "1",
167   - shopid: "57",
168   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
169   - title: "传统汉堡焗套餐"
170   - },
171   - {
172   - ads: "专区特供超值商品",
173   - id: "9524815",
174   - price: "50.00",
175   - prices: "300.00",
176   - stock: "0",
177   - shop: {
178   - id: "57",
179   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
180   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
181   - title: "李宁旗舰店",
182   - titles: "专区特供超值商品"
183   - },
184   - shop_type: "1",
185   - shopid: "57",
186   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
187   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
188   - },
189   - {
190   - ads: "专区特供超值商品",
191   - id: "9524815",
192   - price: "50.00",
193   - prices: "300.00",
194   - stock: "10",
195   - shop: {
196   - id: "57",
197   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
198   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
199   - title: "李宁旗舰店",
200   - titles: "专区特供超值商品"
201   - },
202   - shop_type: "1",
203   - shopid: "57",
204   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
205   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
206   - },
207   - {
208   - ads: "专区特供超值商品",
209   - id: "9524815",
210   - price: "50.00",
211   - prices: "300.00",
212   - stock: "10",
213   - shop: {
214   - id: "57",
215   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
216   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
217   - title: "李宁旗舰店",
218   - titles: "专区特供超值商品"
219   - },
220   - shop_type: "1",
221   - shopid: "57",
222   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
223   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
224   - },
225   - {
226   - ads: "专区特供超值商品",
227   - id: "9524815",
228   - price: "50.00",
229   - prices: "300.00",
230   - stock: "0",
231   - shop: {
232   - id: "57",
233   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
234   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
235   - title: "李宁旗舰店",
236   - titles: "专区特供超值商品"
237   - },
238   - shop_type: "1",
239   - shopid: "57",
240   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
241   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
242   - },
243   - {
244   - ads: "专区特供超值商品",
245   - id: "9524815",
246   - price: "50.00",
247   - prices: "300.00",
248   - stock: "0",
249   - shop: {
250   - id: "57",
251   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
252   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
253   - title: "李宁旗舰店",
254   - titles: "专区特供超值商品"
255   - },
256   - shop_type: "1",
257   - shopid: "57",
258   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
259   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
260   - },
261   - {
262   - ads: "专区特供超值商品",
263   - id: "9524815",
264   - price: "50.00",
265   - prices: "300.00",
266   - stock: "10",
267   - shop: {
268   - id: "57",
269   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
270   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
271   - title: "李宁旗舰店",
272   - titles: "专区特供超值商品"
273   - },
274   - shop_type: "1",
275   - shopid: "57",
276   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
277   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
278   - },
279   - {
280   - ads: "专区特供超值商品",
281   - id: "9524815",
282   - price: "50.00",
283   - prices: "300.00",
284   - stock: "10",
285   - shop: {
286   - id: "57",
287   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
288   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
289   - title: "李宁旗舰店",
290   - titles: "专区特供超值商品"
291   - },
292   - shop_type: "1",
293   - shopid: "57",
294   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
295   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
296   - },
297   - {
298   - ads: "专区特供超值商品",
299   - id: "9524815",
300   - price: "50.00",
301   - prices: "300.00",
302   - stock: "10",
303   - shop: {
304   - id: "57",
305   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
306   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
307   - title: "李宁旗舰店",
308   - titles: "专区特供超值商品"
309   - },
310   - shop_type: "1",
311   - shopid: "57",
312   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
313   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
314   - },
315   - {
316   - ads: "专区特供超值商品",
317   - id: "9524815",
318   - price: "50.00",
319   - prices: "300.00",
320   - stock: "0",
321   - shop: {
322   - id: "57",
323   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
324   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
325   - title: "李宁旗舰店",
326   - titles: "专区特供超值商品"
327   - },
328   - shop_type: "1",
329   - shopid: "57",
330   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
331   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
332   - },
333   - {
334   - ads: "专区特供超值商品",
335   - id: "9524815",
336   - price: "50.00",
337   - prices: "300.00",
338   - stock: "10",
339   - shop: {
340   - id: "57",
341   - logo: "https://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/04/20/5cbab33c82a82.png",
342   - shop_url: "https://wjjshop.cnlive.com/html/mall/1/#/pages/main/shopIndex/shop?shop_id=57",
343   - title: "李宁旗舰店",
344   - titles: "专区特供超值商品"
345   - },
346   - shop_type: "1",
347   - shopid: "57",
348   - simg: "http://wjjtest.ys2.cnliveimg.com/802/shop/img/2019/01/02/5c2c76eeb6584.jpg",
349   - title: "传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐传统汉堡焗套餐 传统汉堡焗套餐汉堡焗传统汉堡焗套餐"
350   - }
351   - ]);
352   -
353   -
354   -
355   -
356   -
  138 + // 折扣专区列表
  139 + this.discountGoods();
357 140 },
358 141 methods: {
359 142  
360 143 /**
361   - * 优选页面接口
  144 + * 折扣专区列表
362 145 */
363   - fansShopMessageList() {
364   -
365   - // 校验登录
366   - if (this.$parent.checkLogin()) {
  146 + discountGoods() {
367 147  
368   - // 加载中提示
369   - Indicator.open("加载中...");
  148 + // 加载中提示
  149 + Indicator.open("加载中...");
370 150  
371   - // 获取证书请求接口
372   - this.http("/Api/" + this.getApiVersion().dynamic + "/fansShopMessageList", {
373   - uid: this.getStore("uid")
374   - }, this.fansShopMessageListCallback, {
375   - method: "POST"
376   - });
377   - }
  151 + // 获取证书请求接口
  152 + this.http("/Api/" + this.getApiVersion().good + "/discountGoods", {
  153 + uid: this.getStore("uid") || 0
  154 + }, this.discountGoodsCallback, {
  155 + method: "POST"
  156 + });
378 157 },
379 158  
380 159 /**
381   - * 优选页面接口回调
  160 + * 折扣专区列表回调
382 161 * @param {Object} res [服务器返回数据]
383 162 * @param {Object} ext [扩展参数]
384 163 */
385   - fansShopMessageListCallback(res, ext) {
  164 + discountGoodsCallback(res, ext) {
386 165  
387 166 // 加载完成
388 167 Indicator.close();
... ... @@ -393,11 +172,23 @@
393 172 // 解构数据
394 173 let { data: datas } = res;
395 174  
396   - /* 获取优选库“优选”数据 开始 */
  175 + /* 获取折扣专区列表数据 开始 */
  176 +
  177 + // 判断接口是否有数据
  178 + if (datas) {
  179 +
  180 + // 设置接口数据
  181 + this.$set(this, 'datas', datas);
  182 +
  183 + // 判断是否有列表数据
  184 + if (datas.list && datas.list.length) {
397 185  
398   -
  186 + // 设置商品列表数据
  187 + this.$set(this, 'goodsLists', datas.list);
  188 + }
  189 + }
399 190  
400   - /* 获取优选库“优选”数据 结束 */
  191 + /* 获取折扣专区列表数据 结束 */
401 192  
402 193 } else if (res.code == 400) {
403 194  
... ... @@ -406,7 +197,7 @@
406 197 } else {
407 198  
408 199 // 获取优选失败
409   - Toast("获取优选失败");
  200 + Toast("获取列表失败");
410 201 }
411 202 },
412 203  
... ... @@ -419,15 +210,23 @@
419 210 // 判断App内
420 211 if (this.isCNLive.value) {
421 212  
  213 + // 已抢光，不跳转
  214 + if (item.num == '2' || (item.num == '1' && item.stock == '0')) {
  215 + return false;
  216 + }
  217 +
422 218 // 判断通用跳转函数是否存在
423 219 if (typeof this.$parent.gotoDetail === 'function') {
424   -
425   -
426   - console.log('toDetail', item);
427   -
428   -
  220 +
  221 + // 跳转参数
  222 + let params = {
  223 + type: '2',
  224 + to: item.id,
  225 + shop_type: item.shop_type
  226 + };
  227 +
429 228 // 通用跳转
430   - this.$parent.gotoDetail(item);
  229 + this.$parent.gotoDetail(params);
431 230 }
432 231 } else {
433 232  
... ... @@ -446,11 +245,14 @@
446 245 });
447 246 }
448 247 },
  248 +
449 249 /**
450   - * 列表附件按钮事件
  250 + * 项目按钮事件
451 251 * @param {Object} item [数据对象]
452 252 */
453 253 primary(item) {
  254 +
  255 + // 跳转商品详情
454 256 this.toDetail(item);
455 257 },
456 258  
... ...