supply-front/src/views/supply/salesReturnOrder/salesReturnOrderDetail.vue

<template>
  <div>
    <h4>订单信息</h4>
    <el-divider />
    <div class="diy-table-1">
      <el-row>
        <el-col :span="8" class="item">
          <div class="label">销售退货单</div>
          <div class="value">{{ detailData.refundOrderId }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">订单日期</div>
          <div class="value">{{ detailData.refOrderDate }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">销售订单</div>
          <div class="value">{{ detailData.refOrderId }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">经销商编号</div>
          <div class="value">{{ detailData.customerNumber }}</div>
        </el-col>
        <el-col :span="16" class="item">
          <div class="label">经销商名称</div>
          <div class="value">{{ detailData.customerName }}</div>
        </el-col>
      </el-row>
      <!-- 政策订单 -->
      <el-row v-if="type === 'policy'">
        <el-col :span="8" class="item">
          <div class="label">销售政策编码</div>
          <div class="value">{{ detailData.policyCode }}</div>
        </el-col>
        <el-col :span="16" class="item">
          <div class="label">销售政策</div>
          <div class="value">{{ detailData.policyTitle }}</div>
        </el-col>
        <el-col :span="24" class="item">
          <div class="label">格力回复</div>
          <div class="value">{{ detailData.geLiNote }}</div>
        </el-col>
      </el-row>
      <!-- 零售订单 -->
      <el-row v-if="type === 'retail'">
        <!-- <el-col :span="8" class="item">
          <div class="label">产品大类</div>
          <div class="value">{{ detailData.id }}</div>
        </el-col> -->
        <el-col :span="24" class="item">
          <div class="label">销售订单类型</div>
          <div class="value">{{ orderType[detailData.refundOrderType] }}</div>
        </el-col>
      </el-row>
      <!-- 商用工程订单 -->
      <el-row v-if="type === 'commercial'">
        <el-col :span="8" class="item">
          <div class="label">工程信息编码</div>
          <div class="value">{{ detailData.refEnginRecordNo }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">工程项目名称</div>
          <div class="value">{{ detailData.refProjectName }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">工程信息单类型</div>
          <div class="value">{{ detailData.refProjectType }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">厂工程编码</div>
          <div class="value">{{ detailData.refFactoryNo }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">使用单位</div>
          <div class="value">{{ detailData.refUseUnit }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label" />
          <div class="value" />
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">联系人</div>
          <div class="value">{{ detailData.refLinkman }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">固定电话</div>
          <div class="value">{{ detailData.refTel }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">移动电话</div>
          <div class="value">{{ detailData.id }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">不扣押金</div>
          <div class="value">{{ detailData.takeDeposit?'不扣':'扣' }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">文件编码</div>
          <div class="value">{{ detailData.id }}</div>
        </el-col>
        <el-col :span="8" class="item">
          <div class="label">业务员</div>
          <div class="value">{{ detailData.serviceName }}</div>
        </el-col>
        <el-col :span="24" class="item">
          <div class="label">格力回复</div>
          <div class="value">{{ detailData.geLiNote }}</div>
        </el-col>
        <el-col :span="24" class="item">
          <div class="label">格力内部备注</div>
          <div class="value">{{ detailData.geLiInnerNote }}</div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24" class="item">
          <div class="label">备注</div>
          <div class="value">{{ detailData.remark }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">制单人</div>
          <div class="value">{{ detailData.createBy }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">制单日期</div>
          <div class="value">{{ detailData.createTime }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">审核人</div>
          <div class="value">{{ detailData.examineBy }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">审核日期</div>
          <div class="value">{{ detailData.examineTime }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">最后更新人</div>
          <div class="value">{{ detailData.updateBy }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">最后更新日期</div>
          <div class="value">{{ detailData.updateTime }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">关闭人</div>
          <div class="value">{{ detailData.refundBy }}</div>
        </el-col>
        <el-col :span="6" class="item">
          <div class="label">关闭日期</div>
          <div class="value">{{ detailData.refundTime }}</div>
        </el-col>
        <el-col :span="24" class="item">
          <div class="label">审核说明</div>
          <div class="value">{{ detailData.examineRemark }}</div>
        </el-col>
      </el-row>
    </div>
    <h4>货品信息</h4>
    <el-divider />
    <zj-table
      :table-attributes="tableAttributes"
      :is-drop="true"
      :columns="columns"
      :table-data="policyData"
    />
  </div>
</template>

<script>
import { getRefundDetail } from '@/api/supply/salesReturnOrder'

export default {
  props: {
    refundOrderId: {
      type: String,
      default: null
    },
    type: {
      type: String,
      default: null
    }
  },
  data() {
    return {
      moduleType: 1,
      detailData: {},
      policyData: [],
      tableAttributes: {
        border: true,
        headerCellClassName: 'headerRowColor',
        size: 'mini',
        'summary-method': this.$getSummaries,
        'show-summary': true
      },
      orderType: {
        TRADE: '商用',
        HOME: '家用',
        RETAIL: '零售单',
        RETAIL_POLICY: '销售政策单'
      }
    }
  },
  computed: {
    columns() {
      return [
        {
          columnAttributes: {
            label: '序号',
            prop: 'index'
          },
          render: (h, { props, index }) => {
            return <div>{index + 1}</div>
          }
        },
        {
          columnAttributes: {
            label: '销售类型',
            prop: 'saleTypeName',
            width: 200
          }
        },
        {
          columnAttributes: {
            label: '产品编码',
            prop: 'materialoldMumber',
            width: 200
          }
        },
        {
          columnAttributes: {
            label: '物料代码',
            prop: 'materialCode',
            width: 200
          }

        },
        {
          columnAttributes: {
            label: '产品名称',
            prop: 'materialName',
            width: 200
          }
        },
        {
          columnAttributes: {
            label: '规格型号',
            prop: 'specification',
            width: 300
          }
        },
        {
          columnAttributes: {
            label: '单位',
            prop: 'unit',
            width: 200
          }
        },
        {
          columnAttributes: {
            label: '单价',
            prop: 'price',
            width: 200
          }
        },
        ...(() => {
          return this.type !== 'commercial' ? [{
            columnAttributes: {
              label: '数量',
              prop: 'qty',
              width: 120
            }
          }] : [
            {
              columnAttributes: {
                label: '工程信息数量',
                prop: 'enginNum',
                width: 120

              }
            },
            {
              columnAttributes: {
                label: '数量',
                prop: 'qty',
                width: 120
              }
            }
          ]
        })(),
        {
          columnAttributes: {
            label: '订单金额',
            prop: 'totalAmount',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '返利类型',
            prop: 'customerWalletName2',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '使用返利金额',
            prop: 'payRebateAmount',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '格力折扣',
            prop: 'discAmount',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '现金钱包',
            prop: 'customerWalletName',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '实付金额',
            prop: 'payAmount',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '直调',
            prop: 'directTransferStatus',
            width: 120
          }, render: (h, { row }) => {
            const { directTransferStatus } = row
            return <div>{directTransferStatus ? '是' : '否'}</div>
          }
        },
        {
          columnAttributes: {
            label: '直调数量',
            prop: 'directTransferQty',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '原订单数量',
            prop: 'oldQty',
            width: 120
          }
        },
        {
          columnAttributes: {
            label: '备注',
            prop: 'remark',
            width: 200
          }
        },
        {
          columnAttributes: {
            label: '税率',
            prop: 'tax',
            width: 120
          }
        }
      ]
    }
  },
  mounted() {
    getRefundDetail({ refundOrderId: this.refundOrderId }).then(res => {
      res.data.items.forEach(item => {
        item.sums1 = ['directTransferQty', 'enginNum', 'hasSendQty', 'oldQty', 'qty', 'rebateRate', 'tax']
        item.sums2 = ['orgPrice', 'payAmount', 'payRebateAmount', 'price', 'totalAmount']
      })
      this.detailData = res.data
      this.policyData = res.data.items
    })
  }
}
</script>

<style lang="scss" scoped></style>