售后相关改动 内容管理改动

mayf

2024-08-23 8db1014ad0c02e88609ef3e46a0236f40820ed1d

 pages/order/after-sale/_action/_id.vue

@@ -1,59 +1,26 @@
<template>
  <div v-loading="wholeLoading" class="base-page-wrapper sale-detail">
    <el-bus-title title="订单信息" size="small"></el-bus-title>
    <el-bus-form
      ref="form"
      label-width="auto"
      :content="formContent"
      readonly
    ></el-bus-form>
    <div
      v-if="detail.imageListFormat && detail.imageListFormat.length > 0"
      class="mb-20"
    >
      <el-bus-title title="售后图片" size="small"></el-bus-title>
      <el-bus-upload
        :value="detail.imageListFormat"
        disabled
        list-type="picture-card"
      ></el-bus-upload>
    </div>
    <div v-if="detail.videoList && detail.videoList.length > 0" class="mb-20">
      <el-bus-title title="售后视频" size="small"></el-bus-title>
      <video
        v-for="(item, index) in detail.videoList"
        :key="index"
        controls
        width="300px"
        height="200"
        class="mr-20 mb-15"
      >
        <source :src="item" />
      </video>
    </div>
    <el-bus-title title="售后处理" size="small"></el-bus-title>
    <el-bus-form
      ref="auditForm"
      label-width="auto"
      :content="auditFormContent"
      :readonly="!editable"
    ></el-bus-form>
    <el-bus-form ref="form" label-width="auto" :content="formContent" readonly>
      <template #id:baseInfo>
        <el-bus-title title="基本信息" size="small"></el-bus-title>
      </template>
      <template #id:refundInfo>
        <div class="base-page-wrapper__line"></div>
        <el-bus-title title="退款信息" size="small"></el-bus-title>
      </template>
      <template #id:goodsInfo>
        <div class="base-page-wrapper__line"></div>
        <el-bus-title title="商品信息" size="small"></el-bus-title>
      </template>
    </el-bus-form>
    <div class="text-center mt-20">
      <el-button
        v-if="editable"
        class="min-w-100"
        :loading="loading"
        type="primary"
        @click="save"
        >处理完成</el-button
      >
      <el-button class="min-w-100" @click="goBack">返回</el-button>
    </div>
  </div>
</template>

