<template>
<!--  退款列表-->
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs="crumbs"></bread-crumb>
    </div>
    <div class="app-container">
      <div style="width: 100%">
        <div class="Top">
          <div>退款列表</div>
          <div class="btn_list">
            <el-button size="small" type="primary" @click="to_add">
              新增
            </el-button>
            <el-button size="small" type="primary" @click="pass_exam">
              批量审核
            </el-button>
            <el-button size="small" type="warning" @click="reject_exam">
              审核拒绝
            </el-button>
          </div>
        </div>
        <div
          style="
            justify-content: flex-start;
            margin: 0px 0 12px 0;
            display: flex;
            align-items: center;
          "
        >
          <div style="display: flex">
            <div style="width: 250px">
              <el-input
                size="small"
                style="width: 200px; margin-left: 10px"
                class="filter-item"
                placeholder="请输入编号/患者名称"
                v-model.trim="tmp_keyword"
              />
            </div>

            <div style="width: 287px;margin-right: 30px;white-space: nowrap;">
              退款类型：
              <el-select v-model="tmp_refundtype" placeholder="请选择" @change="updaterefundtype">
                <el-option
                  v-for="item in refundtypelist"
                  :key="item.name"
                  :label="item.name"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </div>

            <div style="width: 288px;margin-right: 30px;white-space: nowrap;">
              审核状态：
              <el-select v-model="tmp_examinetype" placeholder="请选择" @change="updateexaminetype">
                <el-option
                  v-for="item in examinelist"
                  :key="item.name"
                  :label="item.name"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </div>

            <div style="width: 465px;white-space: nowrap;">
              <span>日期查询：</span>
              <el-date-picker
                unlink-panels
                v-model="tmp_value1"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
              >
              </el-date-picker>
            </div>
            <el-button
              size="small"
              class="filter-item"
              type="primary"
              icon="el-icon-search"
              @click="search_tmp"
              >查询</el-button
            >
          </div>
        </div>
        <el-table
          ref="multipleTable"
          :header-cell-style="{
            backgroundColor: 'rgb(245, 247, 250)',
            color: '#606266',
          }"
          :data="tableData"
          @selection-change="handleSelectionChange"
          border
        >
          <el-table-column type="selection" width="55"> </el-table-column>

          <el-table-column label="申请编号" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.deposit_code  ? scope.row.deposit_code  : ""}}</span>
            </template>
          </el-table-column>
          <el-table-column label="患者名称" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.his_name  ? scope.row.his_name  : ""}}</span>
            </template>
          </el-table-column>

          <el-table-column label="退款类型" align="center">
            <template slot-scope="scope">
<!--              <span>{{scope.row.deposit_code  ? scope.row.deposit_code  : ""}}</span>-->
              <span v-if="scope.row.deposit_status == 3">手动退款</span>
              <span v-if="scope.row.deposit_status == 4">自动退费</span>
            </template>
          </el-table-column>
          <el-table-column label="退款金额" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.deposit  ? scope.row.deposit  : ""}}</span>
            </template>
          </el-table-column>
          <el-table-column label="退款状态" align="center">
            <template slot-scope="scope">
<!--              <span>{{scope.row.deposit_code  ? scope.row.deposit_code  : ""}}</span>-->
              <span v-if="scope.row.trial_status == 0 && scope.row.deposit_status == 3">未审核</span>
              <span v-if="scope.row.trial_status == 1 && scope.row.deposit_status == 3">已审核</span>
              <span v-if="scope.row.trial_status == 2 && scope.row.deposit_status == 3">审核拒绝</span>
              <span v-if="scope.row.deposit_status == 4">-</span>
            </template>
          </el-table-column>
          <el-table-column label="申请人" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.name  ? scope.row.name  : ""}}</span>
            </template>
          </el-table-column>
          <el-table-column label="申请时间" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.starttime  ? scope.row.starttime  : ""}}</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" width="350px">
            <template slot-scope="scope">


              <span v-if="scope.row.trial_status == 0 && scope.row.deposit_status == 3"><!--未审核-->
                <el-button size="small" type="primary" @click="examine(scope.row, scope.row.$index)">审核</el-button>
                <el-button size="small" type="primary" icon="el-icon-edit-outline" @click="edit(scope.row, scope.row.$index)"></el-button>
                <el-button size="small" type="danger" icon="el-icon-delete" @click="toDelete(scope.row, scope.row.$index)"></el-button>
              </span>
              <span v-if="scope.row.trial_status == 1 && scope.row.deposit_status == 3"><!--已审核-->
                -
              </span>
              <span v-if="scope.row.trial_status == 2 && scope.row.deposit_status == 3"><!--审核拒绝-->
                  <el-button size="small" type="danger" icon="el-icon-delete" @click="toDelete(scope.row, scope.row.$index)"></el-button>
              </span>
              <span v-if="scope.row.deposit_status == 4">-

              </span>

            </template>
          </el-table-column>
        </el-table>
