刘文博 / gulu-vue

Download as
Browse Code »

Commit 42375342ffbc9bf4657145d8205f17080b7529de

Authored by 范牧
1 parent 55420a8a96
Exists in master

解决冲突

Showing 1 changed file with 1 additions and 8 deletions   Show diff stats
src/pages/cart/cart.vue
Diff comments   View file @4237534
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <block v-if="cartList.length==0"> 3 <block v-if="cartList.length==0">
4 4
5 </block> 5 </block>
6 <block v-else> 6 <block v-else>
7 <view class="card"> 7 <view class="card">
8 <view class="cardHeader"> 8 <view class="cardHeader">
9 <view 9 <view
10 v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'" 10 v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'"
11 @tap="pChange(pIsoPen)" 11 @tap="pChange(pIsoPen)"
12 > 12 >
13 <span class="correct"></span> 13 <span class="correct"></span>
14 </view> 14 </view>
15 <image 15 <image
16 src="../../static/store.png" 16 src="../../static/store.png"
17 mode="aspectFill" 17 mode="aspectFill"
18 ></image> 18 ></image>
19 <text>非常戴镜</text> 19 <text>非常戴镜</text>
20 </view> 20 </view>
21 <view 21 <view
22 class="cardBody" 22 class="cardBody"
23 v-for="(item,index) in cartList" 23 v-for="(item,index) in cartList"
24 :key="item.cart_id" 24 :key="item.cart_id"
25 @longpress="delCart(item.cart_id,index)" 25 @longpress="delCart(item.cart_id,index)"
26 > 26 >
27 <view 27 <view
28 v-bind:class="childIsOpen[index]? 'partentChecked':'partentCheck'" 28 v-bind:class="childIsOpen[index]? 'partentChecked':'partentCheck'"
29 @tap="Change(childIsOpen[index],index)" 29 @tap="Change(childIsOpen[index],index)"
30 > 30 >
31 <span class="correct"></span> 31 <span class="correct"></span>
32 </view> 32 </view>
33 <view class="imageWrap"> 33 <view class="imageWrap">
34 <image 34 <image
35 :src="item.img_index_url" 35 :src="item.img_index_url"
36 mode="aspectFit" 36 mode="aspectFit"
37 style="width: 188rpx;height: 168rpx;" 37 style="width: 188rpx;height: 168rpx;"
38 ></image> 38 ></image>
39 </view> 39 </view>
40 <view class="goodInfo"> 40 <view class="goodInfo">
41 <!-- <view class="imageWrap"> 41 <!-- <view class="imageWrap">
42 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image> 42 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image>
43 </view> --> 43 </view> -->
44 <view class="infoRight"> 44 <view class="infoRight">
45 <view 45 <view
46 class="goodName" 46 class="goodName"
47 @tap="toGoods(item.pid,item.sk_id)" 47 @tap="toGoods(item.pid,item.sk_id)"
48 >{{item.p_name}}</view> 48 >{{item.p_name}}</view>
49 <!-- <view class="describ"> --> 49 <!-- <view class="describ"> -->
50 <uni-collapse accordion="true"> 50 <uni-collapse accordion="true">
51 <uni-collapse-item 51 <uni-collapse-item
52 showAnimation='true' 52 showAnimation='true'
53 :title="item.tag.prod_tag_fun[0].label+'/'+item.tag.prod_tag_fun[1].label+'/'+item.tag.prod_tag_fun[2].label+'...' || '暂无'" 53 :title="item.tag.prod_tag_fun[0].label+'/'+item.tag.prod_tag_fun[1].label+'/'+item.tag.prod_tag_fun[2].label+'...' || '暂无'"
54 > 54 >
55 <text class="describ"> 55 <text class="describ">
56 <block 56 <block
57 v-for="tag in item.tag.prod_tag_fun" 57 v-for="tag in item.tag.prod_tag_fun"
58 :key="tag.value" 58 :key="tag.value"
59 > 59 >
60 {{tag.label+`&nbsp;&nbsp;`}} 60 {{tag.label+`&nbsp;&nbsp;`}}
61 </block> 61 </block>
62 </text> 62 </text>
63 <!-- <text> 63 <!-- <text>
64 <block v-for="tag in item.tag.prod_tag_style" :key="tag.value"> 64 <block v-for="tag in item.tag.prod_tag_style" :key="tag.value">
65 {{tag.label+`&nbsp;&nbsp;`}} 65 {{tag.label+`&nbsp;&nbsp;`}}
66 </block> 66 </block>
67 </text> --> 67 </text> -->
68 </uni-collapse-item> 68 </uni-collapse-item>
69 </uni-collapse> 69 </uni-collapse>
70 <!-- <view v-bind:class="collapseList[index]? 'icon':'iconed'"></view> --> 70 <!-- <view v-bind:class="collapseList[index]? 'icon':'iconed'"></view> -->
71 <!-- </view> --> 71 <!-- </view> -->
72 <view class="priceBox"> 72 <view class="priceBox">
73 <view class="price">￥{{item.nowPrice*item.num}}</view> 73 <view class="price">￥{{item.nowPrice*item.num}}</view>
74 <text class="maxCount">(限购{{maxCount}}副)</text> 74 <text class="maxCount">(限购{{maxCount}}副)</text>
75 <view class="counter"> 75 <view class="counter">
76 <view 76 <view
77 class="btn" 77 class="btn"
78 disabled="this.addDisabled" 78 disabled="this.addDisabled"
79 type="default" 79 type="default"
80 @tap="counter(index,false,item)" 80 @tap="counter(index,false,item)"
81 >-</view> 81 >-</view>
82 <text>{{item.num}}</text> 82 <text>{{item.num}}</text>
83 <view 83 <view
84 class="btn" 84 class="btn"
85 disabled="this.desDisabled" 85 disabled="this.desDisabled"
86 type="default" 86 type="default"
87 @tap="counter(index,true,item)" 87 @tap="counter(index,true,item)"
88 >+</view> 88 >+</view>
89 </view> 89 </view>
90 </view> 90 </view>
91 </view> 91 </view>
92 </view> 92 </view>
93 </view> 93 </view>
94 </view> 94 </view>
95 </block> 95 </block>
96 <view class="footer"> 96 <view class="footer">
97 <view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view> 97 <view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view>
98 <view class="footerRight"> 98 <view class="footerRight">
99 <navigator 99 <navigator
100 url="/pages/confirmOrder/confirmOrder" 100 url="/pages/confirmOrder/confirmOrder"
101 hover-class="navigator-hover" 101 hover-class="navigator-hover"
102 > 102 >
103 <view class="paybtn">立即结算</view> 103 <view class="paybtn">立即结算</view>
104 </navigator> 104 </navigator>
105 </view> 105 </view>
106 </view> 106 </view>
107 107
108 </view> 108 </view>
109 </template> 109 </template>
110 110
111 <script> 111 <script>
112 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue' 112 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
113 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue' 113 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
114 import store from '@/store' 114 import store from '@/store'
115 115
116 export default { 116 export default {
117 components: { UniCollapse, UniCollapseItem }, 117 components: { UniCollapse, UniCollapseItem },
118 data() { 118 data() {
119 return { 119 return {
120 totalPrice: 0, 120 totalPrice: 0,
121 pIsoPen: false, 121 pIsoPen: false,
122 // childIsOpen:[], 122 // childIsOpen:[],
123 maxCount: 20, 123 maxCount: 20,
124 } 124 }
125 }, 125 },
126 computed: { 126 computed: {
127 127
128 cartList() { 128 cartList() {
129 // console.log('cart-list', this.$store.state.cart.cartList); 129 // console.log('cart-list', this.$store.state.cart.cartList);
130 return this.$store.state.cart.cartList 130 return this.$store.state.cart.cartList
131 }, 131 },
132 childIsOpen() { 132 childIsOpen() {
133 const temp = [] 133 const temp = []
134 temp.length = this.$store.state.cart.cartList.length 134 temp.length = this.$store.state.cart.cartList.length
135 for (let i = 0; i < temp.length; i++) { 135 for (let i = 0; i < temp.length; i++) {
136 temp[i] = false 136 temp[i] = false
137 } 137 }
138 console.log('this.childisOPne===>', temp) 138 console.log('this.childisOPne===>', temp)
139 return temp 139 return temp
140 }, 140 },
141 }, 141 },
142 onLoad: function() { 142 onLoad: function() {
143 // store.dispatch('cart/addCart', { 143 // store.dispatch('cart/addCart', {
144 // uid: this.$store.state.user.userInfo.uid, 144 // uid: this.$store.state.user.userInfo.uid,
145 // openid: this.$store.state.user.userInfo.openid, 145 // openid: this.$store.state.user.userInfo.openid,
146 // mp_id: 7, 146 // mp_id: 7,
147 // sk_id: 7, 147 // sk_id: 7,
148 // num: 1, 148 // num: 1,
149 // pid: 8, 149 // pid: 8,
150 // price: 128, 150 // price: 128,
151 // checkedSKU:{}, 151 // checkedSKU:{},
152 // }) 152 // })
153 store.dispatch('cart/getCartList', { 153 store.dispatch('cart/getCartList', {
154 uid: this.$store.state.user.userInfo.uid, // 用户id 154 uid: this.$store.state.user.userInfo.uid, // 用户id
155 }) 155 })
156 }, 156 },
157
158 methods: { 157 methods: {
159 toGoods(id, sk_id) { 158 toGoods(id, sk_id) {
160 console.log('cart-list', this.$store.state.cart.cartList) 159 console.log('cart-list', this.$store.state.cart.cartList)
161 console.log('---', '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + sk_id) 160 console.log('---', '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + sk_id)
162 uni.navigateTo({ 161 uni.navigateTo({
163 url: '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + sk_id, 162 url: '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + sk_id,
164 success: res => {}, 163 success: res => {},
165 fail: () => {}, 164 fail: () => {},
166 complete: () => {}, 165 complete: () => {},
167 }) 166 })
168 }, 167 },
169
170 counter(index, isadd, item) { 168 counter(index, isadd, item) {
171 // console.log('===>>counter ===>num',num) 169 // console.log('===>>counter ===>num',num)
172 // console.log('===>>counter ===>isadd',isadd) 170 // console.log('===>>counter ===>isadd',isadd)
173 console.log('item=====>', item) 171 console.log('item=====>', item)
174 console.log('num=====>', item.num) 172 console.log('num=====>', item.num)
175 const nums = parseInt(item.num) 173 const nums = parseInt(item.num)
176 if (isadd) { 174 if (isadd) {
177 if (nums >= this.maxCount) { 175 if (nums >= this.maxCount) {
178 this.addDisabled = true 176 this.addDisabled = true
179 } else { 177 } else {
180 this.addDisabled = true 178 this.addDisabled = true
181 // 修改num 179 // 修改num
182 if (this.childIsOpen[index]) { 180 if (this.childIsOpen[index]) {
183 this.totalPrice = this.totalPrice + this.$store.state.cart.cartList[index].nowPrice 181 this.totalPrice = this.totalPrice + this.$store.state.cart.cartList[index].nowPrice
184 } 182 }
185 store.dispatch('cart/modiCart', { 183 store.dispatch('cart/modiCart', {
186 uid: this.$store.state.user.userInfo.uid, 184 uid: this.$store.state.user.userInfo.uid,
187 openid: this.$store.state.user.userInfo.openid, 185 openid: this.$store.state.user.userInfo.openid,
188 mp_id: item.mp_id, 186 mp_id: item.mp_id,
189 sk_id: item.sk_id, 187 sk_id: item.sk_id,
190 price: item.nowPrice, 188 price: item.nowPrice,
191 pid: item.pid, 189 pid: item.pid,
192 num: nums + 1, 190 num: nums + 1,
193 cart_id: item.cart_id, 191 cart_id: item.cart_id,
194 args: { 192 args: {
195 index: index, 193 index: index,
196 isadd: isadd, 194 isadd: isadd,
197 }, 195 },
198 }) 196 })
199 this.addDisabled = false 197 this.addDisabled = false
200 } 198 }
201 } else { 199 } else {
202 if (nums <= 1) { 200 if (nums <= 1) {
203 this.desDisabled = true 201 this.desDisabled = true
204 } else { 202 } else {
205 this.desDisabled = false 203 this.desDisabled = false
206 // post 请求修改相关参数 204 // post 请求修改相关参数
207 if (this.childIsOpen[index]) { 205 if (this.childIsOpen[index]) {
208 this.totalPrice = this.totalPrice - this.$store.state.cart.cartList[index].nowPrice 206 this.totalPrice = this.totalPrice - this.$store.state.cart.cartList[index].nowPrice
209 } 207 }
210 store.dispatch('cart/modiCart', { 208 store.dispatch('cart/modiCart', {
211 uid: this.$store.state.user.userInfo.uid, 209 uid: this.$store.state.user.userInfo.uid,
212 openid: this.$store.state.user.userInfo.openid, 210 openid: this.$store.state.user.userInfo.openid,
213 mp_id: item.mp_id, 211 mp_id: item.mp_id,
214 sk_id: item.sk_id, 212 sk_id: item.sk_id,
215 price: item.nowPrice, 213 price: item.nowPrice,
216 pid: item.pid, 214 pid: item.pid,
217 num: nums - 1, 215 num: nums - 1,
218 cart_id: item.cart_id, 216 cart_id: item.cart_id,
219 args: { 217 args: {
220 index: index, 218 index: index,
221 isadd: isadd, 219 isadd: isadd,
222 }, 220 },
223 }) 221 })
224 this.desDisabled = true 222 this.desDisabled = true
225 } 223 }
226 } 224 }
227 // store.dispatch('cart/getCartList', { 225 // store.dispatch('cart/getCartList', {
228 // uid: this.$store.state.user.userInfo.uid // 用户id 226 // uid: this.$store.state.user.userInfo.uid // 用户id
229 // }) 227 // })
230 }, 228 },
231 Change(isopen, indexC) { 229 Change(isopen, indexC) {
232 // console.log('lalla===>',isopen) 230 // console.log('lalla===>',isopen)
233 this.childIsOpen[indexC] = !isopen 231 this.childIsOpen[indexC] = !isopen
234 if (!isopen) { 232 if (!isopen) {
235 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice) 233 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice)
236 } else { 234 } else {
237 this.totalPrice = this.totalPrice - (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice) 235 this.totalPrice = this.totalPrice - (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice)
238 } 236 }
239 let m = true 237 let m = true
240 for (let i = 0; i < this.childIsOpen.length; i++) { 238 for (let i = 0; i < this.childIsOpen.length; i++) {
241 m = m & this.childIsOpen[i] 239 m = m & this.childIsOpen[i]
242 } 240 }
243 if (m == 1) { 241 if (m === 1) {
244 this.pIsoPen = true 242 this.pIsoPen = true
245 } else { 243 } else {
246 this.pIsoPen = false 244 this.pIsoPen = false
247 } 245 }
248 }, 246 },
249 pChange(isopen) { 247 pChange(isopen) {
250 this.pIsoPen = !isopen 248 this.pIsoPen = !isopen
251 for (let i = 0; i < this.childIsOpen.length; i++) { 249 for (let i = 0; i < this.childIsOpen.length; i++) {
252 this.childIsOpen[i] = !isopen 250 this.childIsOpen[i] = !isopen
253 } 251 }
254 if (this.pIsoPen) { 252 if (this.pIsoPen) {
255 // 计算总价逻辑 253 // 计算总价逻辑
256 if (this.childIsOpen.length !== 0) { 254 if (this.childIsOpen.length !== 0) {
257 for (let i = 0; i < this.childIsOpen.length; i++) { 255 for (let i = 0; i < this.childIsOpen.length; i++) {
258 if (this.childIsOpen[i]) { 256 if (this.childIsOpen[i]) {
259 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[i].num * this.$store.state.cart.cartList[i].nowPrice) 257 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[i].num * this.$store.state.cart.cartList[i].nowPrice)
260 } 258 }
261 } 259 }
262 } 260 }
263 } else { 261 } else {
264 this.totalPrice = 0 262 this.totalPrice = 0
265 } 263 }
266 }, 264 },
267 delCart(cart_id, index) { 265 delCart(cart_id, index) {
268 // console.log('userInfo',this.$store.state.user.userInfo) 266 // console.log('userInfo',this.$store.state.user.userInfo)
269 cart_id = parseInt(cart_id) 267 cart_id = parseInt(cart_id)
270 // console.log('delcart------>cart_id',cart_id) 268 // console.log('delcart------>cart_id',cart_id)
271 // console.log('cartlist====>delcart',this.$store.state.cart.cartList) 269 // console.log('cartlist====>delcart',this.$store.state.cart.cartList)
272 // console.log('delcart======>index',index) 270 // console.log('delcart======>index',index)
273 const uid = this.$store.state.user.userInfo.uid 271 const uid = this.$store.state.user.userInfo.uid
274 const openid = this.$store.state.user.userInfo.openid 272 const openid = this.$store.state.user.userInfo.openid
275 uni.showModal({ 273 uni.showModal({
276 title: '是否删除该商品', 274 title: '是否删除该商品',
277 // content: '是否删除该商品', 275 // content: '是否删除该商品',
278 success: function (res) { 276 success: function (res) {
279 if (res.confirm) { 277 if (res.confirm) {
280 // this.$store.state.cart.cartList.splice(index,1) 278 // this.$store.state.cart.cartList.splice(index,1)
281 store.dispatch('cart/delCart', { 279 store.dispatch('cart/delCart', {
282 uid: uid, 280 uid: uid,
283 openid: openid, 281 openid: openid,
284 cart_id: cart_id, // 要修改的购物车id 282 cart_id: cart_id, // 要修改的购物车id
285 arg: index, // 由于action 传参是能接收两参数，因此将index放入对象 283 arg: index, // 由于action 传参是能接收两参数，因此将index放入对象
286 }) 284 })
287 console.log('用户点击确定') 285 console.log('用户点击确定')
288 } 286 }
289 }, 287 },
290 }) 288 })
291 }, 289 },
292 }, 290 },
293 } 291 }
294 </script> 292 </script>
295 293
296 <style lang="scss"> 294 <style lang="scss">
297 .content { 295 .content {
298 min-height: 100vh; 296 min-height: 100vh;
299 background-color: #f2f2f2; 297 background-color: #f2f2f2;
300 display: flex; 298 display: flex;
301 flex-direction: column; 299 flex-direction: column;
302 align-items: center; 300 align-items: center;
303 justify-content: space-between; 301 justify-content: space-between;
304 padding: 20rpx 40rpx; 302 padding: 20rpx 40rpx;
305 box-sizing: border-box; 303 box-sizing: border-box;
306 304
307 .partentCheck { 305 .partentCheck {
308 width: 16px; 306 width: 16px;
309 height: 16px; 307 height: 16px;
310 border-radius: 22px; 308 border-radius: 22px;
311 border: 1px solid #cfcfcf; 309 border: 1px solid #cfcfcf;
312 background-color: #ffffff; 310 background-color: #ffffff;
313 margin: 6px; 311 margin: 6px;
314 } 312 }
315 .partentChecked { 313 .partentChecked {
316 width: 18px; 314 width: 18px;
317 height: 18px; 315 height: 18px;
318 border-radius: 22px; 316 border-radius: 22px;
319 background-color: #ff6b4a; 317 background-color: #ff6b4a;
320 margin: 6px; 318 margin: 6px;
321 .correct { 319 .correct {
322 display: inline-block; 320 display: inline-block;
323 position: relative; 321 position: relative;
324 width: 10rpx; 322 width: 10rpx;
325 height: 2rpx; 323 height: 2rpx;
326 background: #ffffff; 324 background: #ffffff;
327 line-height: 0; 325 line-height: 0;
328 font-size: 0; 326 font-size: 0;
329 position: relative; 327 position: relative;
330 top: -7px; 328 top: -7px;
331 left: 4px; 329 left: 4px;
332 -webkit-transform: rotate(45deg); 330 -webkit-transform: rotate(45deg);
333 } 331 }
334 .correct:after { 332 .correct:after {
335 content: "/"; 333 content: "/";
336 display: block; 334 display: block;
337 width: 16rpx; 335 width: 16rpx;
338 height: 2rpx; 336 height: 2rpx;
339 background: #ffffff; 337 background: #ffffff;
340 -webkit-transform: rotate(-90deg) translateY(50%) translateX(50%); 338 -webkit-transform: rotate(-90deg) translateY(50%) translateX(50%);
341 } 339 }
342 } 340 }
343 341
344 .card { 342 .card {
345 background-color: #ffffff; 343 background-color: #ffffff;
346 border-radius: 16rpx; 344 border-radius: 16rpx;
347 box-sizing: border-box; 345 box-sizing: border-box;
348 padding: 36rpx 36rpx 36rpx 18rpx; 346 padding: 36rpx 36rpx 36rpx 18rpx;
349 display: flex; 347 display: flex;
350 flex-direction: column; 348 flex-direction: column;
351 align-items: center; 349 align-items: center;
352 justify-content: space-between; 350 justify-content: space-between;
353 margin-bottom: 180rpx; 351 margin-bottom: 180rpx;
354 .cardHeader { 352 .cardHeader {
355 width: 100%; 353 width: 100%;
356 height: 36rpx; 354 height: 36rpx;
357 display: flex; 355 display: flex;
358 align-items: center; 356 align-items: center;
359 justify-content: flex-start; 357 justify-content: flex-start;
360 margin-bottom: 20rpx; 358 margin-bottom: 20rpx;
361 image { 359 image {
362 height: 32rpx; 360 height: 32rpx;
363 width: 32rpx; 361 width: 32rpx;
364 padding-left: 6px; 362 padding-left: 6px;
365 padding-right: 10px; 363 padding-right: 10px;
366 } 364 }
367 text { 365 text {
368 // font-family: PingFangSC-Regular; 366 // font-family: PingFangSC-Regular;
369 font-size: 14px; 367 font-size: 14px;
370 color: #333333; 368 color: #333333;
371 letter-spacing: -0.26px; 369 letter-spacing: -0.26px;
372 } 370 }
373 } 371 }
374 .cardBody { 372 .cardBody {
375 width: 100%; 373 width: 100%;
376 min-height: 300rpx; 374 min-height: 300rpx;
377 display: flex; 375 display: flex;
378 align-items: center; 376 align-items: center;
379 justify-content: space-between; 377 justify-content: space-between;
380 .goodInfo { 378 .goodInfo {
381 width: 390rpx; 379 width: 390rpx;
382 display: flex; 380 display: flex;
383 flex-direction: row; 381 flex-direction: row;
384 justify-content: flex-start; 382 justify-content: flex-start;
385 padding-left: 6px; 383 padding-left: 6px;
386 384
387 .imageWrap { 385 .imageWrap {
388 height: 188rpx; 386 height: 188rpx;
389 width: 188rpx; 387 width: 188rpx;
390 margin-right: 28rpx; 388 margin-right: 28rpx;
391 389
392 image { 390 image {
393 border-radius: 4px; 391 border-radius: 4px;
394 height: 188rpx; 392 height: 188rpx;
395 width: 188rpx; 393 width: 188rpx;
396 } 394 }
397 } 395 }
398 .infoRight { 396 .infoRight {
399 display: flex; 397 display: flex;
400 flex-direction: column; 398 flex-direction: column;
401 align-items: flex-start; 399 align-items: flex-start;
402 justify-content: space-between; 400 justify-content: space-between;
403 min-height: 240rpx; 401 min-height: 240rpx;
404 .goodName { 402 .goodName {
405 display: -webkit-box; 403 display: -webkit-box;
406 -webkit-box-orient: vertical; 404 -webkit-box-orient: vertical;
407 -webkit-line-clamp: 2; 405 -webkit-line-clamp: 2;
408 text-align: justify; 406 text-align: justify;
409 overflow: hidden; 407 overflow: hidden;
410 font-size: 28rpx; 408 font-size: 28rpx;
411 color: #333333; 409 color: #333333;
412 } 410 }
413 .describ { 411 .describ {
414 width: 100%; 412 width: 100%;
415 // min-height: 80rpx; 413 // min-height: 80rpx;
416 // box-sizing: border-box; 414 // box-sizing: border-box;
417 // padding: 10rpx; 415 // padding: 10rpx;
418 font-size: 20rpx; 416 font-size: 20rpx;
419 letter-spacing: -0.23px; 417 letter-spacing: -0.23px;
420 text-align: justify; 418 text-align: justify;
421 color: #999999; 419 color: #999999;
422 // background: #F9F9F9; 420 // background: #F9F9F9;
423 // display: flex; 421 // display: flex;
424 // justify-content: center; 422 // justify-content: center;
425 // align-items: center; 423 // align-items: center;
426 // text{ 424 // text{
427 // text-overflow: -o-ellipsis-lastline; 425 // text-overflow: -o-ellipsis-lastline;
428 // overflow: hidden; 426 // overflow: hidden;
429 // text-overflow: ellipsis; 427 // text-overflow: ellipsis;
430 // display: -webkit-box; 428 // display: -webkit-box;
431 // -webkit-line-clamp: 2; 429 // -webkit-line-clamp: 2;
432 // line-clamp: 2; 430 // line-clamp: 2;
433 // -webkit-box-orient: vertical; 431 // -webkit-box-orient: vertical;
434 // } 432 // }
435 // .icon { 433 // .icon {
436 // width: 0; 434 // width: 0;
437 // height: 0; 435 // height: 0;
438 // border-left: 5px transparent; 436 // border-left: 5px transparent;
439 // border-right: 5px transparent; 437 // border-right: 5px transparent;
440 // border-top: 5px #979797; 438 // border-top: 5px #979797;
441 // border-bottom: 0 transparent; 439 // border-bottom: 0 transparent;
442 // border-style: solid; 440 // border-style: solid;
443 // position: relative; 441 // position: relative;
444 // margin-left: 10px; 442 // margin-left: 10px;
445 // // transform: scaleY(-1); 443 // // transform: scaleY(-1);
446 // } 444 // }
447 // .icon::after{ 445 // .icon::after{
448 // content: ''; 446 // content: '';
449 // position: absolute; 447 // position: absolute;
450 // top: -6.5px; 448 // top: -6.5px;
451 // left: -5px; 449 // left: -5px;
452 // border-left: 5px transparent; 450 // border-left: 5px transparent;
453 // border-right: 5px transparent; 451 // border-right: 5px transparent;
454 // border-top: 5px #FFFFFF; 452 // border-top: 5px #FFFFFF;
455 // border-bottom: 0 transparent; 453 // border-bottom: 0 transparent;
456 // border-style: solid; 454 // border-style: solid;
457 // } 455 // }
458 } 456 }
459 .priceBox { 457 .priceBox {
460 display: flex; 458 display: flex;
461 justify-content: space-between; 459 justify-content: space-between;
462 align-items: center; 460 align-items: center;
463 // margin-top: 26px; 461 // margin-top: 26px;
464 width: 100%; 462 width: 100%;
465 font-size: 14px; 463 font-size: 14px;
466 color: #999999; 464 color: #999999;
467 .maxCount { 465 .maxCount {
468 color: #999999; 466 color: #999999;
469 font-size: 24rpx; 467 font-size: 24rpx;
470 } 468 }
471 .price { 469 .price {
472 color: #ff6b4a; 470 color: #ff6b4a;
473 font-size: 28rpx; 471 font-size: 28rpx;
474 } 472 }
475 .counter { 473 .counter {
476 display: flex; 474 display: flex;
477 flex-direction: row; 475 flex-direction: row;
478 justify-content: space-between; 476 justify-content: space-between;
479 align-items: center; 477 align-items: center;
480 font-size: 28rpx; 478 font-size: 28rpx;
481 color: #333333; 479 color: #333333;
482 width: 122rpx; 480 width: 122rpx;
483 .btn { 481 .btn {
484 display: flex; 482 display: flex;
485 justify-content: center; 483 justify-content: center;
486 line-height: 32rpx; 484 line-height: 32rpx;
487 height: 32rpx; 485 height: 32rpx;
488 width: 32rpx; 486 width: 32rpx;
489 background-color: #f2f2f2; 487 background-color: #f2f2f2;
490 color: #cfcfcf; 488 color: #cfcfcf;
491 } 489 }
492 } 490 }
493 } 491 }
494 } 492 }
495 } 493 }
496 } 494 }
497 } 495 }
498
499 <<<<<<< HEAD
500 .footer { 496 .footer {
501 position: fixed; 497 position: fixed;
502 left: 0; 498 left: 0;
503 bottom: 0px; 499 bottom: 0px;
504 height: 112rpx; 500 height: 112rpx;
505 width: 100%; 501 width: 100%;
506 background-color: #ffffff; 502 background-color: #ffffff;
507 font-size: 16px; 503 font-size: 16px;
508 display: flex; 504 display: flex;
509 justify-content: space-between; 505 justify-content: space-between;
510 align-items: center; 506 align-items: center;
511 .footerLeft { 507 .footerLeft {
512 display: flex; 508 display: flex;
513 justify-content: center; 509 justify-content: center;
514 align-items: center; 510 align-items: center;
515 width: 50%; 511 width: 50%;
516 color: #333333; 512 color: #333333;
517 text { 513 text {
518 color: #ff6b4a; 514 color: #ff6b4a;
519 } 515 }
520 } 516 }
521 .footerRight { 517 .footerRight {
522 display: flex; 518 display: flex;
523 justify-content: flex-end; 519 justify-content: flex-end;
524 align-items: center; 520 align-items: center;
525 width: 50%; 521 width: 50%;
526 margin-right: 26rpx; 522 margin-right: 26rpx;
527 .paybtn { 523 .paybtn {
528 display: flex; 524 display: flex;
529 justify-content: center; 525 justify-content: center;
530 align-items: center; 526 align-items: center;
531 background: #ff6b4a; 527 background: #ff6b4a;
532 border-radius: 20px; 528 border-radius: 20px;
533 border-radius: 20px; 529 border-radius: 20px;
534 color: #ffffff; 530 color: #ffffff;
535 width: 204rpx; 531 width: 204rpx;
536 height: 80rpx; 532 height: 80rpx;
537 } 533 }
538 } 534 }
539 } 535 }
540 } 536 }
541 </style> 537 </style>
542 =======
543 </style>
544 >>>>>>> cb58acb8c1540674edb1dd7cba23e4f04df66c19
545 538