<script>
import AfterSaleItems from '@/components/order/after-sale-items.vue'
import VideoList from '@/components/order/video-list'
export default {
  data() {
    return {
@@ -63,57 +30,100 @@
      formContent: [
        {
          type: 'row',
          id: 'baseInfo',
          items: [
            { label: '订单号：', id: 'orderNo', type: 'input' },
            { label: '售后单号：', id: 'salesNo', type: 'input' },
            { label: '用户账号：', id: 'createName', type: 'input' },
            { label: '下单时间：', id: 'orderTime', type: 'input' },
            { label: '申请时间：', id: 'createTime', type: 'input' },
            { label: '审核时间：', id: 'auditTime', type: 'input' },
            { label: '收货人：', id: 'customer', type: 'input' },
            { label: '收货人电话：', id: 'customerTel', type: 'input' },
            { label: '收货地址：', id: 'customerWholeAddress', type: 'input' },
            { label: '下单时间：', id: 'createTime', type: 'input' },
            { label: '订单金额：', id: 'totalOrderAmount', type: 'input' },
            { label: '售后状态：', id: 'statusStr', type: 'input' },
            { label: '售后理由：', id: 'reason', type: 'input', span: 24 },
            { label: '处理时间：', id: 'auditTime', type: 'input' },
          ],
        },
      ],
      auditFormContent: [
        {
          label: '处理意见：',
          id: 'auditStatus',
          type: 'bus-radio',
          el: {
            code: 'SALES_AUDIT_STATUS',
          },
          rules: { required: true, message: '请选择处理意见' },
          on: {
            change: (e, updateForm) => {
              updateForm({ auditRemarks: '' })
            },
          },
          str: true,
        },
          type: 'row',
          id: 'refundInfo',
          items: [
            { id: 'status', type: 'input', hidden: () => true },
        {
          label: '不通过原因：',
          id: 'auditRemarks',
          type: 'input',
          el: {
            type: 'textarea',
            rows: 6,
          },
          rules: {
            required: true,
            message: '请输入不通过原因',
            trigger: 'blur',
          },
          hidden: (row) => row.auditStatus !== 'REJECT',
        },
        {
          label: '',
          id: 'items',
          component: AfterSaleItems,
              label: '订单状态：',
              id: 'statusStr',
              component: 'simple-text',
              el: (row) => ({
                type: row.status === 'PENDING' ? 'primary' : '',
              }),
          forceDisabled: true,
            },
            { label: '售后单号：', id: 'salesNo', type: 'input' },
            { label: '退款金额(元)：', id: 'totalFee', type: 'input' },
            { label: '供应商扣款(元)：', id: 'feeSupplier', type: 'input' },
            { label: '平台扣款(元)：', id: 'feePlatform', type: 'input' },
            { label: '合伙人扣款(元)：', id: 'feePartner', type: 'input' },
            { label: '打包扣款(元)：', id: 'feePlatformPack', type: 'input' },
            { label: '质检扣款(元)：', id: 'feePlatformCheck', type: 'input' },
            {
              label: '物流扣款(元)：',
              id: 'feePlatformTransport',
              type: 'input',
            },
            { label: '实际总扣款(元)：', id: 'totalFee', type: 'input' },
            {
              label: '申请理由：',
              id: 'reason',
              type: 'input',
              el: { type: 'textarea' },
              span: 24,
            },
            {
              label: '平台回复：',
              id: 'remarks',
              type: 'input',
              el: { type: 'textarea' },
              span: 24,
            },
            {
              label: '退款图片：',
              id: 'pictureList',
              type: 'bus-upload',
              el: {
                listType: 'picture-card',
                size: 'small',
              },
              forceDisabled: true,
              span: 24,
              inputFormat: (row) => {
                if ('pictureList' in row) {
                  return row?.pictureList?.length
                    ? row.pictureList.map((i) => ({ url: i }))
                    : []
                }
              },
            },
            {
              label: '退款视频：',
              id: 'videoList',
              component: VideoList,
              forceDisabled: true,
              span: 24,
            },
          ],
        },
        {
          type: 'row',
          id: 'goodsInfo',
          items: [
            { label: '商品名称：', id: 'flowerName' },
            { label: '商品分类：', id: 'flowerCategory' },
            { label: '级别：', id: 'flowerLevelStr' },
            { label: '颜色：', id: 'flowerColor' },
            { label: '规格：', id: 'flowerUnit' },
            { label: '商品价格(元)：', id: 'price' },
            { label: '供应商价格(元)：', id: 'supplierPrice' },
            { label: '合伙人加价(元)：', id: 'markupPartner' },
            { label: '申请数量：', id: 'num' },
            { label: '实际退款(元)：', id: 'totalFee' },
          ],
        },
      ],
    }
@@ -148,88 +158,10 @@
        data.customerWholeAddress = `${data.customerProvince || ''}${
          data.customerCity || ''
        }${data.customerRegion || ''}${data.customerAddress || ''}`
        data.imageListFormat = Array.isArray(data.imageList)
          ? data.imageList.map((i) => ({ url: i }))
          : []
        this.detail = data || {}
        this.$refs.form.updateForm(data)
        this.$refs.auditForm.updateForm({
          ...data,
          auditStatus: data.status === 'PENDING' ? undefined : data.auditStatus,
        })
      }
      this.wholeLoading = false
    },
    save() {
      this.$refs.auditForm.validate((res) => {
        if (res) {
          const formValue = this.$refs.auditForm.getFormValue()
          if (formValue.auditStatus === 'REJECT') {
            this.$elBusUtil
              .confirm('确定处理完成吗？')
              .then(() => {
                this.doSave({ ...formValue, items: [] })
              })
              .catch(() => {})
          } else {
            // eslint-disable-next-line
            if (
              formValue.items.every(
                (i) =>
                  this.$elBusUtil.isEmpty(i.amount) &&
                  this.$elBusUtil.isTrueEmpty(i.personInCharge)
              )
            ) {
              this.$message.warning('请完善商品售后信息')
            } else if (
              // 理赔金额和责任方不能只有一个有值
              formValue.items.find(
                (i) =>
                  (!this.$elBusUtil.isEmpty(i.amount) &&
                    this.$elBusUtil.isTrueEmpty(i.personInCharge)) ||
                  (this.$elBusUtil.isEmpty(i.amount) &&
                    !this.$elBusUtil.isTrueEmpty(i.personInCharge))
              )
            ) {
              this.$message.warning('赔付金额和责任方必须同时填写')
            } else {
              const items = formValue.items.filter(
                (i) =>
                  !this.$elBusUtil.isEmpty(i.amount) &&
                  !this.$elBusUtil.isTrueEmpty(i.personInCharge)
              )
              // 当存在部分商品未设置赔付金额时提示但允许提交
              if (items.length !== formValue.items.length) {
                this.$elBusUtil
                  .confirm('存在部分商品未设置赔付金额，确定处理完成吗？')
                  .then(() => {
                    this.doSave({ ...formValue, items })
                  })
                  .catch(() => {})
              } else {
                this.$elBusUtil
                  .confirm('确定处理完成吗？')
                  .then(() => {
                    this.doSave({ ...formValue, items })
                  })
                  .catch(() => {})
              }
            }
          }
        }
      })
    },
    async doSave(data) {
      this.loading = true
      const { code } = await this.$elBusHttp.request('flower/api/sales/audit', {
        method: 'post',
        data: { ...data, id: this.$route.params.id },
      })
      if (code === 0) {
        this.$message.success('处理成功')
        this.goBack()
      }
      this.loading = false
    },
  },
}
@@ -237,6 +169,7 @@

<style lang="scss" scoped>
.sale-detail {
  border-radius: 0;
  .el-bus-title {
    margin-bottom: 10px;
  }