<template>
  <!-- 还款单 -->
  <div class="repayment">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="还款单" name="还款单">
        <el-select v-if="headOffice == 1" ref="select" multiple collapse-tags filterable default-first-option v-model="queryForm.storeList" clearable @clear="getData" placeholder="请选择门店" @change="getData">
          <el-option v-for="item in options" :key="item.id" :label="item.label" :value="item.id">
          </el-option>
        </el-select>
        <el-input size="medium" class="form-width-ms" v-model="queryForm.docNum" placeholder="输入要查询的单据号" clearable></el-input>
        <el-input size="medium" class="form-width-ms" v-model="queryForm.memberName" placeholder="输入要查询的会员名字" clearable></el-input>
        <el-input size="medium" class="form-width-ms" maxlength="11" v-model="queryForm.mobilePhone" placeholder="输入要查询的11位会员手机号" oninput="this.value=this.value.replace(/\D/g,'')" pattern="[0-9]*" clearable></el-input>
        <el-button size="mini" type="primary" plain @click="getData">搜索</el-button>
        <el-table :data="billsList" class="margin-top-xs" :header-cell-style="{background: 'linear-gradient(#6cb3ff, #1873d4)' ,color:'#eeeeee'}" ref="multipleTable" highlight-current-row tooltip-effect="dark" stripe>
          <el-table-column align="center" label="状态" width="70" fixed="left">
            <template slot-scope="scope">
              <el-tag effect="dark" size="medium" :type="scope.row.isCancel==1?'primary':'success'"> <span v-show="scope.row.isCancel==1">作废</span><span v-show="scope.row.isCancel==0">正常</span> </el-tag>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="repayNum" label="单号" min-width="120"></el-table-column>
          <el-table-column align="center" prop="repayDate" label="日期" min-width="160"></el-table-column>
          <el-table-column align="center" prop="isAddition" label="是否补单" min-width="50">
            <template slot-scope="scope"><span v-show="scope.row.isAddition==0">否</span><span v-show="scope.row.isAddition==1">是</span></template>
          </el-table-column>
          <el-table-column align="center" prop="memberName" label="会员名字" min-width="100"></el-table-column>
          <el-table-column align="center" prop="mobilePhone" label="手机号码" min-width="100"></el-table-column>
          <el-table-column align="center" prop="debtMoney" label="待付金额" min-width="80"></el-table-column>
          <el-table-column align="center" prop="payMoney" label="已支付" min-width="80"></el-table-column>
          <el-table-column align="center" prop="inputBy" label="录单人" min-width="80"></el-table-column>
          <el-table-column align="center" label="单据个数" min-width="80">
            <template slot-scope="scope">
              <div v-if="scope.row.repayTradeLists!=undefined">
                {{scope.row.repayTradeLists.length}}
              </div>
            </template>
          </el-table-column>
          <el-table-column fixed="right" align="center" label="明细" width="76">
            <template slot-scope="scope">
              <el-button size="mini" type="primary" plain @click="detail(scope.row,detailDialogVisible=true)">明细</el-button>
            </template>
          </el-table-column>
          <el-table-column fixed="right" align="center" label="作废" width="76">
            <template slot-scope="scope">
              <el-button size="mini" type="primary" :disabled="scope.row.isCancel==1" @click="cancel(scope.row)" v-role='5008002'>作废</el-button>
            </template>
          </el-table-column>
          <el-table-column fixed="right" align="center" label="打印" width="76">
            <template slot-scope="scope">
              <el-button size="mini" type="success" :disabled="scope.row.isCancel==1" @click="print(scope.row,printDialogVisible=true) " v-role='5008003'>打印</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="block" style="margin-top:10px;">
          <!-- 分页组件 -->
          <el-pagination align="left" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="queryForm.pageNum" :page-sizes="[10,20,30,40,50]" :page-size="queryForm.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
        </div>
      </el-tab-pane>
      <el-tab-pane label="取消欠款" name="取消欠款">
        <selec v-if="headOffice == 1" ref="selec" @selecData="selecData"></selec>
        <el-input size="medium" class="form-width-ms" v-model="queryForm.docNum" placeholder="输入要查询的单据号" clearable></el-input>
        <el-input size="medium" class="form-width-ms" v-model="queryForm.memberName" placeholder="输入要查询的会员名字" clearable></el-input>
        <el-input size="medium" class="form-width-ms" maxlength="11" v-model="queryForm.mobilePhone" placeholder="输入要查询的11位会员手机号" oninput="this.value=this.value.replace(/\D/g,'')" pattern="[0-9]*" clearable></el-input>
        <el-button size="mini" type="primary" plain @click="getData">搜索</el-button>
        <el-button @click="confirms(radioList)" size="mini" type="primary" :disabled="radioList.state==undefined">明细</el-button>
        <el-button @click="editOrder(1)" size="mini" type="primary" :disabled="radioList.state==3||radioList.state==5 ||radioList.state==1 ||radioList.state==undefined">送审</el-button>
        <el-button @click="editOrder(2)" size="mini" type="primary" :disabled="radioList.state==0||radioList.state==5||radioList.state==2||radioList.state==3||radioList.state==4||radioList.state==undefined" plain>回收</el-button>
        <el-button @click="editOrder(3)" size="mini" type="primary" :disabled="radioList.state==2||radioList.state==5||radioList.state==3 || radioList.state==0|| radioList.state==4||radioList.state==undefined">审核</el-button>
        <el-button @click="editOrder(4)" size="mini" type="primary" :disabled="radioList.state==0||radioList.state==5|| radioList.state==1||radioList.state==2|| radioList.state==4||radioList.state==undefined">反审核</el-button>
        <el-table :data="list" class="margin-top-xs" @row-dblclick="confirms" @row-click="clickRow" :header-cell-style="{background: 'linear-gradient(#6cb3ff, #1873d4)' ,color:'#eeeeee'}" ref="multipleTable" highlight-current-row tooltip-effect="dark" stripe>
          <el-table-column align="center" label="状态" min-width="130">
            <template slot-scope="scope">
              <div class="flex align-center">
                <el-radio v-model="radioValue" :label="scope.row.id" @change.native="(scope.row)">{{''}}
                </el-radio>
                <el-tag size="medium" effect="dark" :type="scope.row.state==0?'info':''||scope.row.state==1?'primary':''||scope.row.state==2?'info':''||scope.row.state==3?'success':''||scope.row.state==4?'warning':scope.row.state==5?'primary':''">
                  <span v-show="scope.row.state==0">新创建</span>
                  <span v-show="scope.row.state==1">已送审</span>
                  <span v-show="scope.row.state==2">已回收</span>
                  <span v-show="scope.row.state==3">已审核</span>
                  <span v-show="scope.row.state==4">反审核</span>
                  <span v-show="scope.row.state==5">已作废</span>
                  <span v-show="scope.row.state==null">未划分</span>
                </el-tag>
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="docType" label="类型" align="center" width="75">
            <template slot-scope="scope">
              <div>{{scope.row.docType=='card_use'?'疗程':scope.row.docType=='promotion_card_use'?'促销':scope.row.liftType==1?'升降级':'正常充值'}}</div>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="docNum" show-overflow-tooltip label="单号" min-width="120"></el-table-column>
          <el-table-column align="center" prop="docDate" show-overflow-tooltip label="日期" min-width="105"></el-table-column>
          <el-table-column align="center" prop="memberName" label="会员名字" min-width="80"></el-table-column>
          <el-table-column align="center" prop="mobilePhone" label="手机号码" min-width="100"></el-table-column>
          <el-table-column align="center" prop="tradeName" label="名称" min-width="120"></el-table-column>
          <el-table-column align="center" prop="tradeMoney" label="成交金额" min-width="80"></el-table-column>
          <el-table-column align="center" prop="debtMoney" label="待付金额" min-width="80"></el-table-column>
          <el-table-column align="center" prop="cancelMoney" label="取消欠款金额" min-width="110"></el-table-column>
          <el-table-column align="center" prop="cancelNum" label="取消欠款次数" min-width="110"></el-table-column>
          <el-table-column align="center" label="操作" width="150">
            <template slot-scope="scope">
              <el-button size="mini" type="primary" :disabled="!(scope.row.state==4||scope.row.state==2||scope.row.state==0)" plain @click="handleUpdata(scope.row)">修改</el-button>
              <el-button size="mini" type="primary" plain @click="del(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="block" style="margin-top:15px;">
          <!-- 分页组件 -->
          <el-pagination align="left" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="queryForm.pageNum" :page-sizes="[10,20,30,40,50]" :page-size="queryForm.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>
    <el-dialog :close-on-click-modal="false" v-dialogDrag :title="title" :visible.sync="cancelDialogVisible" width="650px" append-to-body>
      <el-form label-width="120px" inline>
        <div v-if="cancelForm.docType=='promotion_card_use'">
          <el-form-item label="会员名称">
            {{cancelForm.memberName}}
          </el-form-item>
          <el-form-item label="手机号码">
            {{cancelForm.memberName}}
          </el-form-item>
          <el-form-item label="促销名称">
            {{cancelForm.tradeName}}
          </el-form-item>
          <el-form-item label="成交金额">
            <span class="text-red text-price">
              {{cancelForm.tradeMoney}}
            </span>
          </el-form-item>
          <el-form-item label="欠款金额">
            <span class="text-cyan text-price">
              {{cancelForm.debtMoney}}
            </span>
          </el-form-item>
          <el-form-item label="取消欠款">
            <span class="text-cyan text-price">
              {{cancelForm.cancelMoney}}
            </span>
          </el-form-item>
          <el-table :data="cancelForm.cancelDebtMxes" highlight-current-row tooltip-effect="dark">
            <el-table-column prop="courseProjectNum" show-overflow-tooltip label="项目编码" align="center" min-width="80"></el-table-column>
            <el-table-column prop="courseProjectName" show-overflow-tooltip label="项目名称" align="center" min-width="120"></el-table-column>
            <el-table-column prop="price" show-overflow-tooltip label="欠款" align="center" min-width="80">
              <el-table-column prop="debtMoney" show-overflow-tooltip label="金额" align="center" min-width="80"></el-table-column>
              <el-table-column prop="debtCount" show-overflow-tooltip label="次数" align="center" min-width="80"></el-table-column>
            </el-table-column>
            <el-table-column prop="price" show-overflow-tooltip label="取消欠款" align="center" min-width="80">
              <el-table-column prop="cancelMoney" show-overflow-tooltip label="金额" align="center" min-width="80">
                <template slot-scope="scope">
                  <div @click.stop v-if="title=='修改'">
                    <div class="text-cyan" v-if="editCancelMIndex!=scope.$index" @click="openEditCancelM(scope.row,scope.$index,editCancelMIndex=scope.$index)">
                      {{scope.row.cancelMoney}}
                      <i class="el-icon-edit text-cyan"></i>
                    </div>
                    <el-input v-focus type="number" class="form-input-width-xs" v-else @blur="endEditCancelM(scope.row,editCancelMIndex=-1)" v-model="scope.row.cancelMoney"></el-input>
                  </div>
                  <div v-else>{{scope.row.cancelMoney}}</div>
                </template>
              </el-table-column>
              <el-table-column prop="cancelNum" show-overflow-tooltip label="次数" align="center" min-width="80">
                <template slot-scope="scope">
                  <div @click.stop v-if="title=='修改'">
                    <div class="text-cyan" v-if="editCancelCIndex!=scope.$index" @click="openEditCancelC(scope.row,scope.$index,editCancelCIndex=scope.$index)">
                      {{scope.row.cancelNum}}
                      <i class="el-icon-edit text-cyan"></i>
                    </div>
                    <el-input v-focus type="number" class="form-input-width-xs" v-else @blur="endEditCancelC(scope.row,editCancelCIndex=-1)" v-model="scope.row.cancelNum"></el-input>
                  </div>
                  <div v-else>{{scope.row.cancelNum}}</div>
                </template>
              </el-table-column>
            </el-table-column>
          </el-table>
        </div>
        <div v-else>
          <el-form-item label="欠款帐户">
            {{cancelForm.tradeName}}
          </el-form-item>
          <el-form-item label="成交金额">
            <span class="text-red text-price">
              {{cancelForm.tradeMoney}}
            </span>
          </el-form-item>
          <el-form-item label="欠款金额">
            <span class="text-cyan text-price">
              {{cancelForm.debtMoney}}
            </span>
          </el-form-item>
          <el-form-item label="取消欠款金额">
            <el-input type="number" class="form-width-ms" v-model="cancelForm.cancelMoney"></el-input>
          </el-form-item>
          <el-form-item label="取消欠款次数" v-if="cancelForm.docType == 'card_use'">
            <el-input pattern="[0-9]*\" type="number" class="form-width-ms" v-model="cancelForm.cancelNum"></el-input>
          </el-form-item>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" type="primary" plain @click="cancelDialogVisible = false">取 消</el-button>
        <el-button size="mini" v-if="title=='修改'" type="primary" @click="confirmCancel()">确 定 </el-button>
      </span>
    </el-dialog>

    <el-dialog :close-on-click-modal="false" v-dialogDrag title="打印" :visible.sync="printDialogVisible" width="60%">
      <div id="printService" class="printDiv">
        <div class="text-center text-grey padding-xs">
          还款记录单
        </div>
        <hr>
        <el-form :model="printForm" :inline="true">
          <el-form-item label="">
            <div class="span" style="wdith:120px">{{printForm.storeName}}</div>
          </el-form-item>
          <el-form-item label="">
            {{printForm.repayDate}}
          </el-form-item><br>
          <el-form-item label="还款单号:">
            {{printForm.repayNum}}
          </el-form-item><br>
          <el-form-item label="会员信息:">
            <div>{{printForm.memberName}} / {{printForm.mobilePhone}}</div>
          </el-form-item><br>
          <el-form-item label="欠款金额:">
            <div style="width:50px">{{printForm.debtMoney}}</div>
          </el-form-item>
          <el-form-item label="还款金额:">
            <div>{{printForm.payMoney}}</div>
          </el-form-item>
          <div v-for="(item,index) in printForm.repayTradeLists" :key="index">
            <el-form-item label="帐户名称:">
              <div>
                <span class="text-bold">
                  {{item.tradeName}}
                </span>
                <span class="text-cyan">
                  还款:
                  {{item.repayMoney}}
                </span>
              </div>
            </el-form-item>
          </div>
          <br>
          <br>
          <br>
          <el-form-item label="签名:">
            <!-- <div style="height:30px;width:150px;border-bottom:1px solid #333"> </div> -->
          </el-form-item><br>
          <el-form-item label="服务热线:">
            {{printForm.telephone}}
          </el-form-item><br>
          <el-form-item label="打印时间:">
            {{printForm.printDate  |  dateFormat}}
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" type="primary" plain @click="printDialogVisible = false">取 消</el-button>
        <el-button size="mini" type="primary" v-print="'#printService'">打 印</el-button>
      </span>
    </el-dialog>
    <el-dialog title="导入表格" :visible.sync="infoDialog" :close-on-click-modal='false'>
      <excel @fileData='fileData' @infoDialogV='infoDialogV'></excel>
    </el-dialog>
    <detail ref="detail" @detailData="detailData"></detail>
  </div>
