yos_web/src/HDrpManagement/orderManage/details/tabs/rebatesettlement.vue

<template>
  <div>
    <el-tabs v-if="rebHeadData.length > 0" v-model="activeName" type="border-card" @tab-click="handleClick">
      <el-tab-pane v-for="item in rebHeadData" :key="item.index" :label="item.billno_contract + '_' + item.title" :name="item.billno_contract + '_' + item.title">
        <el-button size="small" style="margin-bottom: 10px" @click="detailGO(item)">查看合同</el-button>
        <div>
          <el-descriptions class="margin-top mt-10" title="居间明细" :column="2" size="small" border>
            <el-descriptions-item :labelStyle="{width:'120px'}" label="订单金额比例">{{item.calculatemodel == 1?Math.round((item.orderratio * 100)*100)/100 + '%':'--'}}</el-descriptions-item>
            <el-descriptions-item :labelStyle="{width:'120px'}" label="订单金额">{{item.amount?tool.formatAmount(item.amount,2):''}}</el-descriptions-item>
            <el-descriptions-item :labelStyle="{width:'120px'}" label="居间产品折扣">{{item.calculatemodel == 2?Math.round((item.productdiscount * 100)*100)/100 + '%':'--'}}</el-descriptions-item>
            <el-descriptions-item :labelStyle="{width:'120px'}" label="居间费">{{tool.formatAmount(item.rebate,2)}}</el-descriptions-item>
            <el-descriptions-item :labelStyle="{width:'120px'}" label="结算经销商">{{item.enterprisename?item.enterprisename:'--'}}</el-descriptions-item>
          </el-descriptions>
        </div>
        <table-new-layout :layout="tablecols" :data="tableData" :custom="true" :width="true" height="calc(100vh - 750px)" minHeight="400px">
          <template v-slot:customcol="scope">
            <div v-if="scope.column.columnname === 'price'">
              {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
            </div>
            <div v-else-if="scope.column.columnname === 'marketprice'">
              {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
            </div>
            <div v-else-if="scope.column.columnname === 'amount'">
              {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
            </div>
            <div v-else-if="scope.column.columnname === 'rebate_price'">
              {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
            </div>
            <div v-else-if="scope.column.columnname === 'rebate_unit_price'">
              {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
            </div>
            <div v-else-if="scope.column.columnname === 'rebate'">
              {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
            </div>
            <div v-else-if="scope.column.columnname === 'discountrate'">
              {{Math.round((scope.column.data[scope.column.columnname] * 100)*100)/100 + '%'}}
            </div>
            <div v-else-if="scope.column.columnname === 'rebate_discountrate'">
              {{Math.round((scope.column.data[scope.column.columnname] * 100)*100)/100 + '%'}}
            </div>
            <p v-else>{{scope.column.data[scope.column.columnname] || '--'}}</p>
          </template>
        </table-new-layout>
        <div class="container normal-panel" style="text-align:right;padding-bottom: 0">
          <el-pagination
              background
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[20, 50, 100, 200]"
              layout="total,sizes, prev, pager, next, jumper"
              :total="total">
          </el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>
    <el-empty v-else description="暂无数据"></el-empty>
  </div>
</template>

<script>
export default {
  data () {
    return {
      rebHeadData:[],
      tableData:[],
      param:{
        "pageNumber": 1,
        "pageSize": 20,
      },
      total:0,
      currentPage:0,
      activeName:'',
      tablecols:[],
      sa_rebatesettlementid:''
    }
  },
  methods:{
    async headData () {
      const res = await this.$api.requested({
        "id": "20230105194402",
        "content": {
          "sa_orderid": this.$route.query.id
        },
      })
      this.rebHeadData = res.data
      this.activeName = res.data.length > 0? res.data[0].billno_contract + '_' + res.data[0].title:''
      this.sa_rebatesettlementid = res.data.length > 0?res.data[0].sa_rebatesettlementid:''
      this.sa_rebatesettlementid?this.listData():''
    },
    async listData () {
      const res = await this.$api.requested({
        "id": "20230105194902",
        "content": {
          "sa_rebatesettlementid": this.sa_rebatesettlementid,
          "pageNumber": this.param.pageNumber,
          "pageSize": this.param.pageSize,
          "where": {
            "condition": ""
          }
        },
      })
      this.tableData = res.data
      this.total = res.total
      this.currentPage = res.pageNumber
    },
    handleSizeChange(val) {
      this.param.pageSize = val
      this.listData()
    },
    handleCurrentChange(val) {
      this.param.pageNumber = val
      this.listData()
    },
    handleClick(tab){
      console.log(tab.index)
      this.sa_rebatesettlementid = this.rebHeadData[tab.index].sa_rebatesettlementid
      this.listData(this.param.pageNumber = 1)
    },
    detailGO(row){
      let type = '居间'
      let route = this.$route
      if (route.path !== '/contractDetail') {
        this.oldRoute = {path:route.path,query:route.query}
        this.$store.dispatch('setHistoryRouter',this.oldRoute)
      }
      // sessionStorage.setItem('listqueryid',this.listqueryid)
      // sessionStorage.setItem('isGo','1')
      this.$router.push({
        path:'/contractDetail',
        query:{
          id:row.sa_contractid,
          rowindex:row.rowindex,
          type:type,
        }
      })
    }
  },
  mounted () {
    this.headData()
  },
  created() {
    this.tablecols = this.tool.tabelCol(this.$route.name).intermediaryFeeTable.tablecols
  }
}

</script>
<style>
</style>