zfire-newmall-admin/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" :operationColumnWidth="50" :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 } 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('订单来源为空！')
            }
          }
        }
      })
    },

    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>