item-management-web/src/views/finance/invoiceCheck.vue

<template>
  <div class="app-container">
    <!-- <div class="title-container">
      <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
    </div> -->
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="待审核发票" name="todo">
        <y-page-list-layout :page-list="pageData1" :page-para="listQuery1" :get-page-list="getList1" :pageSizes="[10, 20, 30, 50, 100, 200, 500, 1000]">
          <template slot="left">
            <el-input v-model="listQuery1.keyword" placeholder="关键字搜索..." clearable
              style="margin-left: 20px;width: 500px;float: left;">
            </el-input>
            <el-date-picker
              style="margin-left: 20px;float: left;"
              v-model="planDate1"
              type="daterange"
              align="center"
              unlink-panels
              range-separator="至"
              start-placeholder="计划开票（开始）"
              end-placeholder="计划开票（结束）"
              :picker-options="pickerOptions1" value-format="yyyy-MM-dd">
            </el-date-picker>
            <el-date-picker
              style="margin-left: 20px;float: left;"
              v-model="applyDate1"
              type="daterange"
              align="center"
              unlink-panels
              range-separator="至"
              start-placeholder="申请时间（开始）"
              end-placeholder="申请时间（结束）"
              :picker-options="pickerOptions1" value-format="yyyy-MM-dd">
            </el-date-picker>
            <el-button class="filter-item" style="margin-left: 10px;float: left;" type="primary" @click="searchList1" round>搜索
            </el-button>
            <el-button class="filter-item" style="float: left;" round type="success" @click="resetSearch1()">重置
            </el-button>
            <el-button class="filter-item" round type="info" @click="exportList1()">导出
            </el-button>
          </template>
          <el-table ref="table" size="medium" slot="table" :data="pageData1.records" show-summary  border
            :summary-method="getSummaries" fit stripe highlight-current-row
            :header-row-style="{ color: '#333333' }" style="
              border-left: 1px solid #ebeced;
              border-right: 1px solid #ebeced;
              color: #333333;">
            <el-table-column label="业务类型" align="center">
              <template slot-scope="{row}">
                <span>{{ row.businessType}}</span>
              </template>
            </el-table-column>
            <el-table-column label="订单名称" align="center" width="150" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.orderName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="订单号" align="center" width="120">
              <template slot-scope="{row}">
                <span>{{ row.orderId }}</span>
              </template>
            </el-table-column>
            <el-table-column label="产品号" align="center" width="200">
              <template slot-scope="{row}">
                <span>{{ row.productionNo?row.productionNo:'--' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票抬头" align="center" width="150" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.title }}</span>
              </template>
            </el-table-column>
            <el-table-column label="税号" align="center">
              <template slot-scope="{row}">
                <span>{{ row.taxNo }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票类型" align="center">
              <template slot-scope="{row}">
                <span>{{ row.type }}</span>
              </template>
            </el-table-column>
            <el-table-column label="待开金额" align="center" prop="planAmount">
              <template slot-scope="{row}">
                <span>{{ row.planAmount }}</span>
              </template>
            </el-table-column>
            <el-table-column label="计划开票时间" align="center">
              <template slot-scope="{row}">
                <span>{{ row.planMakeDate}}</span>
              </template>
            </el-table-column>
            <el-table-column label="备注" align="center" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.remark==null?'-':row.remark}}</span>
              </template>
            </el-table-column>
            <el-table-column label="申请人" align="center">
              <template slot-scope="{row}">
                <span>{{ row.applyName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="申请时间" align="center">
              <template slot-scope="{row}">
                <span>{{ row.created }}</span>
              </template>
            </el-table-column>
            <el-table-column label="开票状态" align="center">
              <template slot-scope="{row}">
                <span style="color:red;font-weight:bold">{{ row.state }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center" >
              <template slot-scope="{row}">
                  <PermissionButton  menu-code="_views_make_invoice_check" class-name="filter-item" type="text"
                  :page-jump="false"  @click="openMakeDialog(row)" />
              </template>
            </el-table-column>
          </el-table>
        </y-page-list-layout>
      </el-tab-pane>
      <el-tab-pane label="已开发票" name="done">
        <y-page-list-layout :page-list="pageData2" :page-para="listQuery2" :get-page-list="getList2" :pageSizes="[10, 20, 30, 50, 100, 200, 500, 1000]">
          <template slot="left">
            <el-input v-model="listQuery2.keyword" placeholder="关键字搜索..." clearable
              style="margin-left: 20px;width: 500px;float: left;">
            </el-input>
            <el-date-picker
              style="margin-left: 20px;float: left;"
              v-model="realDate1"
              type="daterange"
              align="center"
              unlink-panels
              range-separator="至"
              start-placeholder="实际开票（开始）"
              end-placeholder="实际开票（结束）"
              :picker-options="pickerOptions2" value-format="yyyy-MM-dd">
            </el-date-picker>
            <el-date-picker
              style="margin-left: 20px;float: left;"
              v-model="applyDate2"
              type="daterange"
              align="center"
              unlink-panels
              range-separator="至"
              start-placeholder="申请时间（开始）"
              end-placeholder="申请时间（结束）"
              :picker-options="pickerOptions2" value-format="yyyy-MM-dd">
            </el-date-picker>
            <el-button class="filter-item" style="margin-left: 10px;float: left;" type="primary" @click="searchList2" round>搜索
            </el-button>
            <el-button class="filter-item" style="float: left;" round type="success" @click="resetSearch2()">重置
            </el-button>
            <el-button class="filter-item" round type="info" @click="exportList2()">导出
            </el-button>
          </template>
          <el-table ref="table" size="medium" slot="table" :data="pageData2.records" show-summary  border
            :summary-method="getSummaries" fit stripe highlight-current-row
            :header-row-style="{ color: '#333333' }" style="
              border-left: 1px solid #ebeced;
              border-right: 1px solid #ebeced;
              color: #333333;">
            <el-table-column label="业务类型" align="center">
              <template slot-scope="{row}">
                <span>{{ row.businessType}}</span>
              </template>
            </el-table-column>
            <el-table-column label="订单名称" align="center" width="150" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.orderName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="订单号" align="center" width="120">
              <template slot-scope="{row}">
                <span>{{ row.orderId }}</span>
              </template>
            </el-table-column>
            <el-table-column label="产品号" align="center" width="200">
              <template slot-scope="{row}">
                <span>{{ row.productionNo?row.productionNo:'--' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票抬头" align="center" width="150" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.title }}</span>
              </template>
            </el-table-column>
            <el-table-column label="税号" align="center">
              <template slot-scope="{row}">
                <span>{{ row.taxNo }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票类型" align="center">
              <template slot-scope="{row}">
                <span>{{ row.type }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票号" align="center">
              <template slot-scope="{row}">
                <span>{{ row.ticketNo }}</span>
              </template>
            </el-table-column>
            <el-table-column label="已开金额" align="center" prop="planAmount">
              <template slot-scope="{row}">
                <span>{{ row.realAmount }}</span>
              </template>
            </el-table-column>
            <el-table-column label="实际开票时间" align="center">
              <template slot-scope="{row}">
                <span>{{ row.realMakeDate}}</span>
              </template>
            </el-table-column>
            <el-table-column label="备注" align="center" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.remark==null?'-':row.remark}}</span>
              </template>
            </el-table-column>
            <el-table-column label="申请人" align="center">
              <template slot-scope="{row}">
                <span>{{ row.applyName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="申请时间" align="center">
              <template slot-scope="{row}">
                <span>{{ row.created }}</span>
              </template>
            </el-table-column>
            <el-table-column label="开票状态" align="center">
              <template slot-scope="{row}">
                <span style="color:red;font-weight:bold">{{ row.state }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center" >
              <template slot-scope="{row}">
                  <PermissionButton  menu-code="_views_make_invoice_check" class-name="filter-item" type="text"
                  :page-jump="false"  @click="openMakeDialog(row)" />
              </template>
            </el-table-column>
          </el-table>
        </y-page-list-layout>
      </el-tab-pane>
      <el-tab-pane label="已作废发票" name="cancle">
        <y-page-list-layout :page-list="pageData3" :page-para="listQuery3" :get-page-list="getList3" :pageSizes="[10, 20, 30, 50, 100, 200, 500, 1000]">
          <template slot="left">
            <el-input v-model="listQuery3.keyword" placeholder="关键字搜索..." clearable
              style="margin-left: 20px;width: 500px;float: left;">
            </el-input>
            <el-date-picker
              style="margin-left: 20px;float: left;"
              v-model="destroyDate1"
              type="daterange"
              align="center"
              unlink-panels
              range-separator="至"
              start-placeholder="作废时间（开始）"
              end-placeholder="作废时间（结束）"
              :picker-options="pickerOptions3" value-format="yyyy-MM-dd">
            </el-date-picker>
            <el-date-picker
              style="margin-left: 20px;float: left;"
              v-model="applyDate3"
              type="daterange"
              align="center"
              unlink-panels
              range-separator="至"
              start-placeholder="申请时间（开始）"
              end-placeholder="申请时间（结束）"
              :picker-options="pickerOptions3" value-format="yyyy-MM-dd">
            </el-date-picker>
            <el-button class="filter-item" style="margin-left: 10px;float: left;" type="primary" @click="searchList3" round>搜索
            </el-button>
            <el-button class="filter-item" style="float: left;" round type="success" @click="resetSearch3()">重置
            </el-button>
            <el-button class="filter-item" round type="info" @click="exportList3()">导出
            </el-button>
          </template>
          <el-table ref="table" size="medium" slot="table" :data="pageData3.records" show-summary  border
            :summary-method="getSummaries" fit stripe highlight-current-row
            :header-row-style="{ color: '#333333' }" style="
              border-left: 1px solid #ebeced;
              border-right: 1px solid #ebeced;
              color: #333333;">
            <el-table-column label="业务类型" align="center">
              <template slot-scope="{row}">
                <span>{{ row.businessType}}</span>
              </template>
            </el-table-column>
            <el-table-column label="订单名称" align="center" width="150" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.orderName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="订单号" align="center" width="120">
              <template slot-scope="{row}">
                <span>{{ row.orderId }}</span>
              </template>
            </el-table-column>
            <el-table-column label="产品号" align="center" width="200">
              <template slot-scope="{row}">
                <span>{{ row.productionNo?row.productionNo:'--' }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票抬头" align="center" width="150" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.title }}</span>
              </template>
            </el-table-column>
            <el-table-column label="税号" align="center">
              <template slot-scope="{row}">
                <span>{{ row.taxNo }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票类型" align="center">
              <template slot-scope="{row}">
                <span>{{ row.type }}</span>
              </template>
            </el-table-column>
            <el-table-column label="发票号" align="center">
              <template slot-scope="{row}">
                <span>{{ row.ticketNo }}</span>
              </template>
            </el-table-column>
            <el-table-column label="已开金额" align="center" prop="planAmount">
              <template slot-scope="{row}">
                <span>{{ row.planAmount }}</span>
              </template>
            </el-table-column>
            <el-table-column label="作废时间" align="center">
              <template slot-scope="{row}">
                <span>{{ row.modified}}</span>
              </template>
            </el-table-column>
            <el-table-column label="备注" align="center" show-overflow-tooltip>
              <template slot-scope="{row}">
                <span>{{ row.remark==null?'-':row.remark}}</span>
              </template>
            </el-table-column>
            <el-table-column label="申请人" align="center">
              <template slot-scope="{row}">
                <span>{{ row.applyName }}</span>
              </template>
            </el-table-column>
            <el-table-column label="申请时间" align="center">
              <template slot-scope="{row}">
                <span>{{ row.created }}</span>
              </template>
            </el-table-column>
            <el-table-column label="开票状态" align="center">
              <template slot-scope="{row}">
                <span style="color:red;font-weight:bold">{{ row.state }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center" >
              <template slot-scope="{row}">
                  <PermissionButton  menu-code="_views_make_invoice_check" class-name="filter-item" type="text"
                  :page-jump="false"  @click="openMakeDialog(row)" />
              </template>
            </el-table-column>
          </el-table>
        </y-page-list-layout>
      </el-tab-pane>
    </el-tabs>
   
    <el-dialog :visible.sync="newInvoiceDialog" width="75%" top="10vh" center  custom-class="doWarehouseClass">
      <el-form ref="invoice" :model="invoice">
        <el-divider content-position="left">开票信息</el-divider>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="发票抬头：" :rules="{ required: true, message: '发票抬头不能为空', trigger: 'blur' }" prop="title"
              label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.title" class="filter-item" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="发票类型：" :rules="{ required: true, message: '发票类型不能为空', trigger: 'blur' }" prop="type"
              label-width="140px" class="postInfo-container-item">
              <el-select v-model="invoice.type" style="width:100%">
                <el-option label="普票" value="普票"></el-option>
                <el-option label="专票" value="专票"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="税号：" :rules="{ required: true, message: '税号不能为空', trigger: 'blur' }" prop="taxNo"
              label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.taxNo" class="filter-item" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="计划开票日期：" prop="planMakeDate"
              :rules="{ required: true, message: '计划开票日期不能为空', trigger: 'blur' }" label-width="140px"
              class="postInfo-container-item">
              <el-date-picker v-model="invoice.planMakeDate" type="date" placeholder="选择日期" value-format="yyyy-MM-dd" style="width:100%">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="待开金额(元):" prop="planAmount"
              :rules="{ required: true, message: '使用权面积不能为空', trigger: 'blur' }" label-width="140px"
              class="postInfo-container-item">
              <el-input-number :precision="2" :min="0" :value-on-clear="0" v-model.number="invoice.planAmount"
                type="number" style="width:100%" class="filter-item" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="是否收款:" label-width="140px"
              class="postInfo-container-item">
              <el-radio-group :value="invoice.realPayAmount?'已收款':'未收款'">
                <el-radio label="已收款"></el-radio>
                <el-radio label="未收款"></el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="开票项目：" prop="makeItem" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.makeItem" class="filter-item" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="项目数量:" prop="itemQuantity" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.itemQuantity" class="filter-item" />
            </el-form-item>
          </el-col>
         
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="计量单位：" prop="itemUnit" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.itemUnit" class="filter-item" placeholder="个/套/箱/次/斤/公斤/..." />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="24" :span="6">
            <el-form-item label="备注：" prop="remark" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.remark" type="textarea" :autosize="{ minRows: 5, maxRows: 8}"  class="filter-item" />
            </el-form-item>
          </el-col>
        </el-row>
        <!-- <el-divider content-position="left">银行信息</el-divider>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="开户行：" prop="bankName" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.bankName" class="filter-item" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="6" :span="6">
            <el-form-item label="银行账号：" prop="bankAccount" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.bankAccount" class="filter-item" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="地址：" prop="bankAddress" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.bankAddress" class="filter-item" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="6" :span="6">
            <el-form-item label="电话：" prop="bankTel" label-width="140px" class="postInfo-container-item">
              <el-input v-model.trim="invoice.bankTel" class="filter-item" />
            </el-form-item>
          </el-col>
        </el-row> -->
        <el-divider content-position="left">发票信息</el-divider>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="发票号码：" prop="ticketNo" label-width="140px" class="postInfo-container-item"
            :rules="{ required: true, message: '发票号码不能为空', trigger: 'blur' }">
              <el-input v-model="invoice.ticketNo" class="filter-item" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="实开金额(元)：" prop="realAmount" label-width="140px" class="postInfo-container-item"
            :rules="{ required: true, message: '实开金额不能为空', trigger: 'blur' }">
              <el-input-number :precision="2" :min="0" :value-on-clear="0" v-model.number="invoice.realAmount" style="width: 100%;" class="filter-item" readonly disabled />
            </el-form-item>
          </el-col>
         
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="申请日期：" prop="created" label-width="140px" class="postInfo-container-item">
              <el-input :value="invoice.created" class="filter-item" readonly disabled/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="实际开票日期：" prop="realMakeDate" label-width="140px" class="postInfo-container-item"
            :rules="{ required: true, message: '实际开票日期不能为空', trigger: 'blur' }">
              <el-date-picker v-model="invoice.realMakeDate" type="date" placeholder="选择日期" value-format="yyyy-MM-dd" style="width:100%">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="订单类型：" prop="businessType" label-width="140px" class="postInfo-container-item">
              <el-input :value="invoice.businessType" class="filter-item" readonly disabled/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="开票人：" prop="applyName" label-width="140px" class="postInfo-container-item">
              <el-input :value="invoice.applyName" class="filter-item" readonly disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="订单编号：" prop="orderId" label-width="140px" class="postInfo-container-item">
              <el-input :value="invoice.orderId" class="filter-item" readonly disabled/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :lg="12" :span="6">
            <el-form-item label="产品号：" prop="productionNo" label-width="140px" class="postInfo-container-item">
              <el-input :value="invoice.productionNo" class="filter-item" readonly disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="this.invoice.state ==='申请作废' || this.invoice.state ==='已作废'">
          <el-col :xs="24" :sm="12" :lg="24" :span="6">
            <el-form-item label="作废原因：" prop="orderId" label-width="140px" :class="['postInfo-container-item','reason']">
              <el-input  :value="invoice.reason" :class="['filter-item','resaon_input']" readonly disabled/>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="newInvoiceDialog = false">取 消</el-button>
        <el-button type="primary" @click="makeInvoice()" v-if="this.invoice.state==='审核中'">确认开票</el-button>
        <el-button type="danger" @click="refuseApply()"  v-if="this.invoice.state==='审核中'">拒绝申请</el-button>
        <el-button type="danger" @click="cancelling()"  v-if="this.invoice.state==='申请作废'">同意作废</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import YPageListLayout from '@/components/YPageListLayout'
import Breadcrumb from '@/components/Breadcrumb'

export default {
  name: 'invoiceCheck',
  components: {
    Breadcrumb,
    YPageListLayout,
  },
  filters: {
    
  },
  data() {
    return {
      activeName: 'todo',
      pageData1: { records: [] },
      pageData2: { records: [] },
      pageData3: { records: [] },
      listQuery1: {
        page: 1,
        size: 200,
        descs: 'id',
        keyword:null,
        state:'审核中'
      },
      listQuery2: {
        page: 1,
        size: 200,
        descs: 'id',
        keyword:null,
        state:'已开票'
      },
      listQuery3: {
        page: 1,
        size: 200,
        descs: 'id',
        keyword:null,
        state:'已作废'
      },
      newInvoiceDialog:false,
      invoice:{
        id:null,
        productionFundId:null,
        title:null,
        type:null,
        taxNo:null,
        planAmount:null,
        planMakeDate:null,
        bankName:null,
        bankAccount:null,
        bankAddress:null,
        bankTel:null,
        makeItem:null,
        itemQuantity:null,
        itemUnit:null,
        taxRate:null,
        taxAmount:null,
        remark:null,
        businessType:null,
        reportNo:null
      },
      planDate1:"",
      applyDate1:"",
      realDate1:"",
      applyDate2:"",
      destroyDate1:"",
      applyDate3:"",
      pickerOptions1: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
      },
      pickerOptions2: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
      },
      pickerOptions3: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
      },
    }
  },
  created() {
    this.getList1();
  },
  methods: {

    handleClick(tab, event) {
        if (tab.name ==='todo'){
          this.getList1();
        }
        if (tab.name ==='done'){
          this.getList2();
        }
        if (tab.name ==='cancle'){
          this.getList3();
        }
    },
  
    resetSearch1() {
      this.$router.push({ query: {} });
      this.planDate1 = '';
      this.applyDate1 = '';
      this.listQuery1 = {
        current: 1,
        size: 200,
        descs: 'id',
        state:'审核中'
      }
      this.getList1()
    },
   
    searchList1() {
      // 重置分页
      this.listQuery1.page = 1
      this.listQuery1.size = 200
      if (this.planDate1){
        this.listQuery1.pStartDate = this.planDate1[0];
        this.listQuery1.pEndDate = this.planDate1[1];
      }
      if (this.applyDate1){
        this.listQuery1.aStartDate = this.applyDate1[0]+' 00:00:00';
        this.listQuery1.aEndDate = this.applyDate1[1]+' 23:59:59';
      }
      this.getList1()
    },
    resetSearch2() {
      this.$router.push({ query: {} });
      this.realDate1 = '';
      this.applyDate2 = '';
      this.listQuery2 = {
        current: 1,
        size: 200,
        descs: 'id',
        state:'已开票'
      }
      this.getList2()
    },
   
    searchList2() {
      // 重置分页
      this.listQuery2.page = 1
      this.listQuery2.size = 200
      if (this.realDate1){
        this.listQuery2.rStartDate = this.realDate1[0];
        this.listQuery2.rEndDate = this.realDate1[1];
      }
      if (this.applyDate2){
        this.listQuery2.aStartDate = this.applyDate2[0]+' 00:00:00';
        this.listQuery2.aEndDate = this.applyDate2[1]+' 23:59:59';
      }
      this.getList2()
    },
    resetSearch3() {
      this.$router.push({ query: {} });
      this.destroyDate1 = '';
      this.applyDate3 = '';
      this.listQuery3 = {
        current: 1,
        size: 1000,
        descs: 'id',
        state:'已作废'
      }
      this.getList3()
    },
   
    searchList3() {
      // 重置分页
      this.listQuery3.page = 1
      this.listQuery3.size = 200
      if (this.destroyDate1){
        this.listQuery3.dStartDate = this.destroyDate1[0];
        this.listQuery3.dEndDate = this.destroyDate1[1];
      }
      if (this.applyDate3){
        this.listQuery3.aStartDate = this.applyDate3[0]+' 00:00:00';
        this.listQuery3.aEndDate = this.applyDate3[1]+' 23:59:59';
      }
      this.getList3()
    },
    getList1() {
      let loadingInstance = this.$loading({ fullscreen: true });

      this.$api.financeInvoice.list(Object.assign({}, this.listQuery1)).then(res=>{
        if (res.code ===200){
          loadingInstance.close();
            this.pageData1 = res.data;
        }
      })
    },
    exportList1() {
      this.$utils.exportUtil(
            "/financeInvoice/export", this.listQuery1,
            "导出"
        );
    },
    getList2() {
      let loadingInstance = this.$loading({ fullscreen: true });

      this.$api.financeInvoice.list(Object.assign({}, this.listQuery2)).then(res=>{
        if (res.code ===200){
          loadingInstance.close();
            this.pageData2 = res.data;
        }
      })
    },
    exportList2() {
      this.$utils.exportUtil(
            "/financeInvoice/export", this.listQuery2,
            "导出"
        );
    },
    getList3() {
      let loadingInstance = this.$loading({ fullscreen: true });

      this.$api.financeInvoice.list(Object.assign({}, this.listQuery3)).then(res=>{
        if (res.code ===200){
          loadingInstance.close();
            this.pageData3 = res.data;
        }
      })
    },
    exportList3() {
      this.$utils.exportUtil(
            "/financeInvoice/export", this.listQuery3,
            "导出"
        );
    },

    openMakeDialog(row){
      this.newInvoiceDialog= true;
      this.invoice = row;
      if (!this.invoice.realAmount){
        this.invoice.realAmount = row.planAmount;
      }
    },
    makeInvoice(){
      this.$refs.invoice.validate(valid=>{
        if(valid){
          this.$confirm('请确认开票信息是否正确操作后无法修改!','提示',{
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
            center: true
          }).then(()=>{
            if (this.invoice.realAmount===0){
              this.$notify({
                  title: '提示',
                  message: '实开金额不能为0.00',
                  type: 'info',
                  duration: 2000
                });
                return;
            }
            this.invoice.state = '已开票';
            this.$api.financeInvoice.invoiceCheck(this.invoice).then(res=>{
              if (res.code === 200 && res.data){
                this.$notify({
                  title: '成功',
                  message: '操作成功',
                  type: 'success',
                  duration: 2000
                });
                this.newInvoiceDialog= false;
                this.getList1();
              }else {
                this.$notify({
                  title: '失败',
                  message: '操作失败',
                  type: 'error',
                  duration: 2000
                });
              }
            })
          })
        }
      })
    },
    refuseApply(){
      this.$prompt('请填写拒绝理由，若无可直接点击确认按钮。','提示',{
                confirmButtonText: '确认',
                cancelButtonText: '取消',
                type: "warning",
      }).then(({value})=>{
          this.invoice.reason = value;
          this.invoice.state = '驳回';
          this.$api.financeInvoice.edit(this.invoice).then(res=>{
              if (res.code === 200 && res.data){
                this.$notify({
                  title: '成功',
                  message: '操作成功',
                  type: 'success',
                  duration: 2000
                });
                this.newInvoiceDialog= false;
                this.getList1();
              }else {
                this.$notify({
                  title: '失败',
                  message: '操作失败',
                  type: 'error',
                  duration: 2000
                });
              }
            })
      })
    },
    cancelling(){
      this.$confirm('请确认是否作废此发票？','提示',{
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
            center: true
          }).then(()=>{
            this.$api.financeInvoice.cancelling(this.invoice.id).then(res=>{
              if (res.code === 200 && res.data){
                this.$notify({
                  title: '成功',
                  message: '作废成功',
                  type: 'success',
                  duration: 2000
                });
                this.newInvoiceDialog= false;
                this.getList1();
              }else {
                this.$notify({
                  title: '失败',
                  message: '作废失败',
                  type: 'error',
                  duration: 2000
                });
              }
            })
          })
    },
    getSummaries(param){
      const { columns, data } = param;
        const sums = [];
        columns.forEach((column, index) => {
          
          if (index === 0) {
            sums[index] = '合计';
            return;
          }
          const values = data.map(item => Number(item[column.property]));
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0).toFixed(2);
            sums[index] += ' 元';
          } else {
            sums[index] = '-';
          }
        });

        return sums;
    }
  },
  
}
</script>
<style lang="scss" scoped>
 /deep/.doWarehouseClass {
     border-radius: 10px;
    }

  .reason{
    /deep/ .el-form-item__label {
    color: red;
    }
   
  }
  .resaon_input{
    /deep/ .el-input__inner{
      color: red !important;
      font-weight: bold;
    }
  }

   
</style>