jsm-mall-front/src/views/auxiliaryFittings/salesManagement/transaction/index.vue

<template>
  <div class="page">
    <template-page
      v-show="!formDialog"
      ref="pageRef"
      :get-list="getList"
      :table-attributes="tableAttributes"
      :table-events="tableEvents"
      :options-evens-group="optionsEvensGroup"
      :moreParameters="moreParameters"
      :column-parsing="columnParsing"
      :operation="operation()"
      :exportList="exportList"
    >
    </template-page>
    <div class="detail" v-if="formDialog">
      <auxiliarySalesOrderDetail
        v-if="orderSource == 'M_SALES'"
        :id="id"
        @back="backList"
        :formType="2"
        title="辅材销售订单详情"
      >
      </auxiliarySalesOrderDetail>
      <attachmentSalesOrderDetail
        v-if="orderSource == 'P_SALES'"
        :id="id"
        @back="backList"
        :formType="2"
        title="配件销售订单详情"
      ></attachmentSalesOrderDetail>
      <auxiliarySalesReturnOrderDetail
        v-if="orderSource == 'SALES_RET'"
        :id="id"
        @back="backList"
        :formType="2"
        title="辅材销售退货单详情"
      ></auxiliarySalesReturnOrderDetail>
      <attachmentNewReturnDetail
        v-if="orderSource == 'NEW_PARTS_RET'"
        :id="id"
        @back="backList"
        :formType="2"
        title="配件新件返还详情"
      ></attachmentNewReturnDetail>
      <attachmentOldReturnDetail
        v-if="orderSource == 'OLD_PARTS_RET'"
        :id="id"
        @back="backList"
        :formType="2"
        title="配件旧件返还详情"
      ></attachmentOldReturnDetail>
    </div>
  </div>
</template>

<script>
import TemplatePage from '@/components/template/template-page-1.vue'
import import_mixin from '@/components/template/import_mixin.js'
import auxiliarySalesOrderDetail from '../components/auxiliarySalesOrderDetail.vue'
import attachmentSalesOrderDetail from '../components/attachmentSalesOrderDetail.vue'
import auxiliarySalesReturnOrderDetail from '../components/auxiliarySalesReturnOrderDetail.vue'
import attachmentNewReturnDetail from '../components/attachmentNewReturnDetail.vue'
import attachmentOldReturnDetail from '../components/attachmentOldReturnDetail.vue'
import { downloadFiles } from '@/utils/util'
import { listPageV2, pageExport, websitTradeTradeRefund } from '@/api/auxiliaryFittings/transaction'
import operation_mixin from '@/components/template/operation_mixin.js'
export default {
  components: {
    TemplatePage,
    auxiliarySalesOrderDetail,
    attachmentSalesOrderDetail,
    auxiliarySalesReturnOrderDetail,
    attachmentNewReturnDetail,
    attachmentOldReturnDetail
  },
  mixins: [import_mixin, operation_mixin],
  data() {
    return {
      // 事件组合
      optionsEvensGroup: [],
      // 表格属性
      tableAttributes: {
        // 启用勾选列
        selectColumn: true
      },
      // 表格事件
      tableEvents: {
        'selection-change': this.selectionChange
      },
      // 勾选选中行
      recordSelected: [],
      /** 表单变量 */
      id: '',
      orderSource: '',
      formDialog: false
    }
  },
  computed: {
    // 更多参数
    moreParameters() {
      return []
    }
  },
  methods: {
    // 列表请求函数
    getList: listPageV2,
    // 列表导出函数
    exportList: pageExport,
    // 表格列解析渲染数据更改
    columnParsing(item, defaultData) {
      return defaultData
    },
    // 监听勾选变化
    selectionChange(data) {
      this.recordSelected = data
    },

    operation() {
      return this.operationBtn({
        detail: {
          click: ({ row, index, column }) => {
            this.id = row.orderId
            this.orderSource = row.orderSource
            if (row.orderSource) {
              this.formDialog = true
            } else {
              this.$message.warning('订单来源为空！')
            }
          }
        },
        refund: {
          conditions: ({ row, index, column }) => {
            return row.payValue > row.retValue
          },
          click: ({ row, index, column }) => {
            this.$prompt('退款金额', '退款', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              inputPattern: /^\d+(\.\d+)?$/,
              inputErrorMessage: '请输入正确的金额'
            })
              .then(({ value }) => {
                websitTradeTradeRefund({
                  id: row.id,
                  retAmount: value
                }).then(res => {
                  this.$message({
                    message: '退款成功',
                    type: 'success'
                  })
                  this.$refs.pageRef.refreshList()
                })
              })
              .catch(() => {})
          }
        }
      })
    },

    backList() {
      this.id = ''
      this.formDialog = false
      this.$refs.pageRef.refreshList()
    }
  }
}
</script>

<style lang="scss" scoped>
.page {
  height: 100%;
}

.tab {
  padding: 20px 20px 0 20px;
}
</style>