刘文博 / gulu-vue

Download as
Browse Code »

Commit 248b0e031d417ecaf98a5675a2f2ffd7d8415f9e

Authored by 吉鹏
1 parent 4e5fb860bc
Exists in master

解决支付问题

Showing 2 changed files with 33 additions and 18 deletions   Show diff stats
src/pages/confirmOrder/confirmOrder.vue
Diff comments   View file @248b0e0
1 <template> 1 <template>
2 <view class="wrap"> 2 <view class="wrap">
3 <view></view> 3 <view></view>
4 <view 4 <view
5 class="addAddress" 5 class="addAddress"
6 @tap="toaddAddress" 6 @tap="toaddAddress"
7 v-if="this.showAddress" 7 v-if="this.showAddress"
8 > 8 >
9 <view class="addIcon"> 9 <view class="addIcon">
10 <image 10 <image
11 src="../../static/add.png" 11 src="../../static/add.png"
12 mode="aspectFill" 12 mode="aspectFill"
13 ></image> 13 ></image>
14 </view> 14 </view>
15 <view class="addressText">{{addAddress}}</view> 15 <view class="addressText">{{addAddress}}</view>
16 <image 16 <image
17 src="../../static/right.png" 17 src="../../static/right.png"
18 mode="aspectFill" 18 mode="aspectFill"
19 ></image> 19 ></image>
20 </view> 20 </view>
21 <view 21 <view
22 v-else 22 v-else
23 @tap="toaddAddress" 23 @tap="toaddAddress"
24 class="list order-user" 24 class="list order-user"
25 > 25 >
26 <view class="order-user-head"> 26 <view class="order-user-head" v-if="addressInfo != false">
27 <view class="name"> 27 <view class="name">
28 <view 28 <view
29 v-if="addressInfo.default === '1'" 29 v-if="addressInfo.default === '1'"
30 class="default" 30 class="default"
31 ><text>默认</text></view>{{addressInfo.name}} 31 >
32 <text>默认</text>
33 </view>
34 {{addressInfo.name}}
32 </view> 35 </view>
33 <text class="mobile">{{addressInfo.mobile}}</text> 36 <text class="mobile">{{addressInfo.mobile}}</text>
34 </view> 37 </view>
35 <view class="order-user-body"> 38 <view class="order-user-body" v-if="addressInfo != false">
36 <image src="../../static/myorder-paying-location.png"></image> 39 <image src="../../static/myorder-paying-location.png"></image>
37 <text class="address">{{addressInfo.address}}\n{{addressInfo.add_detail}}</text> 40 <text class="address">{{addressInfo.address}}\n{{addressInfo.add_detail}}</text>
38 </view> 41 </view>
42 <view class="order-user-body" v-if="addressInfo == false">
43 <text class="address">点击添加地址</text>
44 </view>
39 <image 45 <image
40 class="arrow" 46 class="arrow"
41 src="../../static/right.png" 47 src="../../static/right.png"
42 mode="aspectFill" 48 mode="aspectFill"
43 ></image> 49 ></image>
44 </view> 50 </view>
45 <view class="content"> 51 <view class="content">
46 <view class="orderInfo"> 52 <view class="orderInfo">
47 <view class="title"> 53 <view class="title">
48 <image 54 <image
49 src="../../static/store.png" 55 src="../../static/store.png"
50 mode="aspectFill" 56 mode="aspectFill"
51 style="width: 40rpx;height: 40rpx;" 57 style="width: 40rpx;height: 40rpx;"
52 ></image> 58 ></image>
53 <text>非常戴镜</text> 59 <text>非常戴镜</text>
54 </view> 60 </view>
55 61
56 <view 62 <view
57 class="infoBox" 63 class="infoBox"
58 v-if="isCart == 'true'" 64 v-if="isCart == 'true'"
59 v-for="(item, index) in checkedCartLst" 65 v-for="(item, index) in checkedCartLst"
60 :key="index" 66 :key="index"
61 > 67 >
62 <view class="infoTop"> 68 <view class="infoTop">
63 <image 69 <image
64 :src="item.img_index_url" 70 :src="item.img_index_url"
65 mode="aspectFill" 71 mode="aspectFill"
66 ></image> 72 ></image>
67 <view class="infoRight"> 73 <view class="infoRight">
68 <text class="goodName">{{item.p_name}}</text> 74 <text class="goodName">{{item.p_name}}</text>
69 <text class="remarks">支持7天无理由退货 顺丰发货</text> 75 <text class="remarks">支持7天无理由退货 顺丰发货</text>
70 <view class="priceBox"> 76 <view class="priceBox">
71 <view class="price">¥{{Number(item.nowPrice) * item.num}}<text class="originCost"> 77 <view class="price">¥{{Number(item.nowPrice) * item.num}}<text class="originCost">
72 ¥{{item.oldPrice*item.num}} 78 ¥{{item.oldPrice*item.num}}
73 </text></view> 79 </text></view>
74 <view class="counter"> 80 <view class="counter">
75 <view 81 <view
76 class="btn" 82 class="btn"
77 disabled="this.disabled" 83 disabled="this.disabled"
78 type="default" 84 type="default"
79 @click="counter(false,index)" 85 @click="counter(false,index)"
80 >-</view> 86 >-</view>
81 <text>{{checkedCartLst[index].num}}</text> 87 <text>{{checkedCartLst[index].num}}</text>
82 <view 88 <view
83 class="btn" 89 class="btn"
84 type="default" 90 type="default"
85 @click="counter(true,index)" 91 @click="counter(true,index)"
86 >+</view> 92 >+</view>
87 </view> 93 </view>
88 </view> 94 </view>
89 </view> 95 </view>
90 </view> 96 </view>
91 <view class="infoBottom"> 97 <view class="infoBottom">
92 <view class="norm">规格 <text> 98 <view class="norm">规格 <text>
93 <!-- 长度超出变省略号未做 --> 99 <!-- 长度超出变省略号未做 -->
94 <block>{{item.sku_name}}<block v-if="index !== current.length -1">/</block> 100 <block>{{item.sku_name}}<block v-if="index !== current.length -1">/</block>
95 </block> 101 </block>
96 </text></view> 102 </text></view>
97 <view class="shippingMethod">使用人 <text> 103 <view class="shippingMethod">使用人 <text>
98 {{item.peopleName}} 104 {{item.peopleName}}
99 </text></view> 105 </text></view>
100 <view class="shippingMethod">配送方式 <text>快递</text></view> 106 <view class="shippingMethod">配送方式 <text>快递</text></view>
101 <view class="message">买家留言 107 <view class="message">买家留言
102 <input 108 <input
103 type="text" 109 type="text"
104 :value="note" 110 :value="note"
105 placeholder="建议提前协商(50字以内)" 111 placeholder="建议提前协商(50字以内)"
106 /> 112 />
107 </view> 113 </view>
108 </view> 114 </view>
109 </view> 115 </view>
110 116
111 <view 117 <view
112 class="infoBox" 118 class="infoBox"
113 v-if="isCart !== 'true'" 119 v-if="isCart !== 'true'"
114 > 120 >
115 <view class="infoTop"> 121 <view class="infoTop">
116 <image 122 <image
117 :src="buyItem.pic" 123 :src="buyItem.pic"
118 mode="aspectFill" 124 mode="aspectFill"
119 ></image> 125 ></image>
120 <view class="infoRight"> 126 <view class="infoRight">
121 <text class="goodName">{{goodInfo.p_name}}</text> 127 <text class="goodName">{{goodInfo.p_name}}</text>
122 <text class="remarks">支持7天无理由退货 顺丰发货</text> 128 <text class="remarks">支持7天无理由退货 顺丰发货</text>
123 <view class="priceBox"> 129 <view class="priceBox">
124 <view class="price">¥{{buyItem.real_price * count}}<text class="originCost"> 130 <view class="price">¥{{buyItem.real_price * count}}<text class="originCost">
125 ¥{{buyItem.out_price * count}} 131 ¥{{buyItem.out_price * count}}
126 </text></view> 132 </text></view>
127 <view class="counter"> 133 <view class="counter">
128 <view 134 <view
129 class="btn" 135 class="btn"
130 disabled="this.disabled" 136 disabled="this.disabled"
131 type="default" 137 type="default"
132 @click="counter(false)" 138 @click="counter(false)"
133 >-</view> 139 >-</view>
134 <text>{{count}}</text> 140 <text>{{count}}</text>
135 <view 141 <view
136 class="btn" 142 class="btn"
137 type="default" 143 type="default"
138 @click="counter(true)" 144 @click="counter(true)"
139 >+</view> 145 >+</view>
140 </view> 146 </view>
141 </view> 147 </view>
142 </view> 148 </view>
143 </view> 149 </view>
144 <view class="infoBottom"> 150 <view class="infoBottom">
145 <view class="norm">规格 <text> 151 <view class="norm">规格 <text>
146 <!-- 长度超出变省略号未做 --> 152 <!-- 长度超出变省略号未做 -->
147 <block 153 <block
148 v-for="(item, index) in current" 154 v-for="(item, index) in current"
149 :key="index" 155 :key="index"
150 >{{attrList[index].attr[item].name}}<block v-if="index !== current.length -1">/</block> 156 >{{attrList[index].attr[item].name}}<block v-if="index !== current.length -1">/</block>
151 </block> 157 </block>
152 </text></view> 158 </text></view>
153 <view class="shippingMethod">使用人 <text> 159 <view class="shippingMethod">使用人 <text>
154 {{name}} 160 {{name}}
155 </text></view> 161 </text></view>
156 <view class="shippingMethod">配送方式 <text>快递</text></view> 162 <view class="shippingMethod">配送方式 <text>快递</text></view>
157 <view class="message">买家留言 163 <view class="message">买家留言
158 <input 164 <input
159 type="text" 165 type="text"
160 :value="note" 166 :value="note"
161 placeholder="建议提前协商(50字以内)" 167 placeholder="建议提前协商(50字以内)"
162 /> 168 />
163 </view> 169 </view>
164 </view> 170 </view>
165 </view> 171 </view>
166 </view> 172 </view>
167 <view class="payWay"> 173 <view class="payWay">
168 <view class="item"> 174 <view class="item">
169 <text>支付方式</text> 175 <text>支付方式</text>
170 <view class="itemRight"> 176 <view class="itemRight">
171 <view class="rightText"> 177 <view class="rightText">
172 <view class="choosePayWay"> 178 <view class="choosePayWay">
173 <image 179 <image
174 src="../../static/chat_logo.png" 180 src="../../static/chat_logo.png"
175 mode="aspectFill" 181 mode="aspectFill"
176 ></image> 182 ></image>
177 <text>微信支付</text> 183 <text>微信支付</text>
178 </view> 184 </view>
179 <!-- <view class="randomSubstraction">最高随机立减￥99</view> --> 185 <!-- <view class="randomSubstraction">最高随机立减￥99</view> -->
180 </view> 186 </view>
181 <!-- <image 187 <!-- <image
182 src="../../static/right.png" 188 src="../../static/right.png"
183 mode="aspectFill" 189 mode="aspectFill"
184 ></image> --> 190 ></image> -->
185 </view> 191 </view>
186 </view> 192 </view>
187 <!-- <view class="item"> 193 <!-- <view class="item">
188 <text>优惠券</text> 194 <text>优惠券</text>
189 <view class="itemRight"> 195 <view class="itemRight">
190 <view class="rightText"> 196 <view class="rightText">
191 <view class="chooseOffers"> 197 <view class="chooseOffers">
192 <text>-￥70.00</text> 198 <text>-￥70.00</text>
193 </view> 199 </view>
194 <view class="preferentialWay">最大优惠</view> 200 <view class="preferentialWay">最大优惠</view>
195 </view> 201 </view>
196 <image 202 <image
197 src="../../static/right.png" 203 src="../../static/right.png"
198 mode="aspectFill" 204 mode="aspectFill"
199 ></image> 205 ></image>
200 </view> 206 </view>
201 </view> --> 207 </view> -->
202 <view class="item"> 208 <view class="item">
203 <text>运费</text> 209 <text>运费</text>
204 <view class="itemRight"> 210 <view class="itemRight">
205 <view class="freight">免运费</view> 211 <view class="freight">免运费</view>
206 </view> 212 </view>
207 </view> 213 </view>
208 <view class="item"> 214 <view class="item">
209 <text>合计</text> 215 <text>合计</text>
210 <view class="itemRight"> 216 <view class="itemRight">
211 <view class="total">¥{{totalPrice}}</view> 217 <view class="total">¥{{totalPrice}}</view>
212 <!-- <view class="total" v-else>¥{{Number(skuInfo.real_price) * count}}</view> --> 218 <!-- <view class="total" v-else>¥{{Number(skuInfo.real_price) * count}}</view> -->
213 </view> 219 </view>
214 </view> 220 </view>
215 </view> 221 </view>
216 <!-- 222 <!--
217 <view class="checkBox"> 223 <view class="checkBox">
218 <checkbox-group> 224 <checkbox-group>
219 <label> 225 <label>
220 <checkbox color="#FF6B4A" value="isAnonymous" checked="true" />匿名购买 226 <checkbox color="#FF6B4A" value="isAnonymous" checked="true" />匿名购买
221 </label> 227 </label>
222 </checkbox-group> 228 </checkbox-group>
223 </view> --> 229 </view> -->
224 </view> 230 </view>
225 <view class="last_zhanwei"></view> 231 <view class="last_zhanwei"></view>
226 <view class="footer"> 232 <view class="footer">
227 <view class="footerLeft">实付金额: 233 <view class="footerLeft">实付金额:
228 <text>¥{{totalPrice}}</text> 234 <text>¥{{totalPrice}}</text>
229 <!-- <text v-else>¥{{Number(skuInfo.real_price) * count}}</text> --> 235 <!-- <text v-else>¥{{Number(skuInfo.real_price) * count}}</text> -->
230 </view> 236 </view>
231 <view class="footerRight"> 237 <view class="footerRight">
232 <view 238 <view
233 class="paybtn" 239 class="paybtn"
234 @tap="orderBuild" 240 @tap="orderBuild"
235 >立即支付</view> 241 >立即支付</view>
236 </view> 242 </view>
237 </view> 243 </view>
238 </view> 244 </view>
239 </template> 245 </template>
240 246
241 <script> 247 <script>
242 import store from '@/store' 248 import store from '@/store'
243 import MD5Util from '../../utils/md5' 249 import MD5Util from '../../utils/md5'
244 250
245 export default { 251 export default {
246 data() { 252 data() {
247 return { 253 return {
248 name: String, 254 name: String,
249 addAddress: '添加收货地址', 255 addAddress: '添加收货地址',
250 count: 1, 256 count: 1,
251 pid: 0, 257 pid: 0,
252 disabled: false, 258 disabled: false,
253 freight: 0.0, 259 freight: 0.0,
254 showAddress: false, 260 showAddress: false,
255 note: '', 261 note: '',
256 addressInfo: { 262 addressInfo: {
257 address: '', 263 address: '',
258 }, 264 },
259 isCart: Boolean, 265 isCart: Boolean,
260 // isAnonymous: 266 // isAnonymous:
261 checkedCartLst: [], 267 checkedCartLst: [],
262 } 268 }
263 }, 269 },
264 onShow(addressId) { 270 onShow(addressId) {
265 // console.log('+-+-*-*-+-+',addressId) 271 // console.log('+-+-*-*-+-+',addressId)
266 if (addressId) { 272 if (addressId) {
267 store 273 store
268 .dispatch('address/details', { 274 .dispatch('address/details', {
269 add_id: addressId, 275 add_id: addressId,
270 }) 276 })
271 .then(({ code, data }) => { 277 .then(({ code, data }) => {
272 if (code === 1) { 278 if (code === 1) {
273 // console.log('code', code, data) 279 // console.log('code', code, data)
274 this.showAddress = true 280 this.showAddress = true
275 this.addressInfo = data 281 this.addressInfo = data
276 } 282 }
277 }) 283 })
278 } 284 }
279 }, 285 },
280 onLoad({ pid, addressId, isCart, count, name }) { 286 onLoad({ pid, addressId, isCart, count, name }) {
281 if (isCart == 'false') { 287 if (isCart == 'false') {
282 this.pid = pid 288 this.pid = pid
283 // store.dispatch('read/fetch', { 289 // store.dispatch('read/fetch', {
284 // pid, 290 // pid,
285 // }) 291 // })
286 } 292 }
287 this.count = count 293 this.count = count
288 this.name = name 294 this.name = name
289 this.isCart = isCart 295 this.isCart = isCart
290 296
291 console.log('++++++++++++' + pid, addressId, isCart) 297 console.log('++++++++++++' + pid, addressId, isCart)
292 this.checkedCartLst = this.$store.state.cart.checkedCartLst 298 this.checkedCartLst = this.$store.state.cart.checkedCartLst
293 // console.log('++++++++++6666666666++',this.$store.state.cart.checkedCartLst) 299 // console.log('++++++++++6666666666++',this.$store.state.cart.checkedCartLst)
294 // 若已经选择地址 300 // 若已经选择地址
295 if (addressId) { 301 if (addressId) {
296 store 302 store
297 .dispatch('address/details', { 303 .dispatch('address/details', {
298 add_id: addressId, 304 add_id: addressId,
299 }) 305 })
300 .then(({ code, data }) => { 306 .then(({ code, data }) => {
301 if (code === 1) { 307 if (code === 1) {
302 // console.log('code', code, data) 308 // console.log('code', code, data)
303 this.showAddress = true 309 this.showAddress = true
304 this.addressInfo = data 310 this.addressInfo = data
305 } 311 }
306 }) 312 })
307 } else { 313 } else {
308 store.dispatch('address/default').then(({ code, data }) => { 314 store.dispatch('address/default').then(({ code, data }) => {
309 if (code === 1) {
310 // console.log('code', code, data)
311 this.showAddress = true 315 this.showAddress = true
312 this.addressInfo = data 316 this.addressInfo = data
313 } 317 console.log("this.addressInfo", this.addressInfo)
314 }) 318 })
315 } 319 }
316 }, 320 },
317 computed: { 321 computed: {
318 totalPrice() { 322 totalPrice() {
319 if (this.isCart == 'true') { 323 if (this.isCart == 'true') {
320 let total = 0 324 let total = 0
321 this.$store.state.cart.checkedCartLst.map(item => { 325 this.$store.state.cart.checkedCartLst.map(item => {
322 total += item.nowPrice * item.num 326 total += item.nowPrice * item.num
323 }) 327 })
324 return total 328 return total
325 } else { 329 } else {
326 return this.buyItem.real_price * this.count 330 return this.buyItem.real_price * this.count
327 } 331 }
328 }, 332 },
329 buyItem() { 333 buyItem() {
330 return this.$store.state.cart.buyItem 334 return this.$store.state.cart.buyItem
331 }, 335 },
332 // checkedCartLst(){ 336 // checkedCartLst(){
333 // console.log('checkedCartLst',this.$store.state.cart.checkedCartLst) 337 // console.log('checkedCartLst',this.$store.state.cart.checkedCartLst)
334 // return this.$store.state.cart.checkedCartLst 338 // return this.$store.state.cart.checkedCartLst
335 // }, 339 // },
336 goodInfo() { 340 goodInfo() {
337 // console.log('state', this.$store.state.read.goodInfo) 341 // console.log('state', this.$store.state.read.goodInfo)
338 return this.$store.state.read.goodInfo 342 return this.$store.state.read.goodInfo
339 }, 343 },
340 skuInfo() { 344 skuInfo() {
341 return this.$store.state.order.param.sk_id_arr 345 return this.$store.state.order.param.sk_id_arr
342 }, 346 },
343 attrList() { 347 attrList() {
344 return this.$store.state.order.param.attrList 348 return this.$store.state.order.param.attrList
345 }, 349 },
346 current() { 350 current() {
347 return this.$store.state.order.param.current 351 return this.$store.state.order.param.current
348 }, 352 },
349 }, 353 },
350 methods: { 354 methods: {
351 counter(isadd, index) { 355 counter(isadd, index) {
352 if (isadd) { 356 if (isadd) {
353 if (this.isCart == 'true') { 357 if (this.isCart == 'true') {
354 this.checkedCartLst[index].num++ 358 this.checkedCartLst[index].num++
355 } else { 359 } else {
356 this.count++ 360 this.count++
357 } 361 }
358 } else { 362 } else {
359 if (this.isCart == 'true') { 363 if (this.isCart == 'true') {
360 this.checkedCartLst[index].num <= 1 ? (this.disabled = true) : this.checkedCartLst[index].num-- 364 this.checkedCartLst[index].num <= 1 ? (this.disabled = true) : this.checkedCartLst[index].num--
361 } else { 365 } else {
362 this.count <= 1 ? (this.disabled = true) : this.count-- 366 this.count <= 1 ? (this.disabled = true) : this.count--
363 } 367 }
364 } 368 }
365 }, 369 },
366 // 跳转添加地址页面 370 // 跳转添加地址页面
367 toaddAddress() { 371 toaddAddress() {
368 uni.navigateTo({ 372 uni.navigateTo({
369 url: `../address/addressList?edit=${1}`, 373 url: `../address/addressList?edit=${1}`,
370 success: res => {}, 374 success: res => {},
371 fail: error => { 375 fail: error => {
372 console.log('跳转到地址列表页面失败====>', error) 376 console.log('跳转到地址列表页面失败====>', error)
373 }, 377 },
374 complete: () => {}, 378 complete: () => {},
375 }) 379 })
376 }, 380 },
377 // 下单 381 // 下单
378 orderBuild() { 382 orderBuild() {
383 if(!this.addressInfo){
384 uni.showLoading({
385 title: '请先添加地址',
386 })
387 return
388 }
379 uni.showLoading({ 389 uni.showLoading({
380 title: '支付中', 390 title: '支付中',
381 }) 391 })
382 if (this.isCart === 'true') { 392 if (this.isCart === 'true') {
383 const checkedGoods = [] 393 const checkedGoods = []
384 const sk_id_arr = [] 394 const sk_id_arr = []
385 this.checkedCartLst.map(item => { 395 this.checkedCartLst.map(item => {
386 checkedGoods.push(item.cart_id) 396 checkedGoods.push(item.cart_id)
387 sk_id_arr.push(item.sk_id) 397 sk_id_arr.push(item.sk_id)
388 }) 398 })
389 store.dispatch('order/build', { 399 store.dispatch('order/build', {
390 uid: this.$store.state.user.userInfo.uid, 400 uid: this.$store.state.user.userInfo.uid,
391 address: JSON.stringify(this.addressInfo), 401 address: JSON.stringify(this.addressInfo),
392 checkedGoods: checkedGoods, 402 checkedGoods: checkedGoods,
393 sk_id_arr: sk_id_arr, 403 sk_id_arr: sk_id_arr,
394 totalPrice: this.totalPrice, 404 totalPrice: this.totalPrice,
395 }).then((res) => { 405 }).then((res) => {
396 this.pay(res) 406 this.pay(res)
397 }) 407 })
398 } 408 }
399 if (this.isCart === 'false') { 409 if (this.isCart === 'false') {
400 const { sk_id_arr: skId, mp_id: mpId } = this.$store.state.order.param 410 const { sk_id_arr: skId, mp_id: mpId } = this.$store.state.order.param
401 store.dispatch('order/buyNow', { 411 store.dispatch('order/buyNow', {
402 pid: skId.pid, 412 pid: skId.pid,
403 sk_id: skId.sk_id, 413 sk_id: skId.sk_id,
404 number: this.count, 414 number: this.count,
405 mp_id: mpId, 415 mp_id: mpId,
406 address: JSON.stringify(this.addressInfo), 416 address: JSON.stringify(this.addressInfo),
407 totalPrice: this.totalPrice, 417 totalPrice: this.totalPrice,
408 liuyan: this.note, 418 liuyan: this.note,
409 dir: 1, 419 dir: 1,
410 }).then((res) => { 420 }).then((res) => {
411 this.pay(res) 421 this.pay(res)
412 }) 422 })
413 } 423 }
414 }, 424 },
415 // 支付 425 // 支付
416 pay(res) { 426 pay(res) {
417 console.log('pay', res) 427 console.log('pay', res)
418 const { data, exKeyName: keyName } = res 428 const { data, exKeyName: keyName } = res
419 const uid = uni.getStorageSync('uid') 429 const uid = uni.getStorageSync('uid')
420 const timeStamp = new Date().getTime().toString() 430 const timeStamp = new Date().getTime().toString()
421 const nonceStr = 'asfafasfasfasfasf' 431 const nonceStr = 'asfafasfasfasfasf'
422 // 支付参数 432 // 支付参数
423 const fieldSet = { 433 const fieldSet = {
424 openid: this.$store.state.user.userInfo.openid, 434 openid: this.$store.state.user.userInfo.openid,
425 uid: this.$store.state.user.userInfo.uid, 435 uid: this.$store.state.user.userInfo.uid,
426 shopid: 0, 436 shopid: 0,
427 payCate: 2020, 437 payCate: 2020,
428 payMoney: this.totalPrice, 438 payMoney: this.totalPrice,
429 payWoodId: `fcdj-${uid}-${keyName}`, 439 payWoodId: `fcdj-${uid}-${keyName}`,
430 payWoodDesc: '在【非常戴镜】的微信付款凭证', 440 payWoodDesc: '在【非常戴镜】的微信付款凭证',
431 nonceStr, 441 nonceStr,
432 signType: 'MD5', 442 signType: 'MD5',
433 app_uid: 2020, 443 app_uid: 2020,
434 timeStamp, 444 timeStamp,
435 keyname: keyName, 445 keyname: keyName,
436 billInfo: JSON.stringify(data), 446 billInfo: JSON.stringify({
437 } 447 address:this.addressInfo,
448 list:data,
449 keyname: keyName
450 }),
451 }
452 console.log("fieldSet", fieldSet)
438 // 请求后台支付接口 453 // 请求后台支付接口
439 store.dispatch('order/pay', fieldSet).then(({ data, data2, pay_id: payId }) => { 454 store.dispatch('order/pay', fieldSet).then(({ data, data2, pay_id: payId }) => {
440 if (data.return_code === 'SUCCESS' && data.result_code === 'SUCCESS') { 455 if (data.return_code === 'SUCCESS' && data.result_code === 'SUCCESS') {
441 const stringA = `appId=wx115b25aa396d27ac&nonceStr=${nonceStr}&package=prepay_id=${data.prepay_id}&signType=MD5&timeStamp=${timeStamp}` 456 const stringA = `appId=wx115b25aa396d27ac&nonceStr=${nonceStr}&package=prepay_id=${data.prepay_id}&signType=MD5&timeStamp=${timeStamp}`
442 const stringSignTemp = stringA + '&key=NewMoney2017hatemydaddy123456789' 457 const stringSignTemp = stringA + '&key=NewMoney2017hatemydaddy123456789'
443 458
444 // 微信支付接口 459 // 微信支付接口
445 uni.requestPayment({ 460 uni.requestPayment({
446 appId: data.appid, 461 appId: data.appid,
447 timeStamp, 462 timeStamp,
448 nonceStr, 463 nonceStr,
449 total_fee: this.totalPrice, 464 total_fee: this.totalPrice,
450 package: `prepay_id=${data.prepay_id}`, 465 package: `prepay_id=${data.prepay_id}`,
451 signType: 'MD5', 466 signType: 'MD5',
452 paySign: MD5Util.MD5(stringSignTemp).toUpperCase(), 467 paySign: MD5Util.MD5(stringSignTemp).toUpperCase(),
453 success: (res) => { 468 success: (res) => {
454 // 支付成功 469 // 支付成功
455 uni.showModal({ 470 uni.showModal({
456 content: '支付成功', 471 content: '支付成功',
457 showCancel: false, 472 showCancel: false,
458 }) 473 })
459 // 跳转订单详情页->状态 待收货 474 // 跳转订单详情页->状态 待收货
460 uni.reLaunch({ 475 uni.reLaunch({
461 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=1&isPay=1`, 476 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=1&isPay=1`,
462 }) 477 })
463 }, 478 },
464 fail: (res) => { 479 fail: (res) => {
465 // 支付失败 480 // 支付失败
466 uni.showModal({ 481 uni.showModal({
467 content: '支付失败', 482 content: '支付失败',
468 showCancel: false, 483 showCancel: false,
469 }) 484 })
470 // 跳转订单详情页->状态 待付款 485 // 跳转订单详情页->状态 待付款
471 uni.reLaunch({ 486 uni.reLaunch({
472 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`, 487 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`,
473 }) 488 })
474 }, 489 },
475 complete: () => { 490 complete: () => {
476 uni.hideLoading() 491 uni.hideLoading()
477 }, 492 },
478 }) 493 })
479 } else { 494 } else {
480 uni.showModal({ 495 uni.showModal({
481 content: '支付失败', 496 content: '支付失败',
482 showCancel: false, 497 showCancel: false,
483 }) 498 })
484 console.log('支付失败') 499 console.log('支付失败')
485 uni.hideLoading() 500 uni.hideLoading()
486 } 501 }
487 }) 502 })
488 }, 503 },
489 }, 504 },
490 } 505 }
491 </script> 506 </script>
492 507
493 <style lang="scss"> 508 <style lang="scss">
494 .wrap { 509 .wrap {
495 height: 100vh; 510 height: 100vh;
496 background-color: #f2f2f2; 511 background-color: #f2f2f2;
497 font-family: PingFangSC-Regular; 512 font-family: PingFangSC-Regular;
498 letter-spacing: -0.23px; 513 letter-spacing: -0.23px;
499 position: absolute; 514 position: absolute;
500 } 515 }
501 .addAddress { 516 .addAddress {
502 background-color: #ffffff; 517 background-color: #ffffff;
503 box-sizing: border-box; 518 box-sizing: border-box;
504 height: 124rpx; 519 height: 124rpx;
505 width: 100%; 520 width: 100%;
506 display: flex; 521 display: flex;
507 align-items: center; 522 align-items: center;
508 padding: 0 40rpx; 523 padding: 0 40rpx;
509 .addIcon { 524 .addIcon {
510 background-color: #f2f2f2; 525 background-color: #f2f2f2;
511 height: 56rpx; 526 height: 56rpx;
512 width: 60rpx; 527 width: 60rpx;
513 border-radius: 4rpx; 528 border-radius: 4rpx;
514 display: flex; 529 display: flex;
515 justify-content: center; 530 justify-content: center;
516 align-items: center; 531 align-items: center;
517 margin-right: 40rpx; 532 margin-right: 40rpx;
518 } 533 }
519 image { 534 image {
520 height: 28rpx; 535 height: 28rpx;
521 width: 30rpx; 536 width: 30rpx;
522 } 537 }
523 .addressText { 538 .addressText {
524 font-size: 28rpx; 539 font-size: 28rpx;
525 color: #333333; 540 color: #333333;
526 margin-right: 364rpx; 541 margin-right: 364rpx;
527 } 542 }
528 } 543 }
529 .content { 544 .content {
530 background-color: #f2f2f2; 545 background-color: #f2f2f2;
531 width: 100%; 546 width: 100%;
532 display: flex; 547 display: flex;
533 flex-direction: column; 548 flex-direction: column;
534 justify-content: center; 549 justify-content: center;
535 align-items: center; 550 align-items: center;
536 padding: 40rpx; 551 padding: 40rpx;
537 box-sizing: border-box; 552 box-sizing: border-box;
538 .orderInfo { 553 .orderInfo {
539 width: 670rpx; 554 width: 670rpx;
540 min-height: 488rpx; 555 min-height: 488rpx;
541 background-color: #ffffff; 556 background-color: #ffffff;
542 border-radius: 20rpx; 557 border-radius: 20rpx;
543 box-sizing: border-box; 558 box-sizing: border-box;
544 padding: 0 40rpx 40rpx 40rpx; 559 padding: 0 40rpx 40rpx 40rpx;
545 .title { 560 .title {
546 display: flex; 561 display: flex;
547 align-items: center; 562 align-items: center;
548 font-size: 28rpx; 563 font-size: 28rpx;
549 color: #333333; 564 color: #333333;
550 height: 60rpx; 565 height: 60rpx;
551 line-height: 40rpx; 566 line-height: 40rpx;
552 padding: 10rpx 10rpx 10rpx 0rpx; 567 padding: 10rpx 10rpx 10rpx 0rpx;
553 image { 568 image {
554 margin-right: 20rpx; 569 margin-right: 20rpx;
555 } 570 }
556 } 571 }
557 .infoBox { 572 .infoBox {
558 margin-top: 42rpx; 573 margin-top: 42rpx;
559 .infoTop { 574 .infoTop {
560 display: flex; 575 display: flex;
561 flex-direction: row; 576 flex-direction: row;
562 image { 577 image {
563 height: 188rpx; 578 height: 188rpx;
564 width: 188rpx; 579 width: 188rpx;
565 margin-right: 24rpx; 580 margin-right: 24rpx;
566 } 581 }
567 .infoRight { 582 .infoRight {
568 width: 374rpx; 583 width: 374rpx;
569 display: flex; 584 display: flex;
570 flex-direction: column; 585 flex-direction: column;
571 align-items: flex-start; 586 align-items: flex-start;
572 justify-content: space-between; 587 justify-content: space-between;
573 .goodName { 588 .goodName {
574 font-size: 28rpx; 589 font-size: 28rpx;
575 color: #333333; 590 color: #333333;
576 } 591 }
577 .remarks { 592 .remarks {
578 font-size: 20rpx; 593 font-size: 20rpx;
579 color: #999999; 594 color: #999999;
580 } 595 }
581 .priceBox { 596 .priceBox {
582 display: flex; 597 display: flex;
583 justify-content: space-between; 598 justify-content: space-between;
584 align-items: center; 599 align-items: center;
585 width: 100%; 600 width: 100%;
586 .price { 601 .price {
587 color: #ff6b4a; 602 color: #ff6b4a;
588 font-size: 28rpx; 603 font-size: 28rpx;
589 text{ 604 text{
590 margin-left: 10rpx; 605 margin-left: 10rpx;
591 } 606 }
592 } 607 }
593 .originCost { 608 .originCost {
594 text-decoration: line-through; 609 text-decoration: line-through;
595 color: #999999; 610 color: #999999;
596 font-size: 20rpx; 611 font-size: 20rpx;
597 } 612 }
598 .counter { 613 .counter {
599 display: flex; 614 display: flex;
600 flex-direction: row; 615 flex-direction: row;
601 justify-content: space-between; 616 justify-content: space-between;
602 font-size: 28rpx; 617 font-size: 28rpx;
603 color: #333333; 618 color: #333333;
604 width: 122rpx; 619 width: 122rpx;
605 .btn { 620 .btn {
606 display: flex; 621 display: flex;
607 justify-content: center; 622 justify-content: center;
608 line-height: 32rpx; 623 line-height: 32rpx;
609 height: 32rpx; 624 height: 32rpx;
610 width: 32rpx; 625 width: 32rpx;
611 background-color: #f2f2f2; 626 background-color: #f2f2f2;
612 color: #cfcfcf; 627 color: #cfcfcf;
613 } 628 }
614 } 629 }
615 } 630 }
616 } 631 }
617 } 632 }
618 .infoBottom { 633 .infoBottom {
619 display: flex; 634 display: flex;
620 flex-direction: column; 635 flex-direction: column;
621 justify-content: flex-start; 636 justify-content: flex-start;
622 font-size: 24rpx; 637 font-size: 24rpx;
623 color: #333333; 638 color: #333333;
624 text { 639 text {
625 color: #999999; 640 color: #999999;
626 margin-left: 20rpx; 641 margin-left: 20rpx;
627 } 642 }
628 643
629 .norm { 644 .norm {
630 margin-top: 28rpx; 645 margin-top: 28rpx;
631 } 646 }
632 .shippingMethod { 647 .shippingMethod {
633 margin-top: 12rpx; 648 margin-top: 12rpx;
634 } 649 }
635 .message { 650 .message {
636 display: flex; 651 display: flex;
637 flex-direction: row; 652 flex-direction: row;
638 align-items: center; 653 align-items: center;
639 margin-top: 18rpx; 654 margin-top: 18rpx;
640 input { 655 input {
641 margin-left: 20rpx; 656 margin-left: 20rpx;
642 width: 75%; 657 width: 75%;
643 } 658 }
644 } 659 }
645 } 660 }
646 } 661 }
647 } 662 }
648 .payWay { 663 .payWay {
649 height: 464rpx; 664 height: 464rpx;
650 width: 670rpx; 665 width: 670rpx;
651 background-color: #ffffff; 666 background-color: #ffffff;
652 color: #333333; 667 color: #333333;
653 font-size: 24rpx; 668 font-size: 24rpx;
654 border-radius: 20rpx; 669 border-radius: 20rpx;
655 box-sizing: border-box; 670 box-sizing: border-box;
656 padding: 0 52rpx 0rpx 40rpx; 671 padding: 0 52rpx 0rpx 40rpx;
657 margin-top: 20rpx; 672 margin-top: 20rpx;
658 display: flex; 673 display: flex;
659 flex-direction: column; 674 flex-direction: column;
660 justify-content: center; 675 justify-content: center;
661 align-items: flex-start; 676 align-items: flex-start;
662 .item { 677 .item {
663 display: flex; 678 display: flex;
664 flex-direction: row; 679 flex-direction: row;
665 justify-content: space-between; 680 justify-content: space-between;
666 align-items: center; 681 align-items: center;
667 width: 100%; 682 width: 100%;
668 height: 115rpx; 683 height: 115rpx;
669 .itemRight { 684 .itemRight {
670 display: flex; 685 display: flex;
671 flex-direction: row; 686 flex-direction: row;
672 justify-content: space-between; 687 justify-content: space-between;
673 align-items: center; 688 align-items: center;
674 image { 689 image {
675 height: 24rpx; 690 height: 24rpx;
676 width: 12rpx; 691 width: 12rpx;
677 } 692 }
678 .rightText { 693 .rightText {
679 margin-right: 20rpx; 694 margin-right: 20rpx;
680 text-align: right; 695 text-align: right;
681 .choosePayWay { 696 .choosePayWay {
682 display: flex; 697 display: flex;
683 align-items: center; 698 align-items: center;
684 text { 699 text {
685 color: #333333; 700 color: #333333;
686 } 701 }
687 image { 702 image {
688 height: 36rpx; 703 height: 36rpx;
689 width: 40rpx; 704 width: 40rpx;
690 margin-right: 8px; 705 margin-right: 8px;
691 } 706 }
692 } 707 }
693 .randomSubstraction { 708 .randomSubstraction {
694 color: #ff6b4a; 709 color: #ff6b4a;
695 } 710 }
696 .preferentialWay { 711 .preferentialWay {
697 color: #999999; 712 color: #999999;
698 } 713 }
699 } 714 }
700 .freight, 715 .freight,
701 .total { 716 .total {
702 margin-right: 32rpx; 717 margin-right: 32rpx;
703 } 718 }
704 text { 719 text {
705 color: #ff6b4a; 720 color: #ff6b4a;
706 } 721 }
707 } 722 }
708 } 723 }
709 } 724 }
710 // .checkBox { 725 // .checkBox {
711 // height: 58rpx; 726 // height: 58rpx;
712 // line-height: 58rpx; 727 // line-height: 58rpx;
713 // width: 100%; 728 // width: 100%;
714 // margin-top: 36rpx; 729 // margin-top: 36rpx;
715 // margin-left: 40rpx; 730 // margin-left: 40rpx;
716 // font-size: 12px; 731 // font-size: 12px;
717 // color: #999999; 732 // color: #999999;
718 // } 733 // }
719 } 734 }
720 .footer { 735 .footer {
721 height: 112rpx; 736 height: 112rpx;
722 width: 100%; 737 width: 100%;
723 background-color: #fff; 738 background-color: #fff;
724 font-size: 16px; 739 font-size: 16px;
725 display: flex; 740 display: flex;
726 justify-content: space-between; 741 justify-content: space-between;
727 align-items: center; 742 align-items: center;
728 position: fixed; 743 position: fixed;
729 bottom: 0; 744 bottom: 0;
730 z-index: 9999; 745 z-index: 9999;
731 .footerLeft { 746 .footerLeft {
732 display: flex; 747 display: flex;
733 justify-content: center; 748 justify-content: center;
734 align-items: center; 749 align-items: center;
735 width: 50%; 750 width: 50%;
736 color: #333333; 751 color: #333333;
737 text { 752 text {
738 color: #ff6b4a; 753 color: #ff6b4a;
739 } 754 }
740 } 755 }
741 .footerRight { 756 .footerRight {
742 display: flex; 757 display: flex;
743 justify-content: flex-end; 758 justify-content: flex-end;
744 align-items: center; 759 align-items: center;
745 width: 50%; 760 width: 50%;
746 margin-right: 26rpx; 761 margin-right: 26rpx;
747 .paybtn { 762 .paybtn {
748 display: flex; 763 display: flex;
749 justify-content: center; 764 justify-content: center;
750 align-items: center; 765 align-items: center;
751 background: #ff6b4a; 766 background: #ff6b4a;
752 border-radius: 20px; 767 border-radius: 20px;
753 border-radius: 20px; 768 border-radius: 20px;
754 color: #ffffff; 769 color: #ffffff;
755 width: 204rpx; 770 width: 204rpx;
756 height: 80rpx; 771 height: 80rpx;
757 } 772 }
758 } 773 }
759 } 774 }
760 // 地址信息样式 775 // 地址信息样式
761 .order-user { 776 .order-user {
762 width: 670rpx; 777 width: 670rpx;
763 height: 228rpx; 778 height: 228rpx;
764 background: #ffffff; 779 background: #ffffff;
765 border-radius: 14rpx; 780 border-radius: 14rpx;
766 margin: 0 auto; 781 margin: 0 auto;
767 margin-top: 20rpx; 782 margin-top: 20rpx;
768 position: relative; 783 position: relative;
769 .order-user-head { 784 .order-user-head {
770 display: flex; 785 display: flex;
771 height: 108rpx; 786 height: 108rpx;
772 width: 100%; 787 width: 100%;
773 align-items: center; 788 align-items: center;
774 padding-left: 126rpx; 789 padding-left: 126rpx;
775 box-sizing: border-box; 790 box-sizing: border-box;
776 .name { 791 .name {
777 display: flex; 792 display: flex;
778 justify-content: space-between; 793 justify-content: space-between;
779 font-size: 14px; 794 font-size: 14px;
780 color: #333333; 795 color: #333333;
781 letter-spacing: -0.26px; 796 letter-spacing: -0.26px;
782 margin-right: 20rpx; 797 margin-right: 20rpx;
783 .default { 798 .default {
784 height: 40rpx; 799 height: 40rpx;
785 width: 80rpx; 800 width: 80rpx;
786 background-color: #4a90e2; 801 background-color: #4a90e2;
787 border-radius: 13px; 802 border-radius: 13px;
788 border-radius: 13px; 803 border-radius: 13px;
789 text-align: center; 804 text-align: center;
790 margin-right: 20rpx; 805 margin-right: 20rpx;
791 text { 806 text {
792 display: flex; 807 display: flex;
793 justify-content: center; 808 justify-content: center;
794 align-items: center; 809 align-items: center;
795 font-size: 12px; 810 font-size: 12px;
796 color: #ffffff; 811 color: #ffffff;
797 letter-spacing: -0.23px; 812 letter-spacing: -0.23px;
798 } 813 }
799 } 814 }
800 } 815 }
801 .mobile { 816 .mobile {
802 font-size: 14px; 817 font-size: 14px;
803 color: #999999; 818 color: #999999;
804 letter-spacing: -0.26px; 819 letter-spacing: -0.26px;
805 } 820 }
806 } 821 }
807 .order-user-body { 822 .order-user-body {
808 display: flex; 823 display: flex;
809 width: 100%; 824 width: 100%;
810 image { 825 image {
811 width: 24px; 826 width: 24px;
812 height: 28px; 827 height: 28px;
813 margin: 12rpx 32rpx 0 40rpx; 828 margin: 12rpx 32rpx 0 40rpx;
814 } 829 }
815 .address { 830 .address {
816 font-weight: bold; 831 font-weight: bold;
817 font-size: 14px; 832 font-size: 14px;
818 color: #333333; 833 color: #333333;
819 letter-spacing: -0.26px; 834 letter-spacing: -0.26px;
820 } 835 }
821 } 836 }
822 .arrow { 837 .arrow {
823 width: 12px; 838 width: 12px;
824 height: 12px; 839 height: 12px;
825 position: absolute; 840 position: absolute;
826 right: 40rpx; 841 right: 40rpx;
827 bottom: 104rpx; 842 bottom: 104rpx;
828 } 843 }
829 } 844 }
830 .last_zhanwei { 845 .last_zhanwei {
831 background: #f2f2f2; 846 background: #f2f2f2;
832 height: 60px; 847 height: 60px;
833 } 848 }
src/pages/myOrderPaying/myOrderPaying.vue
Diff comments   View file @248b0e0
1 <!-- 订单待付款 待收货 --> 1 <!-- 订单待付款 待收货 -->
2 <template> 2 <template>
3 <view class="content"> 3 <view class="content">
4 <view 4 <view
5 class="headerBanner" 5 class="headerBanner"
6 v-if="status == '2'||'3'" 6 v-if="status == '2'||'3'"
7 > 7 >
8 <view class="bannerLeft"> 8 <view class="bannerLeft">
9 <view class="T1">订单已完成</view> 9 <view class="T1">订单已完成</view>
10 </view> 10 </view>
11 <image 11 <image
12 src="../../static/car.png" 12 src="../../static/car.png"
13 mode="aspectFill" 13 mode="aspectFill"
14 ></image> 14 ></image>
15 </view> 15 </view>
16 <!-- 待付款 --> 16 <!-- 待付款 -->
17 <view class="order-time" v-if="status == '0'" > 17 <view class="order-time" v-if="status == '0'" >
18 <text>请在</text> 18 <text>请在</text>
19 <uni-countdown 19 <uni-countdown
20 color="#EC5D3B" 20 color="#EC5D3B"
21 splitor-color="#EC5D3B" 21 splitor-color="#EC5D3B"
22 :show-day="false" 22 :show-day="false"
23 :hour="0" 23 :hour="0"
24 :second="getLeftTime" 24 :second="getLeftTime"
25 @timeup="timeup" > 25 @timeup="timeup" >
26 </uni-countdown> 26 </uni-countdown>
27 27
28 <text>内完成付款</text> 28 <text>内完成付款</text>
29 </view> 29 </view>
30 30
31 <view class="headerBanner" v-if="status == '1'"> 31 <view class="headerBanner" v-if="status == '1'">
32 <view class="bannerLeft"> 32 <view class="bannerLeft">
33 <view class="T1">卖家已发货</view> 33 <view class="T1">卖家已发货</view>
34 <!-- <view class="T2">还剩 确认收货</view> --> 34 <!-- <view class="T2">还剩 确认收货</view> -->
35 </view> 35 </view>
36 <image 36 <image
37 src="../../static/car.png" 37 src="../../static/car.png"
38 mode="aspectFill" 38 mode="aspectFill"
39 ></image> 39 ></image>
40 </view> 40 </view>
41 41
42 42
43 <view class="order"> 43 <view class="order">
44 <view class="order-user"> 44 <view class="order-user">
45 <view class="order-user-head"> 45 <view class="order-user-head">
46 <text class="p1">{{orderAddressInfo.userName}}</text> 46 <text class="p1">{{orderAddressInfo.name}}</text>
47 <text class="p2">{{orderAddressInfo.telNumber}}</text> 47 <text class="p2">{{orderAddressInfo.mobile}}</text>
48 </view> 48 </view>
49 <view class="order-user-body"> 49 <view class="order-user-body">
50 <image src="../../static/myorder-paying-location.png"></image> 50 <image src="../../static/myorder-paying-location.png"></image>
51 <text class="p3">{{orderAddressInfo.provinceName}} {{orderAddressInfo.cityName}} {{orderAddressInfo.countyName}}\n{{orderAddressInfo.detailInfo}}</text> 51 <text class="p3">{{orderAddressInfo.address}}</text>
52 </view> 52 </view>
53 </view> 53 </view>
54 <view class="order-info"> 54 <view class="order-info">
55 <view 55 <view
56 class="order-info-head" 56 class="order-info-head"
57 v-for="(orderInfoListItem,index) in orderInfoList" 57 v-for="(orderInfoListItem,index) in orderInfoList"
58 :key="index" 58 :key="index"
59 > 59 >
60 <image 60 <image
61 :src="orderInfoListItem.imgUrl" 61 :src="orderInfoListItem.imgUrl"
62 mode="aspectFill" 62 mode="aspectFill"
63 ></image> 63 ></image>
64 <view class="order-info-head-r"> 64 <view class="order-info-head-r">
65 <text class="p1">{{orderInfoListItem.p_name}}</text> 65 <text class="p1">{{orderInfoListItem.p_name}}</text>
66 <view 66 <view
67 class="p2" 67 class="p2"
68 style="margin: 0;" 68 style="margin: 0;"
69 > 69 >
70 规格：玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻 70 规格：玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻
71 <!-- <view class="arrow"></view> --> 71 <!-- <view class="arrow"></view> -->
72 </view> 72 </view>
73 <view class="infoText-bottom"> 73 <view class="infoText-bottom">
74 <view class="markPrice">{{orderInfoListItem.nowPrice}}</view> 74 <view class="markPrice">{{orderInfoListItem.nowPrice}}</view>
75 <view class="buy-num">X {{orderInfoListItem.num}}</view> 75 <view class="buy-num">X {{orderInfoListItem.num}}</view>
76 </view> 76 </view>
77 </view> 77 </view>
78 </view> 78 </view>
79 <!-- <view class="order-info-goodsnum"> 79 <!-- <view class="order-info-goodsnum">
80 <text>X1</text> 80 <text>X1</text>
81 </view> --> 81 </view> -->
82 <text class="order-info-freight"> 82 <text class="order-info-freight">
83 <text class="p1">运费</text> 83 <text class="p1">运费</text>
84 <text class="p2">免运费</text> 84 <text class="p2">免运费</text>
85 </text> 85 </text>
86 <text class="order-info-discount"> 86 <text class="order-info-discount">
87 <text class="p1">优惠</text> 87 <text class="p1">优惠</text>
88 <text class="p2">-￥{{totalDiscount}}</text> 88 <text class="p2">-￥{{totalDiscount}}</text>
89 </text> 89 </text>
90 <text class="order-info-price"> 90 <text class="order-info-price">
91 <text class="p1">实付</text> 91 <text class="p1">实付</text>
92 <text class="p2">￥{{orderInfo.order_info.total_fee}}</text> 92 <text class="p2">￥{{orderInfo.order_info.total_fee}}</text>
93 93
94 </text> 94 </text>
95 <text class="order-info-num"> 95 <text class="order-info-num">
96 <text>订单号：{{payId}}</text> 96 <text>订单号：{{payId}}</text>
97 </text> 97 </text>
98 <text class="order-info-time"> 98 <text class="order-info-time">
99 <text>下单时间：{{orderInfo.order_info?orderInfo.order_info.pay_time:'' | timerChange}}</text> 99 <text>下单时间：{{orderInfo.order_info?orderInfo.order_info.pay_time:'' | timerChange}}</text>
100 </text> 100 </text>
101 <view class="order-info-hr"></view> 101 <view class="order-info-hr"></view>
102 <view class="order-info-contact"> 102 <view class="order-info-contact">
103 <image src="../../static/myorder-paying-contact.png"></image> 103 <image src="../../static/myorder-paying-contact.png"></image>
104 <text>联系客服</text> 104 <text>联系客服</text>
105 </view> 105 </view>
106 </view> 106 </view>
107 </view> 107 </view>
108 <view 108 <view
109 class="order-confim" 109 class="order-confim"
110 v-if="status == '0'" 110 v-if="status == '0'"
111 > 111 >
112 <button 112 <button
113 class="b1" 113 class="b1"
114 @click="cancleOrder" 114 @click="cancleOrder"
115 >取消订单</button> 115 >取消订单</button>
116 <button 116 <button
117 class="b2" 117 class="b2"
118 @click="paylog" 118 @click="paylog"
119 >立即支付</button> 119 >立即支付</button>
120 </view> 120 </view>
121 121
122 <view 122 <view
123 class="order-confim" 123 class="order-confim"
124 v-if="status == '1'" 124 v-if="status == '1'"
125 > 125 >
126 <!-- <button class="b1">取消订单</button> --> 126 <!-- <button class="b1">取消订单</button> -->
127 <button 127 <button
128 class="b2" 128 class="b2"
129 @click="confirmOrder" 129 @click="confirmOrder"
130 >确认收货</button> 130 >确认收货</button>
131 </view> 131 </view>
132 <view 132 <view
133 class="order-confim" 133 class="order-confim"
134 v-if="status == '2'" 134 v-if="status == '2'"
135 > 135 >
136 <button 136 <button
137 class="b2" 137 class="b2"
138 @click="toDetail" 138 @click="toDetail"
139 >再次购买</button> 139 >再次购买</button>
140 </view> 140 </view>
141 141
142 </view> 142 </view>
143 </template> 143 </template>
144 144
145 <script> 145 <script>
146 import store from "@/store"; 146 import store from "@/store";
147 import MD5Util from '../../utils/md5' 147 import MD5Util from '../../utils/md5'
148 import UniCountdown from "../../components/UniCountdown/UniCountdown.vue"; 148 import UniCountdown from "../../components/UniCountdown/UniCountdown.vue";
149 export default { 149 export default {
150 components: { 150 components: {
151 UniCountdown 151 UniCountdown
152 }, 152 },
153 data() { 153 data() {
154 return { 154 return {
155 payId: "", 155 payId: "",
156 payTime: "", 156 payTime: "",
157 status: "", // status 0 待付款 1 已发货 157 status: "", // status 0 待付款 1 已发货
158 uid: "", 158 uid: "",
159 openid: "", 159 openid: "",
160 lefttime: 0, 160 lefttime: 0,
161 isPay: 0, 161 isPay: 0,
162 orderInfo:{}, 162 orderInfo:{},
163 totalPrice:0, 163 totalPrice:0,
164 }; 164 };
165 }, 165 },
166 onLoad:async function ({payId,status,isPay}) { 166 onLoad:async function ({payId,status,isPay}) {
167 this.payId = payId 167 this.payId = payId
168 this.status = status 168 this.status = status
169 this.isPay = isPay 169 this.isPay = isPay
170 // console.log('++++++++++++++++++',this.status) 170 // console.log('++++++++++++++++++',this.status)
171 const openid = uni.getStorageSync('openid') 171 const openid = uni.getStorageSync('openid')
172 const uid = this.$store.state.user.userInfo.uid 172 const uid = this.$store.state.user.userInfo.uid
173 this.uid = uid 173 this.uid = uid
174 this.openid = openid 174 this.openid = openid
175 await store.dispatch('orderRead/getOrderInfo', { 175 await store.dispatch('orderRead/getOrderInfo', {
176 pay_id: this.payId, 176 pay_id: this.payId,
177 uid: uid, 177 uid: uid,
178 openid: openid 178 openid: openid
179 }); 179 });
180 // console.log(this.$store.state.orderRead.orderInfo) 180 // console.log(this.$store.state.orderRead.orderInfo)
181 this.orderInfo = this.$store.state.orderRead.orderInfo 181 this.orderInfo = this.$store.state.orderRead.orderInfo
182 this.totalPrice = this.orderInfo.total_fee 182 this.totalPrice = this.orderInfo.total_fee
183 }, 183 },
184 // 若从支付页面跳转过来，返回直接返回到首页 184 // 若从支付页面跳转过来，返回直接返回到首页
185 onBackPress(option) { 185 onBackPress(option) {
186 if (option.from === "backbutton" && this.isPay) { 186 if (option.from === "backbutton" && this.isPay) {
187 uni.switchTab({ 187 uni.switchTab({
188 url: "/pages/index/index" 188 url: "/pages/index/index"
189 }); 189 });
190 return true; // 阻止默认返回行为 190 return true; // 阻止默认返回行为
191 } 191 }
192 }, 192 },
193 computed: { 193 computed: {
194 orderInfoList () { 194 orderInfoList () {
195 return this.orderInfo.order_info?this.orderInfo.order_info.list:null 195 return this.orderInfo.order_info?this.orderInfo.order_info.list:null
196 }, 196 },
197 // 获取订单地址信息 197 // 获取订单地址信息
198 orderAddressInfo () { 198 orderAddressInfo () {
199 return this.orderInfo.order_info?this.orderInfo.order_info.address:null 199 return this.orderInfo.order_info?this.orderInfo.order_info.address:null
200 }, 200 },
201 // 订单付款时间 201 // 订单付款时间
202 getLeftTime () { 202 getLeftTime () {
203 return this.orderInfo.order_info?this.orderInfo.order_info.lefttime:1800 203 return this.orderInfo.order_info?this.orderInfo.order_info.lefttime:1800
204 }, 204 },
205 // 计算总优惠额 205 // 计算总优惠额
206 totalDiscount() { 206 totalDiscount() {
207 const discountInfoList = this.orderInfo.discount_info; 207 const discountInfoList = this.orderInfo.discount_info;
208 let totalDiscount = 0; 208 let totalDiscount = 0;
209 if (discountInfoList) { 209 if (discountInfoList) {
210 discountInfoList.map((discountItem, index) => { 210 discountInfoList.map((discountItem, index) => {
211 totalDiscount += Number(discountItem.value); 211 totalDiscount += Number(discountItem.value);
212 }); 212 });
213 } 213 }
214 // console.log(totalDiscount) 214 // console.log(totalDiscount)
215 return totalDiscount; 215 return totalDiscount;
216 } 216 }
217 }, 217 },
218 218
219 methods: { 219 methods: {
220 //再次购买 暂时只支持跳转第一个商品 220 //再次购买 暂时只支持跳转第一个商品
221 toDetail(){ 221 toDetail(){
222 const pid = this.orderInfo.order_info.list[0].pid 222 const pid = this.orderInfo.order_info.list[0].pid
223 uni.navigateTo({ 223 uni.navigateTo({
224 url: '../details/details?pid='+pid, 224 url: '../details/details?pid='+pid,
225 fail: (res) => {console.log(res)}, 225 fail: (res) => {console.log(res)},
226 }); 226 });
227 }, 227 },
228 // 取消订单 228 // 取消订单
229 timeup() { 229 timeup() {
230 this.cancleOrder(); 230 this.cancleOrder();
231 }, 231 },
232 cancleOrder() { 232 cancleOrder() {
233 const uid = this.uid; 233 const uid = this.uid;
234 const openid = this.openid; 234 const openid = this.openid;
235 const keyname = this.orderInfo.order_info.keyname 235 const keyname = this.orderInfo.order_info.keyname
236 // console.log('keyname',this.orderInfo.keyname) 236 // console.log('keyname',this.orderInfo.keyname)
237 uni.showModal({ 237 uni.showModal({
238 title: "提示", 238 title: "提示",
239 content: "现在取消，订单不可恢复哦，确认取消吗？", 239 content: "现在取消，订单不可恢复哦，确认取消吗？",
240 success: function(res) { 240 success: function(res) {
241 if (res.confirm) { 241 if (res.confirm) {
242 store.dispatch("cancelOrder/cancel", { 242 store.dispatch("cancelOrder/cancel", {
243 keyname: keyname, 243 keyname: keyname,
244 uid: uid, 244 uid: uid,
245 openid: openid 245 openid: openid
246 }); 246 });
247 uni.navigateBack({ 247 uni.navigateBack({
248 delta:1 248 delta:1
249 }) 249 })
250 } else if (res.cancel) { 250 } else if (res.cancel) {
251 console.log("用户点击取消"); 251 console.log("用户点击取消");
252 } 252 }
253 } 253 }
254 }); 254 });
255 }, 255 },
256 paylog() { 256 paylog() {
257 console.log('pay',this.orderInfo) 257 console.log('pay',this.orderInfo)
258 const { data, exKeyName: keyName } = this.orderInfo 258 const { data, exKeyName: keyName } = this.orderInfo
259 const uid = uni.getStorageSync('uid') 259 const uid = uni.getStorageSync('uid')
260 const timeStamp = new Date().getTime().toString() 260 const timeStamp = new Date().getTime().toString()
261 const nonceStr = 'asfafasfasfasfasf' 261 const nonceStr = 'asfafasfasfasfasf'
262 // 支付参数 262 // 支付参数
263 const fieldSet = { 263 const fieldSet = {
264 openid: this.$store.state.user.userInfo.openid, 264 openid: this.$store.state.user.userInfo.openid,
265 uid: this.$store.state.user.userInfo.uid, 265 uid: this.$store.state.user.userInfo.uid,
266 shopid: 0, 266 shopid: 0,
267 payCate: 2020, 267 payCate: 2020,
268 payMoney: this.totalPrice, 268 payMoney: this.totalPrice,
269 payWoodId: `fcdj-${uid}-${keyName}`, 269 payWoodId: `fcdj-${uid}-${keyName}`,
270 payWoodDesc: '在【非常戴镜】的微信付款凭证', 270 payWoodDesc: '在【非常戴镜】的微信付款凭证',
271 nonceStr, 271 nonceStr,
272 signType: 'MD5', 272 signType: 'MD5',
273 app_uid: 2020, 273 app_uid: 2020,
274 timeStamp, 274 timeStamp,
275 keyname: keyName, 275 keyname: keyName,
276 billInfo: JSON.stringify(data), 276 billInfo: JSON.stringify(data),
277 } 277 }
278 // 请求后台支付接口 278 // 请求后台支付接口
279 store.dispatch('order/pay', fieldSet).then(({ data, data2, pay_id: payId }) => { 279 store.dispatch('order/pay', fieldSet).then(({ data, data2, pay_id: payId }) => {
280 if (data.return_code === 'SUCCESS' && data.result_code === 'SUCCESS') { 280 if (data.return_code === 'SUCCESS' && data.result_code === 'SUCCESS') {
281 const stringA = `appId=wx115b25aa396d27ac&nonceStr=${nonceStr}&package=prepay_id=${data.prepay_id}&signType=MD5&timeStamp=${timeStamp}` 281 const stringA = `appId=wx115b25aa396d27ac&nonceStr=${nonceStr}&package=prepay_id=${data.prepay_id}&signType=MD5&timeStamp=${timeStamp}`
282 const stringSignTemp = stringA + '&key=NewMoney2017hatemydaddy123456789' 282 const stringSignTemp = stringA + '&key=NewMoney2017hatemydaddy123456789'
283 283
284 // 微信支付接口 284 // 微信支付接口
285 uni.requestPayment({ 285 uni.requestPayment({
286 appId: data.appid, 286 appId: data.appid,
287 timeStamp, 287 timeStamp,
288 nonceStr, 288 nonceStr,
289 total_fee: this.totalPrice, 289 total_fee: this.totalPrice,
290 package: `prepay_id=${data.prepay_id}`, 290 package: `prepay_id=${data.prepay_id}`,
291 signType: 'MD5', 291 signType: 'MD5',
292 paySign: MD5Util.MD5(stringSignTemp).toUpperCase(), 292 paySign: MD5Util.MD5(stringSignTemp).toUpperCase(),
293 success: (res) => { 293 success: (res) => {
294 // 支付成功 294 // 支付成功
295 uni.showModal({ 295 uni.showModal({
296 content: '支付成功', 296 content: '支付成功',
297 showCancel: false, 297 showCancel: false,
298 }) 298 })
299 // 跳转订单详情页->状态 待收货 299 // 跳转订单详情页->状态 待收货
300 uni.reLaunch({ 300 uni.reLaunch({
301 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=1&isPay=1`, 301 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=1&isPay=1`,
302 }) 302 })
303 }, 303 },
304 fail: (res) => { 304 fail: (res) => {
305 // 支付失败 305 // 支付失败
306 uni.showModal({ 306 uni.showModal({
307 content: '支付失败', 307 content: '支付失败',
308 showCancel: false, 308 showCancel: false,
309 }) 309 })
310 // 跳转订单详情页->刷新本页面 310 // 跳转订单详情页->刷新本页面
311 // uni.redirectTo({ 311 // uni.redirectTo({
312 // url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`, 312 // url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`,
313 // }) 313 // })
314 }, 314 },
315 complete: () => { 315 complete: () => {
316 uni.hideLoading() 316 uni.hideLoading()
317 }, 317 },
318 }) 318 })
319 } else { 319 } else {
320 uni.showModal({ 320 uni.showModal({
321 content: '支付失败', 321 content: '支付失败',
322 showCancel: false, 322 showCancel: false,
323 }) 323 })
324 console.log('支付失败') 324 console.log('支付失败')
325 uni.hideLoading() 325 uni.hideLoading()
326 // uni.redirectTo({ 326 // uni.redirectTo({
327 // url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`, 327 // url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`,
328 // }) 328 // })
329 } 329 }
330 }) 330 })
331 331
332 //修改订单状态 待付款==>待收货 332 //修改订单状态 待付款==>待收货
333 store.dispatch("statusConfirm/confirm", { 333 store.dispatch("statusConfirm/confirm", {
334 uid: this.uid, 334 uid: this.uid,
335 openid: this.openid, 335 openid: this.openid,
336 oldway: "0", 336 oldway: "0",
337 way: "1", 337 way: "1",
338 pay_id: this.payId, 338 pay_id: this.payId,
339 judgeContent: "", 339 judgeContent: "",
340 orderInfo: this.orderInfo.order_info 340 orderInfo: this.orderInfo.order_info
341 }) 341 })
342 .then( 342 .then(
343 // setTimeout(() => { 343 // setTimeout(() => {
344 // uni.navigateBack(); 344 // uni.navigateBack();
345 // }, 1500) 345 // }, 1500)
346 ); 346 );
347 }, 347 },
348 confirmOrder() { 348 confirmOrder() {
349 //确认收货 way1 ==>way2 349 //确认收货 way1 ==>way2
350 store 350 store
351 .dispatch("statusConfirm/confirm", { 351 .dispatch("statusConfirm/confirm", {
352 uid: this.uid, 352 uid: this.uid,
353 openid: this.openid, 353 openid: this.openid,
354 oldway: "1", 354 oldway: "1",
355 way: "2", 355 way: "2",
356 pay_id: this.payId, 356 pay_id: this.payId,
357 judgeContent: "", 357 judgeContent: "",
358 orderInfo: this.orderInfo.order_info 358 orderInfo: this.orderInfo.order_info
359 }) 359 })
360 .then((res)=>{ 360 .then((res)=>{
361 if(res.data.code === 1){ 361 if(res.data.code === 1){
362 uni.showToast({ 362 uni.showToast({
363 title:'已确认', 363 title:'已确认',
364 mask:true, 364 mask:true,
365 duration:1500, 365 duration:1500,
366 icon:'success' 366 icon:'success'
367 }) 367 })
368 }else{ 368 }else{
369 uni-uni.showToast({ 369 uni-uni.showToast({
370 title: '服务器错误，确认失败!', 370 title: '服务器错误，确认失败!',
371 mask:true 371 mask:true
372 }); 372 });
373 } 373 }
374 setTimeout(() => { 374 setTimeout(() => {
375 uni.navigateBack(); 375 uni.navigateBack();
376 }, 1500) 376 }, 1500)
377 }); 377 });
378 } 378 }
379 }, 379 },
380 filters: { 380 filters: {
381 timerChange: function(value) { 381 timerChange: function(value) {
382 var newDate = new Date(); 382 var newDate = new Date();
383 newDate.setTime(value * 1000); 383 newDate.setTime(value * 1000);
384 return newDate.toLocaleString(); 384 return newDate.toLocaleString();
385 } 385 }
386 } 386 }
387 }; 387 };
388 </script> 388 </script>
389 389
390 <style lang="scss" scoped> 390 <style lang="scss" scoped>
391 .content { 391 .content {
392 min-height: 100vh; 392 min-height: 100vh;
393 display: flex; 393 display: flex;
394 flex-direction: column; 394 flex-direction: column;
395 justify-content: flex-start; 395 justify-content: flex-start;
396 align-items: center; 396 align-items: center;
397 background-color: #f2f2f2; 397 background-color: #f2f2f2;
398 } 398 }
399 399
400 .order { 400 .order {
401 margin-bottom: 112rpx; 401 margin-bottom: 112rpx;
402 background: #f2f2f2; 402 background: #f2f2f2;
403 margin-top: 140rpx; 403 margin-top: 140rpx;
404 width: 670rpx; 404 width: 670rpx;
405 } 405 }
406 406
407 .order-time { 407 .order-time {
408 width: 100%; 408 width: 100%;
409 height: 140rpx; 409 height: 140rpx;
410 background-color: #fff; 410 background-color: #fff;
411 display: flex; 411 display: flex;
412 justify-content: center; 412 justify-content: center;
413 align-items: center; 413 align-items: center;
414 position: fixed; 414 position: fixed;
415 top: 0; 415 top: 0;
416 left: 0; 416 left: 0;
417 text { 417 text {
418 // font-family: PingFangSC-Regular; 418 // font-family: PingFangSC-Regular;
419 // margin-top: 48rpx; 419 // margin-top: 48rpx;
420 font-size: 14px; 420 font-size: 14px;
421 color: #333333; 421 color: #333333;
422 letter-spacing: -0.26px; 422 letter-spacing: -0.26px;
423 } 423 }
424 .p2 { 424 .p2 {
425 // font-family: DINAlternate-Bold; 425 // font-family: DINAlternate-Bold;
426 margin: 42rpx 20rpx 0 20rpx; 426 margin: 42rpx 20rpx 0 20rpx;
427 font-size: 18px; 427 font-size: 18px;
428 color: #ec5d3b; 428 color: #ec5d3b;
429 letter-spacing: -0.34px; 429 letter-spacing: -0.34px;
430 } 430 }
431 } 431 }
432 .headerBanner { 432 .headerBanner {
433 width: 100%; 433 width: 100%;
434 height: 140rpx; 434 height: 140rpx;
435 background: #4a90e2; 435 background: #4a90e2;
436 padding: 26rpx 60rpx 24rpx 60rpx; 436 padding: 26rpx 60rpx 24rpx 60rpx;
437 box-sizing: border-box; 437 box-sizing: border-box;
438 color: #ffffff; 438 color: #ffffff;
439 display: flex; 439 display: flex;
440 justify-content: space-between; 440 justify-content: space-between;
441 align-items: center; 441 align-items: center;
442 position: fixed; 442 position: fixed;
443 top: 0; 443 top: 0;
444 left: 0; 444 left: 0;
445 .bannerLeft { 445 .bannerLeft {
446 font-size: 36rpx; 446 font-size: 36rpx;
447 display: flex; 447 display: flex;
448 flex-direction: column; 448 flex-direction: column;
449 justify-content: center; 449 justify-content: center;
450 align-items: center; 450 align-items: center;
451 .T2 { 451 .T2 {
452 font-size: 24rpx; 452 font-size: 24rpx;
453 } 453 }
454 } 454 }
455 image { 455 image {
456 height: 56rpx; 456 height: 56rpx;
457 width: 72rpx; 457 width: 72rpx;
458 } 458 }
459 } 459 }
460 460
461 .order-user { 461 .order-user {
462 height: 228rpx; 462 height: 228rpx;
463 background: #ffffff; 463 background: #ffffff;
464 border-radius: 14rpx; 464 border-radius: 14rpx;
465 margin: 0 auto; 465 margin: 0 auto;
466 margin-top: 20rpx; 466 margin-top: 20rpx;
467 margin-bottom: 20rpx; 467 margin-bottom: 20rpx;
468 .order-user-head { 468 .order-user-head {
469 display: flex; 469 display: flex;
470 height: 108rpx; 470 height: 108rpx;
471 align-items: center; 471 align-items: center;
472 margin-left: 126rpx; 472 margin-left: 126rpx;
473 .p1 { 473 .p1 {
474 // font-family: PingFangSC-Regular; 474 // font-family: PingFangSC-Regular;
475 font-size: 14px; 475 font-size: 14px;
476 color: #333333; 476 color: #333333;
477 letter-spacing: -0.26px; 477 letter-spacing: -0.26px;
478 margin-right: 20rpx; 478 margin-right: 20rpx;
479 } 479 }
480 .p2 { 480 .p2 {
481 // font-family: PingFangSC-Regular; 481 // font-family: PingFangSC-Regular;
482 font-size: 14px; 482 font-size: 14px;
483 color: #999999; 483 color: #999999;
484 letter-spacing: -0.26px; 484 letter-spacing: -0.26px;
485 } 485 }
486 } 486 }
487 .order-user-body { 487 .order-user-body {
488 display: flex; 488 display: flex;
489 width: 100%; 489 width: 100%;
490 image { 490 image {
491 width: 24px; 491 width: 24px;
492 height: 26px; 492 height: 26px;
493 margin: 12rpx 32rpx 0 40rpx; 493 margin: 12rpx 32rpx 0 40rpx;
494 } 494 }
495 .p3 { 495 .p3 {
496 // font-family: PingFangSC-Semibold; 496 // font-family: PingFangSC-Semibold;
497 font-size: 14px; 497 font-size: 14px;
498 color: #333333; 498 color: #333333;
499 letter-spacing: -0.26px; 499 letter-spacing: -0.26px;
500 } 500 }
501 } 501 }
502 } 502 }
503 503
504 .order-info { 504 .order-info {
505 background-color: #fff; 505 background-color: #fff;
506 box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06); 506 box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06);
507 border-radius: 16rpx; 507 border-radius: 16rpx;
508 margin: 0 auto; 508 margin: 0 auto;
509 view { 509 view {
510 margin-left: 40rpx; 510 margin-left: 40rpx;
511 } 511 }
512 text { 512 text {
513 font-size: 14px; 513 font-size: 14px;
514 } 514 }
515 .order-info-head { 515 .order-info-head {
516 display: flex; 516 display: flex;
517 padding-top: 40rpx; 517 padding-top: 40rpx;
518 image { 518 image {
519 height: 188rpx; 519 height: 188rpx;
520 width: 188rpx; 520 width: 188rpx;
521 } 521 }
522 .order-info-head-r { 522 .order-info-head-r {
523 margin: 0; 523 margin: 0;
524 width: 368rpx; 524 width: 368rpx;
525 margin-left: 24rpx; 525 margin-left: 24rpx;
526 // margin-top: 40rpx; 526 // margin-top: 40rpx;
527 text { 527 text {
528 display: block; 528 display: block;
529 } 529 }
530 // .arrow{ 530 // .arrow{
531 // width: 0; 531 // width: 0;
532 // height: 0; 532 // height: 0;
533 // border-left: 5px transparent; 533 // border-left: 5px transparent;
534 // border-right: 5px transparent; 534 // border-right: 5px transparent;
535 // border-top: 5px #979797; 535 // border-top: 5px #979797;
536 // border-bottom: 0 transparent; 536 // border-bottom: 0 transparent;
537 // border-style: solid; 537 // border-style: solid;
538 // position: relative; 538 // position: relative;
539 // // transform: scaleY(-1); 539 // // transform: scaleY(-1);
540 // } 540 // }
541 // .arrow::after{ 541 // .arrow::after{
542 // content: ''; 542 // content: '';
543 // position: absolute; 543 // position: absolute;
544 // top: -6.5px; 544 // top: -6.5px;
545 // left: -5px; 545 // left: -5px;
546 // border-left: 5px transparent; 546 // border-left: 5px transparent;
547 // border-right: 5px transparent; 547 // border-right: 5px transparent;
548 // border-top: 5px #FFFFFF; 548 // border-top: 5px #FFFFFF;
549 // border-bottom: 0 transparent; 549 // border-bottom: 0 transparent;
550 // border-style: solid; 550 // border-style: solid;
551 // } 551 // }
552 .p1 { 552 .p1 {
553 min-height: 40px; 553 min-height: 40px;
554 // font-family: PingFangSC-Regular; 554 // font-family: PingFangSC-Regular;
555 font-size: 14px; 555 font-size: 14px;
556 color: #333333; 556 color: #333333;
557 letter-spacing: -0.26px; 557 letter-spacing: -0.26px;
558 line-height: 18px; 558 line-height: 18px;
559 // line-height: 20px; 559 // line-height: 20px;
560 } 560 }
561 .p2 { 561 .p2 {
562 height: 34px; 562 height: 34px;
563 padding: 1px 0 3px 0; 563 padding: 1px 0 3px 0;
564 // font-family: PingFangSC-Regular; 564 // font-family: PingFangSC-Regular;
565 font-size: 12px; 565 font-size: 12px;
566 color: #999999; 566 color: #999999;
567 letter-spacing: -0.23px; 567 letter-spacing: -0.23px;
568 } 568 }
569 .infoText-bottom { 569 .infoText-bottom {
570 display: flex; 570 display: flex;
571 flex-direction: row; 571 flex-direction: row;
572 justify-content: flex-start; 572 justify-content: flex-start;
573 align-items: center; 573 align-items: center;
574 width: 100%; 574 width: 100%;
575 margin-left: 0; 575 margin-left: 0;
576 .markPrice { 576 .markPrice {
577 font-size: 14px; 577 font-size: 14px;
578 color: #ff6b4a; 578 color: #ff6b4a;
579 margin-right: 20rpx; 579 margin-right: 20rpx;
580 margin-left: 0rpx; 580 margin-left: 0rpx;
581 } 581 }
582 .buy-num { 582 .buy-num {
583 font-size: 12px; 583 font-size: 12px;
584 color: #999999; 584 color: #999999;
585 } 585 }
586 } 586 }
587 } 587 }
588 } 588 }
589 // .order-info-goodsnum { 589 // .order-info-goodsnum {
590 // display: flex; 590 // display: flex;
591 // align-items: center; 591 // align-items: center;
592 // justify-content: flex-end; 592 // justify-content: flex-end;
593 // text { 593 // text {
594 // margin-right: 44rpx; 594 // margin-right: 44rpx;
595 // // ont-family: PingFangSC-Regular; 595 // // ont-family: PingFangSC-Regular;
596 // font-size: 12px; 596 // font-size: 12px;
597 // color: #999999; 597 // color: #999999;
598 // letter-spacing: -0.23px; 598 // letter-spacing: -0.23px;
599 // } 599 // }
600 // } 600 // }
601 .order-info-freight { 601 .order-info-freight {
602 display: block; 602 display: block;
603 margin-left: 40rpx; 603 margin-left: 40rpx;
604 margin-top: 22rpx; 604 margin-top: 22rpx;
605 .p1 { 605 .p1 {
606 // font-family: PingFangSC-Regular; 606 // font-family: PingFangSC-Regular;
607 font-size: 14px; 607 font-size: 14px;
608 color: #333333; 608 color: #333333;
609 letter-spacing: -0.26px; 609 letter-spacing: -0.26px;
610 line-height: 18px; 610 line-height: 18px;
611 margin-right: 24px; 611 margin-right: 24px;
612 } 612 }
613 .p2 { 613 .p2 {
614 // font-family: PingFangSC-Regular; 614 // font-family: PingFangSC-Regular;
615 font-size: 14px; 615 font-size: 14px;
616 color: #ff6b4a; 616 color: #ff6b4a;
617 letter-spacing: -0.26px; 617 letter-spacing: -0.26px;
618 } 618 }
619 } 619 }
620 .order-info-discount { 620 .order-info-discount {
621 display: block; 621 display: block;
622 margin-left: 40rpx; 622 margin-left: 40rpx;
623 margin-top: 24rpx; 623 margin-top: 24rpx;
624 .p1 { 624 .p1 {
625 // font-family: PingFangSC-Regular; 625 // font-family: PingFangSC-Regular;
626 font-size: 14px; 626 font-size: 14px;
627 color: #333333; 627 color: #333333;
628 letter-spacing: -0.26px; 628 letter-spacing: -0.26px;
629 line-height: 18px; 629 line-height: 18px;
630 margin-right: 24px; 630 margin-right: 24px;
631 } 631 }
632 .p2 { 632 .p2 {
633 // font-family: PingFangSC-Regular; 633 // font-family: PingFangSC-Regular;
634 font-size: 14px; 634 font-size: 14px;
635 color: #ff6b4a; 635 color: #ff6b4a;
636 letter-spacing: -0.26px; 636 letter-spacing: -0.26px;
637 } 637 }
638 } 638 }
639 .order-info-price { 639 .order-info-price {
640 display: block; 640 display: block;
641 margin-left: 40rpx; 641 margin-left: 40rpx;
642 margin-top: 24rpx; 642 margin-top: 24rpx;
643 .p1 { 643 .p1 {
644 // font-family: PingFangSC-Semibold; 644 // font-family: PingFangSC-Semibold;
645 font-size: 14px; 645 font-size: 14px;
646 color: #333333; 646 color: #333333;
647 letter-spacing: -0.26px; 647 letter-spacing: -0.26px;
648 line-height: 18px; 648 line-height: 18px;
649 margin-right: 24px; 649 margin-right: 24px;
650 } 650 }
651 .p2 { 651 .p2 {
652 // font-family: PingFangSC-Semibold; 652 // font-family: PingFangSC-Semibold;
653 font-size: 14px; 653 font-size: 14px;
654 color: #ff6b4a; 654 color: #ff6b4a;
655 letter-spacing: -0.26px; 655 letter-spacing: -0.26px;
656 } 656 }
657 } 657 }
658 .order-info-num { 658 .order-info-num {
659 display: block; 659 display: block;
660 margin-left: 40rpx; 660 margin-left: 40rpx;
661 margin-top: 44rpx; 661 margin-top: 44rpx;
662 text { 662 text {
663 // font-family: PingFangSC-Regular; 663 // font-family: PingFangSC-Regular;
664 font-size: 12px; 664 font-size: 12px;
665 color: #999999; 665 color: #999999;
666 letter-spacing: -0.23px; 666 letter-spacing: -0.23px;
667 } 667 }
668 } 668 }
669 .order-info-time { 669 .order-info-time {
670 display: block; 670 display: block;
671 margin: 8rpx 0 48rpx 40rpx; 671 margin: 8rpx 0 48rpx 40rpx;
672 text { 672 text {
673 // font-family: PingFangSC-Regular; 673 // font-family: PingFangSC-Regular;
674 font-size: 12px; 674 font-size: 12px;
675 color: #999999; 675 color: #999999;
676 letter-spacing: -0.23px; 676 letter-spacing: -0.23px;
677 } 677 }
678 } 678 }
679 .order-info-hr { 679 .order-info-hr {
680 width: 520rpx; 680 width: 520rpx;
681 height: 1px; 681 height: 1px;
682 background-color: #e9e9e9; 682 background-color: #e9e9e9;
683 margin-bottom: 20rpx; 683 margin-bottom: 20rpx;
684 } 684 }
685 .order-info-contact { 685 .order-info-contact {
686 display: flex; 686 display: flex;
687 padding-bottom: 28rpx; 687 padding-bottom: 28rpx;
688 image { 688 image {
689 width: 19px; 689 width: 19px;
690 height: 16px; 690 height: 16px;
691 } 691 }
692 text { 692 text {
693 // font-family: PingFangSC-Regular; 693 // font-family: PingFangSC-Regular;
694 margin-left: 20rpx; 694 margin-left: 20rpx;
695 font-size: 14px; 695 font-size: 14px;
696 color: #333333; 696 color: #333333;
697 letter-spacing: -0.26px; 697 letter-spacing: -0.26px;
698 line-height: 18px; 698 line-height: 18px;
699 } 699 }
700 } 700 }
701 } 701 }
702 702
703 .order-confim { 703 .order-confim {
704 display: flex; 704 display: flex;
705 align-items: center; 705 align-items: center;
706 justify-content: flex-end; 706 justify-content: flex-end;
707 // z-index: 999; 707 // z-index: 999;
708 width: 100%; 708 width: 100%;
709 height: 112rpx; 709 height: 112rpx;
710 position: fixed; 710 position: fixed;
711 bottom: 0; 711 bottom: 0;
712 background: #ffffff; 712 background: #ffffff;
713 button { 713 button {
714 width: 204rpx; 714 width: 204rpx;
715 height: 80rpx; 715 height: 80rpx;
716 border: 1px solid #ff6b4a; 716 border: 1px solid #ff6b4a;
717 border-radius: 40rpx; 717 border-radius: 40rpx;
718 font-size: 32rpx; 718 font-size: 32rpx;
719 letter-spacing: -0.3px; 719 letter-spacing: -0.3px;
720 margin-right: 0; 720 margin-right: 0;
721 } 721 }
722 .b1 { 722 .b1 {
723 // font-family: PingFangSC-Regular; 723 // font-family: PingFangSC-Regular;
724 color: #ff6b4a; 724 color: #ff6b4a;
725 background-color: #ffffff; 725 background-color: #ffffff;
726 } 726 }
727 .b2 { 727 .b2 {
728 // font-family: PingFangSC-Regular; 728 // font-family: PingFangSC-Regular;
729 background-color: #ff6b4a; 729 background-color: #ff6b4a;
730 color: #ffffff; 730 color: #ffffff;
731 margin: 0 26rpx 0 20rpx; 731 margin: 0 26rpx 0 20rpx;
732 } 732 }
733 } 733 }
734 </style> 734 </style>
735 735