<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
    <el-tab-pane label="提现管理" name="first">
      <div style="display: inline-block;">
        <div style="position: relative;display: inline-block;margin:5px;">
          <span>支付宝账号：</span>
          <el-input
            style="width: 200px;"
            @keydown.enter.native="phoneSelect"
            placeholder="请输入支付宝账号"
            v-model="zhifubao"
          ></el-input
          >&nbsp;&nbsp;
          <span
            @click="phoneSelect"
            style="position: absolute;right: 18px;top:8px;"
          >
            <icon-svg name="shousuo" class="site-sidebar__menu-icon"></icon-svg>
          </span>
        </div>
        <div style="position: relative;display: inline-block;margin:5px;">
          <span>支付宝名称：</span>
          <el-input
            style="width: 200px;"
            @keydown.enter.native="phoneSelect"
            placeholder="请输入支付宝名称"
            v-model="zhifubaoName"
          ></el-input
          >&nbsp;&nbsp;
          <span
            @click="phoneSelect"
            style="position: absolute;right: 18px;top:8px;"
          >
            <icon-svg name="shousuo" class="site-sidebar__menu-icon"></icon-svg>
          </span>
        </div>
        <div style="position: relative;display: inline-block;margin:5px;">
          <span>店铺名称：</span>
          <el-input
            style="width: 200px;"
            @keydown.enter.native="phoneSelect"
            placeholder="请输入店铺名称"
            v-model="shopName"
          ></el-input
          >&nbsp;&nbsp;
          <span
            @click="phoneSelect"
            style="position: absolute;right: 18px;top:8px;"
          >
            <icon-svg name="shousuo" class="site-sidebar__menu-icon"></icon-svg>
          </span>
        </div>
        <!-- <div style="margin:5px;display: inline-block;">
					<span>手机号:</span>
					<el-input style="width: 150px;" @keydown.enter.native="phoneSelect" clearable placeholder="请输入手机号"
						v-model="phone"></el-input>
				</div>&emsp;&emsp; -->
        <div style="position: relative;display: inline-block;">
          <span>状态：</span>
          <el-select
            v-model="indentState"
            style="width:150px;margin-left: 10px;"
            @change="phoneSelect(indentState)"
          >
            <el-option
              v-for="item in statesnum"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option> </el-select
          >&nbsp;&nbsp;
        </div>
        <div style="margin:5px;display: inline-block;">
          <span>申请开始时间：</span>
          <el-date-picker
            style="width: 200px;margin-left: 10px;"
            v-model="startTime"
            align="right"
            type="datetime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择开始时间"
          >
          </el-date-picker
          >&nbsp;&nbsp;&nbsp;
        </div>
        <div style="margin:5px;display: inline-block;">
          <span>申请截止时间：</span>
          <el-date-picker
            style="width: 200px;margin-left: 10px;"
            v-model="endTime"
            align="right"
            type="datetime"
            format="yyyy-MM-dd HH:mm:ss"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择截止时间"
          >
          </el-date-picker>
        </div>
        <div style="margin:5px;display: inline-block;">
          <span>操作开始时间：</span>
          <el-date-picker
            style="width: 160px;margin-left: 10px;"
            v-model="outstartTime"
            align="right"
            type="datetime"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            placeholder="选择开始时间"
          >
          </el-date-picker
          >&nbsp;&nbsp;&nbsp;
        </div>
        <div style="margin:5px;display: inline-block;">
          <span>操作截止时间：</span>
          <el-date-picker
            style="width: 160px;margin-left: 10px;"
            v-model="outendTime"
            align="right"
            type="datetime"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            placeholder="选择截止时间"
          >
          </el-date-picker
          >&nbsp;&nbsp;&nbsp;
        </div>
        <div style="position: relative;display: inline-block;margin:5px;">
          <span>提现总金额：{{ totalMoney }}</span>
        </div>
      </div>
      <div style="display: inline-block;">
        <el-button
          style="margin:10px;"
          size="mini"
          type="primary"
          icon="document"
          @click="phoneSelect"
          >查询
        </el-button>
        <el-button
          style="margin:10px;"
          size="mini"
          type="primary"
          icon="document"
          @click="cleans2"
          >重置
        </el-button>
        <!-- <el-button
          style="margin:0 0 20px 20px;"
          size="mini"
          type="primary"
          icon="document"
          @click="transferClcik()"
          :disabled="
            checkBoxData.length <= 0 || !isAuth('financeList:transfer')
          "
        >
          批量转账
        </el-button>
        <el-button
          style="margin:0 0 20px 20px;"
          size="mini"
          type="warning"
          icon="document"
          @click="transferRefuseClcik()"
          :disabled="checkBoxData.length <= 0 || !isAuth('financeList:refund')"
        >
          批量拒绝
        </el-button> -->
        <el-button
          style="margin-left:15px;"
          size="mini"
          type="warning"
          icon="document"
          @click="exportBtn"
          >导出Excel
        </el-button>
      </div>
      <div style="color: orange;" v-if="enable">
        * 转账提示：已使用最新商户号的自动提现方式
      </div>
      <div style="color: orange;" v-else>
        * 转账提示：使用原来微信商户号提现方式
      </div>
      <div style="color: orange;">
        *
        导出提示：导出数据前请进行时间或者状态等筛选，否则导出数据量过多易出现卡顿或系统崩溃
      </div>
      <el-table
        @selection-change="changeFun"
        v-loading="tableDataLoading"
        :data="tableData"
      >
        <el-table-column type="selection"> </el-table-column>
        <el-table-column fixed prop="id" label="编号" width="80">
        </el-table-column>
        <el-table-column prop="classify" label="提现方式" width="100">
          <template slot-scope="scope">
            <span v-if="scope.row.classify == 1">支付宝提现</span>
            <span v-if="scope.row.classify == 2">微信提现</span>
            <span v-if="scope.row.classify == 5">银行卡提现</span>
            <span v-if="scope.row.classify == 6">rht提现</span>
          </template>
        </el-table-column>
        <el-table-column prop="orderNumber" label="转账订单号" width="150">
        </el-table-column>
        <el-table-column prop="shopName" label="店铺名称" width="100">
          <template slot-scope="scope">
            <span v-if="scope.row.shopName">{{
              scope.row.shopName != "null" ? scope.row.shopName : "无"
            }}</span>
            <span v-else>无</span>
          </template>
        </el-table-column>
        <el-table-column prop="bankCardNo" label="银行卡号" width="150">
          <template slot-scope="scope">
            <span
              style="color: #4f9dec;cursor: pointer;"
              v-if="scope.row.bankCardNo"
              >{{
                scope.row.bankCardNo != "null" ? scope.row.bankCardNo : "未绑定"
              }}</span
            >
            <span v-else>未绑定</span>
          </template>
        </el-table-column>
        <el-table-column prop="openBank" label="开户行" width="100">
          <template slot-scope="scope">
            <span v-if="scope.row.openBank">{{
              scope.row.openBank != "null" ? scope.row.openBank : "无"
            }}</span>
            <span v-else>无</span>
          </template>
        </el-table-column>
        <el-table-column prop="bankRealName" label="开户人姓名" width="100">
          <template slot-scope="scope">
            <span v-if="scope.row.bankRealName">{{
              scope.row.bankRealName != "null" ? scope.row.bankRealName : "无"
            }}</span>
            <span v-else>无</span>
          </template>
        </el-table-column>
        <el-table-column prop="mchId" label="当前商户号" width="180">
        </el-table-column>
        <el-table-column prop="money" label="提现金额" width="100">
        </el-table-column>
        <el-table-column prop="rate" label="手续费" width="100">
        </el-table-column>
        <el-table-column prop="currentBalance" label="当前余额" width="100">
        </el-table-column>
        <el-table-column prop="state" label="状态" width="100">
          <template slot-scope="scope">
            <span
              style="color: #4f9dec;cursor: pointer;"
              v-if="scope.row.state == 0"
              >待转账</span
            >
            <span v-if="scope.row.state == 1">已转账</span>
            <span v-if="scope.row.state == -1">已拒绝</span>
          </template>
        </el-table-column>
        <el-table-column prop="zhifubao" label="支付宝账号" width="150">
          <template slot-scope="scope">
            <span
              style="color: #4f9dec;cursor: pointer;"
              @click="updates(scope.row)"
              v-if="scope.row.zhifubao"
              >{{
                scope.row.zhifubao != "null" ? scope.row.zhifubao : "未绑定"
              }}</span
            >
            <span v-else>未绑定</span>
          </template>
        </el-table-column>
        <el-table-column prop="zhifubaoName" label="支付宝名称" width="100">
          <template slot-scope="scope">
            <span v-if="scope.row.zhifubaoName">{{
              scope.row.zhifubaoName != "null"
                ? scope.row.zhifubaoName
                : "未绑定"
            }}</span>
            <span v-else>未绑定</span>
          </template>
        </el-table-column>
        <el-table-column prop="cashQrCode" label="微信提现二维码" width="150">
          <template slot-scope="scope">
            <!-- <img :src="scope.row.goodsCover" alt="" width="60" height="60"> -->
            <div style="display: inline-block; margin: 3px;">
              <el-popover placement="top-start" title="" trigger="hover">
                <img
                  style="width: 50px; height: 50px"
                  :src="scope.row.cashQrCode"
                  alt=""
                  slot="reference"
                />
                <img
                  style="width: 300px; height: auto"
                  :src="scope.row.cashQrCode"
                  alt=""
                />
              </el-popover>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="refund" label="拒绝原因" width="220">
        </el-table-column>
        <el-table-column prop="createAt" label="申请时间" width="170">
        </el-table-column>
        <el-table-column prop="outAt" label="转账/拒绝时间" width="180">
        </el-table-column>

        <el-table-column fixed="right" label="操作" width="150">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="primary"
              :disabled="
                !isAuth('financeList:transfer') || scope.row.state != 0
              "
              @click="batch(scope.row)"
            >
              转账
            </el-button>
            <el-button
              size="mini"
              type="primary"
              :disabled="!isAuth('financeList:refund') || scope.row.state != 0"
              @click="refund(scope.row)"
            >
              拒绝
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div style="text-align: center;margin-top: 10px;">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes="[10, 15, 20, 30]"
          :page-size="limit"
          :current-page="page"
          layout="total,sizes, prev, pager, next"
          :total="totalnum"
        >
        </el-pagination>
      </div>
      <!-- 转账弹框 -->
      <!-- <el-dialog
        custom-class="transfer"
        title="转账"
        style="width:100%;"
        :visible.sync="transferVisible"
        center
      >
        <div v-if="enable">
          <span>转账金额：</span>
          <el-input
            v-model="transferMoney"
            placeholder="请输入转账金额"
            style="width:280px;"
          >
          </el-input>
        </div>
        <div v-else style="margin-left:20px;font-size: 16px;">
          <span>确定转账?</span>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="transferVisible = false">取 消</el-button>
          <el-button type="primary" @click="batch()">确 定</el-button>
        </div>
      </el-dialog> -->
      <!-- 拒绝弹框 -->
      <el-dialog title="拒绝" :visible.sync="dialogFormVisible" center>
        <el-form :model="form">
          <el-form-item label="拒绝原因：" :label-width="formLabelWidth">
            <el-input
              v-model="form.content"
              type="textarea"
              rows="4"
              placeholder="请输入拒绝原因"
              style="width:65%;"
            >
            </el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="refundNoticeTo()">确 定</el-button>
        </div>
      </el-dialog>
    </el-tab-pane>
    <el-tab-pane label="收入统计" name="second">
      <div>
        <el-select
          v-model="flag"
          style="width:150px;margin-left: 10px;"
          @change="animeDat"
        >
          <el-option
            v-for="item in flags"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option> </el-select
        >&nbsp;&nbsp;&nbsp;
        <el-date-picker
          style="width: 200px;margin-left: 10px;"
          v-model="info1.stockDate1"
          align="right"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择开始时间"
          @change="animeSelect"
        >
        </el-date-picker>
      </div>
      <el-row v-loading="tableDataLoading1">
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                总收益
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(已完成的支付订单支付总金额)(按支付时间)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  MoneyData.allBigDecimal ? MoneyData.allBigDecimal : 0
                }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                平台总收益
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(已完成的支付订单商家总收入)(按支付时间)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  MoneyData.adminBigDecimal ? MoneyData.adminBigDecimal : 0
                }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                商铺总收益
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(总收益 - 商家总收益)(按支付时间)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{
                  MoneyData.shopBigDecimal ? MoneyData.shopBigDecimal : 0
                }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
      </el-row>
    </el-tab-pane>
    <el-tab-pane label="提现统计" name="third">
      <div>
        <el-select
          v-model="flag"
          style="width:150px;margin-left: 10px;"
          @change="animeDat2"
        >
          <el-option
            v-for="item in flags"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option> </el-select
        >&nbsp;&nbsp;&nbsp;
        <el-date-picker
          style="width: 200px;margin-left: 10px;"
          v-model="info1.stockDate1"
          align="right"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择开始时间"
          @change="animeSelect2"
        >
        </el-date-picker>
      </div>
      <el-row v-loading="tableDataLoading2">
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                累计提现金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现发起的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.sumMoney }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                提现次数
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现发起的次数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.countMoney }}</span
                >笔
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                待转账次数
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现待转账的次数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.stayMoney }}</span
                >笔
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                申请提现金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现待转账的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.applyMoneySum }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>

        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                累计提现金额(提现成功)
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现成功的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.sumMoneySucceed }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                提现笔数(提现成功)
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现成功的次数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.countMoneySucceed }}</span
                >笔
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                待转账金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现待转账的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.sumMoneyAwait }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                已转账金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现成功的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.accomplishMoneySum }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                已拒绝金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(用户提现已拒绝的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.refuseMoneySum }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                支付宝提现金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(支付宝用户提现成功的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.zhifubaoMoneySum }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                微信提现金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(微信用户提现成功的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.weixinMoneySum }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">
                保证金退款统计金额
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  content="(保证金退款成功的金额总数)(按时间筛选)"
                  :open-delay="500"
                >
                  <img class="help" src="~@/assets/img/help.png" alt="" />
                </el-tooltip>
              </div>
              <div class="text_color">
                <span>{{ withdrawData.cashDepositMoneySum }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
      </el-row>
    </el-tab-pane>
    <el-tab-pane label="充值记录" name="fourth">
      <div style="margin:2% 0;display: inline-block;">
        <span>状态：</span>
        <el-select
          v-model="state"
          placeholder="请选择状态"
          style="width:150px;"
          @change="selectTrigger(state)"
        >
          <el-option
            v-for="item in states"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </div>
      <div style="display: inline-block;">
        <span>开始时间：</span>
        <el-date-picker
          style="width: 160px;margin-left: 10px;"
          v-model="startTime"
          align="right"
          type="datetime"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择开始时间"
        >
        </el-date-picker
        >&nbsp;&nbsp;&nbsp;
        <span>截止时间：</span>
        <el-date-picker
          style="width: 160px;margin-left: 10px;"
          v-model="endTime"
          align="right"
          type="datetime"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择截止时间"
        >
        </el-date-picker>
        <el-button
          style="margin-left:15px;"
          size="mini"
          type="primary"
          icon="document"
          @click="timeDate"
          >查询
        </el-button>
      </div>
      <el-table v-loading="tableDataLoading" :data="rechargeData">
        <el-table-column fixed prop="id" label="编号" width="80">
        </el-table-column>
        <el-table-column prop="userName" label="用户名称">
          <template slot-scope="scope">
            <span
              style="color: #4f9dec;cursor: pointer;"
              @click="updates(scope.row)"
              >{{ scope.row.userName ? scope.row.userName : "未绑定" }}</span
            >
          </template>
        </el-table-column>
        <el-table-column prop="orderId" label="充值订单号" width="250">
        </el-table-column>
        <el-table-column prop="money" label="充值金额" width="100">
        </el-table-column>
        <!-- <el-table-column label="分类" width="120">
          <template slot-scope="scope">
            <span style="color: #4f9dec;cursor: pointer;" v-if="scope.row.classify == 1">微信</span>
            <span style="color: #4f9dec;cursor: pointer;" v-if="scope.row.classify == 2">支付宝</span>
          </template>
        </el-table-column> -->
        <el-table-column label="状态" width="120">
          <template slot-scope="scope">
            <span style="color: #4f9dec;" v-if="scope.row.state == 0"
              >待充值</span
            >
            <span style="color: #4f9dec;" v-if="scope.row.state == 1"
              >充值成功</span
            >
            <span style="color: #4f9dec;" v-if="scope.row.state == 2"
              >充值失败</span
            >
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间" width="170">
        </el-table-column>
        <el-table-column prop="payTime" label="支付时间" width="170">
        </el-table-column>
      </el-table>
      <div style="text-align: center;margin-top: 10px;">
        <el-pagination
          @size-change="handleSizeChange1"
          @current-change="handleCurrentChange1"
          :page-sizes="[10, 15, 20, 30]"
          :page-size="limit"
          :current-page="page"
          layout="total,sizes, prev, pager, next"
          :total="totalnum2"
        >
        </el-pagination>
      </div>
    </el-tab-pane>
    <el-tab-pane label="充值统计" name="sixth">
      <div>
        <el-select
          v-model="flag"
          style="width:150px;margin-left: 10px;"
          @change="animeDat3"
        >
          <el-option
            v-for="item in flags"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option> </el-select
        >&nbsp;&nbsp;&nbsp;
        <el-date-picker
          style="width: 200px;margin-left: 10px;"
          v-model="info1.stockDate1"
          align="right"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择开始时间"
          @change="animeSelect3"
        >
        </el-date-picker>
      </div>
      <el-row v-loading="tableDataLoading3">
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">充值总金额</div>
              <div class="text_color">
                <span>{{ rechgeData ? rechgeData : 0 }}</span
                >元
              </div>
            </div>
          </div>
        </el-col>
        <!-- <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">微信充值金额</div>
              <div class="text_color"><span>{{rechgeData.weixinMoney ? rechgeData.weixinMoney : 0}}</span>元</div>
            </div>
          </div>
        </el-col>
        <el-col :span="6" class="cards">
          <div class="box">
            <div class="box_num">
              <div class="box_color">支付宝充值金额</div>
              <div class="text_color"><span>{{rechgeData.zhifubaoMoney ? rechgeData.zhifubaoMoney : 0}}</span>元</div>
            </div>
          </div>
        </el-col> -->
      </el-row>
    </el-tab-pane>
    <!-- 保证金记录 -->
    <el-tab-pane label="保证金记录" name="sevened">
      <div style="margin:2% 0;display: inline-block;">
        <div style="position: relative;display: inline-block;margin:5px;">
          <span>店铺名称：</span>
          <el-input
            style="width: 200px;"
            @keydown.enter.native="baozhengSelect"
            placeholder="请输入店铺名称"
            v-model="shopName3"
          ></el-input
          >&nbsp;&nbsp;
          <span
            @click="baozhengSelect"
            style="position: absolute;right: 18px;top:8px;"
          >
            <icon-svg name="shousuo" class="site-sidebar__menu-icon"></icon-svg>
          </span>
        </div>
        <div style="position: relative;display: inline-block;">
          <span>状态：</span>
          <el-select
            v-model="indentState3"
            style="width:150px;margin-left: 10px;"
            @change="baozhengSelect(indentState3)"
          >
            <el-option
              v-for="item in statesnum3"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option> </el-select
          >&nbsp;&nbsp;
        </div>
        <div style="margin:5px;display: inline-block;">
          <span>开始时间：</span>
          <el-date-picker
            style="width: 160px;margin-left: 10px;"
            v-model="startTime"
            align="right"
            type="datetime"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            placeholder="选择开始时间"
          >
          </el-date-picker
          >&nbsp;&nbsp;&nbsp;
        </div>
        <div style="margin:5px;display: inline-block;">
          <span>截止时间：</span>
          <el-date-picker
            style="width: 160px;margin-left: 10px;"
            v-model="endTime"
            align="right"
            type="datetime"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            placeholder="选择截止时间"
          >
          </el-date-picker>
        </div>
        <div style="position: relative;display: inline-block;margin:5px;">
          <span>保证金提现总额：{{ totalbaoMoney }}</span>
        </div>
      </div>
      <div style="display: inline-block;">
        <el-button
          style="margin:10px;"
          size="mini"
          type="primary"
          icon="document"
          @click="baozhengcha"
          >查询
        </el-button>
        <el-button
          style="margin:10px;"
          size="mini"
          type="primary"
          icon="document"
          @click="cleans3"
          >重置
        </el-button>
        <el-button
          style="margin-left:15px;"
          size="mini"
          type="warning"
          icon="document"
          @click="exportBtn3"
          >导出Excel
        </el-button>
      </div>
      <div style="color: orange;">
        *
        导出提示：导出数据前请进行时间或者状态等筛选，否则导出数据量过多易出现卡顿或系统崩溃
      </div>
      <el-table v-loading="tableDataLoading" :data="baozhengData">
        <el-table-column type="selection"> </el-table-column>
        <el-table-column fixed prop="id" label="编号"> </el-table-column>
        <el-table-column prop="shopName3" label="店铺名称">
          <template slot-scope="scope">
            <span v-if="scope.row.shopName">{{
              scope.row.shopName != "null" ? scope.row.shopName : "无"
            }}</span>
            <span v-else>无</span>
          </template>
        </el-table-column>
        <el-table-column prop="content" label="保证金金额"> </el-table-column>
        <el-table-column prop="type" label="状态">
          <template slot-scope="scope">
            <span v-if="scope.row.type == 1">充值</span>
            <span v-if="scope.row.type == 2">提现</span>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="提现时间"> </el-table-column>
        <!-- <el-table-column prop="orderNumber" label="保证金订单号"> -->
        <!-- </el-table-column> -->
      </el-table>
      <div style="text-align: center;margin-top: 10px;">
        <el-pagination
          @size-change="handleSizeChange2"
          @current-change="handleCurrentChange2"
          :page-sizes="[10, 15, 20, 30]"
          :page-size="limit"
          :current-page="page"
          layout="total,sizes, prev, pager, next"
          :total="totalnum3"
        >
        </el-pagination>
      </div>
    </el-tab-pane>
    <!-- 导出限制 -->
    <el-dialog
      custom-class="export"
      :visible.sync="exportVisible"
      center
      :title="exportTitle"
      :close-on-click-modal="false"
    >
      <div class="con" v-show="exportFlag == 1">
        <img src="../../assets/img/error.png" alt="" />
        <span
          style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
          >当前导出条数超过50000条，暂不支持导出</span
        >
        <span style="font-size:14px;color: #808080;"
          >（注：数据中的图片、附件只能以链接的形式导出）</span
        >
      </div>
      <div class="con" v-show="exportFlag == 2">
        <img class="gundong" src="../../assets/img/loading.png" alt="" />
        <span
          style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
          >导出中...</span
        >
        <span style="font-size:14px;color: #808080;"
          >（注：请到个人导出记录查看并下载）</span
        >
      </div>
      <div class="con" v-show="exportFlag == 3">
        <img src="../../assets/img/success.png" alt="" />
        <span
          style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
          >导出成功</span
        >
        <span style="font-size:14px;color: #808080;"
          >（注：请到个人导出记录查看并下载）</span
        >
      </div>
      <div class="con" v-show="exportFlag == 4">
        <img class="gundong" src="../../assets/img/loading.png" alt="" />
        <span
          style="font-size:20px;color: #000;font-weight: 800;margin: 18px 0 5px;"
          >版本迭代中，导出暂时无法使用</span
        >
      </div>
      <div class="btn">
        <el-button type="primary" @click="exportAffirm">确定</el-button>
      </div>
    </el-dialog>
  </el-tabs>
</template>

<script>
import { throttle, debounce } from "lodash";
export default {
  data() {
    return {
      page: 1,
      limit: 10,
      balance: -1,
      zhifubao: "",
      tkstatus: -1,
      state: 1,
      states: [
        {
          label: "全部",
          value: -1
        },
        {
          label: "待充值",
          value: 0
        },
        {
          label: "充值成功",
          value: 1
        },
        {
          label: "充值失败",
          value: 2
        }
      ],
      indentState: "",
      statesnum: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "待转账"
        },
        {
          value: 1,
          label: "已转账"
        },
        {
          value: -1,
          label: "已拒绝"
        }
      ],
      indentState3: "",
      statesnum3: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 1,
          label: "充值"
        },
        {
          value: 2,
          label: "提现"
        }
      ],
      phone: "",
      zhifubaoName: "",
      shopName: "",
      shopName3: "",
      totalMoney: "", //提现总金额
      totalbaoMoney: "", //保证金提现总额
      content: "",
      startTime: "",
      endTime: "",
      outstartTime: "",
      outendTime: "",
      cashId: "",
      type: -1,
      totalnum: 0,
      totalnum2: 0,
      totalnum3: 0,
      sqxTotal: "",
      userTotal: "",
      taunTotal: "",
      relationId: "",
      sumMoneyByTime: "",
      money: "",
      activeName: "first",
      formLabelWidth: "200px",
      dialogFormVisible: false,
      dialogFormVisible1: false,
      dialogFormVisible2: false,
      tableDataLoading: false,
      tableDataLoading1: false,
      tableDataLoading2: false,
      tableDataLoading3: false,
      tableData: [],
      baozhengData: [],
      rechargeData: [],
      rechgeData: {},
      withdrawData: {},
      depositData: [],
      MoneyData: {},
      checkBoxData: [], //多选框选择的值
      flag: "day",
      form: {
        cashId: "",
        content: ""
      },
      form2: {
        id: "",
        money: "",
        createTime: ""
      },
      info: {
        stockDate: this.getNowTime() //日期
      },
      info1: {
        stockDate1: this.getNowTime1() //日期
      },
      info2: {
        stockDate2: this.getNowTime2() //日期
      },
      flags: [
        {
          value: "day",
          label: "按天查询"
        },
        {
          value: "month",
          label: "按月查询"
        },
        {
          value: "year",
          label: "按年查询"
        }
      ],

      // 导出限制
      exportTitle: "导出错误",
      exportVisible: false,
      exportFlag: 1, //1 超出限制  2导出中

      // 提现管理 转账
      // transferVisible: false,
      // shopId: "",
      // id: "",
      // transferMoney: "" // 金额
      enable: false // 判断是否为新支付
    };
  },
  methods: {
    // 会员详情跳转
    updates(row) {
      if (row.userId) {
        this.$router.push({
          path: "/userDetail",
          query: {
            userId: row.userId
          }
        });
      }
    },
    // 批量转账
    transferClcik: debounce(function(id) {
      var ids = id
        ? [id]
        : this.checkBoxData.map(item => {
            return item.id;
          });
      console.log(ids, "勾选的ids");
      this.$http({
        url: this.$http.adornUrl("app/new-pay/enable-new-pay"),
        method: "get"
      }).then(({ data }) => {
        console.log(data.enable, "是否启用新支付");
        this.enable = data.enable;
        for (var i in ids) {
          if (this.enable) {
            console.log("rht转账");
            // let reg = /^(0|[1-9]\d*)(\.\d{1,2})?$/;
            // if (reg.test(this.transferMoney)) {
            // } else {
            //   this.$message({
            //     message: "金额必须大于等于0且不能超过两位小数！",
            //     type: "error",
            //     duration: 2000
            //   });
            //   return;
            // }
            // console.log(this.transferMoney, "正确金额");
            this.$http({
              url: this.$http.adornUrl(`cash/confirm-cash/${ids[i]}`),
              method: "post"
            }).then(({ data }) => {
              // console.log(data, "rht转账");
              if (data.code == 0) {
                this.$notify({
                  title: "提示",
                  duration: 1800,
                  message: "转账成功",
                  type: "warning"
                });
                // this.dataSelect();
                // return;
              } else {
                this.$notify({
                  title: "提示",
                  duration: 1800,
                  message: "转账失败",
                  type: "error"
                });
                // this.dataSelect();
                return;
              }
            });
          } else {
            console.log("银行卡转账");
            this.$http({
              url: this.$http.adornUrl(`cash/alipay/${ids[i]}`),
              method: "post",
              data: this.$http.adornData({})
            }).then(({ data }) => {
              if (data.code == 0) {
                this.$notify({
                  title: "提示",
                  duration: 1800,
                  message: "转账成功",
                  type: "warning"
                });
                // this.dataSelect();
                // return;
              }
              if (data.code == 9999) {
                this.$notify({
                  title: "提示",
                  duration: 1800,
                  message: data.msg,
                  type: "error"
                });
                // this.dataSelect();
                return;
              }
              if (data.code == 500) {
                this.$notify({
                  title: "提示",
                  duration: 1800,
                  message: "转账失败",
                  type: "error"
                });
                // this.dataSelect();
                return;
              }
            });
          }
        }
        this.dataSelect();
      });
      // for (var i in ids) {
      // this.$http({
      //   url: this.$http.adornUrl(`cash/alipay/${ids[i]}`),
      //   method: "post",
      //   data: this.$http.adornData({})
      // }).then(({ data }) => {
      //   if (data.code == 0) {
      //     this.$notify({
      //       title: "提示",
      //       duration: 1800,
      //       message: data.msg,
      //       type: "warning"
      //     });
      //     return;
      //   }
      //   if (data.code == 9999) {
      //     this.$notify({
      //       title: "提示",
      //       duration: 1800,
      //       message: data.msg,
      //       type: "error"
      //     });
      //     return;
      //   }
      // });
      // }
    }, 100),
    // 批量拒绝
    transferRefuseClcik: debounce(function(id) {
      var ids = id
        ? [id]
        : this.checkBoxData.map(item => {
            return item.id;
          });
      console.log(ids, "勾选的ids");
      for (var i in ids) {
        this.$http({
          url: this.$http.adornUrl(`cash/refund`),
          method: "post",
          params: this.$http.adornParams({
            cashId: ids[i],
            content: ""
          })
        }).then(({ data }) => {
          // console.log(data, "rht转账");
          if (data.code == 0) {
            this.$notify({
              title: "提示",
              duration: 1800,
              message: "操作成功",
              type: "warning"
            });
            // this.dataSelect();
            // return;
          } else {
            this.$notify({
              title: "提示",
              duration: 1800,
              message: "操作失败",
              type: "error"
            });
            // this.dataSelect();
            return;
          }
        });
      }
      this.dataSelect();
    }, 100),
    // 多选
    changeFun(val) {
      this.checkBoxData = val;
    },
    // 转账弹窗
    transferClick() {
      // this.transferVisible = true;
      // this.transferMoney="";
      // this.shopId=row.shopId;
      // this.id=row.id;
      this.$http({
        url: this.$http.adornUrl("app/new-pay/enable-new-pay"),
        method: "get"
      }).then(({ data }) => {
        console.log(data.enable, "是否启用新支付");
        this.enable = data.enable;
      });
    },
    // 确定转账
    batch(rows) {
      if (rows.state == 1) {
        this.$message({
          message: "已转账，请勿重复操作！",
          type: "error",
          duration: 1500
        });
        return;
      }
      this.$confirm(`确定转账?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.$http({
            url: this.$http.adornUrl("app/new-pay/enable-new-pay"),
            method: "get"
          }).then(({ data }) => {
            console.log(data.enable, "是否启用新支付");
            this.enable = data.enable;
            if (this.enable) {
              console.log("rht转账");
              // let reg = /^(0|[1-9]\d*)(\.\d{1,2})?$/;
              // if (reg.test(this.transferMoney)) {
              // } else {
              //   this.$message({
              //     message: "金额必须大于等于0且不能超过两位小数！",
              //     type: "error",
              //     duration: 2000
              //   });
              //   return;
              // }
              // console.log(this.transferMoney, "正确金额");
              this.$http({
                url: this.$http.adornUrl(`cash/confirm-cash/${rows.id}`),
                method: "post"
              }).then(({ data }) => {
                console.log(data, "rht转账");
                if (data.code == 0) {
                  this.$message({
                    message: data.msg,
                    type: "success",
                    duration: 1500,
                    onClose: () => {
                      this.dataSelect();
                    }
                  });
                } else {
                  this.$message({
                    message: data.msg,
                    type: "warning",
                    duration: 1500,
                    onClose: () => {}
                  });
                }
              });
            } else {
              console.log("银行卡转账");
              this.$http({
                url: this.$http.adornUrl(`cash/alipay/${rows.id}`),
                method: "post",
                data: this.$http.adornData({})
              }).then(({ data }) => {
                if (data.code == 0) {
                  this.$message({
                    message: data.msg,
                    type: "success",
                    duration: 1500,
                    onClose: () => {
                      this.dataSelect();
                    }
                  });
                  return;
                }
                if (data.code == 9999) {
                  this.$message({
                    message: data.msg,
                    type: "error",
                    duration: 1500,
                    onClose: () => {
                      this.dataSelect();
                    }
                  });
                  return;
                }
                if (data.code == 500) {
                  this.$message({
                    message: data.msg,
                    type: "error",
                    duration: 1500,
                    onClose: () => {
                      this.dataSelect();
                    }
                  });
                  return;
                }
              });
            }
          });
        })
        .catch(() => {
          console.log("cencel");
        });
    },
    // 拒绝
    refund(row) {
      if (row.state == -1) {
        this.$message({
          message: "已拒绝，请勿重复操作！",
          type: "error",
          duration: 1500
        });
      } else {
        this.dialogFormVisible = true;
        this.form.cashId = row.id;
      }
    },
    // 拒绝操作
    refundNoticeTo() {
      if (this.form.content == "") {
        this.$message({
          message: "请输入拒绝原因",
          type: "error",
          duration: 1500
        });
        return;
      }
      if (this.form.content.length > 100) {
        this.$message({
          message: "拒绝原因不得超过100字",
          type: "error",
          duration: 1500
        });
        return;
      }
      this.$http({
        url: this.$http.adornUrl(`cash/refund`),
        method: "post",
        params: this.$http.adornParams({
          cashId: this.form.cashId,
          content: this.form.content
        })
      }).then(({ data }) => {
        if (data.code == 0) {
          this.dialogFormVisible = false;
          this.$message({
            message: "操作成功",
            type: "success",
            duration: 1500,
            onClose: () => {
              this.form.content = "";
              this.dataSelect();
            }
          });
          return;
        }
        if (data.code == 500) {
          this.dialogFormVisible = false;
          this.$message({
            message: data.msg,
            type: "error",
            duration: 1500,
            onClose: () => {
              this.form.content = "";
              this.dataSelect();
            }
          });
          return;
        }
        if (data.code == -100) {
          this.dialogFormVisible = false;
          this.$message({
            message: data.msg,
            type: "error",
            duration: 1500,
            onClose: () => {
              this.form.content = "";
              this.dataSelect();
            }
          });
          return;
        }
      });
    },
    timeDate() {
      this.rechargeSelect();
    },
    // 日期选择
    animeDat(value) {
      let vanumber = value;
      if (vanumber === "day") {
        this.flag = "day";
        this.incomeSelect();
      }
      if (vanumber === "month") {
        this.flag = "month";
        this.incomeSelect();
      }
      if (vanumber === "year") {
        this.flag = "year";
        this.incomeSelect();
      }
    },
    // 日期选择2
    animeDat2(value) {
      let vanumber = value;
      if (vanumber === "day") {
        this.flag = "day";
        this.withdrawSelect();
      }
      if (vanumber === "month") {
        this.flag = "month";
        this.withdrawSelect();
      }
      if (vanumber === "year") {
        this.flag = "year";
        this.withdrawSelect();
      }
    },
    // 日期选择3
    animeDat3(value) {
      let vanumber = value;
      if (vanumber === "day") {
        this.flag = "day";
        this.rechSelect();
      }
      if (vanumber === "month") {
        this.flag = "month";
        this.rechSelect();
      }
      if (vanumber === "year") {
        this.flag = "year";
        this.rechSelect();
      }
    },
    animeSelect() {
      this.incomeSelect();
    },
    animeSelect2() {
      this.withdrawSelect();
    },
    animeSelect3() {
      this.rechSelect();
    },
    //处理默认选中当前日期
    getNowTime1() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth(); //得到月份
      var date = now.getDate(); //得到日期
      var hh = now.getHours() < 10 ? "0" + now.getHours() : now.getHours();
      var mm =
        now.getMinutes() < 10 ? "0" + now.getMinutes() : now.getMinutes();
      var ss =
        now.getSeconds() < 10 ? "0" + now.getSeconds() : now.getSeconds();
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date} ${hh}:${mm}:${ss}`;
      return defaultDate;
      this.$set(this.info, "stockDate", defaultDate);
    },
    getNowTime2() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth(); //得到月份
      var date = now.getDate(); //得到日期
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date}`;
      return defaultDate;
      this.$set(this.info, "stockDate", defaultDate);
    },
    //处理默认选中当前日期
    getNowTime() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth() - now.getMonth(); //得到月份
      var date = now.getDate() - now.getDate() + 1; //得到日期
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date}`;
      return defaultDate;
      this.$set(this.info, "stockDate", defaultDate);
    },
    handleSizeChange(val) {
      this.limit = val;
      this.dataSelect();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.dataSelect();
    },
    handleSizeChange1(val) {
      this.limit = val;
      this.rechargeSelect();
    },
    handleCurrentChange1(val) {
      this.page = val;
      this.rechargeSelect();
    },
    handleSizeChange2(val) {
      this.limit = val;
      this.baozhengSelect();
    },
    handleCurrentChange2(val) {
      this.page = val;
      this.baozhengSelect();
    },
    handleClick(tab, event) {
      if (tab._props.label == "提现管理") {
        this.page = 1;
        this.limit = 10;
        this.dataSelect();
      }
      if (tab._props.label == "收入统计") {
        this.flag = "day";
        this.incomeSelect();
      }
      if (tab._props.label == "充值统计") {
        this.flag = "day";
        this.rechSelect();
      }
      if (tab._props.label == "提现统计") {
        this.flag = "day";
        this.withdrawSelect();
      }
      if (tab._props.label == "充值记录") {
        this.page = 1;
        this.limit = 10;
        this.rechargeSelect();
      }
      if (tab._props.label == "保证金记录") {
        this.page = 1;
        this.limit = 10;
        this.baozhengSelect();
      }
    },
    // 支付宝账号查询
    zfbselect() {
      if (this.zhifubao == "") {
        this.$notify({
          title: "提示",
          duration: 1800,
          message: "请输入支付宝账号",
          type: "error"
        });
        return;
      }
      this.tableDataLoading = true;
      this.$http({
        url: this.$http.adornUrl("cash/selectPayDetails"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          zhifubao: this.zhifubao
        })
      }).then(({ data }) => {
        this.tableDataLoading = false;
        let returnData = data.data;
        this.tableData = returnData.list;
        this.totalnum = returnData.totalCount;
      });
      //提现总金额
      this.$http({
        url: this.$http.adornUrl("cash/selectPayTotal"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          zhifubao: this.zhifubao
        })
      }).then(({ data }) => {
        this.totalMoney = data.data;
      });
    },
    // 支付宝名称
    qdselect() {
      if (this.zhifubaoName == "") {
        this.$notify({
          title: "提示",
          duration: 1800,
          message: "请输入渠道账号",
          type: "error"
        });
        return;
      }
      this.tableDataLoading = true;
      this.$http({
        url: this.$http.adornUrl("cash/selectPayDetails"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          zhifubaoName: this.zhifubaoName
        })
      }).then(({ data }) => {
        this.tableDataLoading = false;
        let returnData = data.data;
        this.tableData = returnData.list;
        this.totalnum = returnData.totalCount;
      });
      //提现总金额
      this.$http({
        url: this.$http.adornUrl("cash/selectPayTotal"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          zhifubaoName: this.zhifubaoName
        })
      }).then(({ data }) => {
        this.totalMoney = data.data;
      });
    },
    // 获取数据列表
    dataSelect() {
      this.tableDataLoading = true;
      this.$http({
        url: this.$http.adornUrl("cash/selectPayDetails"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          zhifubaoName: this.zhifubaoName,
          shopName: this.shopName,
          zhifubao: this.zhifubao,
          bankCardNo: "",
          bankRealName: "",
          openBank: "",
          type: 2,
          state: this.indentState,
          phone: this.phone,
          startTime: this.startTime,
          endTime: this.endTime,
          outstartTime: this.outstartTime,
          outendTime: this.outendTime
        })
      }).then(({ data }) => {
        console.log(data, "财务中心");

        this.tableDataLoading = false;
        let returnData = data.data;
        this.tableData = returnData.list;
        this.totalnum = returnData.totalCount;
      });
      //提现总金额
      this.$http({
        url: this.$http.adornUrl("cash/selectPayTotal"),
        method: "get",
        params: this.$http.adornParams({
          // 'page': this.page,
          // 'limit': this.limit,
          zhifubaoName: this.zhifubaoName,
          shopName: this.shopName,
          zhifubao: this.zhifubao,
          type: 2,
          state: this.indentState,
          phone: this.phone,
          startTime: this.startTime,
          endTime: this.endTime,
          outstartTime: this.outstartTime,
          outendTime: this.outendTime
        })
      }).then(({ data }) => {
        this.totalMoney = data.data;
      });

      this.$http({
        url: this.$http.adornUrl("app/new-pay/enable-new-pay"),
        method: "get"
      }).then(({ data }) => {
        console.log(data.enable, "true:新支付  false:旧支付");
        this.enable = data.enable;
      });
    },
    // 保证金记录
    baozhengSelect() {
      this.tableDataLoading = true;
      this.$http({
        url: this.$http.adornUrl("/wallet/list"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          shopName: this.shopName3,
          type: this.indentState3,
          classify: 2,
          startTime: this.startTime,
          endTime: this.endTime
        })
      }).then(({ data }) => {
        this.tableDataLoading = false;
        let returnData = data.data;
        this.baozhengData = returnData.list;
        this.totalnum3 = returnData.totalCount;
      });
      //保证金提现总金额
      this.$http({
        url: this.$http.adornUrl("/wallet/statistics"),
        method: "get",
        params: this.$http.adornParams({
          // 'page': this.page,
          // 'limit': this.limit,
          shopName: this.shopName3,
          type: this.indentState3,
          classify: 2,
          startTime: this.startTime,
          endTime: this.endTime
        })
      }).then(({ data }) => {
        this.totalbaoMoney = data.data;
      });
    },
    // 收入统计
    incomeSelect() {
      this.tableDataLoading1 = true;
      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/tcwmplatformMoney"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info1.stockDate1,
          dateType: this.flag
        })
      }).then(({ data }) => {
        if (data.code == 0) {
          console.log(data.data, "收入统计");

          let returnData = data.data;
          this.MoneyData = returnData;
        }
        this.tableDataLoading1 = false;
      });
    },
    // 充值统计
    rechSelect() {
      this.tableDataLoading3 = true;
      this.$http({
        url: this.$http.adornUrl("admin/dataCentre/selectTopUpStatistics"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info1.stockDate1,
          dateType: this.flag
        })
      }).then(({ data }) => {
        if (data.code == 0) {
          let returnData = data.data;
          this.rechgeData = returnData;
        }
        this.tableDataLoading3 = false;
      });
    },
    // 提现统计
    withdrawSelect() {
      this.tableDataLoading2 = true;
      this.$http({
        url: this.$http.adornUrl("cash/statisticsMoney"),
        method: "get",
        params: this.$http.adornParams({
          date: this.info1.stockDate1,
          dateType: this.flag
          // 'type':1
        })
      }).then(({ data }) => {
        let returnData = data.data;
        this.withdrawData = returnData;
        this.withdrawData.sumMoney = this.withdrawData.sumMoney.toFixed(2);
        this.withdrawData.applyMoneySum = this.withdrawData.applyMoneySum.toFixed(
          2
        );
        this.withdrawData.accomplishMoneySum = this.withdrawData.accomplishMoneySum.toFixed(
          2
        );
        this.withdrawData.refuseMoneySum = this.withdrawData.refuseMoneySum.toFixed(
          2
        );
        this.withdrawData.zhifubaoMoneySum = this.withdrawData.zhifubaoMoneySum.toFixed(
          2
        );
        this.withdrawData.weixinMoneySum = this.withdrawData.weixinMoneySum.toFixed(
          2
        );
        this.withdrawData.cashDepositMoneySum = this.withdrawData.cashDepositMoneySum.toFixed(
          2
        );
        this.withdrawData.sumMoneySucceed = this.withdrawData.sumMoneySucceed.toFixed(
          2
        );
        this.withdrawData.sumMoneyAwait = this.withdrawData.sumMoneyAwait.toFixed(
          2
        );
        this.tableDataLoading2 = false;
      });
    },
    selectTrigger() {
      this.rechargeSelect();
    },
    // 获取充值记录
    rechargeSelect() {
      if (this.endTime == "") {
        this.endTime = this.info2.stockDate2;
      }
      if (this.startTime == "") {
        this.startTime = this.info.stockDate;
      }
      this.tableDataLoading = true;
      this.$http({
        url: this.$http.adornUrl("cash/selectUserRecharge"),
        method: "get",
        params: this.$http.adornParams({
          page: this.page,
          limit: this.limit,
          state: this.state,
          startTime: this.startTime,
          endTime: this.endTime
        })
      }).then(({ data }) => {
        this.tableDataLoading = false;
        let returnData = data.data;
        this.rechargeData = returnData.list;
        this.totalnum2 = returnData.totalCount;
      });
    },
    // 查询
    phoneSelect() {
      this.page = 1;
      this.dataSelect();
    },
    // 重置
    cleans2() {
      this.zhifubao = "";
      this.zhifubaoName = "";
      this.shopName = "";
      this.page = 1;
      this.indentState = "";
      this.phone = "";
      this.startTime = "";
      this.endTime = "";
      this.outstartTime = "";
      this.outendTime = "";
      this.dataSelect();
    },
    //保证金查询
    baozhengcha() {
      this.page = 1;
      this.baozhengSelect();
    },
    // 保证金重置
    cleans3() {
      this.shopName3 = "";
      this.page = 1;
      this.indentState3 = "";
      this.startTime = "";
      this.endTime = "";
      this.baozhengSelect();
    },
    //提现管理 导出
    // exportBtn() {
    //   this.$http({
    //     url: this.$http.adornUrl("cash/excelPayDetails"),
    //     method: "get",
    //     responseType: "blob",
    //     params: this.$http.adornParams({
    //       // 'page': page,
    //       // 'size': this.size,
    //       zhifubaoName: this.zhifubaoName,
    //       shopName: this.shopName,
    //       zhifubao: this.zhifubao,
    //       // 'bankCardNo':,
    //       // 'bankRealName':,
    //       // 'openBank':,
    //       // 'classify':,
    //       type: 2,
    //       state: this.indentState,
    //       phone: this.phone,
    //       startTime: this.startTime,
    //       endTime: this.endTime
    //     })
    //   }).then(({ data }) => {
    //     let blob = new Blob([data], {
    //       type:
    //         "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
    //     });
    //     if (window.navigator.msSaveOrOpenBlob) {
    //       navigator.msSaveBlob(blob);
    //     } else {
    //       let url = window.URL.createObjectURL(blob);
    //       let elink = document.createElement("a");
    //       elink.download = "财务列表.xlsx";
    //       elink.style.display = "none";
    //       elink.href = url;
    //       document.body.appendChild(elink);
    //       elink.click();
    //       document.body.removeChild(elink);
    //     }
    //   });
    // },
    exportBtn() {
      console.log(this.totalnum, "导出条数");
      this.exportTitle = "导出";
      // this.exportFlag = 4;
      this.exportVisible = true;
      if (this.totalnum >= 50000) {
        this.exportTitle = "导出错误";
        this.exportFlag = 1;
      } else {
        this.exportTitle = "导出";
        this.exportFlag = 2;
        this.exportVisible = true;
        var userId = this.$cookie.get("userId");
        this.$http({
          url: this.$http.adornUrl("admin/export/excelPayouts"),
          method: "get",
          // responseType: "blob",
          params: this.$http.adornParams({
            userId: userId,
            zhifubao: this.zhifubao,
            zhifubaoName: this.zhifubaoName,
            shopName: this.shopName,
            // 'bankCardNo':,
            // 'bankRealName':,
            // 'openBank':,
            // 'classify':,
            type: 2,
            phone: this.phone,
            state: this.indentState,
            startTime: this.startTime,
            endTime: this.endTime,
            outstartTime: this.outstartTime,
            outendTime: this.outendTime
          })
        }).then(({ data }) => {
          console.log(data, "导出");
          if (data.code == 0) {
            this.exportTitle = "导出成功";
            this.exportFlag = 3;
          }
          // let blob = new Blob([data], {
          //   type:
          //     "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
          // });
          // if (window.navigator.msSaveOrOpenBlob) {
          //   navigator.msSaveBlob(blob);
          // } else {
          //   let url = window.URL.createObjectURL(blob);
          //   let elink = document.createElement("a");
          //   elink.download = "订单列表.xlsx";
          //   elink.style.display = "none";
          //   elink.href = url;
          //   document.body.appendChild(elink);
          //   elink.click();
          //   document.body.removeChild(elink);
          // }
        });
      }
    },
    // 保证金导出
    // exportBtn3() {
    //   this.$http({
    //     url: this.$http.adornUrl("cash/excelPayDetails"),
    //     method: "get",
    //     responseType: "blob",
    //     params: this.$http.adornParams({
    //       // 'page': page,
    //       // 'size': this.size,
    //       shopName: this.shopName3,
    //       type: this.indentState3,
    //       classify: 2,
    //       startTime: this.startTime,
    //       endTime: this.endTime
    //     })
    //   }).then(({ data }) => {
    //     let blob = new Blob([data], {
    //       type:
    //         "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
    //     });
    //     if (window.navigator.msSaveOrOpenBlob) {
    //       navigator.msSaveBlob(blob);
    //     } else {
    //       let url = window.URL.createObjectURL(blob);
    //       let elink = document.createElement("a");
    //       elink.download = "提现记录列表.xlsx";
    //       elink.style.display = "none";
    //       elink.href = url;
    //       document.body.appendChild(elink);
    //       elink.click();
    //       document.body.removeChild(elink);
    //     }
    //   });
    // },
    exportBtn3() {
      console.log(this.totalnum3, "导出条数");
      this.exportTitle = "导出";
      // this.exportFlag = 4;
      this.exportVisible = true;
      if (this.totalnum3 >= 50000) {
        this.exportTitle = "导出错误";
        this.exportFlag = 1;
      } else {
        this.exportTitle = "导出";
        this.exportFlag = 2;
        this.exportVisible = true;
        var userId = this.$cookie.get("userId");
        this.$http({
          url: this.$http.adornUrl("admin/export/excelDeposit"),
          method: "get",
          // responseType: "blob",
          params: this.$http.adornParams({
            userId: userId,
            shopName: this.shopName3,
            type: this.indentState3,
            classify: 2,
            startTime: this.startTime,
            endTime: this.endTime
          })
        }).then(({ data }) => {
          console.log(data, "导出");
          if (data.code == 0) {
            this.exportTitle = "导出成功";
            this.exportFlag = 3;
          }
          // let blob = new Blob([data], {
          //   type:
          //     "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
          // });
          // if (window.navigator.msSaveOrOpenBlob) {
          //   navigator.msSaveBlob(blob);
          // } else {
          //   let url = window.URL.createObjectURL(blob);
          //   let elink = document.createElement("a");
          //   elink.download = "订单列表.xlsx";
          //   elink.style.display = "none";
          //   elink.href = url;
          //   document.body.appendChild(elink);
          //   elink.click();
          //   document.body.removeChild(elink);
          // }
        });
      }
    },

    // exportList() {
    //   console.log(this.tableData2.totalCount, "导出条数");
    //   this.exportTitle = "导出";
    //   // this.exportFlag = 4;
    //   this.exportVisible = true;
    //   if (this.tableData2.totalCount >= 50000) {
    //     this.exportTitle = "导出错误";
    //     this.exportFlag = 1;
    //   } else {
    //     this.exportTitle = "导出";
    //     this.exportFlag = 2;
    //     this.exportVisible = true;
    //     var userId = this.$cookie.get("userId");
    //     this.$http({
    //       url: this.$http.adornUrl("admin/export/excelOrder"),
    //       method: "get",
    //       // responseType: "blob",
    //       params: this.$http.adornParams({
    //         // 'page': page,
    //         // 'size': this.size,
    //         userId: userId,
    //         phone: this.phone,
    //         userName: this.userName,
    //         orderNumber: this.orderNumber,
    //         status: this.status,
    //         shopName: this.shopName,
    //         orderSequence: this.orderSequence,
    //         orderType: this.orderType,
    //         reservationFlag: this.reservationFlag,
    //         indentStatus: this.indentStatus,
    //         riderPhone: this.riderPhone,
    //         startTime: this.startTime,
    //         endTime: this.endTime,
    //         payStartTime: this.payStartTime,
    //         payEndTime: this.payEndTime
    //       })
    //     }).then(({ data }) => {
    //       console.log(data, "导出");
    //       if (data.code == 0) {
    //         this.exportTitle = "导出成功";
    //         this.exportFlag = 3;
    //       }
    //       // let blob = new Blob([data], {
    //       //   type:
    //       //     "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
    //       // });
    //       // if (window.navigator.msSaveOrOpenBlob) {
    //       //   navigator.msSaveBlob(blob);
    //       // } else {
    //       //   let url = window.URL.createObjectURL(blob);
    //       //   let elink = document.createElement("a");
    //       //   elink.download = "订单列表.xlsx";
    //       //   elink.style.display = "none";
    //       //   elink.href = url;
    //       //   document.body.appendChild(elink);
    //       //   elink.click();
    //       //   document.body.removeChild(elink);
    //       // }
    //     });
    //   }
    // },
    exportAffirm() {
      this.exportVisible = false;
    },
    getPath() {
      // this.$router.push({ name: 'mission', params: { refund: '' } });
      if (this.$route.params.type == "platform") {
        console.log("平台-监控路由获取参数", this.$route.params);
        this.indentState = this.$route.params.refund;
        this.startTime = this.$route.params.dayId + " " + "00:00:00";
        this.endTime = this.$route.params.dayId + " " + "23:59:59";
        this.dataSelect();
      } else if (this.$route.params.type == "shop") {
        console.log("商家-监控路由获取参数", this.$route.params);
        this.indentState = this.$route.params.refund;
        this.shopName = this.$route.params.shopName;
        this.startTime = this.$route.params.dayId + " " + "00:00:00";
        this.endTime = this.$route.params.dayId + " " + "23:59:59";
        this.dataSelect();
      } else {
        this.shopName = "";
        this.indentState = "";
        this.startTime = "";
        this.endTime = "";
        this.dataSelect();
      }
    }
  },
  watch: {
    $route: "getPath"
  },
  mounted() {
    // this.dataSelect();
    this.transferClick();
    // this.rechargeSelect()
    this.$nextTick(() => {
      if (this.$route.params.type == "platform") {
        console.log("平台-监控路由获取参数", this.$route.params);
        this.indentState = this.$route.params.refund;
        this.startTime = this.$route.params.dayId + " " + "00:00:00";
        this.endTime = this.$route.params.dayId + " " + "23:59:59";
        this.dataSelect();
      } else if (this.$route.params.type == "shop") {
        console.log("商家-监控路由获取参数", this.$route.params);
        this.indentState = this.$route.params.refund;
        this.shopName = this.$route.params.shopName;
        this.startTime = this.$route.params.dayId + " " + "00:00:00";
        this.endTime = this.$route.params.dayId + " " + "23:59:59";
        this.dataSelect();
      } else {
        this.shopName = "";
        this.indentState = "";
        this.startTime = "";
        this.endTime = "";
        this.dataSelect();
      }
    });
  }
};
</script>

