<template>
  <div>
    <br />
    <div class="top">
      <el-form :inline="true" :model="searchInfo" class="demo-form-inline">
        <el-form-item label="打款批次：">
          <el-input placeholder="请输入批次号" v-model="searchInfo.batchNo"></el-input>
        </el-form-item>

        <el-form-item label="审核状态：">
           <el-select v-model="searchInfo.batchStatus" clearable placeholder="全部">
                        <el-option v-for="item in this.$enumUtils.toValue('ManualReviewStatus')" :key="item.value"
                                :label="item.label" :value="item.value"></el-option>
                    </el-select>
        </el-form-item>
        <div class="btn">
          <el-button @click="reset" type="primary">重置</el-button>
          <el-button @click="querySearchRemind" type="primary">查询</el-button>
        </div>
      </el-form>
    </div>
    <div>
      <el-table
        :data="tablePlanRemindData"
        style="width: 100%"
        :default-sort="{prop: 'date', order: 'descending'}"
      >
        <el-table-column prop="batchNo" label="打款批次" sortable></el-table-column>
        <el-table-column prop="totalCount" label="打款单数量" sortable></el-table-column>

        <el-table-column prop="totalAmt" label="总金额" sortable></el-table-column>
        <el-table-column prop="approvalStatusStr" label="审核状态" ></el-table-column>
        <el-table-column prop="describe" label="备注信息"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button size="mini" type="text" @click="passMoney(scope.row)"  v-if="scope.row.approvalStatus !== 'SUCCESS' && scope.row.approvalStatus !== 'FAIL'  "  >通过</el-button>
            <el-button size="mini" type="text" @click="passMoney(scope.row)" v-else disabled>通过</el-button>
            <el-button size="mini" type="text" @click="refuseMoney(scope.row)" v-if="scope.row.approvalStatus !== 'FAIL' &&  scope.row.approvalStatus !== 'SUCCESS' " >拒绝</el-button>
            <el-button size="mini" type="text" @click="refuseMoney(scope.row)" v-else  disabled >拒绝</el-button>
            <el-button size="mini" type="text" @click="exportMoney(scope.row)" >导出</el-button>
            <el-button size="mini" type="text" @click="moneyDetail(scope.row)">详情</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="page">
      <el-pagination
        @current-change="handleCurrentChange"
        @size-change="handleSizeChange"
        :current-page.sync="page.current"
        :page-sizes="[20, 50, 80, 100]"
        :page-size="page.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="page.total"
      ></el-pagination>
    </div>

 

    <!--窗口组件-->
    <template>
     

      <!-- 详情 -->
      <byhDetailMarket
        v-if="ui.byhDetailMarket.visible"
        :batchNo="ui.byhDetailMarket.batchNo"
        :dialogVisible.sync="ui.byhDetailMarket.visible"
      ></byhDetailMarket>

      <!-- 打款通过 -->
      <byhPassMoney
        v-if="ui.byhPassMoney.visible"
        :batchNo="ui.byhPassMoney.batchNo"
        :totalCount="ui.byhPassMoney.totalCount"
        :totalAmt="ui.byhPassMoney.totalAmt"
        :dialogVisible.sync="ui.byhPassMoney.visible"
      ></byhPassMoney>
      <!-- 打款拒绝 -->
      <byhRefuseMoney
        v-if="ui.byhRefuseMoney.visible"
        :batchNo="ui.byhRefuseMoney.batchNo"
        :totalCount="ui.byhRefuseMoney.totalCount"
        :totalAmt="ui.byhRefuseMoney.totalAmt"
        :dialogVisible.sync="ui.byhRefuseMoney.visible"
      ></byhRefuseMoney>

      <!--  导出数据 -->
      <byhExportMoney
        v-if="ui.byhExportMoney.visible"
        :batchNo="ui.byhExportMoney.batchNo"
        :totalCount="ui.byhExportMoney.totalCount"
        :totalAmt="ui.byhExportMoney.totalAmt"
        :dialogVisible.sync="ui.byhExportMoney.visible"
      ></byhExportMoney>



    </template>
  </div>
</template>

<script>
import * as moment from "moment";
import downloadexcel  from 'vue-json-excel'
import byhDetailMarket from "./ByhDetailAuthMarket";
import byhPassMoney from "./ByhPassMoney";
import byhRefuseMoney from "./ByhRefuseMoney";
import byhExportMoney from "./ByhExportMoney";

