3f535f30
 杨鑫
'初始'
|
1
2
3
4
5
6
7
8
9
|
<template>
<el-dialog :close-on-click-modal="false" title="详情" :visible.sync="visible" custom-class="bian_css" width="65%">
<div v-loading="loading" class="order_details">
<!-- <el-button plain @click="close">关闭</el-button> -->
<!-- 关闭 -->
<!-- <el-button icon="el-icon-close" class="close" @click="close" />-->
<div class="cotent">
<div class="left_part">
<div class="order_info">
|
|
1991126c
杨鑫
'最新'
|
10
|
<TitleWithCircle title="售后信息" style="margin-bottom: 15px;"/>
|
|
3f535f30
杨鑫
'初始'
|
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
|
<ul>
<li>
<p>
<span>售后单号:</span>
<span>{{ order.afterFormid }}</span>
</p>
<p>
<span>订单ID:</span>
<span>{{ order.orderId }}</span>
</p>
</li>
<li>
<p>
<span>订单状态:</span>
<span v-if="order.state === 1">待付款</span>
<span v-if="order.state === 2">待发货</span>
<span v-if="order.state === 3">待收货</span>
<span v-if="order.state === 4">已完成</span>
<span v-if="order.state === 5">已取消</span>
</p>
<p>
<span>售后类型:</span>
<span v-if="order.afterType === 1">仅退款</span>
<span v-if="order.afterType === 2">退货退款</span>
</p>
</li>
<li>
<p>
<span>退款金额:</span>
<span>{{ order.price }}</span>
</p>
<p>
<span>买家账户:</span>
<span>{{ order.customerName }}</span>
</p>
</li>
<li>
<p>
<span>申请时间:</span>
<span>{{ order.createTime }}</span>
</p>
<p>
<span>最近处理时间:</span>
<span>{{ order.updateTime }}</span>
</p>
</li>
<li>
<span>备注:</span>
<span>{{ order.remark }}</span>
</li>
</ul>
</div>
<div class="goods_info">
|
|
1991126c
杨鑫
'最新'
|
64
|
<TitleWithCircle title="商品信息" style="margin-bottom: 15px;"/>
|
|
3f535f30
杨鑫
'初始'
|
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
|
<div
v-for="(item, index) in order.products"
:key="index"
class="goods_list"
>
<!-- <div class="good_price">
<ul>
<li>
<p>商品总价: ¥{{ item.total }}</p>
<p>支付金额: ¥{{ order.price }}</p>
</li>
<li>
<p>物流费用: ￥{{ order.logisticsPrice }}</p>
</li>
</ul>
</div> -->
<div class="good_details">
<ul>
<li>
|
|
65478d1d
杨鑫
'最新'
|
84
|
<img :src="$baseURL+item.image">
|
|
3f535f30
杨鑫
'初始'
|
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
<div class="details">
<p>{{ item.productName }}</p>
<div class="skuDetails">
<p
v-for="(detailsItem, detailsindex) of item.skuDetails"
:key="detailsindex"
>
{{ detailsItem.skuValue }}
</p>
</div>
<p>SKU: {{ item.skuId }}</p>
</div>
</li>
<li class="cen">
<p>¥{{ `${item.productPrice} * ${item.number}` }}</p>
</li>
<li>
<p v-if="order.afterType === 1">仅退款</p>
<p v-if="order.afterType === 2">退货退款</p>
</li>
<li>
<p class="fontWeight">¥{{ item.total }}</p>
</li>
</ul>
<div class="totalRefund">
运费金额：
<span class="fontWeight">¥{{ order.logisticsPrice }}</span>
</div>
<div class="totalRefund">
退款总金额：
<span class="fontWeight">¥{{ order.price }}</span>
</div>
</div>
</div>
</div>
<div class="logistics_info">
|
|
1991126c
杨鑫
'最新'
|
121
|
<TitleWithCircle title="售后记录" style="margin-bottom: 15px;"/>
|
|
3f535f30
杨鑫
'初始'
|
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
|
<div class="after_sales_record">
<div
v-for="(item, index) in order.afterHistory"
:key="index"
class="record_list"
>
<div class="record_list_title">
<p>{{ item.title }}</p>
<div>
<p>买家名称：{{ item.name }}</p>
<p>申请时间：{{ item.time }}</p>
</div>
<p>留言：{{ item.reason }}</p>
</div>
</div>
<div class="record_list_content">
<!-- <p>-->
<!-- <!– <span>{{ item.type }}:</span> –>-->
<!-- <span>{{ item.actionNote }}</span>-->
<!-- </p>-->
<div v-if="order.images && order.images.length != 0" class="proofBox">
<h3>买家举证图片:</h3>
<div class="imgBox">
|
|
87d6eb96
杨鑫
'修改BUG'
|
145
|
<el-image v-for="(item, index) of order.images" :key="index" :src="$baseURL+item" :preview-src-list="imglist(order.images)" alt />
|
|
3f535f30
杨鑫
'初始'
|
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
|
</div>
</div>
</div>
</div>
<div v-if="order.afterType !== 1" class="logistics_content">
<p class="logistics_title">
<span>物流公司: {{ order.express }}</span>
<span>运单号: {{ order.deliverFormid }}</span>
</p>
</div>
</div>
</div>
<div class="right_part">
<div v-if="showOne || showTwo" class="preO">
<div class="topTips">
<div class="leftImg">
<img src="../../../assets/images/tips.png" alt>
</div>
<div class="rTitle">
<b>等待商家处理</b>
<p>买家已发起售后申请，请尽快处理</p>
</div>
</div>
<div class="buyerR">买家说明:{{ order.explain }}</div>
</div>
<div v-if="showThree" class="preO">
<div class="topTips">
<div class="leftImg">
<img src="../../../assets/images/tips.png" alt>
</div>
<div class="rTitle">
<b>买家已退回</b>
<p>请注意检查货物是否达到退款标准，如未达到，请联系买家协商</p>
</div>
</div>
<div class="buyerR">物流公司:{{ order.express }}</div>
<div class="buyerR">物流单号:{{ order.deliverFormid }}</div>
</div>
<div class="btnList">
<div v-if="showOne" class="lists">
<div class="btns" @click="agree(5)">同意退款申请</div>
<div class="btns" @click="agree(2)">拒绝退款申请</div>
</div>
<div v-if="showTwo" class="lists">
<div class="btns" @click="agree(1)">同意申请</div>
<div class="btns" @click="agree(2)">拒绝申请</div>
</div>
<div v-if="showThree" class="lists">
<div class="btns" @click="agree(3)">确认收货且退款</div>
<div class="btns" @click="agree(4)">货物有损拒绝退款</div>
</div>
</div>
</div>
</div>
<!-- *********************************弹框开始********************************* -->
<!-- 申请弹框 -->
<el-dialog
:visible.sync="isVisible"
:title="title"
width="30%"
top="32vh"
center
:append-to-body="true"
:close-on-click-modal="false"
>
<div v-if="title === '同意申请'" class="agreeTitle">
同意申请后，系统将自动发送你的退款地址给买家
</div>
<div v-if="title === '拒绝退款申请'" class="agreeTitle2">
<div class="tiTop">
请与买家协商好后再操作，拒绝后买家仍可以再次申请
</div>
<el-input
v-model="textarea"
type="textarea"
:autosize="{ minRows: 2, maxRows: 4 }"
placeholder="请输入留言"
/>
</div>
<div v-if="title === '确认收货且退款'" class="agreeTitle2">
<div class="tiTop">已确认商品无误，退款给买家</div>
</div>
<div v-if="title === '货物有损拒绝退款'" class="agreeTitle2">
<div class="tiTop">我已确认货物有损，不予退款</div>
<el-input
v-model="textarea"
type="textarea"
:autosize="{ minRows: 2, maxRows: 4 }"
placeholder="请输入留言"
/>
</div>
<div v-if="title === '同意退款申请'" class="agreeTitle2">
<div class="tiTop">同意退款申请后，退款金额将返还至买家的支付渠道</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button
v-if="title === '同意申请'"
|
|
be060284
杨鑫
'最新'
|
243
|
style="background-color: #3F9B6A;color: #fff"
|
|
3f535f30
杨鑫
'初始'
|
244
245
246
247
|
@click="agreeEn(1)"
>同意申请</el-button>
<el-button
v-if="title === '拒绝退款申请'"
|
|
be060284
杨鑫
'最新'
|
248
|
style="background-color: #3F9B6A;color: #fff"
|
|
3f535f30
杨鑫
'初始'
|
249
250
251
252
|
@click="agreeEn(2)"
>拒绝申请</el-button>
<el-button
v-if="title === '确认收货且退款'"
|
|
be060284
杨鑫
'最新'
|
253
|
style="background-color: #3F9B6A;color: #fff"
|
|
3f535f30
杨鑫
'初始'
|
254
255
256
257
|
@click="agreeEn(3)"
>确认退款</el-button>
<el-button
v-if="title === '货物有损拒绝退款'"
|
|
be060284
杨鑫
'最新'
|
258
|
style="background-color: #3F9B6A;color: #fff"
|
|
3f535f30
杨鑫
'初始'
|
259
260
261
262
|
@click="agreeEn(4)"
>确 定</el-button>
<el-button
v-if="title === '同意退款申请'"
|
|
be060284
杨鑫
'最新'
|
263
|
style="background-color: #3F9B6A;color: #fff"
|
|
3f535f30
杨鑫
'初始'
|
264
265
|
@click="agreeEn(5)"
>同意退款</el-button>
|
|
be060284
杨鑫
'最新'
|
266
267
|
<el-button @click="isVisible = false" class="buttonHover"
style="color: #606266;border: 1px solid #dddfe5;background-color: #fff;">取 消</el-button>
|
|
3f535f30
杨鑫
'初始'
|
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
|
</span>
</el-dialog>
<!-- 发货 -->
<el-dialog
:visible.sync="isVisibles"
title="发货"
:close-on-click-modal="false"
>
<el-form
ref="sendGoodsForm"
:model="form"
:rules="rules"
label-width="80px"
>
<el-form-item label="快递公司" prop="express">
<el-select v-model="form.express" filterable>
<el-option
v-for="(item, index) in companyList"
:key="index"
:label="item.dictName"
:value="item.dictId"
/>
</el-select>
</el-form-item>
<el-form-item label="快递单号" prop="deliverFormid">
<el-input v-model="form.deliverFormid" />
</el-form-item>
<!--
<el-form-item label="快递公司编号" prop="shipperCode" v-if="false">
<el-input v-model="form.shipperCode" />
</el-form-item>-->
</el-form>
<span slot="footer" class="dialog-footer">
<el-button style="background-color: #3F9B6A;color: #fff" @click="confirm">确 定</el-button>
<el-button class="buttonHover"
style="color: #606266;border: 1px solid #dddfe5;background-color: #fff;" @click="cancel">取 消</el-button>
</span>
</el-dialog>
</div>
</el-dialog>
</template>
<script>
import {
aftersaleGetById,
orderGetSelect,
orderDilevery,
refundSuccess,
refundRefuse,
success,
refuse,
confirmAndRefund,
damaging
} from '@/api/order'
|
|
be060284
杨鑫
'最新'
|
323
324
325
|
import {
refundToShop,
} from '@/api/apih5'
|
|
1991126c
杨鑫
'最新'
|
326
|
import TitleWithCircle from '@/components/top/index';
|
|
3f535f30
杨鑫
'初始'
|
327
328
|
export default {
name: 'AfterDetails',
|
|
1991126c
杨鑫
'最新'
|
329
330
331
|
components: {
TitleWithCircle
},
|
|
3f535f30
杨鑫
'初始'
|
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
|
data() {
return {
loading: false,
visible: false,
afterId: 0,
order: {},
isVisible: false,
isVisibles: false,
companyList: [],
title: '同意申请',
textarea: '',
showOne: false,
showTwo: false,
showThree: false,
form: {
express: '',
deliverFormid: '',
orderId: ''
},
rules: {
logisticsName: [
{ required: false, message: '请输入快递公司名称', trigger: 'blur' }
],
deliverFormid: [
{ required: true, message: '请输入快递单号', trigger: 'blur' }
],
express: [
{ required: true, message: '请选择快递公司', trigger: 'blur' }
]
|
|
be060284
杨鑫
'最新'
|
361
|
},
|
|
3f535f30
杨鑫
'初始'
|
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
|
}
},
// computed: {
// afterId() {
// return this.$route.params.afterId
// }
// },
// created() {
// console.log(this.afterId)
// },
mounted() {
this.getCompanyList()
// setTimeout(() => {
// this.btnShow(),
// console.log('mounted')
// }, 1000)
},
methods: {
|
|
87d6eb96
杨鑫
'修改BUG'
|
380
381
382
383
384
385
386
|
imglist(dataList){
const newDataList = dataList.map(item => {
item = this.$baseURL + item;
return item;
})
return newDataList;
},
|
|
3f535f30
杨鑫
'初始'
|
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
|
show(id) {
this.visible = true
this.afterId = id
this.getProductList()
console.log(this.order, 'this.order')
},
async getProductList() {
this.loading = true
try {
const res = await aftersaleGetById({ afterId: this.afterId })
this.order = res.data
this.btnShow()
} finally {
this.loading = false
}
},
async getCompanyList() {
const res = await orderGetSelect()
if (res.code === '') {
this.companyList = res.data
}
},
// 发货
confirm() {
this.$refs.sendGoodsForm.validate((valid) => {
if (valid) {
this.form.orderId = this.order.orderId
orderDilevery(this.form).then((res) => {
if (res.code === '') {
this.$message({
message: '发货成功',
type: 'success'
})
this.isVisibles = false
}
})
}
})
},
cancel() {
this.isVisibles = false
},
close() {
this.visible = false
},
// 申请弹框
agree(index) {
if (index === 1) {
this.title = '同意申请'
this.isVisible = true
} else if (index === 2) {
this.title = '拒绝退款申请'
this.isVisible = true
} else if (index === 3) {
this.title = '确认收货且退款'
this.isVisible = true
} else if (index === 4) {
this.title = '货物有损拒绝退款'
this.isVisible = true
} else if (index === 5) {
this.title = '同意退款申请'
this.isVisible = true
} else if (index === 9) {
this.isVisibles = true
this.form = {
express: '',
deliverFormid: '',
orderId: 1
}
}
},
// 同意申请
async agreeEn(index) {
|
|
be060284
杨鑫
'最新'
|
460
461
|
// console.log(index,this.order,'123123213123')
// return
|
|
3f535f30
杨鑫
'初始'
|
462
463
464
465
466
467
468
469
470
471
472
473
|
if (index === 1) {
this.title = '同意申请'
const res = await success({
orderId: this.order.orderId,
afterId: this.order.afterId
})
if (res.code === '') {
this.$message({
message: '成功',
type: 'success'
})
this.isVisible = false
|
|
be060284
杨鑫
'最新'
|
474
475
|
this.close()
this.$emit('childMessage',false)
|
|
3f535f30
杨鑫
'初始'
|
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
|
}
} else if (index === 2) {
this.title = '拒绝退款申请'
if (this.showOne) {
const res = await refundRefuse({
orderId: this.order.orderId,
afterId: this.order.afterId,
reason: this.textarea
})
if (res.code === '') {
this.$message({
message: '成功',
type: 'success'
})
this.isVisible = false
|
|
be060284
杨鑫
'最新'
|
491
492
|
this.close()
this.$emit('childMessage',false)
|
|
3f535f30
杨鑫
'初始'
|
493
494
495
496
497
498
499
500
501
502
503
504
505
506
|
}
}
if (this.showTwo) {
const res = await refuse({
orderId: this.order.orderId,
afterId: this.order.afterId,
reason: this.textarea
})
if (res.code === '') {
this.$message({
message: '成功',
type: 'success'
})
this.isVisible = false
|
|
be060284
杨鑫
'最新'
|
507
508
|
this.close()
this.$emit('childMessage',false)
|
|
3f535f30
杨鑫
'初始'
|
509
510
511
512
|
}
}
} else if (index === 3) {
this.title = '确认收货且退款'
|
|
52fc03a8
杨鑫
'最新'
|
513
|
|
|
be060284
杨鑫
'最新'
|
514
515
516
517
518
|
const res = await refundToShop ({
parentFormid: this.order.subOrderId,
orderFormid: this.order.subOrderId,
payId: this.order.payId,
refundAmount: this.order.price*100
|
|
3f535f30
杨鑫
'初始'
|
519
|
})
|
|
be060284
杨鑫
'最新'
|
520
|
if (res.code === ''||res.code === '200') {
|
|
3f535f30
杨鑫
'初始'
|
521
522
523
524
525
|
this.$message({
message: '成功',
type: 'success'
})
this.isVisible = false
|
|
be060284
杨鑫
'最新'
|
526
527
|
this.close()
this.$emit('childMessage',false)
|
|
3f535f30
杨鑫
'初始'
|
528
529
530
531
532
533
534
535
536
537
538
539
540
|
}
} else if (index === 4) {
this.title = '货物有损拒绝退款'
const res = await damaging({
orderId: this.order.orderId,
afterId: this.order.afterId
})
if (res.code === '') {
this.$message({
message: '成功',
type: 'success'
})
this.isVisible = false
|
|
be060284
杨鑫
'最新'
|
541
542
|
this.close()
this.$emit('childMessage',false)
|
|
3f535f30
杨鑫
'初始'
|
543
544
|
}
} else if (index === 5) {
|
|
52fc03a8
杨鑫
'最新'
|
545
|
|
|
be060284
杨鑫
'最新'
|
546
547
548
549
550
|
const res = await refundToShop ({
parentFormid: this.order.subOrderId,
orderFormid: this.order.subOrderId,
payId: this.order.payId,
refundAmount: this.order.price*100
|
|
3f535f30
杨鑫
'初始'
|
551
|
})
|
|
be060284
杨鑫
'最新'
|
552
|
if (res.code === ''||res.code === '200') {
|
|
3f535f30
杨鑫
'初始'
|
553
554
555
556
557
|
this.$message({
message: '成功',
type: 'success'
})
this.isVisible = false
|
|
be060284
杨鑫
'最新'
|
558
559
|
this.close()
this.$emit('childMessage',false)
|
|
3f535f30
杨鑫
'初始'
|
560
|
}
|
|
be060284
杨鑫
'最新'
|
561
|
|
|
3f535f30
杨鑫
'初始'
|
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
|
}
},
// 判断按钮展示
btnShow() {
console.log(this.order, 'this.order')
this.showOne = false
this.showTwo = false
this.showThree = false
if (
this.order.afterType === 1 &&
(this.order.afterState === 1 || this.order.afterState === 5)
) {
this.showOne = true
}
if (
this.order.afterType === 2 &&
(this.order.afterState === 1 || this.order.afterState === 5)
) {
this.showTwo = true
}
if (this.order.afterType === 2 && this.order.afterState === 3) {
this.showThree = true
}
}
}
}
</script>
<style lang="scss" scoped>
@import url("../../../styles/elDialog.scss");
ul {
list-style: none;
margin: 0;
padding: 0;
}
.order_details {
.close {
position: absolute;
right: 20px;
&:hover {
cursor: pointer;
}
}
.cotent {
overflow: hidden;
font-size: 14px;
margin: 20px;
.goods_info,
.order_info,
.logistics_info,
.pay_order_info,
.take_goods_info {
background: #fff;
margin-bottom: 10px;
padding: 10px 20px;
}
h2 {
margin: 0;
font-weight: 400;
height: 40px;
line-height: 40px;
font-size: 18px;
text-align: -10px;
}
.left_part {
float: left;
width: calc(70% - 10px);
margin-right: 10px;
.order_info {
box-sizing: border-box;
ul {
margin: 10px 20px;
overflow: hidden;
li {
overflow: hidden;
line-height: 30px;
p {
float: left;
font-size: 14px;
width: 50%;
span {
&:nth-child(2) {
margin-left: 10px;
}
}
}
}
}
}
.goods_info {
.goods_list {
padding: 15px;
.good_price {
ul {
li {
&:nth-child(1) {
p {
width: 50%;
float: left;
}
}
p {
line-height: 30px;
}
}
}
border-bottom: 1px gray solid;
}
.good_details {
overflow: hidden;
ul {
display: flex;
padding:0 10px 20px 10px;
border-bottom: 1px solid #ccc;
li {
flex: 5;
display: flex;
justify-content: space-around;
align-items: center;
.details {
margin: 0 30px;
width: 150px;
line-height: 20px;
.skuDetails {
display: flex;
margin-right: 10px;
}
}
img {
width: 50px;
height: 50px;
}
&:nth-child(2) {
display: block;
}
}
.cen{
margin-top: 5%;
}
}
.totalRefund{
display: flex;
justify-content: right;
margin: 20px 40px 0 0;
}
.fontWeight{
font-weight: 700;
}
}
}
}
.logistics_info {
.send_good {
display: block;
margin: 20px auto !important;
&:hover {
cursor: pointer;
}
}
.logistics_content {
padding: 0 20px;
.logistics_title {
span {
display: inline-block;
width: 45%;
}
}
.logistics_item {
span {
display: inline-block;
width: 30%;
}
}
}
}
}
.right_part {
background: #fff;
float: left;
width: 30%;
height: 600px;
overflow: hidden;
padding: 50px;
font-size: 15px;
.preO {
.topTips {
display: flex;
justify-content: center;
align-items: center;
.leftImg {
img {
width: 50px;
height: 50px;
}
}
}
.buyerR {
text-align: left;
margin-left: 53px;
}
}
}
}
.record_list_content {
img {
width: 100px;
height: 100px;
}
.proofBox {
margin-top: 20px;
.imgBox {
padding-left: 20px;
.el-image {
margin-right: 15px;
width: 100px;
height: 100px;
}
}
h3 {
margin-bottom: 20px;
}
}
}
}
.agreeTitle2 {
text-align: center;
font-size: 20px;
}
.btnList {
display: flex;
justify-content: center;
margin-top: 30px;
.lists {
.btns {
width: 200px;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background: #3a68f2;
margin-bottom: 20px;
border-radius: 5px;
cursor: pointer;
}
}
}
.after_sales_record {
.record_list {
padding: 0 20px;
border-bottom: 1px solid gray;
overflow: hidden;
p{
line-height:30px
}
.record_list_title{
padding: 10px 0;
div{
overflow: hidden;
p{
float:left ;
width: 50%;
}
}
}
.detail_title {
font-size: 24px;
color: #333333;
position: relative;
margin: 50px 20px 20px;
&:before {
content: "";
display: block;
position: absolute;
top: 5px;
left: -20px;
width: 4px;
height: 24px;
background-color: #3a68f2;
}
}
}
}
</style>
|
