<template>
  <el-dialog
    v-loading="loading"
    title="选择退款记录"
    :center="true"
    align="left"
    top="7vh"
    width="1024px"
    :close-on-click-modal="false"
    :visible.sync="showModelThis"
    element-loading-text="拼命加载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)"
    append-to-body
    @close="closeModel"
  >
    <el-card style="height: 700px; margin-top: -25px">
      <el-row :gutter="10">
        <el-col :span="24" style="padding: 0 0 10px 0">
          <el-col :span="8" style="width: 290px">
            <el-input v-model="parmValue.traNo" placeholder="请输入退款编号">
              <el-button
                slot="append"
                icon="el-icon-search"
                @click="searchList"
              ></el-button>
            </el-input>
          </el-col>
          <el-col :span="4" style="width: 160px" class="fr tr">
            <el-button type="primary" @click="searchList"> 刷新 </el-button>
            <el-button type="warning" @click="restSearch"> 重置 </el-button>
          </el-col>
        </el-col>
        <el-col :span="24">
          <el-table
            :data="tableData"
            ref="multipleTable"
            stripe
            border
            :size="'mini'"
            max-height="610"
            style="width: 100%"
            row-key="id"
            :expand-row-keys="expands"
            @selection-change="handleSelectionChange"
          >
            <el-table-column
              type="selection"
              width="45"
              fixed="left"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="refundNo"
              label="退款编号"
              show-overflow-tooltip
              width="180"
            ></el-table-column>

            <el-table-column
              prop="traNo"
              label="原资金编号"
              show-overflow-tooltip
              width="230"
            ></el-table-column>

            <el-table-column
              prop="customerNo"
              label="客户企业编码"
              show-overflow-tooltip
              width="130"
            ></el-table-column>
            <el-table-column
              prop="customer"
              label="客户企业名称"
              show-overflow-tooltip
              min-width="170"
            ></el-table-column>

            <el-table-column
              prop="refund_fee"
              label="退款总额度"
              show-overflow-tooltip
              width="120px"
            ></el-table-column>
            <el-table-column
              prop="back_fee"
              label="退款认领额度"
              show-overflow-tooltip
              width="120"
            ></el-table-column>

            <el-table-column
              prop="addtime"
              label="申请时间"
              show-overflow-tooltip
              width="150"
            ></el-table-column>
          </el-table>
        </el-col>
        <el-col :span="24">
          <el-row>
            <el-col :span="18">
              <div class="Pagination" style="text-align: center; margin-top: 12px">
                <el-pagination
                  :current-page="parmValue.page"
                  :page-size="parmValue.size"
                  :size="searchSize"
                  layout="total,  prev, pager, next, jumper"
                  :total="count"
                  @size-change="handleSizeChange"
                  @current-change="handlePageChange"
                />
              </div>
            </el-col>
            <el-col :span="6" style="text-align: right">
              <div style="margin-top: 12px">
                <el-button type="primary" size="medium" @click="submitForm"
                  >保 存
                </el-button>
                <el-button @click="showModelThis = false" size="medium">{{
                  isDetail ? "关 闭" : "取 消"
                }}</el-button>
              </div>
            </el-col>
          </el-row>
        </el-col>
      </el-row>
    </el-card>
  </el-dialog>
</template>

<script>
import asyncRequest from "@/apis/caixiaoService/InvoiceSales/refund";
import asyncAoldRequest from "@/apis/aoldService/InvoiceSales/refund";
import mixinPage from "@/mixins/elPaginationHandle";
import resToken from "@/mixins/resToken";
import { mapGetters } from "vuex";
export default {
  props: ["id", "showModel", "refund_status", "onces"],
  computed: {
    ...mapGetters(["business_companyNo"]),
  },
  mixins: [mixinPage, resToken],
  data() {
    return {
      loading: false,
      icon: "",
      count: 0,
      tableData: [],
      showModelThis: this.showModel,
      multipleSelection: [],
      parmValue: {
        type: "1",
        page: 1, // 页码
        size: 15, // 每页显示条数
        relaNo: "",
        inv_type: "",
        back_type: "",
        refund_status: "",
      },
    };
  },
  watch: {
    icon(val) {
      if (val) {
        this.showModelThis = false;
        this.$emit("setVal", val);
      }
    },
    showModel: function (val) {
      this.showModelThis = val;
    },
    showModelThis(val) {
      if (!val) {
        this.$emit("cancel");
      } else {
        this.searchList();
      }
    },
  },
  methods: {
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    restSearch() {
      this.parmValue.traNo = "";
      this.parmValue.page = 1;
      this.searchList();
    },
    async searchList() {
      this.multipleSelection = [];
      if (!this.loading) {
        this.loading = true;
        this.tableData = [];
        this.parmValue.companyNo = this.id; // 客户企业编码
        this.parmValue.refund_status = this.refund_status ? this.refund_status : "";
        let res = {};
        if (this.business_companyNo === "1") {
          res = await asyncRequest.list(this.parmValue);
        } else {
          res = await asyncAoldRequest.list(this.parmValue);
        }
        const { code, data, message } = res;
        if (code === 0) {
          const { list, count } = data;
          this.tableData = list;
          this.count = count;
        } else if (code >= 100 && code <= 104) {
          await this.logout();
        } else {
          this.tableData = [];
          this.count = 0;
        }
        this.loading = false;
      }
    },
    closeModel() {
      console.log("closeModel!!");
    },
    async submitForm() {
      if (this.onces && this.multipleSelection.length > 1) {
        this.$message.warning("只能选择一条数据！");
      } else {
        // 刷新
        this.showModelThis = false;
        this.$emit("refresh", this.multipleSelection);
      }
    },
  },
};
</script>

<style></style>
