ngds/backendEle/src/components/WithdrawTable.vue

<template>
  <div class="leo-withdrawTable" v-loading="loading">
    <div class="filter-box">
      <filter-user :filter-types="filterTypes" @select-value="handleFilterUser"></filter-user>
    </div>
    <el-table ref="multipleTable" :data="tableData" stripe style="width: 100%;"
              @selection-change="handleSelectionChange" :height="tool.getTableHeight(true)">
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column label="提现流水号" width="220">
        <template slot-scope="scope">
          <el-tag type="" size="small" class="no-border">
            {{scope.row.SN}}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column label="提现期数" width="120">
        <template slot-scope="scope">
          {{scope.row.WITHDRAW_PERIOD_NUM}}
        </template>
      </el-table-column>
      <el-table-column label="提现时间" width="170">
        <template slot-scope="scope">
          {{tool.formatDate(scope.row.CREATED_AT)}}
        </template>
      </el-table-column>
      <el-table-column label="Estimated date of payment" width="120"> <!-- 预计付款日期 -->
        <template slot-scope="scope">
          {{tool.formatDate(scope.row.PLAN_PAID_AT,false)}}
        </template>
      </el-table-column>
      <el-table-column label="付款日期" width="120">
        <template slot-scope="scope">
          {{tool.formatDate(scope.row.PAID_AT,false)}}
        </template>
      </el-table-column>
      <el-table-column label="付款状态" width="120">
        <template slot-scope="scope">
          {{scope.row.AUDIT_STATUS_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="付款失败时间" width="170">
        <template slot-scope="scope">
          {{tool.formatDate(scope.row.PAID_FAIL_AT)}}
        </template>
      </el-table-column>
      <el-table-column label="银行信息更新时间" width="170">
        <template slot-scope="scope">
          {{tool.formatDate(scope.row.BANK_INFO.BANK_UPDATED_AT)}}
        </template>
      </el-table-column>
      <el-table-column label="付款失败原因" width="170">
        <template slot-scope="scope">
          {{scope.row.PAID_FAIL_REMARK}}
        </template>
      </el-table-column>
      <el-table-column label="会员编号" width="150">
        <template slot-scope="scope">
          {{scope.row.BASE_INFO.USER_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="会员姓名" width="110">
        <template slot-scope="scope">
          {{scope.row.BASE_INFO.REAL_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="会员状态" width="110">
        <template slot-scope="scope">
          {{(scope.row.BASE_INFO.STATUS_NAME)}}
        </template>
      </el-table-column>
<!--      <el-table-column label="身份证号" width="170">-->
<!--        <template slot-scope="scope">-->
<!--          {{scope.row.BASE_INFO.ID_CARD}}-->
<!--        </template>-->
<!--      </el-table-column>-->
      <el-table-column label="提现方式">
        <template slot-scope="scope">
          {{scope.row.IS_AUTO_WITHDRAW==='1'?'auto withdrawal':'manual withdrawal'}}
        </template>
      </el-table-column>
      <el-table-column label="提现金额" width="110">
        <template slot-scope="scope">
          {{tool.formatPrice(scope.row.AMOUNT)}}
        </template>
      </el-table-column>
      <el-table-column label="手续费" width="110">
        <template slot-scope="scope">
          {{tool.formatPrice(scope.row.FEES)}}
        </template>
      </el-table-column>
      <el-table-column label="实际到账金额" width="110">
        <template slot-scope="scope">
          {{tool.formatPrice(scope.row.REAL_AMOUNT)}}
        </template>
      </el-table-column>
      <!--<el-table-column label="付款类型">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.PAY_TYPE==='1'?'见票付款':'无票付款'}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <!--<el-table-column label="发票金额" width="110">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.INVOICE_AMOUNT}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <!--<el-table-column label="发票号" width="110">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.INVOICE_NUM}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <!--<el-table-column label="应注册类型" width="100">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.BASE_INFO.SHOULD_REG_TYPE?regTypes[scope.row.BASE_INFO.SHOULD_REG_TYPE].TYPE_NAME:''}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <!--<el-table-column label="实时注册类型" width="110">-->
        <!--<template slot-scope="scope">-->
          <!--{{regTypes[scope.row.BASE_INFO.REG_TYPE].TYPE_NAME}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <!--<el-table-column label="注册名称" width="160">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.BASE_INFO.REG_NAME}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <el-table-column label="开户名" width="150">
        <template slot-scope="scope">
          {{scope.row.BANK_INFO.REAL_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="开户行" width="150">
        <template slot-scope="scope">
          {{scope.row.BANK_INFO.OPEN_BANK_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="开户省份" width="110">
        <template slot-scope="scope">
          {{scope.row.BANK_INFO.BANK_PROVINCE_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="开户城市" width="110">
        <template slot-scope="scope">
          {{scope.row.BANK_INFO.BANK_CITY_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="开户区县" width="110">
        <template slot-scope="scope">
          {{scope.row.BANK_INFO.BANK_COUNTY_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="开户支行" width="180">
        <template slot-scope="scope">
          {{scope.row.BANK_INFO.BANK_ADDRESS}}
        </template>
      </el-table-column>
      <el-table-column label="银行账户" width="180">
        <template slot-scope="scope">
          {{scope.row.BANK_INFO.BANK_NO}}
        </template>
      </el-table-column>
      <el-table-column label="操作时间" width="170">
        <template slot-scope="scope">
          {{tool.formatDate(scope.row.UPDATED_AT)}}
        </template>
      </el-table-column>
      <el-table-column label="操作管理员" width="150">
        <template slot-scope="scope">
          {{scope.row.UPDATE_ADMIN_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="审核时间" width="170">
        <template slot-scope="scope">
          {{tool.formatDate(scope.row.AUDITED_AT)}}
        </template>
      </el-table-column>
      <el-table-column label="审核人" width="150">
        <template slot-scope="scope">
          {{scope.row.AUDIT_ADMIN_NAME}}
        </template>
      </el-table-column>
      <el-table-column label="Remark" width="150"> <!-- 备注 -->
        <template slot-scope="scope">
          {{scope.row.REMARK}}
        </template>
      </el-table-column>
      <!--<el-table-column label="体系名称" width="150">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.BASE_INFO.SYSTEM_NAME}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <!--<el-table-column label="所属报单主体编号" width="150">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.BASE_INFO.DEC_USER_NAME}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <!--<el-table-column label="所属报单主体姓名" width="150">-->
        <!--<template slot-scope="scope">-->
          <!--{{scope.row.BASE_INFO.DEC_REAL_NAME}}-->
        <!--</template>-->
      <!--</el-table-column>-->
      <el-table-column label="手机号码" width="110">
        <template slot-scope="scope">
          {{scope.row.BASE_INFO.MOBILE}}
        </template>
      </el-table-column>
      <el-table-column label="备用手机号码" width="120">
        <template slot-scope="scope">
          {{scope.row.BASE_INFO.TEL}}
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="180">
        <template slot-scope="scope">
          <el-dropdown size="small" trigger="click"
                       v-if="withdrawStatus!==-1 && scope.row.AUDIT_STATUS!=='7' && (permission.hasPermission(`finance/withdraw-status`)||permission.hasPermission(`finance/invoice-audit-add`)||permission.hasPermission(`finance/invoice-audit-edit`))">
            <el-button type="primary" size="small" @click.stop="">
              Action<i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <!--<el-dropdown-item command="add"-->
                                <!--@click.native="handleAddInvoiceShow(scope.row)"-->
                                <!--v-show="(scope.row.AUDIT_STATUS==='0'||scope.row.AUDIT_STATUS==='1') && (permission.hasPermission(`finance/invoice-audit-add`)||permission.hasPermission(`finance/invoice-audit-edit`))">-->
                <!--补录发票信息-->
              <!--</el-dropdown-item>-->
              <el-dropdown-item command="status"
                                @click.native="handleStatusShow(scope.row, 2, 'Are you sure to approve the current withdrawal?')"
                                v-show="scope.row.AUDIT_STATUS==='0' && permission.hasPermission(`finance/withdraw-status`)"> <!-- 确定对当前提现进行审核通过操作？ -->
                Approve <!-- 审核通过 -->
              </el-dropdown-item>
              <el-dropdown-item command="status"
                                @click.native="handleStatusShow(scope.row, 3, 'Are you sure to set the current withdrawal as payment action?')"
                                v-show="scope.row.AUDIT_STATUS === '2' && permission.hasPermission(`finance/withdraw-status`)"> <!-- 确定对当前提现进行设为待付款操作？ -->
                设为待付款
              </el-dropdown-item>
              <el-dropdown-item command="status"
                                @click.native="handleStatusShow(scope.row, 6, 'Are you sure to set the current withdrawal as paid?')"
                                v-show="scope.row.AUDIT_STATUS === '3' && permission.hasPermission(`finance/withdraw-status`)"> <!-- 确定对当前提现进行设为已付款操作 -->
                设为已付款
              </el-dropdown-item>
              <el-dropdown-item command="status"
                                @click.native="handleStatusShow(scope.row, 3, 'Are you sure to set the current withdrawal as payment action?')"
                                v-show="scope.row.AUDIT_STATUS === '4' && permission.hasPermission(`finance/withdraw-status`)"> <!-- 确定对当前提现进行设为待付款操作？ -->
                设为待付款
              </el-dropdown-item>
              <el-dropdown-item command="status"
                                @click.native="handleStatusShow(scope.row, 4, 'Are you sure to set payment failure for the current withdrawal?', '付款失败备注')"
                                v-show="scope.row.AUDIT_STATUS === '6' && permission.hasPermission(`finance/withdraw-status`)"> <!-- 确定对当前提现进行设为付款失败操作？ -->
                设为付款失败
              </el-dropdown-item>
              <el-dropdown-item command="status"
                                @click.native="handleStatusShow(scope.row, 7, 'Determines that the current withdrawal is set to a withdrawal return operation?', 'Note on withdrawal return')"
                                v-show="scope.row.AUDIT_STATUS === '0' && permission.hasPermission(`finance/withdraw-status`)"> <!-- 确定对当前提现进行设为提现退回操作？ --> <!-- 提现退回备注 -->
                Return <!-- 设为提现退回 -->
              </el-dropdown-item>
              <el-dropdown-item command="status"
                                @click.native="handleStatusShow(scope.row, 7, '该会员已提供发票，请确认是否处理提现退回？', 'Note on withdrawal return')"
                                v-show="(scope.row.AUDIT_STATUS === '1'||scope.row.AUDIT_STATUS === '2'||scope.row.AUDIT_STATUS === '3') && permission.hasPermission(`finance/withdraw-status`)"> <!-- 提现退回备注 -->
                Return <!-- 设为提现退回 -->
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>
    <div class="white-box-footer">
      <el-button type="primary" size="small"
                 @click="handleStatusShow(null,3,'确定对所选提现进行设为待付款操作？')"
                 v-if="withdrawStatus===2&&permission.hasPermission(`finance/withdraw-status`)">标记为待付款
      </el-button>
      <el-button type="primary" size="small"
                 @click="handleStatusShow(null,6,'确定对所选提现进行设为已付款操作？')"
                 v-if="withdrawStatus===3&&permission.hasPermission(`finance/withdraw-status`)">标记为已付款
      </el-button>
      <el-button type="primary" size="small"
                 @click="handleStatusShow(null,4,'确定对所选提现进行设为付款失败操作？','付款失败备注')"
                 v-if="withdrawStatus===6&&permission.hasPermission(`finance/withdraw-status`)">标记为付款失败
      </el-button>

      <el-button type="primary" size="small"
                 @click="handleStatusShow(null,3,'确定对所选提现进行设为待付款操作？')"
                 v-if="withdrawStatus===4&&permission.hasPermission(`finance/withdraw-status`)">标记为待付款
      </el-button>

      <!--<el-input size="small" placeholder="Excel文件总行数" type="number" v-model="excelForm.rowCount" min="1"-->
                <!--v-if="withdrawStatus===6 && permission.hasPermission(`finance/import-withdraws-to-excel-table`) && permission.hasPermission(`finance/import-withdraws-paid-false`)"-->
                <!--style="width: 300px;overflow: hidden;">-->
        <!--<leo-excel-uploader slot="append"-->
                            <!--:request-upload-route="`file/upload-excel`"-->
                            <!--:request-import-to-excel-table-route="`finance/import-withdraws-to-excel-table`"-->
                            <!--:request-import-excel-table-to-data-route="`finance/import-withdraws-paid-false`"-->
                            <!--:import-row-count="excelForm.rowCount"-->
                            <!--excel-option="withdrawPaidFalse"-->
                            <!--upload-btn-title="Excel导入"-->
        <!--&gt;</leo-excel-uploader>-->
      <!--</el-input>-->
      <!--<el-button type="primary" size="small" @click="handleExcelPaidFalse"-->
                 <!--v-if="withdrawStatus===6 && (permission.hasPermission(`finance/import-withdraws-to-excel-table`) && permission.hasPermission(`finance/import-withdraws-paid-false`))">-->
        <!--下载Excel模板-->
      <!--</el-button>-->
      <el-button type="success" size="small" @click="handleExport"
                 v-show="permission.hasPermission(`finance/withdraw-export`)">Export Excel
      </el-button>
      <el-button type="primary" size="small" @click="handleAdd" v-if="false">新增提现</el-button>
      <pagination :total="totalCount" :page_size="pageSize" @size-change="handleSizeChange" @current-change="handleCurrentChange"></pagination>
    </div>
    <el-dialog title="修改提现信息" :visible.sync="dialogEditFormVisible">
      <el-form :model="form" label-width="150px" style="width:500px;" v-loading="dialogEditLoading">
        <el-form-item label="会员编号">
          <el-input v-model="form.baseInfo.USER_NAME" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="会员姓名">
          <el-input v-model="form.baseInfo.REAL_NAME" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="身份证号">
          <el-input v-model="form.baseInfo.ID_CARD" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="注册类型">
          <el-select v-model="form.baseInfo.REG_TYPE" placeholder="请选择注册类型" :disabled="true">
            <el-option v-for="(item,key) in regTypes" :label="item.TYPE_NAME" :value="item.ID"
                       :key="item.ID"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="提现金额">
          <el-input v-model="form.amount" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="Estimated date of payment"> <!-- 预计付款日期 -->
          <el-date-picker
              v-model="form.planPaidAt"
              type="date"
              placeholder="Select date"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions0"
          > <!-- 选择日期 -->
          </el-date-picker>
        </el-form-item>
        <el-form-item label="Remark"> <!-- 备注 -->
          <el-input v-model="form.createRemark"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogEditFormVisible = false">Cancel<!-- 取 消 --></el-button>
        <el-button type="primary" @click.native="handleEdit">Edit<!-- 修 改 --></el-button>
      </div>
    </el-dialog>
    <el-dialog title="Review withdrawal info" :visible.sync="dialogAuditFormVisible"> <!-- 审核提现信息 -->
      <el-alert
          :title="auditForm.auditTips"
          type="warning" :closable="false">
      </el-alert>
      <el-form :model="auditForm" label-width="150px" style="width:500px;" v-loading="dialogAuditLoading">
        <el-form-item label="Estimated date of payment" v-show="withdrawStatus===2||withdrawStatus===4"> <!-- 预计付款日期 -->
          <el-date-picker
              v-model="auditForm.planPaidAt"
              type="date"
              placeholder="Select date"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions0"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="付款日期" v-show="withdrawStatus===3">
          <el-date-picker
              v-model="auditForm.paidAt"
              type="date"
              placeholder="Select date"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions1"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item :label="auditRemark">
          <el-input v-model="auditForm.createRemark"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogAuditFormVisible = false">Cancel<!-- 取 消 --></el-button>
        <el-button type="primary" @click.native="handleStatus">Submit<!-- 提 交 --></el-button>
      </div>
    </el-dialog>

    <el-dialog title="补录发票信息" :visible.sync="dialogAddInvoiceVisible">
      <el-form :model="invoiceForm" label-width="200px" style="width:600px;" v-loading="dialogAddInvoiceLoading">
        <el-form-item label="提现流水号">
          <el-input v-model="invoiceForm.withdrawSn" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="发票代码">
          <el-input v-model="invoiceForm.invoiceCode"></el-input>
        </el-form-item>
        <el-form-item label="发票号码">
          <el-input v-model="invoiceForm.invoiceNum"></el-input>
        </el-form-item>
        <el-form-item label="开票日期">
          <el-date-picker
              v-model="invoiceForm.invoiceDate"
              type="date"
              placeholder="Select date"
              value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="提现金额">
          <el-input v-model="invoiceForm.amount"></el-input>
        </el-form-item>
        <el-form-item label="税率">
          <el-input v-model="invoiceForm.taxRate"></el-input>
        </el-form-item>
        <el-form-item label="购买方名称">
          <el-input v-model="invoiceForm.purchaserName"></el-input>
        </el-form-item>
        <el-form-item label="购买方纳税人识别号">
          <el-input v-model="invoiceForm.purchaserRegisterNum"></el-input>
        </el-form-item>
        <el-form-item label="购买方地址电话">
          <el-input v-model="invoiceForm.purchaserAddress"></el-input>
        </el-form-item>
        <el-form-item label="购买方开户行及账号">
          <el-input v-model="invoiceForm.purchaserBank"></el-input>
        </el-form-item>
        <el-form-item label="销售方名称">
          <el-input v-model="invoiceForm.sellerName"></el-input>
        </el-form-item>
        <el-form-item label="销售方纳税人识别号">
          <el-input v-model="invoiceForm.sellerRegisterNum"></el-input>
        </el-form-item>
        <el-form-item label="销售方地址电话">
          <el-input v-model="invoiceForm.sellerAddress"></el-input>
        </el-form-item>
        <el-form-item label="销售方开户行及账号">
          <el-input v-model="invoiceForm.sellerBank"></el-input>
        </el-form-item>
        <el-form-item label="货物或应税劳务服务名称">
          <el-input v-model="invoiceForm.itemName"></el-input>
        </el-form-item>
        <el-form-item label="发票备注">
          <el-input v-model="invoiceForm.invoiceRemark" type="textarea"
                    :rows="2"></el-input>
        </el-form-item>
        <el-form-item label="Remark"> <!-- 备注 -->
          <el-input v-model="invoiceForm.createRemark"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogAddInvoiceVisible = false">Cancel<!-- 取 消 --></el-button>
        <el-button type="primary" @click.native="handleAddInvoice">Submit<!-- 提 交 --></el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import network from '@/utils/network'
  import tool from '@/utils/tool'
  import FilterUser from '@/components/FilterUser'
  import baseInfo from '@/utils/baseInfo'
  import permission from '@/utils/permission'
  import LeoExcelUploader from '@/components/ExcelUploader'
  import {CDN_BASE_URL} from '@/utils/config'
  import Pagination from '@/components/Pagination'
  import filterHelper from '../utils/filterHelper'

  export default {
    name: 'leo-withdraw-table',
    components: {FilterUser, LeoExcelUploader,Pagination},
    props: {
      withdrawStatus: {
        type: Number,
        default: -1
      },
    },
    mounted() {
      this.getData()
    },
    data() {
      return {
        allData: null,
        tableData: null,
        loading: true,
        multipleSelection: [],
        currentPage: 1,
        totalPages: 1,
        totalCount: 1,
        pageSize: 20,
        tool: tool,
        permission: permission,
        regTypes: baseInfo.regTypes(),
        dialogEditFormVisible: false,
        dialogEditLoading: false,
        dialogAuditFormVisible: false,
        dialogAuditLoading: false,
        dialogAddInvoiceVisible: false,
        dialogAddInvoiceLoading: false,
        auditId: null,
        form: {
          id: null,
          baseInfo: {USER_NAME: null, REG_TYPE: null},
          amount: null,
          planPaidAt: null,
          paidAt: new Date(),
          createRemark: null,
        },
        invoiceForm: {
          id: null,
          withdrawId: null,
          withdrawSn: null,
          invoiceCode: null,
          invoiceNum: null,
          invoiceDate: null,
          amount: null,
          taxRate: null,
          purchaserName: null,
          purchaserRegisterNum: null,
          purchaserAddress: null,
          purchaserBank: null,
          sellerName: null,
          sellerRegisterNum: null,
          sellerAddress: null,
          sellerBank: null,
          itemName: null,
          invoiceRemark: null,
          createRemark: null,
        },
        pickerOptions0: {
          disabledDate(time) {
            return time.getTime() < Date.now();
          }
        },
        pickerOptions1: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 8.64e7;
          }
        },
        auditRemark: '',
        auditForm: {
          auditTips: '',
          auditStatus: null,
          selectedIds: [],
          planPaidAt: null,
          createRemark: null,
        },
        auditTips: '',
        filterTypes: {
          'USER_NAME': {isUserTable: true, name: '会员编号'},
          'REAL_NAME': {isUserTable: true, name: '会员姓名'},
          'ID_CARD': {isUserTable: true, name: '身份证'},
          'MOBILE': {isUserTable: true, name: '手机号'},
          'sn': {isUserTable: false, name: '提现流水号'},
          'periodNum': {isUserTable: false, name: '提现期数'},
          'amount': {isUserTable: false, name: '提现金额'},
          // 'IS_AUTO_WITHDRAW': {
          //   isUserTable: false,
          //   name: '提现方式',
          //   other: 'select',
          //   selectData: [{id: 1, name: '自动提现'}, {id: 0, name: '手动提现'}],
          // },
          // 'PAY_TYPE': {
          //   isUserTable: false,
          //   name: '付款类型',
          //   other: 'select',
          //   selectData: [{id: 1, name: '见票付款'}, {id: 0, name: '无票付款'}],
          // },
          // 'invoiceNum': {isUserTable: false, name: '发票号'},
          'paidAt': {isUserTable: false, name: '付款日期', other: 'date'},
        },
        filterModel: {},
        excelForm: {
          rowCount: '',
        },
      }
    },
    methods: {
      handleExpand(row, event, column) {
        this.$refs.multipleTable.toggleRowExpansion(row)
      },
      handleExport() {
        this.$confirm('Are you sure you want to export the current data？', 'Hint', {
          confirmButtonText: 'confirm', // 确定
          cancelButtonText: 'cancel', // 取消
          type: 'warning'
        }).then(() => {
          return network.getData('finance/withdraw-export', {status: this.withdrawStatus})
        }).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
        }).catch(response => {
        })
      },
      handleAdd() {
        this.$router.push({path: `/finance/withdraw-add`})
      },
      handleExcel() {
      },
      handleExcelPaidFalse() {
        window.open(CDN_BASE_URL + `/files/bonus_withdraw_paid_false.xlsx`)
      },
      handleEditShow(row) {
        this.dialogEditLoading = true
        this.auditId = row.ID
        this.dialogEditFormVisible = true
        let vueObj = this
        network.getData('finance/withdraw-get', {id: this.auditId}).then(response => {
          vueObj.dialogEditLoading = false
          vueObj.form = response
        })
      },
      handleEdit() {
        this.dialogEditFormVisible = false
        this.$message({
          message: '正在修改数据',
          type: 'info'
        })
        this.loading = true
        let path = 'finance/withdraw-edit'
        network.postData(path, this.form).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
          this.getData(this.currentPage, this.pageSize)
        }).catch(response => {
        })
      },
      handleStatusShow(row, status, title, remark = '备注') {
        this.auditForm = {
          auditTips: '',
          auditStatus: null,
          selectedIds: [],
          planPaidAt: null,
          paidAt: new Date(),
          remark: null,
        }
        if (row === null) {
          for (let val of this.multipleSelection) {
            this.auditForm.selectedIds.push(val.ID)
          }
        } else {
          this.auditForm.selectedIds.push(row.ID)
        }
        if (this.auditForm.selectedIds.length === 0) {
          this.$message({
            message: '请选择数据',
            type: 'warning'
          })
          return
        }
        this.auditRemark = remark
        this.dialogAuditFormVisible = true
        this.auditForm.auditTips = title
        this.auditForm.auditStatus = status
      },
      handleStatus() {
        this.$confirm('Are you sure to change the state of the selected data?', 'Hint', { // 确定要对所选数据修改状态吗？
          confirmButtonText: 'confirm', // 确定
          cancelButtonText: 'cancel', // 取消
          type: 'warning'
        }).then(() => {
          return network.postData('finance/withdraw-status', this.auditForm)
        }).then(response => {
          this.dialogAuditFormVisible = false
          this.$message({
            message: response,
            type: 'success'
          })
          this.getData(this.currentPage, this.pageSize)
        }).catch(response => {
          this.dialogAuditFormVisible = false
        })
      },
      handleAddInvoiceShow(row) {
        this.dialogAddInvoiceVisible = true
        this.auditId = row.INVOICE_ID
        this.dialogAddInvoiceLoading = true
        let vueObj = this
        network.getData('finance/invoice-audit-get', {id: this.auditId}).then(response => {
          vueObj.dialogAddInvoiceLoading = false
          vueObj.invoiceForm = response
          this.invoiceForm.withdrawSn = row.SN
          this.invoiceForm.withdrawId = row.ID
        })
      },
      handleAddInvoice() {
        let path = 'finance/invoice-audit-add'
        if (this.invoiceForm.id) path = 'finance/invoice-audit-edit'
        network.postData(path, this.invoiceForm).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
          this.dialogAddInvoiceVisible = false
          this.getData(this.currentPage, this.pageSize)
        }).catch(response => {
        })
      },
      handleSelectionChange(val) {
        this.multipleSelection = val
      },
      handleCurrentChange(page) {
        this.getData(page, this.pageSize)
      },
      handleSizeChange(pageSize) {
        this.getData(this.currentPage, pageSize)
      },
      handleFilterUser(filterData) {
        filterHelper.handleFilterUser(this, filterData)
      },
      handleFilter() {
        this.getData()
      },
      getData(page, pageSize) {
        let filterData = this.filterModel
        filterData.filterStatus = this.withdrawStatus != '-1' ? `=,${this.withdrawStatus}` : ''
        let vueObj = this
        network.getPageData(this, 'finance/withdraw', page, pageSize, filterData, function (response) {
          vueObj.allData = response
        })
      },
      onMessageCallback() {
        this.getData(this.currentPage, this.pageSize)
      },
    }
  }
</script>

<style scoped>
  .el-alert {
    margin-bottom: 20px;
  }
</style>