<style scoped>
.box {
  padding: 44px;
  border: 1px solid #eee;
  margin: 15px 10px;
}

.box_num {
  font-size: 14px;
  color: #66b1ff;
}

.box_num .box_color {
  color: #333;
  font-size: 14px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}
.box_num .box_color .help {
  width: 16px;
  height: 16px;
  cursor: pointer;
  margin: 0 2px;
}

.box_num div span {
  font-size: 20px;
  margin-left: 5px;
}

.text_color {
  color: #4f9dec;
}

.text_color span {
  margin-right: 5px;
}

/* 导出限制 */
.el-tabs >>> .export {
  width: 500px;
}
.el-tabs >>> .export .con {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
}
.el-tabs >>> .export .con .gundong {
  animation: gundong 3s linear infinite;
}
@keyframes gundong {
  /* from表示动画的开始位置，也可以使用0%来表示。 */
  from {
    transform: rotate(0deg);
  }
  /* to表示动画的结束位置，也可以使用100%来表示。 */
  to {
    transform: rotate(360deg);
  }
}
.el-tabs >>> .export img {
  width: 70px;
}
.el-tabs >>> .export .btn {
  display: flex;
  flex-direction: row-reverse;
}

.el-tabs >>> .transfer {
  width: 500px;
  /* height: 300px; */
}
.el-tabs >>> .el-dialog__body {
  padding: 30px 20px;
}
.el-tabs >>> .el-dialog__footer {
  padding: 30px 20px;
}
.el-tabs >>> .dialog-footer {
  text-align: right;
}
</style>
