<template>
  <div id="tax_hardware_monitor">
    <el-card v-loading="loading">
      <div slot="header">
        <span>税盘监控管理信息</span>
        <el-button
            @click="handleRefresh"
            style="float: right"
            type="primary"
        >刷 新
        </el-button
        >
        <el-button
            @click="handleTaxDeclaration"
            style="float: right; margin-right: 10px"
            type="primary"
        >清 卡
        </el-button>
        <el-button
            @click="invoiceTypeChange"
            style="float: right; margin-right: 10px"
            type="primary"
        >票种变更
        </el-button>
      </div>
      <el-table
          :data="resultList"
          border
          style="width: 100%"
          :height="tableHeight"
      >
        <el-table-column
            prop="invoiceCategory"
            :formatter="fmtInvoiceCategory"
            label="发票种类"
            align="center"
            width="160"
        >
        </el-table-column>
        <el-table-column
            prop="invoiceClosingTime"
            label="开票截止日期"
            align="center"
            width="160"
        ></el-table-column>
        <el-table-column
            prop="startDateSubmit"
            label="数据报送起始日期"
            align="center"
            width="160"
        ></el-table-column>
        <el-table-column
            prop="endDateSubmit"
            label="数据报送终止日期"
            align="center"
            width="160"
        ></el-table-column>
        <el-table-column
            prop="singleInvoiceMoneyLimit"
            label="单张发票开票金额限额（元）"
            align="center"
            width="120"
        ></el-table-column>
        <el-table-column
            prop="cumulativeInvoiceMoneyLimit"
            label="正数发票累计金额限额（元）"
            align="center"
            width="120"
        ></el-table-column>
        <el-table-column
            prop="negativeInvoiceMoneyLimit"
            label="负数发票累计金额限额（元）"
            align="center"
            width="120"
        ></el-table-column>
        <el-table-column
            prop="negativeInvoiceFlag"
            label="负数发票标识"
            align="center"
        ></el-table-column>
        <el-table-column
            prop="latestTaxDate"
            label="最新报税日期"
            align="center"
            width="160"
        ></el-table-column>
        <el-table-column
            prop="uploadDeadline"
            label="上传截止日期"
            align="center"
        ></el-table-column>
        <el-table-column
            prop="offlineInvoiceLength"
            label="离线开票时长（小时）"
            align="center"
        ></el-table-column>
        <el-table-column
            prop="offlineCumulativeMoney"
            label="离线正数累计金额（元）"
            align="center"
            width="120"
        ></el-table-column>
        <el-table-column
            prop="negativeOfflineCumulativeMoney"
            label="离线负数累计金额（元）"
            align="center"
            width="120"
        ></el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
import { EntDeviceMonitorInfo } from '@/api/ent_device'

import SKServer from '@/api/skserver'
import { AxiosRequestByBearer, AxiosRequestData } from '@/data/axios_request'
import cache from '@/utils/cache'

// 发票类别列表
const invoiceCategoryOptions = [
  {
    value: 1,
    label: '增值税普通电子发票',
  },
  {
    value: 2,
    label: '增值税电子专用发票',
  },
  {
    value: 3,
    label: '增值税普通纸质发票',
  },
  {
    value: 4,
    label: '增值税专用纸质发票',
  },
]

export default {
  name: 'TaxHardwareMonitor',
  data() {
    return {
      loading: false,
      resultList: [],
      tableHeight: '',
      token: '',
      deviceNum: '',
      entTaxId: ''
    }
  },
  created() {
    let company = JSON.parse(cache.getSession('company'))
    this.entTaxId = company.entTaxId
    this.deviceNum = company.defaultDeviceInfo.taxDiscId
    this.token = cache.getToken()
    this.tableHeight = window.innerHeight - 250
    this.callEntDeviceMonitorInfo()
  },
  mounted() {
    this.tableHeight = window.innerHeight - 250
    window.onresize = () => {
      return (() => {
        this.tableHeight = window.innerHeight - 250
      })()
    }
  },
  methods: {
    fmtInvoiceCategory(row, column, cellValue) {
      let result = cellValue
      for (const item of invoiceCategoryOptions) {
        if (item.value === cellValue) {
          result = item.label
          break
        }
      }
      return result
    },
    // 刷新
    handleRefresh() {
      this.callEntDeviceMonitorInfo()
    },
    // 企业设备监控信息查询
    callEntDeviceMonitorInfo() {
      this.loading = true
      EntDeviceMonitorInfo()
          .then((val) => {
            this.loading = false
            this.resultList = val.data
          })
          .catch((err) => {
            this.loading = false
            this.$message.error(err)
          })
    },
    handleTaxDeclaration() {
      this.loading = true
      let _this = this
      SKServer.taxDeclaration()
          .then((val) => {
            console.log(val)
            val.data.forEach((item, index) => {
              _this.$message.warning(item.clean_invoice)
            })
            _this.callEntDeviceMonitorInfo()
          })
          .catch((err) => {
            _this.$message.error(err)
          })
          .finally(() => {
            _this.loading = false
          })
    },
    // 票种变更
    async invoiceTypeChange() {
      if (this.token) {
        this.loading = true
        const url = '/v1/sk/change_invoice_category'
        let response = await AxiosRequestByBearer(
            url,
            this.token,
            {
              tax_no: this.entTaxId,
              device_no: this.deviceNum
            },
            false,
            1
        )
        if (response) {
          if (response.code === 200) {
            this.loading = false
            this.$message({
              message: response.message,
              type: 'success'
            })
          } else {
            this.loading = false
            this.$message.error(response.message)
          }
        }
      }
    }
  }
}
</script>
