Commit c8df315053e977f2a57b6ce4a40720f76e6ec61c

Authored by 后端开发-许程
1 parent 86be033d

商品组件样式

components/goods_list/goods_list.js
1 // pages/user/yhq/qr_code/qr_code.js 1 // pages/user/yhq/qr_code/qr_code.js
2 -const {  
3 - barcode,  
4 - qrcode  
5 -} = require('../../utils/index.js') 2 +
  3 +
  4 +var
  5 + t = getApp(), a = t.request, o = t.globalData.setting, os = o,
  6 + i = require("../../utils/util.js"), ut = i, s = require("../../utils/common.js");
  7 +
6 8
7 Component({ 9 Component({
8 data: { 10 data: {
  11 + url: o.imghost,
9 object: null, 12 object: null,
  13 + curPage:1,
  14 + is_no_more:1,//加载完所有数据的控制器
  15 + load_complete:0//加载完成
10 }, 16 },
11 properties: { 17 properties: {
12 // 这里定义了innerText属性,属性值可以在组件使用时指定 18 // 这里定义了innerText属性,属性值可以在组件使用时指定
@@ -14,14 +20,55 @@ Component({ @@ -14,14 +20,55 @@ Component({
14 ready: function () { 20 ready: function () {
15 }, 21 },
16 22
  23 +
17 methods: { 24 methods: {
  25 +
  26 + get_list:function(){
  27 +
  28 + var that = this;
  29 + var curPage = that.data.curPage;
  30 + getApp().request.get('/api/weshop/goods/page?page',{
  31 + data: { is_mainshow: 1, isonsale: 1,
  32 + is_recommend: 1, is_on_sale: 1,
  33 + store_id: o.stoid,
  34 + page: curPage,
  35 + pageSize:10,
  36 + },
  37 + success: function (res){
  38 +
  39 + that.data.curPage++;
  40 + var data=res.data;
  41 + if (res.data.data.pageData.length==0){
  42 + that.setData({is_no_more:0});
  43 + t.showWarning("加载完啦", null, 500, !1)
  44 + return false;
  45 + }
  46 + //加载完成
  47 + if (data.data.pageData) {
  48 + that.setData({load_complete:1});
  49 + }
  50 + that.setData({recommend:data.data.pageData});
  51 + }
  52 + })
  53 + },
  54 + bind_bnerr_xc: function (e) {
  55 + var _errImg = e.target.dataset.errorimg;
  56 + var _errurl = e.target.dataset.url;
  57 +
  58 + var _errObj = {};
  59 + _errObj[_errImg] = "/miniapp/images/default_g_img.gif";
  60 + this.setData(_errObj) //注意这里的赋值方式,只是将数据列表中的此项图片路径值替换掉 ;
  61 +
  62 + },
18 63
  64 + reset:function(){
  65 + curPage=1;
  66 + },
  67 +
  68 +
19 }, 69 },
20 70
21 - //打开  
22 - onshow: function (e) {  
23 -  
24 - } 71 +
25 72
26 73
27 74
components/goods_list/goods_list.json
1 { 1 {
2 "component": true, 2 "component": true,
3 - "usingComponents": {} 3 + "usingComponents": {}
4 } 4 }
5 \ No newline at end of file 5 \ No newline at end of file
components/goods_list/goods_list.wxml
@@ -5,7 +5,7 @@ @@ -5,7 +5,7 @@
5 <!-- 商品详情 --> 5 <!-- 商品详情 -->
6 <view class="collect ib" wx:for="{{recommend}}" bindtap="go_url" data-url="/pages/goods/goodsInfo/goodsInfo?goods_id={{item.goods_id}}"> 6 <view class="collect ib" wx:for="{{recommend}}" bindtap="go_url" data-url="/pages/goods/goodsInfo/goodsInfo?goods_id={{item.goods_id}}">
7 <!-- 商品图片 --> 7 <!-- 商品图片 -->
8 - <image class="sp" src="{{item.original_img}}" mode="scaleToFill" binderror="bind_bnerr2" data-url="{{item.original_img}}" data-errorimg="recommend[{{index}}].original_img"></image> 8 + <image class="sp" src="{{url+item.original_img}}" mode="scaleToFill" binderror="bind_bnerr_xc" data-url="{{item.original_img}}" data-errorimg="recommend[{{index}}].original_img"></image>
9 <view class="bottom"> 9 <view class="bottom">
10 <!-- 商品名称 --> 10 <!-- 商品名称 -->
11 <view class="goods_name ellipsis-2 fs24">{{item.goods_name}}</view> 11 <view class="goods_name ellipsis-2 fs24">{{item.goods_name}}</view>
@@ -21,17 +21,11 @@ @@ -21,17 +21,11 @@
21 <view class="fs22">¥</view> 21 <view class="fs22">¥</view>
22 <view class="fs22">{{item.market_price}}</view> 22 <view class="fs22">{{item.market_price}}</view>
23 </view> 23 </view>
24 -  
25 </view> 24 </view>
26 -  
27 -  
28 </view> 25 </view>
29 -  
30 -  
31 </view> 26 </view>
32 -  
33 </view> 27 </view>
34 - <view class="nothing flex-center" wx:if="{{is_no_more}}"> 28 + <view class="nothing flex-center" wx:if="{{is_no_more==0}}">
35 <view class="Foil"></view> 29 <view class="Foil"></view>
36 <view class="no_content fs24">没有更多内容了</view> 30 <view class="no_content fs24">没有更多内容了</view>
37 <view class="Foil"></view> 31 <view class="Foil"></view>
components/goods_list/goods_list.wxss
1 .collects { 1 .collects {
2 margin-top: 40rpx; 2 margin-top: 40rpx;
3 } 3 }
  4 +.ib{
  5 + display: inline-block;
  6 +}
  7 +.fs24{
  8 + font-size: 24rpx;
  9 +}
  10 +.flex-center{
  11 +display:flex;
  12 +justify-content:center;
  13 +align-items:center;
  14 +}
  15 +.xc-wc{
  16 + color: #d60021;
4 17
  18 +}
  19 +.fs22{
  20 + font-size: 22rpx;
  21 +}
  22 +.xc-ash{
  23 +color: #b9b9b9;
  24 +}
  25 +.choice_box .choice_list .choice_footer .price {
  26 + color: #f23030; height: 10px
  27 +}
  28 +.fs35{
  29 + font-size:35rpx;
  30 +}
  31 +.flex{display: flex}
  32 +.ellipsis-2 {
  33 + overflow: hidden;
  34 + text-overflow: ellipsis;
  35 + display: -webkit-box;
  36 + -webkit-box-orient: vertical;
  37 + -webkit-line-clamp: 2;
  38 +}
  39 +.goods_name{
  40 + height: 70rpx;
  41 + margin-top: 6rpx;
  42 +}
5 .hang { 43 .hang {
6 width: 100%; 44 width: 100%;
7 margin: auto; 45 margin: auto;
pages/index/index/index.js
@@ -59,7 +59,7 @@ Page({ @@ -59,7 +59,7 @@ Page({
59 59
60 onLoad: function () { 60 onLoad: function () {
61 var th = this; 61 var th = this;
62 - n.init(th, "", "recommend"); 62 + // n.init(th, "", "recommend");
63 63
64 //看一下商家是否开通了权益 64 //看一下商家是否开通了权益
65 //--初始化是否有打勾-- 65 //--初始化是否有打勾--
@@ -72,8 +72,14 @@ Page({ @@ -72,8 +72,14 @@ Page({
72 } 72 }
73 }) 73 })
74 74
  75 +
  76 +
75 }, 77 },
76 async onShow() { 78 async onShow() {
  79 +
  80 +
  81 +
  82 +
77 var th=this; 83 var th=this;
78 await this.init_load(); 84 await this.init_load();
79 //显示的时候要开启计时器 85 //显示的时候要开启计时器
@@ -288,13 +294,14 @@ Page({ @@ -288,13 +294,14 @@ Page({
288 } 294 }
289 }) 295 })
290 //---调用信息--- 296 //---调用信息---
291 - this.requestRecommend(); 297 + // this.requestRecommend();
292 this.setData({ishow:1}); 298 this.setData({ishow:1});
293 //---先获取会员--- 299 //---先获取会员---
294 t.getUserFir(function () { 300 t.getUserFir(function () {
295 301
296 }); 302 });
297 - 303 + var goods_list = this.selectComponent("#goods_list"); //组件的id
  304 + goods_list.get_list();
298 }, 305 },
299 306
300 //--判断小程序是否过期-- 307 //--判断小程序是否过期--
@@ -312,23 +319,13 @@ Page({ @@ -312,23 +319,13 @@ Page({
312 }, 319 },
313 //---加载更多是靠这个函数---- 320 //---加载更多是靠这个函数----
314 onReachBottom: function () { 321 onReachBottom: function () {
315 - //if (!n.canloadMore()) this.setData({ is_no_more:1});  
316 - var n1 = n.data.goodsLoadFinishFlag  
317 - if (n1) {  
318 - this.setData({ is_no_more: 1 }); return false;  
319 - }  
320 - n.canloadMore() && this.requestRecommend();  
321 - 322 +
  323 + var goods_list = this.selectComponent("#goods_list"); //组件的id
  324 + goods_list.get_list();
  325 +
322 }, 326 },
323 327
324 - //--更多商品--  
325 - requestRecommend: function () {  
326 - var e = this, t = '/api/weshop/goods/page?page=' + e.data.currentPage;  
327 - n.request(t, function () {  
328 - e.data.currentPage++;  
329 - }  
330 - , null, { is_mainshow: 1, isonsale: 1, is_recommend:1, is_on_sale: 1, store_id: o.stoid, pageSize: 10 });  
331 - }, 328 +
332 329
333 onPullDownRefresh: function (e) { 330 onPullDownRefresh: function (e) {
334 this.data.recommend = null, this.data.currentPage = 1, n.resetConfig(), this.requestHomePage(), 331 this.data.recommend = null, this.data.currentPage = 1, n.resetConfig(), this.requestHomePage(),
@@ -393,12 +390,12 @@ Page({ @@ -393,12 +390,12 @@ Page({
393 bind_bnerr2: function (e) { 390 bind_bnerr2: function (e) {
394 var _errImg = e.target.dataset.errorimg; 391 var _errImg = e.target.dataset.errorimg;
395 var _errurl = e.target.dataset.url; 392 var _errurl = e.target.dataset.url;
396 - var ii = _errurl.indexOf(o.imghost);  
397 - if (ii != -1) {  
398 - var _errObj = {};  
399 - _errObj[_errImg] = this.data.url + "/miniapp/images/default_g_img.gif";  
400 - this.setData(_errObj) //注意这里的赋值方式,只是将数据列表中的此项图片路径值替换掉 ;  
401 - } 393 + //var ii = _errurl.indexOf(o.imghost);
  394 + // if (ii != -1) {
  395 + // var _errObj = {};
  396 + // _errObj[_errImg] = this.data.url + "/miniapp/images/default_g_img.gif";
  397 + // this.setData(_errObj) //注意这里的赋值方式,只是将数据列表中的此项图片路径值替换掉 ;
  398 + // }
402 }, 399 },
403 //图片失败,默认图片 400 //图片失败,默认图片
404 bind_bnerr3: function (e) { 401 bind_bnerr3: function (e) {
pages/index/index/index.json
@@ -2,9 +2,9 @@ @@ -2,9 +2,9 @@
2 "navigationBarBackgroundColor": "#ff7295", 2 "navigationBarBackgroundColor": "#ff7295",
3 "navigationBarTextStyle": "white", 3 "navigationBarTextStyle": "white",
4 "usingComponents": { 4 "usingComponents": {
5 - "goods_list":"/components/goods_list/goods_list", 5 + "goods_recommend":"/components/goods_list/goods_list",
6 "nav": "/components/diy_nav/diy_nav", 6 "nav": "/components/diy_nav/diy_nav",
7 - "advertising":"/components/diy_advertising/diy_advertising", 7 + "advertising":"/components/diy_advertising/diy_advertising",
8 "groupbuy": "/components/diy_groupbuy/diy_groupbuy", 8 "groupbuy": "/components/diy_groupbuy/diy_groupbuy",
9 "goodsGroup": "/components/diy_goodsGroup/diy_goodsGroup", 9 "goodsGroup": "/components/diy_goodsGroup/diy_goodsGroup",
10 "seckill": "/components/diy_seckill/diy_seckill", 10 "seckill": "/components/diy_seckill/diy_seckill",
pages/index/index/index.wxml
@@ -140,12 +140,7 @@ @@ -140,12 +140,7 @@
140 <image src="{{url+aitem.original_img}}" lazy-load="true" data-errorimg="saleGoods[{{index}}][{{aind}}].original_img" 140 <image src="{{url+aitem.original_img}}" lazy-load="true" data-errorimg="saleGoods[{{index}}][{{aind}}].original_img"
141 binderror="bind_bnerr3" data-img="{{aitem.original_img}}"></image> 141 binderror="bind_bnerr3" data-img="{{aitem.original_img}}"></image>
142 142
143 - <!--<view class="djs_view">-->  
144 - <!--<text class='tui-conutdown-box'>{{aitem.djs.day}}</text>天-->  
145 - <!--<text class='tui-conutdown-box'>{{aitem.djs.hou}}</text>时-->  
146 - <!--<text class='tui-conutdown-box'>{{aitem.djs.min}}</text>分-->  
147 - <!--<text class='tui-conutdown-box tui-countdown-bg'>{{aitem.djs.sec}}</text>秒-->  
148 - <!--</view>--> 143 +
149 144
150 145
151 <image wx:if="{{aitem.status==0}}" class="status_img" src="{{url}}/miniapp/images/miao/yure.png"></image> 146 <image wx:if="{{aitem.status==0}}" class="status_img" src="{{url}}/miniapp/images/miao/yure.png"></image>
@@ -237,15 +232,7 @@ @@ -237,15 +232,7 @@
237 </view> 232 </view>
238 233
239 </view> 234 </view>
240 - <!-- <view class="kill-item"wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind">  
241 - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}">  
242 - <view class="kill-pic ">  
243 - <image class="wh100" src="{{url+aitem.original_img}}" data-val="{{aitem.original_img}}"  
244 - data-errorimg="goodlist[{{index}}].original_img" binderror="bind_bnerr2" lazy-load="true">  
245 - </image>  
246 - </view>  
247 - </navigator>  
248 - </view> --> 235 +
249 236
250 </swiper-item> 237 </swiper-item>
251 </swiper> 238 </swiper>
@@ -256,93 +243,7 @@ @@ -256,93 +243,7 @@
256 </view> 243 </view>
257 </view> 244 </view>
258 </view> 245 </view>
259 - <!--新品上市-->  
260 - <!-- <view class="seckill" wx:if="{{newGoods!=null}}">  
261 - <navigator url="/pages/goods/goodsList/goodsList?is_new=1">  
262 - <view class="seckill-time">  
263 - <view class="classname">  
264 - <text class="sk-tips">新品上市</text>  
265 - </view>  
266 - <image class="arrow-right" src="{{url}}/miniapp/images/icon-arrowdown.png"></image>  
267 - </view>  
268 - </navigator>  
269 - <view class="seckill-list">  
270 - <swiper class="s_prom" indicator-active-color='red' indicator-dots="true">  
271 - <swiper-item wx:for="{{newGoods}}" class="p_swiper" wx:key="{{index}}">  
272 - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}"  
273 - wx:for="{{item}}" wx:key="item" wx:for-item="aitem" wx:for-index="aind"  
274 - >  
275 - <view class="imgview">  
276 - <image src="{{url+aitem.original_img}}" lazy-load="true" data-errorimg="newGoods[{{index}}][{{aind}}].original_img"  
277 - binderror="bind_bnerr3" data-img="{{aitem.original_img}}"></image>  
278 -  
279 - </view>  
280 - <view>{{aitem.goods_name}}</view>  
281 - <view class="co-red">¥{{aitem.shop_price}}  
282 - <text class="un_line">¥{{aitem.market_price}}</text>  
283 - </view>  
284 - </navigator>  
285 - </swiper-item>  
286 - </swiper>  
287 - </view>  
288 - </view> -->  
289 - <!--热销商品-->  
290 - <!-- <view class="seckill" wx:if="{{hotGoods!=null}}">  
291 - <navigator url="/pages/goods/goodsList/goodsList?is_hot=1">  
292 - <view class="seckill-time">  
293 - <view class="classname">  
294 - <text class="sk-tips">热销商品</text>  
295 - </view>  
296 - <image class="arrow-right" src="{{url}}/miniapp/images/icon-arrowdown.png"></image>  
297 - </view>  
298 - </navigator>  
299 - <view class="seckill-list">  
300 - <swiper class="s_prom" indicator-active-color='red' indicator-dots="true">  
301 - <swiper-item wx:for="{{hotGoods}}" class="p_swiper" wx:key="{{index}}">  
302 - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}"  
303 - wx:for="{{item}}" wx:key="item" wx:for-item="aitem" wx:for-index="aind"  
304 - >  
305 - <view class="imgview">  
306 - <image src="{{url+aitem.original_img}}" lazy-load="true" data-errorimg="hotGoods[{{index}}][{{aind}}].original_img"  
307 - binderror="bind_bnerr3" data-img="{{aitem.original_img}}"></image>  
308 -  
309 - </view>  
310 - <view>{{aitem.goods_name}}</view>  
311 - <view class="co-red">¥{{aitem.shop_price}}  
312 - <text class="un_line">¥{{aitem.market_price}}</text>  
313 - </view>  
314 - </navigator>  
315 - </swiper-item>  
316 - </swiper>  
317 - </view>  
318 - </view> -->  
319 - <!--推荐商品-->  
320 - <!--111111111111 <view class="section">  
321 - <view class="section-title">推荐商品</view>  
322 - <view class="section-subtitle">  
323 - <image class="wh100" src="{{url}}/miniapp/images/pic-interesting.png"></image>  
324 - </view>  
325 - </view>  
326 - <view class="choice_box">  
327 - <view class="choice_list">  
328 - <view class="choice_item" wx:for="{{recommend}}" wx:key="{{index}}" >  
329 - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{item.goods_id}}">  
330 - <image src="{{item.original_img}}" lazy-load="true" binderror="bind_bnerr2" data-url="{{item.original_img}}" data-errorimg="recommend[{{index}}].original_img"></image>  
331 - </navigator>  
332 - <navigator class="title shelue" url="/pages/goods/goodsInfo/goodsInfo?goods_id={{item.goods_id}}">{{item.goods_name}}</navigator>  
333 - <view class="choice_footer">  
334 - <view class="price flex"> -->  
335 - <!--<view class="meiz" wx:if="{{index==1}}">美妆价</view><view class="dengj" wx:if="{{index==3}}">等级价</view>-->  
336 - <!-- 11111¥{{item.shop_price}} <view class="xiafa">¥{{item.market_price}}</view>  
337 - </view>  
338 - <view class="ys">已售{{item.sales_sum}}</view> -->  
339 - <!-- <navigator class="similer" url="/pages/goods/goodsList/goodsList?cat_id={{item.cat_id}}">找相似</navigator>-->  
340 - <!-- 111111</view>  
341 - </view>  
342 - </view>  
343 - </view>  
344 -</view> -->  
345 - 246 +
346 247
347 248
348 249
@@ -376,44 +277,10 @@ @@ -376,44 +277,10 @@
376 </view> 277 </view>
377 278
378 </view> 279 </view>
  280 + <!-- 商品列表组件 -->
  281 + <goods_recommend id="goods_list"></goods_recommend>
379 <!-- 商品列表 --> 282 <!-- 商品列表 -->
380 - <!-- <view class="collects">  
381 - <view class="hang "> -->  
382 - <!-- 商品详情 -->  
383 - <!-- <view class="collect ib" wx:for="{{recommend}}" bindtap="go_url" data-url="/pages/goods/goodsInfo/goodsInfo?goods_id={{item.goods_id}}"> -->  
384 - <!-- 商品图片 -->  
385 - <!-- <image class="sp" src="{{item.original_img}}" mode="scaleToFill" binderror="bind_bnerr2" data-url="{{item.original_img}}" data-errorimg="recommend[{{index}}].original_img"></image>  
386 - <view class="bottom"> -->  
387 - <!-- 商品名称 -->  
388 - <!-- <view class="goods_name ellipsis-2 fs24">{{item.goods_name}}</view> -->  
389 - <!-- 商品价格 -->  
390 - <!-- <view class="money flex"> -->  
391 - <!-- 办卡价 -->  
392 - <!-- <view class="flex xc-wc">  
393 - <view class="fs24">¥</view>  
394 - <view class="fs35">{{filter.toFix(item.shop_price,2)}}</view>  
395 - </view> -->  
396 - <!-- 原价 -->  
397 - <!-- <view class="price flex xc-ash">  
398 - <view class="fs22">¥</view>  
399 - <view class="fs22">{{item.market_price}}</view>  
400 - </view>  
401 -  
402 - </view>  
403 -  
404 -  
405 - </view>  
406 -  
407 -  
408 - </view>  
409 -  
410 - </view>  
411 - <view class="nothing flex-center" wx:if="{{is_no_more}}">  
412 - <view class="Foil"></view>  
413 - <view class="no_content fs24">没有更多内容了</view>  
414 - <view class="Foil"></view>  
415 - </view>  
416 - </view> --> 283 +
417 </view> 284 </view>
418 285
419 </view> 286 </view>
utils/LoadMore.js
@@ -110,13 +110,13 @@ var e = function() { @@ -110,13 +110,13 @@ var e = function() {
110 110
111 //没有活动,就不用调用接口 111 //没有活动,就不用调用接口
112 if (glist==""){ 112 if (glist==""){
113 - c.setData(a({}, l, g)); 113 + //c.setData(a({}, l, g));
114 if ("function" == typeof e && (n = e(t)), !1 === n) return !1; 114 if ("function" == typeof e && (n = e(t)), !1 === n) return !1;
115 i && 0 != i.length || (s.data.goodsLoadFinishFlag = !0, u && o.showWarning("加载完啦", null, 500, !1)); 115 i && 0 != i.length || (s.data.goodsLoadFinishFlag = !0, u && o.showWarning("加载完啦", null, 500, !1));
116 return false; 116 return false;
117 } 117 }
118 118
119 - c.setData(a({}, l, g)); 119 + // c.setData(a({}, l, g));
120 if ("function" == typeof e && (n = e(t)), !1 === n) return !1; 120 if ("function" == typeof e && (n = e(t)), !1 === n) return !1;
121 i && 0 != i.length || (s.data.goodsLoadFinishFlag = !0, u && o.showWarning("加载完啦", null, 500, !1)); 121 i && 0 != i.length || (s.data.goodsLoadFinishFlag = !0, u && o.showWarning("加载完啦", null, 500, !1));
122 122
utils/filter.wxs
1 var filters = { 1 var filters = {
2 toFix:function(val,count){ 2 toFix:function(val,count){
3 - console.log("你是说明书上 没什么 ");  
4 return val.toFixed(count) 3 return val.toFixed(count)
5 }, 4 },
6 replace_time:function(val){ 5 replace_time:function(val){