Blame view

merchant-web-master/src/views/comprehensive/OrderRhq/afterDetails.vue 23.3 KB
3f535f30   杨鑫   '初始'
1
  <template>
29cad55a   杨鑫   '验收'
2
3
4
5
6
7
8
9
    <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;"/>
29cad55a   杨鑫   '验收'
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;"/>
29cad55a   杨鑫   '验收'
65
66
67
68
69
70
              <div
                v-for="(item, index) in order.products"
                :key="index"
                class="goods_list"
              >
                <!-- <div class="good_price">
3f535f30   杨鑫   '初始'
71
72
                <ul>
                  <li>
29cad55a   杨鑫   '验收'
73
                    <p>商品总价: ¥{{ item.total }}</p>
3f535f30   杨鑫   '初始'
74
75
76
77
78
79
                    <p>支付金额: ¥{{ order.price }}</p>
                  </li>
                  <li>
                    <p>物流费用: ¥{{ order.logisticsPrice }}</p>
                  </li>
                </ul>
29cad55a   杨鑫   '验收'
80
81
82
83
              </div> -->
                <div class="good_details">
                  <ul>
                    <li>
1991126c   杨鑫   '最新'
84
                      <img :src="$baseURL+item.image">
29cad55a   杨鑫   '验收'
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
                      <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>
3f535f30   杨鑫   '初始'
118
              </div>
29cad55a   杨鑫   '验收'
119
120
            </div>
            <div class="logistics_info">
1991126c   杨鑫   '最新'
121
              <TitleWithCircle title="售后记录" style="margin-bottom: 15px;"/>
29cad55a   杨鑫   '验收'
122
123
124
125
126
127
128
129
130
131
132
              <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>
3f535f30   杨鑫   '初始'
133
                    </div>
29cad55a   杨鑫   '验收'
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
                    <p>留言:{{ item.reason }}</p>
                  </div>
                </div>
                <div class="record_list_content">
                  <!--              <p>-->
                  <!--                &lt;!&ndash; <span>{{ item.type }}:</span> &ndash;&gt;-->
                  <!--                <span>{{ item.actionNote }}</span>-->
                  <!--              </p>-->
                  <div v-if="order.images && order.images.length != 0" class="proofBox">
                    <h3>买家举证图片:</h3>
                    <div class="imgBox">
                      <el-image v-for="(item, index) of order.images" :key="index" :src="item" :preview-src-list="order.images" alt />
                    </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>
3f535f30   杨鑫   '初始'
155
156
157
              </div>
            </div>
          </div>
29cad55a   杨鑫   '验收'
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
          <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>
3f535f30   杨鑫   '初始'
197
198
199
            </div>
          </div>
        </div>
29cad55a   杨鑫   '验收'
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
        <!-- *********************************弹框开始********************************* -->
        <!-- 申请弹框 -->
        <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="请输入留言"
            />
3f535f30   杨鑫   '初始'
224
          </div>
29cad55a   杨鑫   '验收'
225
226
          <div v-if="title === '确认收货且退款'" class="agreeTitle2">
            <div class="tiTop">已确认商品无误,退款给买家</div>
3f535f30   杨鑫   '初始'
227
          </div>
29cad55a   杨鑫   '验收'
228
229
          <div v-if="title === '货物有损拒绝退款'" class="agreeTitle2">
            <div class="tiTop">我已确认货物有损,不予退款</div>
3f535f30   杨鑫   '初始'
230
            <el-input
29cad55a   杨鑫   '验收'
231
232
233
234
              v-model="textarea"
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 4 }"
              placeholder="请输入留言"
3f535f30   杨鑫   '初始'
235
            />
29cad55a   杨鑫   '验收'
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
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
          </div>
          <div v-if="title === '同意退款申请'" class="agreeTitle2">
            <div class="tiTop">同意退款申请后,退款金额将返还至买家的支付渠道</div>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button
              v-if="title === '同意申请'"
              type="primary"
              @click="agreeEn(1)"
            >同意申请</el-button>
            <el-button
              v-if="title === '拒绝退款申请'"
              type="primary"
              @click="agreeEn(2)"
            >拒绝申请</el-button>
            <el-button
              v-if="title === '确认收货且退款'"
              type="primary"
              @click="agreeEn(3)"
            >确认退款</el-button>
            <el-button
              v-if="title === '货物有损拒绝退款'"
              type="primary"
              @click="agreeEn(4)"
            >确 定</el-button>
            <el-button
              v-if="title === '同意退款申请'"
              type="primary"
              @click="agreeEn(5)"
            >同意退款</el-button>
            <el-button @click="isVisible = false">取 消</el-button>
          </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>
3f535f30   杨鑫   '初始'
295
296
297
298
          <!--
          <el-form-item label="快递公司编号" prop="shipperCode" v-if="false">
            <el-input v-model="form.shipperCode" />
          </el-form-item>-->
29cad55a   杨鑫   '验收'
299
300
301
302
303
304
305
306
307
          </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>