<!--        <div>充值金额合计：<span>{{sum}}</span></div>-->
      </div>

      <el-dialog
        title="申请退款"
        :visible.sync="dialogVisible"
        width="30%"
        :show-close="close"
      >
        <refundAdd ref="refuna_add" v-bind="$attrs"></refundAdd>
        <span slot="footer" class="dialog-footer">
          <el-button @click="pass">取消</el-button>
          <el-button type="primary" @click="Submit">保 存</el-button>
        </span>
      </el-dialog>

      <el-dialog
        title="编辑退款"
        :visible.sync="dialogVisible02"
        width="30%"
        :show-close="close"
      >
        <refundUpdate ref="refuna_up" v-bind="$attrs"></refundUpdate>
        <span slot="footer" class="dialog-footer">
          <el-button @click="pass02">取消</el-button>
          <el-button type="primary" @click="Submit02">保 存</el-button>
        </span>
      </el-dialog>

      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 50, 100, 200, 500, 1000]"
        :page-size="10"
        background
        align="right"
        style="margin-top: 20px"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>
  </div>
</template>
<script>
import BreadCrumb from "@/xt_pages/components/bread-crumb";
import refundAdd from "./Template/refundAdd.vue";
import refundUpdate from "./Template/refundUpdate.vue";
import {
  refundlist,
  deleterefund,
  refundreview,
  getweektime
}from "@/api/deposit";
export default {
  components: {
    BreadCrumb,
    refundAdd,
    refundUpdate,
  },
  data() {
    return {
      refundtypelist:[{name:"全部",value:0},{name:"手动退款",value: 3},{name:"自动退费",value: 4}],
      examinelist:[{name:"全部",value:3},{name:"未审核",value: 0},{name:"已审核",value: 1},{name:"审核拒绝",value: 2}],
      status: "",
      value: "",
      crumbs: [
        { path: false, name: "押金管理" },
        { path: "/DepositManagement/DepositSearch", name: "充值详情" },
      ],
      tableData: [],
      multipleSelection: [],
      total: 0,
      page: 1,
      limit: 10,
      keyword: "",
      tmp_keyword:"",//临时keyword
      value1:"",
      tmp_value1:"",//临时日期
      start_time:"",
      end_time:"",
      // sum:"",
      dialogVisible: false,
      dialogVisible02:false,
      close: false,
      refundtype: 0,//退款类型
      tmp_refundtype: 0,//临时退款类型
      examinetype: 3,//审核类型
      tmp_examinetype: 3,//临时审核状态

    };
  },

  created(){
    this.init();
    // this.search()
  },
  methods: {
    // 初始化数据
    init() {
      var params = {}
      getweektime(params).then((res) => {
        if (res.data.state == 1){
          this.tmp_value1 = [res.data.data.srart_time,res.data.data.end_time]
          this.value1 = [res.data.data.srart_time,res.data.data.end_time]
        }
        this.search()
      })
    },
    //审核（单个）
    examine(val,index){
      var params = {
        ids:val.id,
        trial_status: 1,
      };
      refundreview(params).then((res) => {
        if (res.data.state == 1){
          this.$message.success("审核通过");
          this.search();
        }else {
          this.$message.error("审核失败：" + res.data.msg);
        }
      })
    },
    updaterefundtype(){
      console.log("refundtype",this.refundtype)
    },
    updateexaminetype(){
      console.log("examinetype",this.examinetype)
    },

    // 查询操作
    search() {
      // alert("gagaga")
      // console.log("value1",this.value1)
      if (this.value1 != null){
        if(this.value1[0] != undefined && this.value1[1] != undefined){
          this.start_time = this.value1[0]
          this.end_time = this.value1[1]
        }
      }else {
        this.start_time = ""
        this.end_time = ""
      }
      var params = {
        keyword: this.keyword,
        start_time: this.start_time,
        end_time: this.end_time,
        refundtype: this.refundtype,
        examinetype: this.examinetype,
        page: this.page,
        limit: this.limit,
      };
      // console.log("params",params)
      refundlist(params).then((res) => {
        if (res.data.state == 1){
          this.tableData = res.data.data.list;
          this.total = res.data.data.total;
        }
      })
    },
    // 查询操作_查询按钮触发
    search_tmp() {
      console.log("==this.tmp_value1==",this.tmp_value1)
      console.log("==this.value1==",this.value1)
      this.keyword = this.tmp_keyword;
      this.refundtype = this.tmp_refundtype;
      this.examinetype = this.tmp_examinetype;
      this.value1 = this.tmp_value1;
      if (this.value1 != null){
        if(this.value1[0] != undefined && this.value1[1] != undefined){
          this.start_time = this.value1[0]
          this.end_time = this.value1[1]
        }
      }else {
        this.start_time = ""
        this.end_time = ""
      }
      var params = {
        keyword: this.keyword,
        start_time: this.start_time,
        end_time: this.end_time,
        refundtype: this.refundtype,
        examinetype: this.examinetype,
        page: 1,//this.page,
        limit: this.limit,
      };
      // console.log("params",params)
      refundlist(params).then((res) => {
        if (res.data.state == 1){
          this.tableData = res.data.data.list;
          this.total = res.data.data.total;
        }
      })
    },

    // 新增
    to_add() {
      this.dialogVisible = true;
      this.$nextTick(() => {
        this.$refs['refuna_add'].closePop();
        this.$refs['refuna_add'].getcode();
        this.$refs['refuna_add'].getusername();
      })
    },

    // 编辑
    edit(data,val){
      if(data.trial_status != 0){
        // alert("当前状态不可编辑")
        this.$message.error("当前状态不可编辑!")
          return
      }
      this.dialogVisible02 = true;
      this.$nextTick(() => {
        this.$refs['refuna_up'].getinformation(data, val);
        this.$refs['refuna_up'].getusername();
        this.$refs['refuna_up'].updateconfig();
      })
    },

    // 删除
    toDelete(val,index) {
      var params = {
        id:val.id,
      };
      this.$confirm("是否确定删除?", {
        confirmButtonText: "确 定",
        cancelButtonText: "取 消",
        type: "warning",
      }).then(() => {
        deleterefund(params).then((res) => {
          if (res.data.state == 1) {
            this.$message.success(res.data.data.list);
          }else {
            this.$message.error(res.data.msg);
          }
        })//刷新
          .then(() =>{
            this.search();
          })
          .catch((err) => {
            console.log(err)
          })
      }).catch(() => {});
    },

    // 批量审核通过
    pass_exam() {
      if(this.multipleSelection.length < 1){
        this.$message.error("未选择任何信息")
        return
      }
      var tmp = "";
      console.log("初始值",tmp)
      for (var i=0;i < this.multipleSelection.length;i++){
        tmp = tmp + this.multipleSelection[i].id + ","
      }
      var params = {
        ids: tmp,
        trial_status: 1,
      }
      refundreview(params).then((res) => {
        if (res.data.state == 1){
          this.$message.success("审核通过");
          this.search();
        }else {
          this.$message.error("审核失败：" + res.data.msg);
        }
      })

    },

    // 审核拒绝
    reject_exam() {
      if(this.multipleSelection.length < 1){
        this.$message.error("未选择任何信息")
        return
      }
      var tmp = "";
      console.log("初始值",tmp)
      for (var i=0;i < this.multipleSelection.length;i++){
        tmp = tmp + this.multipleSelection[i].id + ","
      }
      var params = {
        ids: tmp,
        trial_status: 2,
      }
      refundreview(params).then((res) => {
        if (res.data.state == 1){
          this.$message.success("审核拒绝成功");
          this.search();
        }else {
          this.$message.error("审核拒绝失败：" + res.data.msg);
        }
      })

    },

    // 提交
    Submit() {
      this.$refs['refuna_add'].subfrom();
    },
    Submit02(){
      this.$refs['refuna_up'].subfrom();
    },
    // 退款申请审核
    pass(){
      // this.$refs['refuna_add'].examine();
      this.dialogVisible = false;
    },
    pass02(){
      // this.$refs['refuna_add'].examine();
      this.dialogVisible02 = false;
    },
    pli() {
      // alert("父组件被调用!")
      this.dialogVisible = false;
    },
    pli02() {
      // alert("父组件被调用!")
      this.dialogVisible02 = false;
    },
    // 页表操作
    handleSizeChange(val) {
      this.limit = val;
      this.search();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.search();
    },

    // 列表选择
    handleSelectionChange(val){
        this.multipleSelection = val
        console.log("this.multipleSelection",this.multipleSelection)
    }
  },
};
</script>
<style scoped>
.Top {
  width: 100%;
  height: 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 10px;
}
.btn_list {
  display: flex;
}
</style>>

