<template>
  <div id="tax_table">
    <div style="flex: 1">
      <el-container>
        <el-table
            :data="invoiceList"
            border
            style="width: 100%; flex: 1"
            :height="tableHeight"
            ref="table"
        >
          <el-table-column
              prop="entName"
              label="序号"
              width="160"
          ></el-table-column>
          <el-table-column
              prop="entTaxId"
              label="发票代码"
              width="160"
          ></el-table-column>
          <el-table-column
              prop="entShortName"
              label="发票号码"
              width="160"
          ></el-table-column>
          <el-table-column
              prop="entType"
              label="开票日期"
              width="100"
              :formatter="getEntType"
          ></el-table-column>
          <el-table-column
              prop="entAddress"
              label="销方名称"
              width="160"
          ></el-table-column>
          <el-table-column
              prop="entContactPerson"
              label="金额"
              width="100"
          ></el-table-column>
          <el-table-column
              prop="entPhone"
              label="税额"
              width="120"
          ></el-table-column>
          <el-table-column
              prop="entPhone"
              label="有效税额"
              width="120"
          ></el-table-column>
          <el-table-column
              prop="entTaxOfficeCode"
              label="原所属期"
              width="120"
          ></el-table-column>
          <el-table-column
              prop="serviceStatus"
              label="发票类型"
              width="120"
              :formatter="getServerStatus"
          ></el-table-column>
          <el-table-column
              prop="serviceStatus"
              label="用途"
              width="120"
              :formatter="getServerStatus"
          ></el-table-column>
          <el-table-column
              prop="serviceStatus"
              label="发票状态"
              width="120"
              :formatter="getServerStatus"
          ></el-table-column>
          <el-table-column
              prop="serviceStatus"
              label="异常类型"
              width="120"
              :formatter="getServerStatus"
          ></el-table-column>
          <el-table-column
              prop="serviceStatus"
              label="管理状态"
              width="120"
              :formatter="getServerStatus"
          ></el-table-column>
          <el-table-column
              prop="serviceStatus"
              label="操作"
              width="120"
              :formatter="getServerStatus"
          ></el-table-column>
        </el-table>
      </el-container>
    </div>
    <div style="height: 50px">
      <el-row type="flex" :gutter="20">
        <el-col :span="12"></el-col>
        <el-col :span="12">
          <div style="text-align: right">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="pageNum"
                :page-sizes="pageSizes"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next"
                :total="totalNumber"
            ></el-pagination>
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import { AxiosRequestData } from '@/data/axios_request'
import cache from '@/utils/cache'

export default {
  name: 'tax_table',
  data() {
    return {
      token: '',
      pageNum: 1,
      pageSize: 10,
      totalNumber: 0,
      totalPage: 0,
      pageSizes: [10, 30, 50, 100],
      searchData: {
        entTaxId: '',
        selectDate: '',
        present: false,
        invoiceDateBegin: '',
        invoiceDateEnd: '',
        invoiceCode: '',
        invoiceNumber: '',
        inputInvoiceCategory: '',
        sellerName: '',
        sellerEntTaxId: '',
        pageNum: 1,
        pageSize: 10
      },
      invoiceList: {}
    }
  },
  methods: {
    // 变更每页显示的数据条数
    handleSizeChange(val) {
      this.pageSize = val
      this.getInvoiceInfo()
    },
    // 翻页
    handleCurrentChange(val) {
      this.pageNum = val
      this.getInvoiceInfo()
    },
    // 设置查询数据
    setSearchData(searchData) {
      this.searchData = searchData
      this.token = cache.getToken()
    },
    // 获取发票分页信息
    async getInvoiceInfo() {
      const url = '/sys/invoice/deduction/deductedInvoices'
      if (this.token) {
        let response = await AxiosRequestData(
            url,
            this.token,
            {
              entTaxId: this.searchData.entTaxId,
              period: this.searchData.selectDate,
              present: this.searchData.present,
              invoiceDateBegin: this.searchData.invoiceDateBegin,
              invoiceDateEnd: this.searchData.invoiceDateEnd,
              invoiceCode: this.searchData.invoiceCode,
              invoiceNumber: this.searchData.invoiceNumber,
              inputInvoiceCategory: this.searchData.inputInvoiceCategory,
              sellerName: this.searchData.sellerName,
              sellerEntTaxId: this.searchData.sellerEntTaxId,
              pageNum: this.pageNum,
              pageSize: this.pageSize
            },
            false,
            2
        )
        if (response) {
          console.log('数据')
          console.log(response)
          if (response.code === 0) {
            this.totalNumber = response.data.total
            this.totalPage = response.data.pages
            this.entList = response.data.records
          }
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
