Skip to content

Commit 24ff48b

Browse files
authored
style(微信小程序): 更新首页优惠券的样式 🎨 (#520)
1 parent fe57793 commit 24ff48b

File tree

2 files changed

+282
-252
lines changed

2 files changed

+282
-252
lines changed

litemall-wx/pages/index/index.wxml

Lines changed: 179 additions & 179 deletions
Original file line numberDiff line numberDiff line change
@@ -1,198 +1,198 @@
1-
<!--index.wxml-->
1+
<!-- index.wxml -->
22
<view class="container">
3-
<view class="search">
4-
<navigator url="/pages/search/search" class="input">
5-
<van-icon name="search"/>
6-
<text class="txt">商品搜索, 共{{goodsCount}}款好物</text>
7-
</navigator>
8-
</view>
9-
<swiper class="banner" indicator-dots="true" autoplay="true" interval="3000" duration="1000">
10-
<swiper-item wx:for="{{banner}}" wx:key="id">
11-
<block wx:if="{{item.link>0}}">
12-
<navigator url="/pages/goods/goods?id={{item.link}}">
13-
<image src="{{item.url}}" background-size="cover"></image>
3+
<view class="search">
4+
<navigator url="/pages/search/search" class="input">
5+
<van-icon name="search" />
6+
<text class="txt">商品搜索, 共{{goodsCount}}款好物</text>
147
</navigator>
15-
</block>
16-
<block wx:else>
17-
<image src="{{item.url}}" background-size="cover"></image>
18-
</block>
19-
</swiper-item>
20-
</swiper>
21-
<view class="m-menu">
22-
<navigator class="item" url="/pages/category/category?id={{item.id}}" wx:for="{{channel}}" wx:key="id">
23-
<image src="{{item.iconUrl}}" background-size="cover"></image>
24-
<text>{{item.name}}</text>
25-
</navigator>
26-
</view>
27-
28-
<view class="a-section a-coupon" wx:if="{{coupon.length > 0}}">
29-
<view class="h">
30-
<view class="title">
31-
<view>
32-
<navigator url="/pages/coupon/coupon">
33-
<text class="txt">优惠券</text>
34-
</navigator>
35-
</view>
36-
</view>
378
</view>
38-
<view wx:if="{{coupon.length>0}}" class="b">
39-
<view class="item" wx:for="{{coupon}}" wx:for-index="index" wx:for-item="item" wx:key="id" bindtap="getCoupon" data-index="{{item.id}}">
40-
<view class="tag">{{item.tag}}</view>
41-
<view class="content">
42-
<view class="left">
43-
<view class="discount">{{item.discount}}元</view>
44-
<view class="min"> 满{{item.min}}元使用</view>
45-
</view>
46-
<view class="right">
47-
<view class="name">{{item.name}}</view>
48-
<view class="desc">{{item.desc}}</view>
49-
<view class="time" wx:if="{{item.days != 0}}">有效期:{{item.days}}天</view>
50-
<view class="time" wx:else> 有效期:{{item.startTime}} - {{item.endTime}}</view>
51-
</view>
52-
</view>
53-
</view>
9+
<swiper class="banner" indicator-dots="true" autoplay="true" interval="3000" duration="1000">
10+
<swiper-item wx:for="{{banner}}" wx:key="id">
11+
<block wx:if="{{item.link>0}}">
12+
<navigator url="/pages/goods/goods?id={{item.link}}">
13+
<image src="{{item.url}}" background-size="cover"></image>
14+
</navigator>
15+
</block>
16+
<block wx:else>
17+
<image src="{{item.url}}" background-size="cover"></image>
18+
</block>
19+
</swiper-item>
20+
</swiper>
21+
<view class="m-menu">
22+
<navigator class="item" url="/pages/category/category?id={{item.id}}" wx:for="{{channel}}" wx:key="id">
23+
<image src="{{item.iconUrl}}" background-size="cover"></image>
24+
<text>{{item.name}}</text>
25+
</navigator>
5426
</view>
55-
</view>
56-
57-
<view class="a-section a-groupon" wx:if="{{groupons.length > 0}}">
58-
<view class="h">
59-
<view class="title">
60-
<view>
61-
<navigator url="/pages/groupon/grouponList/grouponList">
62-
<text class="txt">团购专区</text>
63-
</navigator>
27+
<view class="a-section a-coupon" wx:if="{{coupon.length > 0}}">
28+
<view class="h">
29+
<view class="title">
30+
<view>
31+
<navigator url="/pages/coupon/coupon">
32+
<text class="txt">优惠券</text>
33+
</navigator>
34+
</view>
35+
</view>
6436
</view>
65-
</view>
66-
</view>
67-
<view class="b">
68-
<view class="item" wx:for="{{groupons}}" wx:for-index="index" wx:for-item="item" wx:key="id">
69-
<navigator url="/pages/goods/goods?id={{item.id}}">
70-
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
71-
<view class="right">
72-
<view class="text">
73-
<view class="header">
74-
<text class="name">{{item.name}}</text>
75-
<van-tag type="primary">{{item.grouponMember}}人成团</van-tag>
76-
</view>
77-
<view class="expire">
78-
<van-tag round type="warning">有效期至 {{item.expireTime}}</van-tag>
79-
</view>
80-
<text class="desc">{{item.brief}}</text>
81-
<view class="price">
82-
<view class="counterPrice">现价:¥{{item.retailPrice}}</view>
83-
<view class="retailPrice">团购价:¥{{item.grouponPrice}}</view>
84-
</view>
37+
<view wx:if="{{coupon.length>0}}" class="b">
38+
<view class="coupon_item" wx:for="{{coupon}}" wx:for-index="index" wx:for-item="item" wx:key="id" bindtap="getCoupon" data-index="{{item.id}}">
39+
<view class="coupon_price">
40+
<view>
41+
<!-- <view class="tag"></view> -->
42+
<view class="price">{{item.discount}}元</view>
43+
<view class="p">满{{item.min}}元使用</view>
44+
</view>
45+
</view>
46+
<view class="coupon_msg">
47+
<view class="coupon_condition">
48+
<view class="coupon_tag">
49+
<view class="coupon_tag_text">{{item.tag}}</view>
50+
</view>
51+
<view class="text">{{item.name}}</view>
52+
</view>
53+
<view class="coupon_instruction">{{item.desc}}</view>
54+
<view class="coupon_date" wx:if="{{item.days != 0}}">{{item.days}}天</view>
55+
<view class="coupon_date" wx:else>{{item.startTime}} - {{item.endTime}}</view>
56+
</view>
8557
</view>
86-
</view>
87-
</navigator>
88-
</view>
89-
</view>
90-
</view>
91-
92-
<view class="a-section a-brand">
93-
<view class="h">
94-
<navigator url="../brand/brand">
95-
<text class="txt">品牌制造商直供</text>
96-
</navigator>
58+
</view>
9759
</view>
98-
<view class="b">
99-
<view class="item item-1" wx:for="{{brands}}" wx:key="id">
100-
<navigator url="/pages/brandDetail/brandDetail?id={{item.id}}">
101-
<view class="wrap">
102-
<image class="img" src="{{item.picUrl}}" mode="aspectFill"></image>
103-
<view class="mt">
104-
<text class="brand">{{item.name}}</text>
105-
<text class="price">{{item.floorPrice}}</text>
106-
<text class="unit">元起</text>
60+
<view class="a-section a-groupon" wx:if="{{groupons.length > 0}}">
61+
<view class="h">
62+
<view class="title">
63+
<view>
64+
<navigator url="/pages/groupon/grouponList/grouponList">
65+
<text class="txt">团购专区</text>
66+
</navigator>
67+
</view>
10768
</view>
108-
</view>
109-
</navigator>
110-
</view>
111-
</view>
112-
</view>
113-
<view class="a-section a-new" wx:if="{{newGoods.length > 0}}">
114-
<view class="h">
115-
<view>
116-
<navigator url="../newGoods/newGoods">
117-
<text class="txt">周一周四 · 新品首发</text>
118-
</navigator>
119-
</view>
120-
</view>
121-
<view class="b">
122-
<view class="item" wx:for="{{newGoods}}" wx:for-index="index" wx:for-item="item" wx:key="id">
123-
<navigator url="../goods/goods?id={{item.id}}">
124-
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
125-
<text class="name">{{item.name}}</text>
126-
<text class="price">¥{{item.retailPrice}}</text>
127-
</navigator>
128-
</view>
129-
</view>
130-
</view>
131-
132-
<view class="a-section a-popular" wx:if="{{hotGoods.length > 0}}">
133-
<view class="h">
134-
<view>
135-
<navigator url="../hotGoods/hotGoods">
136-
<text class="txt">人气推荐</text>
137-
</navigator>
138-
</view>
69+
</view>
70+
<view class="b">
71+
<view class="item" wx:for="{{groupons}}" wx:for-index="index" wx:for-item="item" wx:key="id">
72+
<navigator url="/pages/goods/goods?id={{item.id}}">
73+
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
74+
<view class="right">
75+
<view class="text">
76+
<view class="header">
77+
<text class="name">{{item.name}}</text>
78+
<van-tag type="primary">{{item.grouponMember}}人成团</van-tag>
79+
</view>
80+
<view class="expire">
81+
<van-tag round type="warning">有效期至 {{item.expireTime}}</van-tag>
82+
</view>
83+
<text class="desc">{{item.brief}}</text>
84+
<view class="price">
85+
<view class="counterPrice">现价:¥{{item.retailPrice}}</view>
86+
<view class="retailPrice">团购价:¥{{item.grouponPrice}}</view>
87+
</view>
88+
</view>
89+
</view>
90+
</navigator>
91+
</view>
92+
</view>
13993
</view>
140-
<view class="b">
141-
<view class="item" wx:for="{{hotGoods}}" wx:for-index="index" wx:for-item="item" wx:key="id">
142-
<navigator url="/pages/goods/goods?id={{item.id}}">
143-
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
144-
<view class="right">
145-
<view class="text">
146-
<text class="name">{{item.name}}</text>
147-
<text class="desc">{{item.brief}}</text>
148-
<text class="price">¥{{item.retailPrice}}</text>
94+
<view class="a-section a-brand">
95+
<view class="h">
96+
<navigator url="../brand/brand">
97+
<text class="txt">品牌制造商直供</text>
98+
</navigator>
99+
</view>
100+
<view class="b">
101+
<view class="item item-1" wx:for="{{brands}}" wx:key="id">
102+
<navigator url="/pages/brandDetail/brandDetail?id={{item.id}}">
103+
<view class="wrap">
104+
<image class="img" src="{{item.picUrl}}" mode="aspectFill"></image>
105+
<view class="mt">
106+
<text class="brand">{{item.name}}</text>
107+
<text class="price">{{item.floorPrice}}</text>
108+
<text class="unit">元起</text>
109+
</view>
110+
</view>
111+
</navigator>
149112
</view>
150-
</view>
151-
</navigator>
152-
</view>
113+
</view>
153114
</view>
154-
</view>
155-
156-
<view class="a-section a-topic" wx:if="topics.length > 0" hidden="{{topics.length <= 0}}">
157-
<view class="h">
158-
<view>
159-
<navigator url="/pages/topic/topic">
160-
<text class="txt">专题精选</text>
161-
</navigator>
162-
</view>
115+
<view class="a-section a-new" wx:if="{{newGoods.length > 0}}">
116+
<view class="h">
117+
<view>
118+
<navigator url="../newGoods/newGoods">
119+
<text class="txt">周一周四 · 新品首发</text>
120+
</navigator>
121+
</view>
122+
</view>
123+
<view class="b">
124+
<view class="item" wx:for="{{newGoods}}" wx:for-index="index" wx:for-item="item" wx:key="id">
125+
<navigator url="../goods/goods?id={{item.id}}">
126+
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
127+
<text class="name">{{item.name}}</text>
128+
<text class="price">¥{{item.retailPrice}}</text>
129+
</navigator>
130+
</view>
131+
</view>
163132
</view>
164-
<view class="b">
165-
<scroll-view scroll-x class="list">
166-
<view class="item" wx:for="{{topics}}" wx:for-index="index" wx:for-item="item" wx:key="id">
167-
<navigator url="../topicDetail/topicDetail?id={{item.id}}">
168-
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
169-
<view class="np">
170-
<text class="name">{{item.title}}</text>
171-
<text class="price">¥{{item.price}}元起</text>
133+
<view class="a-section a-popular" wx:if="{{hotGoods.length > 0}}">
134+
<view class="h">
135+
<view>
136+
<navigator url="../hotGoods/hotGoods">
137+
<text class="txt">人气推荐</text>
138+
</navigator>
139+
</view>
140+
</view>
141+
<view class="b">
142+
<view class="item" wx:for="{{hotGoods}}" wx:for-index="index" wx:for-item="item" wx:key="id">
143+
<navigator url="/pages/goods/goods?id={{item.id}}">
144+
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
145+
<view class="right">
146+
<view class="text">
147+
<text class="name">{{item.name}}</text>
148+
<text class="desc">{{item.brief}}</text>
149+
<text class="price">¥{{item.retailPrice}}</text>
150+
</view>
151+
</view>
152+
</navigator>
172153
</view>
173-
<text class="desc">{{item.subtitle}}</text>
174-
</navigator>
175154
</view>
176-
</scroll-view>
177155
</view>
178-
</view>
179-
<view class="good-grid" wx:for="{{floorGoods}}" wx:key="id">
180-
<view class="h" wx:if="{{item.goodsList.length>0}}">
181-
<text>{{item.name}}</text>
156+
<view class="a-section a-topic" wx:if="topics.length > 0" hidden="{{topics.length <= 0}}">
157+
<view class="h">
158+
<view>
159+
<navigator url="/pages/topic/topic">
160+
<text class="txt">专题精选</text>
161+
</navigator>
162+
</view>
163+
</view>
164+
<view class="b">
165+
<scroll-view scroll-x class="list">
166+
<view class="item" wx:for="{{topics}}" wx:for-index="index" wx:for-item="item" wx:key="id">
167+
<navigator url="../topicDetail/topicDetail?id={{item.id}}">
168+
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
169+
<view class="np">
170+
<text class="name">{{item.title}}</text>
171+
<text class="price">¥{{item.price}}元起</text>
172+
</view>
173+
<text class="desc">{{item.subtitle}}</text>
174+
</navigator>
175+
</view>
176+
</scroll-view>
177+
</view>
182178
</view>
183-
<view class="b">
184-
<block wx:for="{{item.goodsList}}" wx:for-index="iindex" wx:for-item="iitem" wx:key="id">
185-
<view class="item {{iindex % 2 == 0 ? '' : 'item-b'}}">
186-
<navigator url="../goods/goods?id={{iitem.id}}" class="a">
187-
<image class="img" src="{{iitem.picUrl}}" background-size="cover"></image>
188-
<text class="name">{{iitem.name}}</text>
189-
<text class="price">¥{{iitem.retailPrice}}</text>
190-
</navigator>
179+
<view class="good-grid" wx:for="{{floorGoods}}" wx:key="id">
180+
<view class="h" wx:if="{{item.goodsList.length>0}}">
181+
<text>{{item.name}}</text>
191182
</view>
192-
</block>
183+
<view class="b">
184+
<block wx:for="{{item.goodsList}}" wx:for-index="iindex" wx:for-item="iitem" wx:key="id">
185+
<view class="item {{iindex % 2 == 0 ? '' : 'item-b'}}">
186+
<navigator url="../goods/goods?id={{iitem.id}}" class="a">
187+
<image class="img" src="{{iitem.picUrl}}" background-size="cover"></image>
188+
<text class="name">{{iitem.name}}</text>
189+
<text class="price">¥{{iitem.retailPrice}}</text>
190+
</navigator>
191+
</view>
192+
</block>
193+
</view>
194+
<navigator url="/pages/category/category?id={{item.id}}" class="t" wx:if="{{item.goodsList.length>0}}">
195+
<view class="txt">{{'更多'+item.name+'好物 >'}}</view>
196+
</navigator>
193197
</view>
194-
<navigator url="/pages/category/category?id={{item.id}}" class="t" wx:if="{{item.goodsList.length>0}}">
195-
<view class="txt">{{'更多'+item.name+'好物 >'}}</view>
196-
</navigator>
197-
</view>
198198
</view>

0 commit comments

Comments
 (0)