<template>
    <div class="ele-body">
      <el-card shadow="never" v-loading="loading">
           <div class="ele-border-lighter form-content" v-loading="loading">  
              <!-- 数据表格 -->
              <ele-pro-table
                ref="table"
                :columns="columns"
                :datasource="datasource"
                height="calc(100vh - 385px)"
                full-height="calc(100vh - 116px)"
                tool-class="ele-toolbar-form"
                :selection.sync="selection"
                cache-key="eomContactPageTable"
              >
                <!-- 查看详情列 -->
             
                <template v-slot:returnNo="{ row }">
                  <el-link type="primary" :underline="false" @click="openorderDetail(row,'returnNo')"> {{ row.returnNo }}</el-link>
                </template>
                <template v-slot:sendNo="{ row }">
                  <el-link type="primary" :underline="false" @click="openorderDetail(row,'sendNo')"> {{ row.sendNo }}</el-link>
                </template>
                <template v-slot:orderNo="{ row }">
                  <el-link type="primary" :underline="false" @click="openorderDetail(row,'orderNo')"> {{ row.orderNo }}</el-link>
                </template>
              
              </ele-pro-table>
            </div>
      </el-card>
  
  
      <send-detail-dialog  ref="sendDetailDialogRef"></send-detail-dialog>
      <detail-dialog ref="DetailDialogRef"></detail-dialog>
    </div>
  </template>
  
  <script>
  import detailDialog from '@/views/saleManage/saleOrder/returnGoods/components/detailDialog.vue';
  import sendDetailDialog from '@/views/saleManage/saleOrder/invoice/components/detailDialog.vue'
  import {reviewStatusEnum} from '@/enum/dict';
  import {getReturnTableList} from '@/api/saleManage/returnGoods';
  import dictMixins from '@/mixins/dictMixins';
  
  
  export default {
      mixins: [dictMixins],
      components: {
        sendDetailDialog,
        detailDialog,
      },
      props:{
        orderId:String
      },
      data() {
        return {
          activeComp: 'saleorder',
          tabOptions: [
            { key: 'saleorder', name: '销售订单' },
            { key: 'invoice', name: '发货单' },
            { key: 'returnorder', name: '退货单' }
          ],
          selection:[],   //单选中集合
          delVisible:false,  //批量删除弹框状态
          loading: false,  // 加载状态
          columns: [
            {
               width: 45,
               type: 'selection',
               columnKey: 'selection',
               align: 'center'
            },
            {
              columnKey: 'index',
              label: '序号',
              type: 'index',
              width: 55,
              align: 'center',
              showOverflowTooltip: true,
              fixed: 'left'
            },
            {
              prop: 'returnNo',
              label: '退货单编码',
              align: 'center',
              slot: 'returnNo',
              showOverflowTooltip: true,
              minWidth: 200
            },
            {
              prop: 'sendNo',
              label: '发货单编码',
              align: 'center',
              slot: 'sendNo',
              showOverflowTooltip: true,
              minWidth: 200
            },
            {
              prop: 'contactName',
              label: '客户名称',
              align: 'center',
              showOverflowTooltip: true,
              minWidth: 180,
            },
            {
              prop: 'payAmount',
              label: '应付金额',
              align: 'center',
              slot: 'payAmount',
              showOverflowTooltip: true,
              minWidth: 200
            },
            {
              prop: 'reviewStatus',
              label: '状态',
              align: 'center',
              showOverflowTooltip: true,
              minWidth: 200,
              formatter: (_row, _column, cellValue) => {
              return reviewStatusEnum[_row.reviewStatus].label;
            }
            },
            {
              prop: 'createTime',
              label: '创建时间',
              align: 'center',
              showOverflowTooltip: true,
              minWidth: 170
            }
          ]
        };
      },
      computed: {},
   
      methods: {
      
      
        /* 表格数据源 */
        datasource({ page, limit, where, order }) {
          return getReturnTableList({
            pageNum: page,
            size: limit,
            orderId:this.orderId,
            ...where
          });
        },
      
    
        /* 刷新表格 */
        reload(where) {
          this.$refs.table.reload({ page: 1, where });
        },
        
      
  
  
      //查看详情
      openorderDetail(row,type){
        if(type==='returnNo'){
          this.$refs.DetailDialogRef.open(row);
        }
        if(type==='sendNo'){
          this.$refs.sendDetailDialogRef.open({id:row.sendId});
        }
        if(type==='orderNo'){
          this.$refs.orderDetailDialogRef.open({id:row.orderId});
        }
         
        },
  
      }
    };
  </script>
  
  <style lang="scss" scoped>
  .ele-body{
    padding-top:0;
    padding-bottom: 0;
  }
  :deep .el-card__body{
  padding: 0;
  }
  :deep(.el-link--inner){
    margin-left: 0px !important;
  }
  
  .sys-organization-list {
    height: calc(100vh - 264px);
    box-sizing: border-box;
    border-width: 1px;
    border-style: solid;
    overflow: auto;
  }
  .sys-organization-list :deep(.el-tree-node__content) {
    height: 40px;
    & > .el-tree-node__expand-icon {
      margin-left: 10px;
    }
  }
  
  .switch_left ul .active{
    border-top: 4px solid var(--color-primary);
      color: var(--color-primary-5);
  }
  .switch{
    padding-bottom: 20px;
  }
  
  .el-dropdown-link {
      cursor: pointer;
      color: var(--color-primary-5);
    }
    .el-icon-arrow-down {
      font-size: 12px;
    }
  </style>
  