<template>
<!-- :tabs="['详细信息']" -->
  <div>
    <basicDetails
        ref="details"
        :titleText="mainData.oppname"
        :editData="mainData"
        :mainAreaData="mainAreaData"
        turnPageId="20230106154004"
        idname="sa_bankstatementid"
        ownertable="sa_bankstatement"
        tags=""
        @pageChange="pageChange"
        @onEditSuccess="queryMainData($route.query.id)">
      <div slot="tags">
      </div>
      <div slot="customOperation" >
        <Confirm class="inline-16" v-if="tool.checkAuth($route.name,'confirm') && mainData.status == '未入账'" @onSuccess="queryMainData()"></Confirm>
        <customBtn 
          btnName="退回"
          message="确认退回当前数据吗?"
          idName="20230301101404"
          keyName="sa_bankstatementid"
          :id="$route.query.id"
          @onSuccess="queryMainData"
          class="inline-16"
          v-if="mainData.status != '新建' && tool.checkAuth($route.name,'back')"
        />
      </div>
      <div slot="slot0" >
        <!-- <base-info v-if="detailInfo" :detailInfo="detailInfo"></base-info> -->
      </div>
      <div slot="slot1" >
      </div>
    </basicDetails>
  </div>
</template>

<script>
import BaseInfo from '@/HDrpManagement/projectChange/modules/modules/baseInfo/baseInfo'
import Confirm from '../components/confirm'
export default {
  name: "detail",
  data() {
    return {
      mainData:{},
      mainAreaData:{},
      detailInfo:'',

    }
  },
  components:{
    BaseInfo,
    Confirm
  },
  methods:{
    async queryMainData(id) {
      const res = await this.$api.requested({
        "id": "20230106154104",
        "content": {
          "sa_bankstatementid": this.$route.query.id
        }
      })
      this.mainData = res.data
      console.log(this.mainData);
      this.changeDataStructure()
      
    },
    changeDataStructure() {
      let that = this
      this.mainAreaData = [
        {
          label:'状态',
          value:this.mainData.status,
          style:function () {
            let style = {}
            switch (that.mainData.status) {
              case '已入账(人工)':
                style = {color:'#e09a1a'}
                break;
              case '已入账(系统)':
                style = {color:'#3874f6'}
                break;
              case '已确认(非货款)':
                style = {color:'#52C41A'}
                break;
              case '未入账':
                style = {color:'#000000'}
                break;
            }
            return style
          }
        },
        {
          label:'经销商编号',
          value:this.mainData.agentnum
        },
        {
          label:'经销商名称',
          value:this.mainData.enterprisename
        },
        {
          label:'付款账号',
          value:this.mainData.oppaccno
        },
        {
          label:'付款人开户行',
          value:this.mainData.oppbkname
        },
        {
          label:'付款人',
          value:this.mainData.oppname
        },
        {
          label:'交易金额',
          value:this.tool.formatAmount(this.mainData.amount,2)
        },
        {
          label:'交易时间',
          value:this.mainData.trantime
        },
        {
          label:'收入凭证号',
          value:this.mainData.billno
        }
      ]
      this.detailInfo = [
        {
          label:'状态',
          value:this.mainData.status,
          style:function () {
            let style = {}
            switch (that.mainData.status) {
              case '已入账(人工)':
                style = {color:'#52C41A'}
                break;
              case '已入账(系统)':
                style = {color:'#3874f6'}
                break;
              case '已确认(非贷货)':
                style = {color:'#52C41A'}
                break;
              case '未入账':
                style = {color:'#333333'}
                break;
            }
            return style
          }
        },
        {
          label:'经销商编号',
          value:this.mainData.agentnum
        },
        {
          label:'经销商名称',
          value:this.mainData.enterprisename
        },
        {
          label:'付款账号',
          value:this.mainData.oppaccno
        },
        {
          label:'付款人开户行',
          value:this.mainData.oppbkname
        },
        {
          label:'付款人',
          value:this.mainData.oppname
        },
        {
          label:'交易金额',
          value:this.mainData.amount
        },
        {
          label:'交易时间',
          value:this.mainData.trantime
        },
        {
          label:'收入凭证号',
          value:this.mainData.sa_cashbillid
        }
      ]
    },
    // 监听切换数据,上一页,下一页
    pageChange (id,rowindex,tabIndex) {
      this.flag = false
      tabIndex = this.$route.query.tabIndex
      this.$router.replace({path:'/bankStatementDetail',query:{id:id,rowindex:rowindex,tabIndex:tabIndex}})
      this.queryMainData(id)
    },
    onSuccess(){
      this.visible = false
      this.queryMainData(this.$route.query.id)
      this.$emit('onSuccess')
    }
  },
  mounted () {
    this.queryMainData(this.$route.query.id)
  },
  created() {
  }
}
</script>

<style scoped>

</style>