clearticket_ota/src/views/queryReport/checkAndPrintReport.vue

<template>
  <div class="form-wrap">
    <div class="searchBox">
      <el-form
        ref="form"
        :model="form"
        :inline="true"
        label-width="150px">
        <el-form-item
          label="首次核销起始时间"
          prop="checkTimeBegin">
          <el-date-picker
            v-model="form.checkTimeBegin"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item
          label="首次核销截止时间"
          prop="checkTimeEnd">
          <el-date-picker
            v-model="form.checkTimeEnd"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item
          label="分销商名称"
          prop="otaSourceNameList"
        >
          <el-select
            v-model="form.otaSourceNameList"
            multiple
            clearable
            placeholder="请选择"
            filterable>
            <el-option
              label="全部"
              value="">
            </el-option>
            <el-option
              v-for="item in otaList"
              :key="item.id"
              :label="item.otaSourceName"
              :value="item.otaSourceName">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="票种"
          prop="ticketTypeIdList">
          <el-select
            filterable
            multiple
            clearable
            v-model="form.ticketTypeIdList"
            placeholder="请选择">
            <el-option
              label="全部"
              value="">
            </el-option>
            <el-option
              v-for="item in ticketTypeList"
              :key="item.id"
              :label="item.name"
              :value="item.ticketTypeId">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div class="btn-wrap">
        <el-button @click="reset">重置</el-button>
        <el-button
          @click="exportReport"
          type="primary">导出</el-button>
        <el-button
          type="primary"
          @click="getData">搜索</el-button>
      </div>
    </div>

    <div class="tableBox">
      <!-- <div class="block-title">
        查询信息
        <span style="font-size:13px;color:black">(包含检票+取票，与分销商对账请用此报表)</span>
      </div> -->
      <el-table
        :data="tableData"
        stripe
        row-class-name="is-center"
        v-loading="loading">
        <el-table-column
          prop="otaSourceName"
          label="订单渠道">
        </el-table-column>
        <el-table-column
          prop="ticketTypeName"
          label="票种">
        </el-table-column>
        <el-table-column
          prop="unitPrice"
          label="单价">
        </el-table-column>
        <el-table-column
          prop="checkCount"
          label="检票次数">
        </el-table-column>
        <el-table-column
          prop="checkPrice"
          label="检票金额">
        </el-table-column>
        <el-table-column
          prop="checkMarketPrice"
          label="检票市场金额">
        </el-table-column>
        <el-table-column
          prop="checkSettlementPrice"
          label="检票结算金额">
        </el-table-column>
      </el-table>
    </div>

  </div>
</template>
<script>
import { getCheckAndPrintStatistics } from '@/api/queryReport'
import { getTicketTypeList } from '@/api/ticketType'
import { getOtaProjectList } from '@/api/ota'
import moment from 'moment'

export default {
  name: 'checkAndPrintReport',
  data () {
    return {
      ticketTypeList: [],
      otaList: [],
      projectName: localStorage.getItem('otaProject'),
      form: {
        export: false,
        checkTimeBegin: new Date(moment().startOf('month')),
        checkTimeEnd: new Date(moment().endOf('month')),
        otaSourceNameList: [], // 分销商名称
        ticketTypeIdList: [], // 票种名称
        pageNum: 1,
        pageSize: 10
      },
      tableData: [],
      total: 0,
      loading: false,
      currentItem: {},
      orderDialogVisible: false,
      guestDialogVisible: false
    }
  },
  computed: {
    queryClear () {
      return this.$store.state.user.permissionList.includes('stats:clearwx_query')
    }
  },
  created () {
    this.getTicketTypeList()
    this.getProductList()
    this.getData()
  },
  methods: {
    reset () {
      this.$refs.form.resetFields()
    },
    // 获取票种列表
    getTicketTypeList () {
      return getTicketTypeList({
        pageNum: 1,
        pageSize: -1
      }).then(res => {
        this.ticketTypeList = res.data.records || []
      })
    },
    getProductList () {
      return getOtaProjectList({
        pageNum: 1,
        pageSize: -1
      }).then(res => {
        this.otaList = res.data.records || []
      })
    },
    exportReport () {
      this.form.export = true
      getCheckAndPrintStatistics(this.form).then(() => {
        this.$confirm('导出成功，是否去下载页', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$router.push('/queryReport/reportExport')
        }).catch(() => {})
      }, () => {
        this.$notify.error({
          title: '提示',
          message: '导出失败'
        })
      })
      this.form.export = false
    },
    getData () {
      this.loading = true
      if (this.form.checkTimeBegin) {
        this.form.checkTimeBegin = moment(this.form.checkTimeBegin).format('YYYY-MM-DD HH:mm:ss')
      }
      if (this.form.checkTimeEnd) {
        this.form.checkTimeEnd = moment(this.form.checkTimeEnd).format('YYYY-MM-DD HH:mm:ss')
      }
      if (!this.form.otaSourceNameList || this.form.otaSourceNameList.length === 0) {
        this.form.otaSourceNameList = []
      }
      if (!this.form.ticketTypeIdList || this.form.ticketTypeIdList.length === 0) {
        this.form.ticketTypeIdList = []
      }
      getCheckAndPrintStatistics(this.form).then(res => {
        res.data.forEach(item => {
          if (item.ticketTypeName === '总计') {
            item.otaSourceName = '总计'
            item.ticketTypeName = ''
            item.price = ''
          } else if (item.ticketTypeName === '小计') {
            item.otaSourceName = '小计'
            item.ticketTypeName = ''
            item.price = ''
          }
        })
        this.tableData = res.data
        this.loading = false
      }).catch(() => {
        this.loading = false
      })
    }
  }
}
</script>

<style scoped>

</style>