3f535f30   杨鑫   '初始'
308
309
310
  </template>
  
  <script>
29cad55a   杨鑫   '验收'
311
312
313
314
315
316
317
318
319
320
321
  import {
    aftersaleGetById,
    orderGetSelect,
    orderDilevery,
    refundSuccess,
    refundRefuse,
    success,
    refuse,
    confirmAndRefund,
    damaging
  } from '@/api/order'
1991126c   杨鑫   '最新'
322
  import TitleWithCircle from '@/components/top/index';
3f535f30   杨鑫   '初始'
323
  export default {
29cad55a   杨鑫   '验收'
324
    name: 'AfterDetails',
1991126c   杨鑫   '最新'
325
326
327
    components: {
        TitleWithCircle
      },
3f535f30   杨鑫   '初始'
328
329
    data() {
      return {
29cad55a   杨鑫   '验收'
330
331
332
        loading: false,
        visible: false,
        afterId: 0,
3f535f30   杨鑫   '初始'
333
        order: {},
29cad55a   杨鑫   '验收'
334
335
336
337
338
339
340
341
        isVisible: false,
        isVisibles: false,
        companyList: [],
        title: '同意申请',
        textarea: '',
        showOne: false,
        showTwo: false,
        showThree: false,
3f535f30   杨鑫   '初始'
342
        form: {
3f535f30   杨鑫   '初始'
343
          express: '',
29cad55a   杨鑫   '验收'
344
345
          deliverFormid: '',
          orderId: ''
3f535f30   杨鑫   '初始'
346
        },
3f535f30   杨鑫   '初始'
347
348
349
350
351
352
353
354
355
356
        rules: {
          logisticsName: [
            { required: false, message: '请输入快递公司名称', trigger: 'blur' }
          ],
          deliverFormid: [
            { required: true, message: '请输入快递单号', trigger: 'blur' }
          ],
          express: [
            { required: true, message: '请选择快递公司', trigger: 'blur' }
          ]
3f535f30   杨鑫   '初始'
357
        }
29cad55a   杨鑫   '验收'
358
      }
3f535f30   杨鑫   '初始'
359
    },
29cad55a   杨鑫   '验收'
360
361
362
363
364
365
366
367
368
369
370
371
372
373
    // computed: {
    //   afterId() {
    //     return this.$route.params.afterId
    //   }
    // },
    // created() {
    //   console.log(this.afterId)
    // },
    mounted() {
      this.getCompanyList()
      // setTimeout(() => {
      //   this.btnShow(),
      //   console.log('mounted')
      // }, 1000)
3f535f30   杨鑫   '初始'
374
375
    },
    methods: {
29cad55a   杨鑫   '验收'
376
377
378
379
380
381
      show(id) {
        this.visible = true
        this.afterId = id
        this.getProductList()
        console.log(this.order, 'this.order')
      },
3f535f30   杨鑫   '初始'
382
      async getProductList() {
29cad55a   杨鑫   '验收'
383
384
385
386
387
388
389
390
        this.loading = true
        try {
          const res = await aftersaleGetById({ afterId: this.afterId })
          this.order = res.data
          this.btnShow()
        } finally {
          this.loading = false
        }
3f535f30   杨鑫   '初始'
391
      },
29cad55a   杨鑫   '验收'
392
393
394
395
396
      async getCompanyList() {
        const res = await orderGetSelect()
        if (res.code === '') {
          this.companyList = res.data
        }
3f535f30   杨鑫   '初始'
397
      },
29cad55a   杨鑫   '验收'
398
      // 发货
3f535f30   杨鑫   '初始'
399
400
401
      confirm() {
        this.$refs.sendGoodsForm.validate((valid) => {
          if (valid) {
29cad55a   杨鑫   '验收'
402
            this.form.orderId = this.order.orderId
3f535f30   杨鑫   '初始'
403
404
405
406
407
408
            orderDilevery(this.form).then((res) => {
              if (res.code === '') {
                this.$message({
                  message: '发货成功',
                  type: 'success'
                })
29cad55a   杨鑫   '验收'
409
                this.isVisibles = false
3f535f30   杨鑫   '初始'
410
411
412
413
414
415
              }
            })
          }
        })
      },
      cancel() {
29cad55a   杨鑫   '验收'
416
        this.isVisibles = false
3f535f30   杨鑫   '初始'
417
      },
29cad55a   杨鑫   '验收'
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
      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
          }
3f535f30   杨鑫   '初始'
445
446
        }
      },
