Commit 081c50da0c980cda815ab8a67a9304d9cc091194

Authored by 范牧
1 parent c00c258098
Exists in master

取消订单返回修改

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

1.74 KB

src/store/modules/address.js
1 import urlAlias from '../url' 1 import urlAlias from '../url'
2 import request from '../request' 2 import request from '../request'
3 3
4 const { editAddress, addressList, getAddress, getDefaultAddress } = urlAlias 4 const { editAddress, addressList, getAddress, getDefaultAddress, delAddress } = urlAlias
5 5
6 const state = { list: [], detail: {}, defaultInfo: {} } 6 const state = { list: [], detail: {}, defaultInfo: {} }
7 7
8 const mutations = { 8 const mutations = {
9 LIST: (state, list) => { 9 LIST: (state, list) => {
10 state.list = list 10 state.list = list
11 }, 11 },
12 DETAILS: (state, details) => { 12 DETAILS: (state, details) => {
13 state.details = details 13 state.details = details
14 }, 14 },
15 DEFAULT: (state, data) => { 15 DEFAULT: (state, data) => {
16 state.defaultInfo = data 16 state.defaultInfo = data
17 }, 17 },
18 } 18 }
19 19
20 const actions = { 20 const actions = {
21 edit(mutations, param, success) { 21 edit(mutations, param, success) {
22 return new Promise((resolve) => request({ 22 return new Promise((resolve) => request({
23 url: editAddress, 23 url: editAddress,
24 data: param, 24 data: param,
25 success: () => { 25 success: () => {
26 resolve() 26 resolve()
27 }, 27 },
28 fail: () => { 28 fail: () => {
29 uni.showModal({ 29 uni.showModal({
30 content: '编辑失败', 30 content: '编辑失败',
31 showCancel: false, 31 showCancel: false,
32 }) 32 })
33 }, 33 },
34 complete: (res) => { 34 complete: (res) => {
35 console.log('complete status === > ', res) 35 console.log('complete status === > ', res)
36 }, 36 },
37 })) 37 }))
38 }, 38 },
39 list({ commit }) { 39 list({ commit }) {
40 request({ 40 request({
41 url: addressList, 41 url: addressList,
42 success: (res) => { 42 success: (res) => {
43 commit('LIST', res.data.data) 43 commit('LIST', res.data.data)
44 }, 44 },
45 fail: () => { 45 fail: () => {
46 uni.showModal({ 46 uni.showModal({
47 content: '获取地址列表失败', 47 content: '获取地址列表失败',
48 showCancel: false, 48 showCancel: false,
49 }) 49 })
50 }, 50 },
51 }) 51 })
52 }, 52 },
53 details({ commit }, param) { 53 details({ commit }, param) {
54 return new Promise((resolve, reject) => request({ 54 return new Promise((resolve, reject) => request({
55 url: getAddress, 55 url: getAddress,
56 data: param, 56 data: param,
57 success: (res) => { 57 success: (res) => {
58 commit('DETAILS', res.data.data) 58 commit('DETAILS', res.data.data)
59 resolve({ 59 resolve({
60 code: res.data.code, 60 code: res.data.code,
61 data: res.data.data, 61 data: res.data.data,
62 }) 62 })
63 }, 63 },
64 fail: () => { 64 fail: () => {
65 uni.showModal({ 65 uni.showModal({
66 content: '获取地址信息失败', 66 content: '获取地址信息失败',
67 showCancel: false, 67 showCancel: false,
68 }) 68 })
69 }, 69 },
70 })) 70 }))
71 }, 71 },
72 default({ commit }, param) { 72 default({ commit }, param) {
73 return new Promise((resolve, reject) => request({ 73 return new Promise((resolve, reject) => request({
74 url: getDefaultAddress, 74 url: getDefaultAddress,
75 data: param, 75 data: param,
76 success: (res) => { 76 success: (res) => {
77 resolve({ 77 resolve({
78 code: res.data.code, 78 code: res.data.code,
79 data: res.data.data, 79 data: res.data.data,
80 }) 80 })
81 }, 81 },
82 fail: () => { 82 fail: () => {
83 uni.showModal({ 83 uni.showModal({
84 content: '获取默认地址信息失败', 84 content: '获取默认地址信息失败',
85 showCancel: false, 85 showCancel: false,
86 }) 86 })
87 }, 87 },
88 })) 88 }))
89 }, 89 },
90 delete(_, param) {
91 return new Promise((resolve) => request({
92 url: delAddress,
93 data: param,
94 success: (res) => {
95 resolve()
96 },
97 fail: () => {
98 uni.showModal({
99 content: '删除地址失败',
100 showCancel: false,
101 })
102 },
103 }))
104 },
90 } 105 }
91 106
92 export default { 107 export default {
93 namespaced: true, 108 namespaced: true,
94 state, 109 state,
95 mutations, 110 mutations,
96 actions, 111 actions,
97 } 112 }
98 113
1 const urlAlias = { 1 const urlAlias = {
2 // 详情 2 // 详情
3 read: '/app/prod/read', // 获取商品信息 3 read: '/app/prod/read', // 获取商品信息
4 4
5 // 首页 5 // 首页
6 shopList: '/app/prod/list', // 获取首页商品列表 6 shopList: '/app/prod/list', // 获取首页商品列表
7 category: '/app/prod/category2', // 获取首页商品分类 7 category: '/app/prod/category2', // 获取首页商品分类
8 search: '/app/prod/search', // 首页搜索商品 8 search: '/app/prod/search', // 首页搜索商品
9 9
10 // 登陆 10 // 登陆
11 login: '/app/glass/getOpenId', // 登陆 11 login: '/app/glass/getOpenId', // 登陆
12 getUserInfo: '/app/glass/userinfo', // 获取用户信息 12 getUserInfo: '/app/glass/userinfo', // 获取用户信息
13 13
14 // 我的订单 14 // 我的订单
15 orderList: '/app/order/list', // 获取订单列表 15 orderList: '/app/order/list', // 获取订单列表
16 myOrderList: '/app/order/list3', // 获取订单列表 16 myOrderList: '/app/order/list3', // 获取订单列表
17 orderRead: '/app/order/read', // 获取订单详情 17 orderRead: '/app/order/read', // 获取订单详情
18 cancelOrder: '/app/order/wait/del', // 取消订单 18 cancelOrder: '/app/order/wait/del', // 取消订单
19 statusConfirm: '/app/order/statusConfirm', // 订单操作 19 statusConfirm: '/app/order/statusConfirm', // 订单操作
20 payLog: '/app/pay/log', // 调起支付 20 payLog: '/app/pay/log', // 调起支付
21 orderBuild: '/app/order/build', // 加购后生成订单 21 orderBuild: '/app/order/build', // 加购后生成订单
22 buyNow: '/app/order/buynow', // 立即购买生成订单 22 buyNow: '/app/order/buynow', // 立即购买生成订单
23 pay: '/app/pay/log', // 支付接口 23 pay: '/app/pay/log', // 支付接口
24 24
25 // 购物车 25 // 购物车
26 cartList: '/app/cart/list', // 获取购物车列表 26 cartList: '/app/cart/list', // 获取购物车列表
27 cartModi: '/app/cart/modi', // 修改购物车 27 cartModi: '/app/cart/modi', // 修改购物车
28 cartDel: '/app/cart/del', // 删除购物车 28 cartDel: '/app/cart/del', // 删除购物车
29 cartAdd: '/app/cart/add', // 添加购物车 29 cartAdd: '/app/cart/add', // 添加购物车
30 30
31 // 我的 31 // 我的
32 recommandList: '/app/prod/recommand', // 获取用户个性化推荐商品 32 recommandList: '/app/prod/recommand', // 获取用户个性化推荐商品
33 33
34 // 镜框选购页 34 // 镜框选购页
35 detailStandardList: '/app/prod/read', // 获取商品的详细信息 35 detailStandardList: '/app/prod/read', // 获取商品的详细信息
36 // 选购页 36 // 选购页
37 detailStandardUrl: '/app/prod/read', // 获取商品的详细信息 37 detailStandardUrl: '/app/prod/read', // 获取商品的详细信息
38 makePost: '/app/glass/makeProdAdvPic', // 生成分享海报 38 makePost: '/app/glass/makeProdAdvPic', // 生成分享海报
39 39
40 // 地址管理 40 // 地址管理
41 editAddress: '/app/address/edit_address', // 编辑地址 41 editAddress: '/app/address/edit_address', // 编辑地址
42 addressList: '/app/address/get_address_list', // 获取用户地址列表 42 addressList: '/app/address/get_address_list', // 获取用户地址列表
43 getAddress: '/app/address/get_address_by_id', // 获取用户某一地址信息 43 getAddress: '/app/address/get_address_by_id', // 获取用户某一地址信息
44 getDefaultAddress: '/app/address/get_default_address', // 获取用户默认地址信息 44 getDefaultAddress: '/app/address/get_default_address', // 获取用户默认地址信息
45 delAddress: '/app/address/del_address', // 删除用户地址
45 46
46 // 用户数据 47 // 用户数据
47 mylovelist: '/app/user/mylovelist', // 关心的人的数据 48 mylovelist: '/app/user/mylovelist', // 关心的人的数据
48 myloveadd: '/app/user/myloveadd', // 添加关心的人 49 myloveadd: '/app/user/myloveadd', // 添加关心的人
49 myloveupdate: '/app/user/myloveupdate', // 更新关心人的数据 50 myloveupdate: '/app/user/myloveupdate', // 更新关心人的数据
50 } 51 }
51 52
52 export default urlAlias 53 export default urlAlias
53 54