Commit 87e0a41035e05533d198d5c2a691cf40b574fd63
1 parent
37ccd96757
Exists in
master
修改订单详情时间戳
Showing
1 changed file
with
10 additions
and
2 deletions
Show diff stats
src/pages/myOrderPaying/myOrderPaying.vue
1 | <!-- 订单待付款 待收货 --> | 1 | <!-- 订单待付款 待收货 --> |
2 | <template> | 2 | <template> |
3 | <view class="content"> | 3 | <view class="content"> |
4 | <!-- 待付款 --> | 4 | <!-- 待付款 --> |
5 | <view | 5 | <view |
6 | class="order-time" | 6 | class="order-time" |
7 | v-if="status == '0'" | 7 | v-if="status == '0'" |
8 | > | 8 | > |
9 | <text>请在</text> | 9 | <text>请在</text> |
10 | <uni-countdown | 10 | <uni-countdown |
11 | color="#EC5D3B" | 11 | color="#EC5D3B" |
12 | splitor-color="#EC5D3B" | 12 | splitor-color="#EC5D3B" |
13 | :show-day="false" | 13 | :show-day="false" |
14 | :hour="0" | 14 | :hour="0" |
15 | :second="getTime" | 15 | :second="getTime" |
16 | @timeup=timeup | 16 | @timeup=timeup |
17 | ></uni-countdown> | 17 | ></uni-countdown> |
18 | <text>内完成付款</text> | 18 | <text>内完成付款</text> |
19 | </view> | 19 | </view> |
20 | <!-- 待收货 --> | 20 | <!-- 待收货 --> |
21 | <view | 21 | <view |
22 | class="headerBanner" | 22 | class="headerBanner" |
23 | v-if="status == '1'" | 23 | v-if="status == '1'" |
24 | > | 24 | > |
25 | <view class="bannerLeft"> | 25 | <view class="bannerLeft"> |
26 | <view class="T1">卖家已发货</view> | 26 | <view class="T1">卖家已发货</view> |
27 | <view class="T2">还剩 确认收货</view> | 27 | <view class="T2">还剩 确认收货</view> |
28 | </view> | 28 | </view> |
29 | <image | 29 | <image |
30 | src="../../static/car.png" | 30 | src="../../static/car.png" |
31 | mode="aspectFill" | 31 | mode="aspectFill" |
32 | ></image> | 32 | ></image> |
33 | </view> | 33 | </view> |
34 | <view class="order"> | 34 | <view class="order"> |
35 | <view class="order-user"> | 35 | <view class="order-user"> |
36 | <view class="order-user-head"> | 36 | <view class="order-user-head"> |
37 | <text class="p1">{{orderAddressInfo.userName}}</text> | 37 | <text class="p1">{{orderAddressInfo.userName}}</text> |
38 | <text class="p2">{{orderAddressInfo.telNumber}}</text> | 38 | <text class="p2">{{orderAddressInfo.telNumber}}</text> |
39 | </view> | 39 | </view> |
40 | <view class="order-user-body"> | 40 | <view class="order-user-body"> |
41 | <image src="../../static/myorder-paying-location.png"></image> | 41 | <image src="../../static/myorder-paying-location.png"></image> |
42 | <text class="p3">{{orderAddressInfo.provinceName}} {{orderAddressInfo.cityName}} {{orderAddressInfo.countyName}}\n{{orderAddressInfo.detailInfo}}</text> | 42 | <text class="p3">{{orderAddressInfo.provinceName}} {{orderAddressInfo.cityName}} {{orderAddressInfo.countyName}}\n{{orderAddressInfo.detailInfo}}</text> |
43 | </view> | 43 | </view> |
44 | </view> | 44 | </view> |
45 | <view class="order-info"> | 45 | <view class="order-info"> |
46 | <view | 46 | <view |
47 | class="order-info-head" | 47 | class="order-info-head" |
48 | v-for="(orderInfoListItem,index) in orderInfoList" | 48 | v-for="(orderInfoListItem,index) in orderInfoList" |
49 | :key="index" | 49 | :key="index" |
50 | > | 50 | > |
51 | <image | 51 | <image |
52 | :src="orderInfoListItem.imgUrl" | 52 | :src="orderInfoListItem.imgUrl" |
53 | mode="aspectFill" | 53 | mode="aspectFill" |
54 | ></image> | 54 | ></image> |
55 | <view class="order-info-head-r"> | 55 | <view class="order-info-head-r"> |
56 | <text class="p1">{{orderInfoListItem.p_name}}</text> | 56 | <text class="p1">{{orderInfoListItem.p_name}}</text> |
57 | <view | 57 | <view |
58 | class="p2" | 58 | class="p2" |
59 | style="margin: 0;" | 59 | style="margin: 0;" |
60 | > | 60 | > |
61 | 规格:玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻 | 61 | 规格:玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻 |
62 | <!-- <view class="arrow"></view> --> | 62 | <!-- <view class="arrow"></view> --> |
63 | </view> | 63 | </view> |
64 | <view class="infoText-bottom"> | 64 | <view class="infoText-bottom"> |
65 | <view class="markPrice">{{orderInfoListItem.nowPrice}}</view> | 65 | <view class="markPrice">{{orderInfoListItem.nowPrice}}</view> |
66 | <view class="buy-num">X {{orderInfoListItem.num}}</view> | 66 | <view class="buy-num">X {{orderInfoListItem.num}}</view> |
67 | </view> | 67 | </view> |
68 | </view> | 68 | </view> |
69 | </view> | 69 | </view> |
70 | <!-- <view class="order-info-goodsnum"> | 70 | <!-- <view class="order-info-goodsnum"> |
71 | <text>X1</text> | 71 | <text>X1</text> |
72 | </view> --> | 72 | </view> --> |
73 | <text class="order-info-freight"> | 73 | <text class="order-info-freight"> |
74 | <text class="p1">运费</text> | 74 | <text class="p1">运费</text> |
75 | <text class="p2">{{orderInfo.trans_price}}</text> | 75 | <text class="p2">{{orderInfo.trans_price}}</text> |
76 | </text> | 76 | </text> |
77 | <text class="order-info-discount"> | 77 | <text class="order-info-discount"> |
78 | <text class="p1">优惠</text> | 78 | <text class="p1">优惠</text> |
79 | <text class="p2">-¥{{totalDiscount}}</text> | 79 | <text class="p2">-¥{{totalDiscount}}</text> |
80 | </text> | 80 | </text> |
81 | <text class="order-info-price"> | 81 | <text class="order-info-price"> |
82 | <text class="p1">实付</text> | 82 | <text class="p1">实付</text> |
83 | <text class="p2">¥{{orderInfo.order_info[0].total_fee}}</text> | 83 | <text class="p2">¥{{orderInfo.order_info[0].total_fee}}</text> |
84 | </text> | 84 | </text> |
85 | <text class="order-info-num"> | 85 | <text class="order-info-num"> |
86 | <text>订单号:{{payId}}</text> | 86 | <text>订单号:{{payId}}</text> |
87 | </text> | 87 | </text> |
88 | <text class="order-info-time"> | 88 | <text class="order-info-time"> |
89 | <text>下单时间:{{orderInfo.order_info[0].pay_time}}</text> | 89 | <text>下单时间:{{orderInfo.order_info[0].pay_time | timerChange}}</text> |
90 | </text> | 90 | </text> |
91 | <view class="order-info-hr"></view> | 91 | <view class="order-info-hr"></view> |
92 | <view class="order-info-contact"> | 92 | <view class="order-info-contact"> |
93 | <image src="../../static/myorder-paying-contact.png"></image> | 93 | <image src="../../static/myorder-paying-contact.png"></image> |
94 | <text>联系客服</text> | 94 | <text>联系客服</text> |
95 | </view> | 95 | </view> |
96 | </view> | 96 | </view> |
97 | </view> | 97 | </view> |
98 | <view | 98 | <view |
99 | class="order-confim" | 99 | class="order-confim" |
100 | v-if="status == '0'" | 100 | v-if="status == '0'" |
101 | > | 101 | > |
102 | <button | 102 | <button |
103 | class="b1" | 103 | class="b1" |
104 | @click="cancleOrder" | 104 | @click="cancleOrder" |
105 | >取消订单</button> | 105 | >取消订单</button> |
106 | <button | 106 | <button |
107 | class="b2" | 107 | class="b2" |
108 | @click="paylog" | 108 | @click="paylog" |
109 | >立即支付</button> | 109 | >立即支付</button> |
110 | </view> | 110 | </view> |
111 | 111 | ||
112 | <view | 112 | <view |
113 | class="order-confim" | 113 | class="order-confim" |
114 | v-if="status == '1'" | 114 | v-if="status == '1'" |
115 | > | 115 | > |
116 | <!-- <button class="b1">取消订单</button> --> | 116 | <!-- <button class="b1">取消订单</button> --> |
117 | <button | 117 | <button |
118 | class="b2" | 118 | class="b2" |
119 | @click="confirmOrder" | 119 | @click="confirmOrder" |
120 | >确认收货</button> | 120 | >确认收货</button> |
121 | </view> | 121 | </view> |
122 | </view> | 122 | </view> |
123 | </template> | 123 | </template> |
124 | 124 | ||
125 | <script> | 125 | <script> |
126 | import store from '@/store' | 126 | import store from '@/store' |
127 | import UniCountdown from '../../components/UniCountdown/UniCountdown.vue' | 127 | import UniCountdown from '../../components/UniCountdown/UniCountdown.vue' |
128 | export default { | 128 | export default { |
129 | components: { | 129 | components: { |
130 | UniCountdown | 130 | UniCountdown |
131 | }, | 131 | }, |
132 | data () { | 132 | data () { |
133 | return { | 133 | return { |
134 | // orderInfo:{}, | 134 | // orderInfo:{}, |
135 | payId: '', | 135 | payId: '', |
136 | payTime: '', | ||
136 | status: '', | 137 | status: '', |
137 | uid: '', | 138 | uid: '', |
138 | openid: '', | 139 | openid: '', |
139 | lefttime: 0 | 140 | lefttime: 0 |
140 | 141 | ||
141 | } | 142 | } |
142 | }, | 143 | }, |
143 | onLoad: function (option) { | 144 | onLoad: function (option) { |
144 | console.log(option) | 145 | console.log(option) |
145 | this.payId = option.payId | 146 | this.payId = option.payId |
146 | this.status = option.status | 147 | this.status = option.status |
147 | const openid = uni.getStorageSync('openid') | 148 | const openid = uni.getStorageSync('openid') |
148 | const uid = this.$store.state.user.uid | 149 | const uid = this.$store.state.user.uid |
149 | this.uid = uid | 150 | this.uid = uid |
150 | this.openid = openid | 151 | this.openid = openid |
151 | store.dispatch('orderRead/getOrderInfo', { | 152 | store.dispatch('orderRead/getOrderInfo', { |
152 | pay_id: this.payId, | 153 | pay_id: this.payId, |
153 | uid: '1', | 154 | uid: '1', |
154 | openid: openid | 155 | openid: openid |
155 | }) | 156 | }) |
156 | 157 | ||
157 | // this.orderInfo = this.$store.state.orderRead.orderInfo | 158 | // this.orderInfo = this.$store.state.orderRead.orderInfo |
158 | }, | 159 | }, |
159 | computed: { | 160 | computed: { |
160 | // 获取订单详细信息 | 161 | // 获取订单详细信息 |
161 | orderInfo () { | 162 | orderInfo () { |
162 | console.log(this.$store.state.orderRead.orderInfo) | 163 | console.log(this.$store.state.orderRead.orderInfo) |
163 | return this.$store.state.orderRead.orderInfo || {} | 164 | return this.$store.state.orderRead.orderInfo || {} |
164 | }, | 165 | }, |
165 | orderInfoList () { | 166 | orderInfoList () { |
166 | const orderInfoList = this.orderInfo.order_info[0].list | 167 | const orderInfoList = this.orderInfo.order_info[0].list |
167 | // console.log(this.orderInfo.order_info[0].list.p_name + 'sssss') | ||
168 | return orderInfoList | 168 | return orderInfoList |
169 | }, | 169 | }, |
170 | // 获取订单地址信息 | 170 | // 获取订单地址信息 |
171 | orderAddressInfo () { | 171 | orderAddressInfo () { |
172 | return this.orderInfo.order_info[0].address | 172 | return this.orderInfo.order_info[0].address |
173 | }, | 173 | }, |
174 | // 订单付款时间 | 174 | // 订单付款时间 |
175 | getTime () { | 175 | getTime () { |
176 | return this.orderInfo.order_info[0].lefttime | 176 | return this.orderInfo.order_info[0].lefttime |
177 | }, | 177 | }, |
178 | // 计算总优惠额 | 178 | // 计算总优惠额 |
179 | totalDiscount () { | 179 | totalDiscount () { |
180 | const discountInfoList = this.orderInfo.discount_info | 180 | const discountInfoList = this.orderInfo.discount_info |
181 | let totalDiscount = 0 | 181 | let totalDiscount = 0 |
182 | if (discountInfoList) { | 182 | if (discountInfoList) { |
183 | discountInfoList.map((discountItem, index) => { | 183 | discountInfoList.map((discountItem, index) => { |
184 | totalDiscount += Number(discountItem.value) | 184 | totalDiscount += Number(discountItem.value) |
185 | }) | 185 | }) |
186 | } | 186 | } |
187 | // console.log(totalDiscount) | 187 | // console.log(totalDiscount) |
188 | return totalDiscount | 188 | return totalDiscount |
189 | } | 189 | } |
190 | }, | 190 | }, |
191 | methods: { | 191 | methods: { |
192 | // 取消订单 | 192 | // 取消订单 |
193 | timeup () { | 193 | timeup () { |
194 | this.cancleOrder() | 194 | this.cancleOrder() |
195 | }, | 195 | }, |
196 | cancleOrder () { | 196 | cancleOrder () { |
197 | const uid = this.uid | 197 | const uid = this.uid |
198 | const openid = this.openid | 198 | const openid = this.openid |
199 | uni.showModal({ | 199 | uni.showModal({ |
200 | title: '提示', | 200 | title: '提示', |
201 | content: '现在取消,订单不可恢复哦,确认取消吗?', | 201 | content: '现在取消,订单不可恢复哦,确认取消吗?', |
202 | success: function (res) { | 202 | success: function (res) { |
203 | if (res.confirm) { | 203 | if (res.confirm) { |
204 | store.dispatch('cancelOrder/cancel', { | 204 | store.dispatch('cancelOrder/cancel', { |
205 | keyname: '1', | 205 | keyname: '1', |
206 | uid: uid, | 206 | uid: uid, |
207 | openid: openid | 207 | openid: openid |
208 | }) | 208 | }) |
209 | } else if (res.cancel) { | 209 | } else if (res.cancel) { |
210 | console.log('用户点击取消') | 210 | console.log('用户点击取消') |
211 | } | 211 | } |
212 | } | 212 | } |
213 | }) | 213 | }) |
214 | }, | 214 | }, |
215 | paylog () { | 215 | paylog () { |
216 | 216 | ||
217 | }, | 217 | }, |
218 | confirmOrder () { | 218 | confirmOrder () { |
219 | store.dispatch('statusConfirm/confirm', { | 219 | store.dispatch('statusConfirm/confirm', { |
220 | uid: this.uid, | 220 | uid: this.uid, |
221 | openid: this.openid, | 221 | openid: this.openid, |
222 | oldway: '1', | 222 | oldway: '1', |
223 | way: '2', | 223 | way: '2', |
224 | pay_id: this.payId, | 224 | pay_id: this.payId, |
225 | judgeContent: '', | 225 | judgeContent: '', |
226 | orderInfo: this.orderInfo.order_info | 226 | orderInfo: this.orderInfo.order_info |
227 | }).then( | 227 | }).then( |
228 | setTimeout(() => { | 228 | setTimeout(() => { |
229 | uni.navigateBack() | 229 | uni.navigateBack() |
230 | }, 1500) | 230 | }, 1500) |
231 | ) | 231 | ) |
232 | } | 232 | } |
233 | }, | ||
234 | filters: { | ||
235 | timerChange: function(value) { | ||
236 | var newDate = new Date() | ||
237 | newDate.setTime(value * 1000) | ||
238 | console.log(newDate.toLocaleString()) | ||
239 | return newDate.toLocaleString() | ||
240 | } | ||
233 | } | 241 | } |
234 | } | 242 | } |
235 | </script> | 243 | </script> |
236 | 244 | ||
237 | <style lang="scss" scoped> | 245 | <style lang="scss" scoped> |
238 | .content { | 246 | .content { |
239 | min-height: 100vh; | 247 | min-height: 100vh; |
240 | display: flex; | 248 | display: flex; |
241 | flex-direction: column; | 249 | flex-direction: column; |
242 | justify-content: flex-start; | 250 | justify-content: flex-start; |
243 | align-items: center; | 251 | align-items: center; |
244 | background-color: #f2f2f2; | 252 | background-color: #f2f2f2; |
245 | } | 253 | } |
246 | 254 | ||
247 | .order { | 255 | .order { |
248 | margin-bottom: 112rpx; | 256 | margin-bottom: 112rpx; |
249 | background: #f2f2f2; | 257 | background: #f2f2f2; |
250 | margin-top: 140rpx; | 258 | margin-top: 140rpx; |
251 | width: 670rpx; | 259 | width: 670rpx; |
252 | } | 260 | } |
253 | 261 | ||
254 | .order-time { | 262 | .order-time { |
255 | width: 100%; | 263 | width: 100%; |
256 | height: 140rpx; | 264 | height: 140rpx; |
257 | background-color: #fff; | 265 | background-color: #fff; |
258 | display: flex; | 266 | display: flex; |
259 | justify-content: center; | 267 | justify-content: center; |
260 | align-items: center; | 268 | align-items: center; |
261 | position: fixed; | 269 | position: fixed; |
262 | top: 0; | 270 | top: 0; |
263 | left: 0; | 271 | left: 0; |
264 | text { | 272 | text { |
265 | // font-family: PingFangSC-Regular; | 273 | // font-family: PingFangSC-Regular; |
266 | // margin-top: 48rpx; | 274 | // margin-top: 48rpx; |
267 | font-size: 14px; | 275 | font-size: 14px; |
268 | color: #333333; | 276 | color: #333333; |
269 | letter-spacing: -0.26px; | 277 | letter-spacing: -0.26px; |
270 | } | 278 | } |
271 | .p2 { | 279 | .p2 { |
272 | // font-family: DINAlternate-Bold; | 280 | // font-family: DINAlternate-Bold; |
273 | margin: 42rpx 20rpx 0 20rpx; | 281 | margin: 42rpx 20rpx 0 20rpx; |
274 | font-size: 18px; | 282 | font-size: 18px; |
275 | color: #ec5d3b; | 283 | color: #ec5d3b; |
276 | letter-spacing: -0.34px; | 284 | letter-spacing: -0.34px; |
277 | } | 285 | } |
278 | } | 286 | } |
279 | .headerBanner { | 287 | .headerBanner { |
280 | width: 100%; | 288 | width: 100%; |
281 | height: 140rpx; | 289 | height: 140rpx; |
282 | background: #4a90e2; | 290 | background: #4a90e2; |
283 | padding: 26rpx 60rpx 24rpx 60rpx; | 291 | padding: 26rpx 60rpx 24rpx 60rpx; |
284 | box-sizing: border-box; | 292 | box-sizing: border-box; |
285 | color: #ffffff; | 293 | color: #ffffff; |
286 | display: flex; | 294 | display: flex; |
287 | justify-content: space-between; | 295 | justify-content: space-between; |
288 | align-items: center; | 296 | align-items: center; |
289 | position: fixed; | 297 | position: fixed; |
290 | top: 0; | 298 | top: 0; |
291 | left: 0; | 299 | left: 0; |
292 | .bannerLeft { | 300 | .bannerLeft { |
293 | font-size: 36rpx; | 301 | font-size: 36rpx; |
294 | display: flex; | 302 | display: flex; |
295 | flex-direction: column; | 303 | flex-direction: column; |
296 | justify-content: center; | 304 | justify-content: center; |
297 | align-items: center; | 305 | align-items: center; |
298 | .T2 { | 306 | .T2 { |
299 | font-size: 24rpx; | 307 | font-size: 24rpx; |
300 | } | 308 | } |
301 | } | 309 | } |
302 | image { | 310 | image { |
303 | height: 56rpx; | 311 | height: 56rpx; |
304 | width: 72rpx; | 312 | width: 72rpx; |
305 | } | 313 | } |
306 | } | 314 | } |
307 | 315 | ||
308 | .order-user { | 316 | .order-user { |
309 | height: 228rpx; | 317 | height: 228rpx; |
310 | background: #ffffff; | 318 | background: #ffffff; |
311 | border-radius: 14rpx; | 319 | border-radius: 14rpx; |
312 | margin: 0 auto; | 320 | margin: 0 auto; |
313 | margin-top: 20rpx; | 321 | margin-top: 20rpx; |
314 | margin-bottom: 20rpx; | 322 | margin-bottom: 20rpx; |
315 | .order-user-head { | 323 | .order-user-head { |
316 | display: flex; | 324 | display: flex; |
317 | height: 108rpx; | 325 | height: 108rpx; |
318 | align-items: center; | 326 | align-items: center; |
319 | margin-left: 126rpx; | 327 | margin-left: 126rpx; |
320 | .p1 { | 328 | .p1 { |
321 | // font-family: PingFangSC-Regular; | 329 | // font-family: PingFangSC-Regular; |
322 | font-size: 14px; | 330 | font-size: 14px; |
323 | color: #333333; | 331 | color: #333333; |
324 | letter-spacing: -0.26px; | 332 | letter-spacing: -0.26px; |
325 | margin-right: 20rpx; | 333 | margin-right: 20rpx; |
326 | } | 334 | } |
327 | .p2 { | 335 | .p2 { |
328 | // font-family: PingFangSC-Regular; | 336 | // font-family: PingFangSC-Regular; |
329 | font-size: 14px; | 337 | font-size: 14px; |
330 | color: #999999; | 338 | color: #999999; |
331 | letter-spacing: -0.26px; | 339 | letter-spacing: -0.26px; |
332 | } | 340 | } |
333 | } | 341 | } |
334 | .order-user-body { | 342 | .order-user-body { |
335 | display: flex; | 343 | display: flex; |
336 | width: 100%; | 344 | width: 100%; |
337 | image { | 345 | image { |
338 | width: 24px; | 346 | width: 24px; |
339 | height: 26px; | 347 | height: 26px; |
340 | margin: 12rpx 32rpx 0 40rpx; | 348 | margin: 12rpx 32rpx 0 40rpx; |
341 | } | 349 | } |
342 | .p3 { | 350 | .p3 { |
343 | // font-family: PingFangSC-Semibold; | 351 | // font-family: PingFangSC-Semibold; |
344 | font-size: 14px; | 352 | font-size: 14px; |
345 | color: #333333; | 353 | color: #333333; |
346 | letter-spacing: -0.26px; | 354 | letter-spacing: -0.26px; |
347 | } | 355 | } |
348 | } | 356 | } |
349 | } | 357 | } |
350 | 358 | ||
351 | .order-info { | 359 | .order-info { |
352 | background-color: #fff; | 360 | background-color: #fff; |
353 | box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06); | 361 | box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06); |
354 | border-radius: 16rpx; | 362 | border-radius: 16rpx; |
355 | margin: 0 auto; | 363 | margin: 0 auto; |
356 | view { | 364 | view { |
357 | margin-left: 40rpx; | 365 | margin-left: 40rpx; |
358 | } | 366 | } |
359 | text { | 367 | text { |
360 | font-size: 14px; | 368 | font-size: 14px; |
361 | } | 369 | } |
362 | .order-info-head { | 370 | .order-info-head { |
363 | display: flex; | 371 | display: flex; |
364 | padding-top: 40rpx; | 372 | padding-top: 40rpx; |
365 | image { | 373 | image { |
366 | height: 188rpx; | 374 | height: 188rpx; |
367 | width: 188rpx; | 375 | width: 188rpx; |
368 | } | 376 | } |
369 | .order-info-head-r { | 377 | .order-info-head-r { |
370 | margin: 0; | 378 | margin: 0; |
371 | width: 368rpx; | 379 | width: 368rpx; |
372 | margin-left: 24rpx; | 380 | margin-left: 24rpx; |
373 | // margin-top: 40rpx; | 381 | // margin-top: 40rpx; |
374 | text { | 382 | text { |
375 | display: block; | 383 | display: block; |
376 | } | 384 | } |
377 | // .arrow{ | 385 | // .arrow{ |
378 | // width: 0; | 386 | // width: 0; |
379 | // height: 0; | 387 | // height: 0; |
380 | // border-left: 5px transparent; | 388 | // border-left: 5px transparent; |
381 | // border-right: 5px transparent; | 389 | // border-right: 5px transparent; |
382 | // border-top: 5px #979797; | 390 | // border-top: 5px #979797; |
383 | // border-bottom: 0 transparent; | 391 | // border-bottom: 0 transparent; |
384 | // border-style: solid; | 392 | // border-style: solid; |
385 | // position: relative; | 393 | // position: relative; |
386 | // // transform: scaleY(-1); | 394 | // // transform: scaleY(-1); |
387 | // } | 395 | // } |
388 | // .arrow::after{ | 396 | // .arrow::after{ |
389 | // content: ''; | 397 | // content: ''; |
390 | // position: absolute; | 398 | // position: absolute; |
391 | // top: -6.5px; | 399 | // top: -6.5px; |
392 | // left: -5px; | 400 | // left: -5px; |
393 | // border-left: 5px transparent; | 401 | // border-left: 5px transparent; |
394 | // border-right: 5px transparent; | 402 | // border-right: 5px transparent; |
395 | // border-top: 5px #FFFFFF; | 403 | // border-top: 5px #FFFFFF; |
396 | // border-bottom: 0 transparent; | 404 | // border-bottom: 0 transparent; |
397 | // border-style: solid; | 405 | // border-style: solid; |
398 | // } | 406 | // } |
399 | .p1 { | 407 | .p1 { |
400 | min-height: 40px; | 408 | min-height: 40px; |
401 | // font-family: PingFangSC-Regular; | 409 | // font-family: PingFangSC-Regular; |
402 | font-size: 14px; | 410 | font-size: 14px; |
403 | color: #333333; | 411 | color: #333333; |
404 | letter-spacing: -0.26px; | 412 | letter-spacing: -0.26px; |
405 | line-height: 18px; | 413 | line-height: 18px; |
406 | // line-height: 20px; | 414 | // line-height: 20px; |
407 | } | 415 | } |
408 | .p2 { | 416 | .p2 { |
409 | height: 34px; | 417 | height: 34px; |
410 | padding: 1px 0 3px 0; | 418 | padding: 1px 0 3px 0; |
411 | // font-family: PingFangSC-Regular; | 419 | // font-family: PingFangSC-Regular; |
412 | font-size: 12px; | 420 | font-size: 12px; |
413 | color: #999999; | 421 | color: #999999; |
414 | letter-spacing: -0.23px; | 422 | letter-spacing: -0.23px; |
415 | } | 423 | } |
416 | .infoText-bottom { | 424 | .infoText-bottom { |
417 | display: flex; | 425 | display: flex; |
418 | flex-direction: row; | 426 | flex-direction: row; |
419 | justify-content: flex-start; | 427 | justify-content: flex-start; |
420 | align-items: center; | 428 | align-items: center; |
421 | width: 100%; | 429 | width: 100%; |
422 | margin-left: 0; | 430 | margin-left: 0; |
423 | .markPrice { | 431 | .markPrice { |
424 | font-size: 14px; | 432 | font-size: 14px; |
425 | color: #ff6b4a; | 433 | color: #ff6b4a; |
426 | margin-right: 20rpx; | 434 | margin-right: 20rpx; |
427 | margin-left: 0rpx; | 435 | margin-left: 0rpx; |
428 | } | 436 | } |
429 | .buy-num { | 437 | .buy-num { |
430 | font-size: 12px; | 438 | font-size: 12px; |
431 | color: #999999; | 439 | color: #999999; |
432 | } | 440 | } |
433 | } | 441 | } |
434 | } | 442 | } |
435 | } | 443 | } |
436 | // .order-info-goodsnum { | 444 | // .order-info-goodsnum { |
437 | // display: flex; | 445 | // display: flex; |
438 | // align-items: center; | 446 | // align-items: center; |
439 | // justify-content: flex-end; | 447 | // justify-content: flex-end; |
440 | // text { | 448 | // text { |
441 | // margin-right: 44rpx; | 449 | // margin-right: 44rpx; |
442 | // // ont-family: PingFangSC-Regular; | 450 | // // ont-family: PingFangSC-Regular; |
443 | // font-size: 12px; | 451 | // font-size: 12px; |
444 | // color: #999999; | 452 | // color: #999999; |
445 | // letter-spacing: -0.23px; | 453 | // letter-spacing: -0.23px; |
446 | // } | 454 | // } |
447 | // } | 455 | // } |
448 | .order-info-freight { | 456 | .order-info-freight { |
449 | display: block; | 457 | display: block; |
450 | margin-left: 40rpx; | 458 | margin-left: 40rpx; |
451 | margin-top: 22rpx; | 459 | margin-top: 22rpx; |
452 | .p1 { | 460 | .p1 { |
453 | // font-family: PingFangSC-Regular; | 461 | // font-family: PingFangSC-Regular; |
454 | font-size: 14px; | 462 | font-size: 14px; |
455 | color: #333333; | 463 | color: #333333; |
456 | letter-spacing: -0.26px; | 464 | letter-spacing: -0.26px; |
457 | line-height: 18px; | 465 | line-height: 18px; |
458 | margin-right: 24px; | 466 | margin-right: 24px; |
459 | } | 467 | } |
460 | .p2 { | 468 | .p2 { |
461 | // font-family: PingFangSC-Regular; | 469 | // font-family: PingFangSC-Regular; |
462 | font-size: 14px; | 470 | font-size: 14px; |
463 | color: #ff6b4a; | 471 | color: #ff6b4a; |
464 | letter-spacing: -0.26px; | 472 | letter-spacing: -0.26px; |
465 | } | 473 | } |
466 | } | 474 | } |
467 | .order-info-discount { | 475 | .order-info-discount { |
468 | display: block; | 476 | display: block; |
469 | margin-left: 40rpx; | 477 | margin-left: 40rpx; |
470 | margin-top: 24rpx; | 478 | margin-top: 24rpx; |
471 | .p1 { | 479 | .p1 { |
472 | // font-family: PingFangSC-Regular; | 480 | // font-family: PingFangSC-Regular; |
473 | font-size: 14px; | 481 | font-size: 14px; |
474 | color: #333333; | 482 | color: #333333; |
475 | letter-spacing: -0.26px; | 483 | letter-spacing: -0.26px; |
476 | line-height: 18px; | 484 | line-height: 18px; |
477 | margin-right: 24px; | 485 | margin-right: 24px; |
478 | } | 486 | } |
479 | .p2 { | 487 | .p2 { |
480 | // font-family: PingFangSC-Regular; | 488 | // font-family: PingFangSC-Regular; |
481 | font-size: 14px; | 489 | font-size: 14px; |
482 | color: #ff6b4a; | 490 | color: #ff6b4a; |
483 | letter-spacing: -0.26px; | 491 | letter-spacing: -0.26px; |
484 | } | 492 | } |
485 | } | 493 | } |
486 | .order-info-price { | 494 | .order-info-price { |
487 | display: block; | 495 | display: block; |
488 | margin-left: 40rpx; | 496 | margin-left: 40rpx; |
489 | margin-top: 24rpx; | 497 | margin-top: 24rpx; |
490 | .p1 { | 498 | .p1 { |
491 | // font-family: PingFangSC-Semibold; | 499 | // font-family: PingFangSC-Semibold; |
492 | font-size: 14px; | 500 | font-size: 14px; |
493 | color: #333333; | 501 | color: #333333; |
494 | letter-spacing: -0.26px; | 502 | letter-spacing: -0.26px; |
495 | line-height: 18px; | 503 | line-height: 18px; |
496 | margin-right: 24px; | 504 | margin-right: 24px; |
497 | } | 505 | } |
498 | .p2 { | 506 | .p2 { |
499 | // font-family: PingFangSC-Semibold; | 507 | // font-family: PingFangSC-Semibold; |
500 | font-size: 14px; | 508 | font-size: 14px; |
501 | color: #ff6b4a; | 509 | color: #ff6b4a; |
502 | letter-spacing: -0.26px; | 510 | letter-spacing: -0.26px; |
503 | } | 511 | } |
504 | } | 512 | } |
505 | .order-info-num { | 513 | .order-info-num { |
506 | display: block; | 514 | display: block; |
507 | margin-left: 40rpx; | 515 | margin-left: 40rpx; |
508 | margin-top: 44rpx; | 516 | margin-top: 44rpx; |
509 | text { | 517 | text { |
510 | // font-family: PingFangSC-Regular; | 518 | // font-family: PingFangSC-Regular; |
511 | font-size: 12px; | 519 | font-size: 12px; |
512 | color: #999999; | 520 | color: #999999; |
513 | letter-spacing: -0.23px; | 521 | letter-spacing: -0.23px; |
514 | } | 522 | } |
515 | } | 523 | } |
516 | .order-info-time { | 524 | .order-info-time { |
517 | display: block; | 525 | display: block; |
518 | margin: 8rpx 0 48rpx 40rpx; | 526 | margin: 8rpx 0 48rpx 40rpx; |
519 | text { | 527 | text { |
520 | // font-family: PingFangSC-Regular; | 528 | // font-family: PingFangSC-Regular; |
521 | font-size: 12px; | 529 | font-size: 12px; |
522 | color: #999999; | 530 | color: #999999; |
523 | letter-spacing: -0.23px; | 531 | letter-spacing: -0.23px; |
524 | } | 532 | } |
525 | } | 533 | } |
526 | .order-info-hr { | 534 | .order-info-hr { |
527 | width: 520rpx; | 535 | width: 520rpx; |
528 | height: 1px; | 536 | height: 1px; |
529 | background-color: #e9e9e9; | 537 | background-color: #e9e9e9; |
530 | margin-bottom: 20rpx; | 538 | margin-bottom: 20rpx; |
531 | } | 539 | } |
532 | .order-info-contact { | 540 | .order-info-contact { |
533 | display: flex; | 541 | display: flex; |
534 | padding-bottom: 28rpx; | 542 | padding-bottom: 28rpx; |
535 | image { | 543 | image { |
536 | width: 19px; | 544 | width: 19px; |
537 | height: 16px; | 545 | height: 16px; |
538 | } | 546 | } |
539 | text { | 547 | text { |
540 | // font-family: PingFangSC-Regular; | 548 | // font-family: PingFangSC-Regular; |
541 | margin-left: 20rpx; | 549 | margin-left: 20rpx; |
542 | font-size: 14px; | 550 | font-size: 14px; |
543 | color: #333333; | 551 | color: #333333; |
544 | letter-spacing: -0.26px; | 552 | letter-spacing: -0.26px; |
545 | line-height: 18px; | 553 | line-height: 18px; |
546 | } | 554 | } |
547 | } | 555 | } |
548 | } | 556 | } |
549 | 557 | ||
550 | .order-confim { | 558 | .order-confim { |
551 | display: flex; | 559 | display: flex; |
552 | align-items: center; | 560 | align-items: center; |
553 | justify-content: flex-end; | 561 | justify-content: flex-end; |
554 | // z-index: 999; | 562 | // z-index: 999; |
555 | width: 100%; | 563 | width: 100%; |
556 | height: 112rpx; | 564 | height: 112rpx; |
557 | position: fixed; | 565 | position: fixed; |
558 | bottom: 0; | 566 | bottom: 0; |
559 | background: #ffffff; | 567 | background: #ffffff; |
560 | button { | 568 | button { |
561 | width: 204rpx; | 569 | width: 204rpx; |
562 | height: 80rpx; | 570 | height: 80rpx; |
563 | border: 1px solid #ff6b4a; | 571 | border: 1px solid #ff6b4a; |
564 | border-radius: 40rpx; | 572 | border-radius: 40rpx; |
565 | font-size: 32rpx; | 573 | font-size: 32rpx; |
566 | letter-spacing: -0.3px; | 574 | letter-spacing: -0.3px; |
567 | margin-right: 0; | 575 | margin-right: 0; |
568 | } | 576 | } |
569 | .b1 { | 577 | .b1 { |
570 | // font-family: PingFangSC-Regular; | 578 | // font-family: PingFangSC-Regular; |
571 | color: #ff6b4a; | 579 | color: #ff6b4a; |
572 | background-color: #ffffff; | 580 | background-color: #ffffff; |
573 | } | 581 | } |
574 | .b2 { | 582 | .b2 { |
575 | // font-family: PingFangSC-Regular; | 583 | // font-family: PingFangSC-Regular; |
576 | background-color: #ff6b4a; | 584 | background-color: #ff6b4a; |
577 | color: #ffffff; | 585 | color: #ffffff; |
578 | margin: 0 26rpx 0 20rpx; | 586 | margin: 0 26rpx 0 20rpx; |
579 | } | 587 | } |
580 | } | 588 | } |
581 | </style> | 589 | </style> |