29cad55a   杨鑫   '验收'
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
      // 同意申请
      async agreeEn(index) {
        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
            this.$router.go(-1)
          }
        } 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
              this.$router.go(-1)
            }
          }
          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
              this.$router.go(-1)
            }
          }
        } else if (index === 3) {
          this.title = '确认收货且退款'
          const res = await confirmAndRefund({
            orderId: this.order.orderId,
            afterId: this.order.afterId
          })
          if (res.code === '') {
            this.$message({
              message: '成功',
              type: 'success'
            })
            this.isVisible = false
            this.$router.go(-1)
          }
        } 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
            this.$router.go(-1)
          }
        } else if (index === 5) {
          const res = await refundSuccess({
            orderId: this.order.orderId,
            afterId: this.order.afterId
          })
          if (res.code === '') {
            this.$message({
              message: '成功',
              type: 'success'
            })
            this.isVisible = false
            this.$router.go(-1)
          }
          if (res.code === '') {
            this.$message({
              message: '成功',
              type: 'success'
            })
            this.isVisible = false
          }
        }
      },
      // 判断按钮展示
      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
        }
3f535f30   杨鑫   '初始'
566
567
568
569
570
571
572
573
574
575
576
577
578
      }
    }
  }
  </script>
  
  <style lang="scss" scoped>
  @import url("../../../styles/elDialog.scss");
  ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .order_details {
3f535f30   杨鑫   '初始'
579
    .close {
3f535f30   杨鑫   '初始'
580
581
582
583
584
585
      position: absolute;
      right: 20px;
      &:hover {
        cursor: pointer;
      }
    }
3f535f30   杨鑫   '初始'
586
    .cotent {
3f535f30   杨鑫   '初始'
587
588
      overflow: hidden;
      font-size: 14px;
29cad55a   杨鑫   '验收'
589
      margin: 20px;
3f535f30   杨鑫   '初始'
590
591
592
593
594
595
596
597
598
      .goods_info,
      .order_info,
      .logistics_info,
      .pay_order_info,
      .take_goods_info {
        background: #fff;
        margin-bottom: 10px;
        padding: 10px 20px;
      }
3f535f30   杨鑫   '初始'
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
      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 {
29cad55a   杨鑫   '验收'
614
615
            margin: 10px 20px;
            overflow: hidden;
3f535f30   杨鑫   '初始'
616
617
            li {
              overflow: hidden;
29cad55a   杨鑫   '验收'
618
              line-height: 30px;
3f535f30   杨鑫   '初始'
619
              p {
3f535f30   杨鑫   '初始'
620
621
                float: left;
                font-size: 14px;
29cad55a   杨鑫   '验收'
622
                width: 50%;
3f535f30   杨鑫   '初始'
623
624
625
626
627
628
629
630
                span {
                  &:nth-child(2) {
                    margin-left: 10px;
                  }
                }
              }
            }
          }
3f535f30   杨鑫   '初始'
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
        }
        .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 {
29cad55a   杨鑫   '验收'
652
              overflow: hidden;
3f535f30   杨鑫   '初始'
653
654
              ul {
                display: flex;
29cad55a   杨鑫   '验收'
655
656
                padding:0 10px 20px 10px;
                border-bottom: 1px solid #ccc;
3f535f30   杨鑫   '初始'
657
                li {
29cad55a   杨鑫   '验收'
658
                  flex: 5;
3f535f30   杨鑫   '初始'
659
660
661
662
663
                  display: flex;
                  justify-content: space-around;
                  align-items: center;
                  .details {
                    margin: 0 30px;
29cad55a   杨鑫   '验收'
664
                    width: 150px;
3f535f30   杨鑫   '初始'
665
666
                    line-height: 20px;
                    .skuDetails {
29cad55a   杨鑫   '验收'
667
                      display: flex;
3f535f30   杨鑫   '初始'
668
                      margin-right: 10px;
3f535f30   杨鑫   '初始'
669
670
671
672
673
674
                    }
                  }
                  img {
                    width: 50px;
                    height: 50px;
                  }
29cad55a   杨鑫   '验收'
675
676
677
                  &:nth-child(2) {
                    display: block;
                  }
3f535f30   杨鑫   '初始'
678
                }
29cad55a   杨鑫   '验收'
679
680
681
682
683
684
685
686
687
688
689
                .cen{
                  margin-top: 5%;
                }
              }
              .totalRefund{
                display: flex;
                justify-content: right;
                margin: 20px 40px 0 0;
              }
              .fontWeight{
                font-weight: 700;
3f535f30   杨鑫   '初始'
690
691
692
693
694
695
696
697
698
699
700
701
702
              }
            }
          }
        }
        .logistics_info {
          .send_good {
            display: block;
            margin: 20px auto !important;
            &:hover {
              cursor: pointer;
            }
          }
          .logistics_content {
29cad55a   杨鑫   '验收'
703
            padding: 0 20px;
3f535f30   杨鑫   '初始'
704
705
            .logistics_title {
              span {
3f535f30   杨鑫   '初始'
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
                display: inline-block;
                width: 45%;
              }
            }
            .logistics_item {
              span {
                display: inline-block;
                width: 30%;
              }
            }
          }
        }
      }
  
      .right_part {
29cad55a   杨鑫   '验收'
721
        background: #fff;
3f535f30   杨鑫   '初始'
722
723
        float: left;
        width: 30%;
29cad55a   杨鑫   '验收'
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
        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;
        }
3f535f30   杨鑫   '初始'
824
825
826
827
      }
    }
  }
  </style>