Commit ecde406930baaa00e4f75e72058300eb19eeee89

Authored by 范牧
1 parent 8bd42a7f24
Exists in master

部分bug修改

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