export default {
  name: "ByhPlanRemindList",
  components: {
    byhDetailMarket,
    byhPassMoney,
    byhRefuseMoney,
    byhExportMoney,
    downloadexcel 
  },
  data() {
    return {
      flag: false,
      ui: {
        byhPassMoney: {
          visible: false,
          totalCount: "",
          totalAmt: "",
          batchNo:'',
        },
        byhRefuseMoney: {
          visible: false,
          totalCount: "",
          totalAmt: "",
          batchNo:'',
        },
        byhExportMoney: {
          visible: false,
          totalCount: "",
          totalAmt: "",
          batchNo:'',
        },
        byhDetailMarket: {
          visible: false,
          totalCount: "",
          totalAmt: "",
          batchNo:'',
        }
      },
      page: {
        current: 1,
        size: 20,
        total: 0
      },
      searchInfo: {
        date: [new Date(), new Date()],
        batchNo: "",
        batchStatus: "",
      },
      tablePlanRemindData: [],
      record: "",
      userGroupList: [],
      centerDialogVisible: false
    };
  },

  mounted: function() {
    this.tablePlanRemindData = this.remindData();
  },

  methods: {
    formatter(row, column) {
      return row.address;
    },
    //子组件传值给父组件
    getMyEvent(msg) {
      if (msg) {
        this.tablePlanRemindData = this.remindData();
      }
    },
    // 分配后不刷新页面加载数据
    getMyMarket(msg) {
      if (msg) {
        this.tablePlanRemindData = this.remindData();
      }
    },

    /** 加载数据 */
    remindData(params) {
      var listsData = [];
      this.$$post("/raise/getPageBatchListApproval", this.buildParam())
        .then(res => {
          if (res.data.code != 200) {
            this.$message.error(res.data.message);
            return;
          }
          listsData = res.data.result.data;
          this.tablePlanRemindData = listsData;
          this.page.total = res.data.result.total;
        })
        .catch(error => {
          this.$Message.error(error || "系统异常");
        });
    },

    //搜索查询
    querySearchRemind() {
      this.remindData();
    },

    /*提醒期数*/
    planIndexFormat: function(row, column) {
      var planIndex = row[column.property];
      if (planIndex == undefined) {
        return "";
      }
      return planIndex + "/3";
    },
    // 打款申请通过
    passMoney(record) {
      this.ui.byhPassMoney = {
        visible: true,
        batchNo: record.batchNo,
        totalCount: record.totalCount,
        totalAmt: record.totalAmt
      };
    },
    refuseMoney(record) {
      this.ui.byhRefuseMoney = {
        visible: true,
        batchNo: record.batchNo,
        totalCount: record.totalCount,
        totalAmt: record.totalAmt
      };
    },
    exportMoney(record) {
      this.ui.byhExportMoney = {
        visible: true,
        batchNo: record.batchNo,
        totalCount: record.totalCount,
        totalAmt: record.totalAmt
      };
    },

    moneyDetail(record) {
      this.ui.byhDetailMarket = {
        visible: true,
        batchNo: record.batchNo,
      };
    },
    handleSizeChange(row) {
      this.page.size = row;
      this.page.current = 1;
      this.remindData();
    },
    //参数
    buildParam() {
      var return_hash = {
        size: this.page.size,
        current: this.page.current,
        approvalStatus: '',
      };
      if (this.searchInfo.batchNo != "") {
        return_hash["batchNo"] = this.searchInfo.batchNo;
      }

      if (this.searchInfo.batchStatus != "") {
        return_hash["approvalStatus"] = this.searchInfo.batchStatus;
      }
      return_hash["createUser"] =  localStorage.getItem("userName");
    

      return return_hash;
    },


    //显示日期
    dateFormat: function(row, column) {
      var date = row[column.property];
      if (date == undefined) {
        return "";
      }
      return moment(date).format("YYYY-MM-DD");
    },

    //重置
    reset() {
      this.searchInfo.batchNo = "";
      this.searchInfo.batchStatus = "";
    },

    /** 处理分页操作*/
    handleCurrentChange() {
      this.tablePlanRemindData = this.remindData();
    },
    //营销组分类
    marketFormat: function(row, column) {
      var status = row["group"];
      return this.$enumUtils.toMsg("marketEnum", status);
    },

    mergeDate(param1, param2) {
      if (param1 == "") {
        return "";
      }
      var array = new Array();
      array[0] = new Date(param1);
      array[1] = new Date(param2);
      return array;
    },
    getDate(param, num) {
      if (param && param[num] !== "") {
        return moment(param[num]).format("YYYY-MM-DD");
      }
      return "";
    }
  }
};
</script>

<style scoped>
</style>