</template>
<script>
import {
  repayPage,
  repayCancel,
  repayEditStaff,
  selectOne,
  cancelDebtList,
  editCancelDebtList,
  auditCancelDebtList,
  theauditCancelDebtList,
  deleteCancelDebtList,
  recycleCancelDebtList,
  submitCancelDebtList,
} from "@/api/eashier.js";
import { organizations } from "@/api/storeManage.js";

import excel from "@/components/excel";
import admin from "@/components/staffList/admin/index";
import manager from "@/components/staffList/manager/index";
import staffsles from "@/components/staffList/staff/index";
import selec from "@/components/store/select/index";

export default {
  components: {
    staffsles,
    manager,
    admin,
    excel,
    detail,
    selec,
  },
  data() {
    return {
      headOffice: sessionStorage.getItem("headOffice") * 1,
      printDialogVisible: false, //打印弹窗开关
      detailDialogVisible: false,
      cancelDialogVisible: false,
      editStaffDialog: false,
      radiostaffvalue: "",
      radiostaffvalueList: {},
      activeName: "还款单",
      radioValue: null,
      radioList: {},
      options: [],
      editIndex: -1,
      title: "",
      pageNum: 1, // 当前页码
      pageSize: 10, // 每页的数据条数,
      printForm: {
        repayDate: "",
        recharge: "",
        repayNum: null,
        storeId: "",
        memberName: "",
        mobilePhone: null,
        money: null,
        backMoney: null,
        numMoney: null,
        numMoneys: null,
        telephone: "",
        printDate: new Date(),
      },
      editForm: {},
      billsList: [],
      form: {}, //主对象
      repayTradeLists: [],
      staffValue: "",
      entities: [],
      list: [], //主数组
      index: -1,
      total: 0, //分页总条数
      cancelForm: {},
      queryForm: {
        //查询对象
        pageNum: 1,
        pageSize: 10,
      },
      infoDialog: false, //上传文件弹窗开关
      editCancelCIndex: -1,
      editCancelMIndex: -1,
    };
  },
  methods: {
    handleUpdata(row){
      console.log(row)
      this.cancelForm={ ...row }
      this.cancelDialogVisible=true
      this.title='修改'
    },
    confirms(row) {
      this.cancelForm = row;
      this.cancelDialogVisible = true;
      this.title = "明细";
    },
    openEditCancelM(row, index) {},
    endEditCancelM(row) {
      if (row.cancelMoney * 1 > row.debtMoney) {
        this.$message.waring({ message: "最高可以取消" + row.debtMoney });
        row.cancelMoney = row.debtMoney;
      } else {
        this.sumMoney();
      }
    },
    openEditCancelC(row, index) {
      let form = { ...row };
    },
    endEditCancelC(row) {
      if (row.cancelNum * 1 > row.debtCount) {
        this.$message.waring({ message: "最高可以取消" + row.debtCount });
        row.cancelNum = row.debtCount;
      } else {
        this.sumMoney();
      }
    },
    sumMoney() {
      let money = 0;
      let form = { ...this.cancelForm };
      this.cancelForm.cancelDebtMxes.forEach((item) => {
        money += item.cancelMoney * 1;
      });
      form.cancelMoney = money.toFixed(2) * 1;
      this.cancelForm = JSON.parse(JSON.stringify(form));
    },
    //明细返回方法
    detailData(v) {
      this.getData();
    },
    del(row) {
      deleteCancelDebtList({ id: row.id }).then((res) => {
        if (res.code == "000000") {
          this.$message.success({ message: "删除成功!" });
          this.getData();
        } else {
          this.$alert(res.message, "提示", {
            confirmButtonText: "确定",
            confirmButtonClass: "confirmbtnFalses",
            type: "warning",
            center: true,
            callback: (action) => {},
          });
        }
      });
    },
    confirmCancel() {
      editCancelDebtList(this.cancelForm).then((res) => {
        if (res.code == "000000") {
          this.cancelDialogVisible = false;
          this.$message.success({ message: "修改成功!" });
          this.getData();
        } else {
          this.$alert(res.message, "提示", {
            confirmButtonText: "确定",
            confirmButtonClass: "confirmbtnFalses",
            type: "warning",
            center: true,
            callback: (action) => {},
          });
        }
      });
    },
    editOrder(number) {
      if (number == 3) {
        let form = { id: this.radioList.id, state: number };
        auditCancelDebtList(form).then((res) => {
          if (res.code == "000000") {
            this.$message.success({ message: "审核成功!" });
            this.getData();
          } else {
            this.$alert(res.message, "提示", {
              confirmButtonText: "确定",
              confirmButtonClass: "confirmbtnFalses",
              type: "warning",
              center: true,
              callback: (action) => {},
            });
          }
        });
      }
      if (number == 4) {
        let form = { id: this.radioList.id, state: number };
        theauditCancelDebtList(form).then((res) => {
          if (res.code == "000000") {
            this.$message.success({ message: "反审核成功!" });
            this.getData();
          } else {
            this.$alert(res.message, "提示", {
              confirmButtonText: "确定",
              confirmButtonClass: "confirmbtnFalses",
              type: "warning",
              center: true,
              callback: (action) => {},
            });
          }
        });
      }
      if (number == 1) {
        let form = { id: this.radioList.id, state: number };
        submitCancelDebtList(form).then((res) => {
          if (res.code == "000000") {
            this.$message.success({ message: "操作成功!" });
            this.getData();
          } else {
            this.$alert(res.message, "提示", {
              confirmButtonText: "确定",
              confirmButtonClass: "confirmbtnFalses",
              type: "warning",
              center: true,
              callback: (action) => {},
            });
          }
        });
      }
      if (number == 2) {
        let form = { id: this.radioList.id, state: number };
        recycleCancelDebtList(form).then((res) => {
          if (res.code == "000000") {
            this.$message.success({ message: "操作成功!" });
            this.getData();
          } else {
            this.$alert(res.message, "提示", {
              confirmButtonText: "确定",
              confirmButtonClass: "confirmbtnFalses",
              type: "warning",
              center: true,
              callback: (action) => {},
            });
          }
        });
      }
    },
    clickRow(row) {
      this.radioValue = row.id;
      this.radioList = row;
    },
    //切换标签页
    handleClick(tab, event) {
      console.log(tab, event);
      this.activeName = tab.name;
      this.getData();
      if (this.headOffice == 1) {
        this.$nextTick(() => {
          this.$refs.selec.show();
        });
      }
    },

    //上传文件方法
    fileData(v) {
      //console.log(v);
    },
    //返回上传文件弹窗状态
    infoDialogV(v) {
      this.infoDialog = v;
    },

    //导出方法
    exit() {},

    eidtStaff(index) {
      this.index = index;
    },
    //点击选中
    rowClick(row) {
      this.radiostaffvalue = row.id;
      this.radiostaffvalueList = row;
    },

    detailEditStaff(row) {
      this.$refs.detail.show(row);
    },

    //明细
    detail(row) {
      this.$refs.detail.show(row);
    },
    // 打印方法
    print(row) {
      //console.log(row);
      this.printForm = row;
      this.printForm.printDate = new Date();
      this.printForm.telephone = JSON.parse(
        sessionStorage.getItem("storeInfo")
      ).telephone;
    },
    //作废
    cancel(row) {
      this.$confirm("确定作废, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        cancelButtonClass: "cancelbtnFalses",
        confirmButtonClass: "confirmbtnFalses",
      })
        .then(() => {
          row.repayTradeLists.forEach((item) => {
            delete item.entities;
            delete item.achievementAmount;
            delete item.cardCommissionAmount;
            delete item.cardAchievementAmount;
            delete item.commissionAmount;
            delete item.repayDate;
          });
          delete row.payLists;
          //console.log(row);
          repayCancel(row).then((res) => {
            //console.log(res);
            if (res.code == "000000") {
              this.getData();
              this.$message.success({ message: res.message });
            } else {
              this.$alert(res.message, "提示", {
                confirmButtonText: "确定",
                confirmButtonClass: "confirmbtnFalses",
                type: "warning",
                center: true,
                callback: (action) => {},
              });
            }
          });
        })
        .catch(() => {
          this.$message.info({ message: "已取消操作！" });
        });
    },
    selecData(v) {
      this.queryForm.storeList = v;
      this.getData();
    },
    //获取数据
    async getData() {
      if (this.activeName == "还款单") {
        if (this.headOffice == 1) {
          setTimeout(() => {
            console.log(this.$refs.selec);
            this.$nextTick(() => {
              this.$refs.selec.show();
            });
          }, 800);
        }
        repayPage(this.queryForm).then((res) => {
          if (res.code == "000000") {
            this.billsList = res.pageInfo.list;
            this.total = res.pageInfo.total;
          } else {
            this.$alert(res.message, "加载还款列表", {
              confirmButtonText: "确定",
              confirmButtonClass: "confirmbtnFalses",
              type: "warning",
              center: true,
              callback: (action) => {},
            });
          }
        });
      } else {
        cancelDebtList(this.queryForm).then((res) => {
          if (res.code == "000000") {
            this.list = res.pageInfo.list;
            this.total = res.pageInfo.total;
          } else {
            this.$alert(res.message, "加载取消还款列表", {
              confirmButtonText: "确定",
              confirmButtonClass: "confirmbtnFalses",
              type: "warning",
              center: true,
              callback: (action) => {},
            });
          }
        });
      }
    },
    //分页方法
    handleSizeChange(val) {
      this.queryForm.pageSize = val;
      this.getData();
    },
    handleCurrentChange(val) {
      this.queryForm.pageNum = val;
      this.getData();
    },
    //数组按对应字段合计返回方法
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (column.property == "payMoney") {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              sums[index] = "--";
            }
          }, 0);
          sums[index] += " ";
        } else {
          sums[index] = "--";
        }
      });
      return sums;
    },
  },
  created() {
    let list = JSON.parse(sessionStorage.getItem("list"));
    list.forEach((item) => {
      if (item.id == 5008001) {
        this.getData();
        organizations({ pageSize: 999 }).then((res) => {
          if (res.code == "000000") {
            res.rows.forEach((item) => {
              item.label = item.storeNum + "-" + item.storeName;
            });
            this.options = res.rows;
          } else {
            this.$alert(res.message, "提示", {
              confirmButtonText: "确定",
              confirmButtonClass: "confirmbtnFalses",
              type: "warning",
              center: true,
              callback: (action) => {},
            });
          }
        });
      }
    });
  },
};
</script>

<style>
.repayment {
  padding: 10px;
  overflow: auto;
  margin-left: 10px;
}
.dialogDiv .el-radio__label {
  display: none;
}
.printDiv .el-form-item {
  margin-bottom: 0px;
}
.printDiv .el-form-item__label,
.el-form-item__content {
  font-size: 12px;
  color: black;
  font-family: "宋体";
  padding: 0 5px 0 0;
}
.printDiv {
  width: 230px;
  margin: 0 auto;
}
.editstaffdiv {
  width: 120px;
}
.editStaffDialogDiv .el-radio__label {
  display: none;
}
</style>
