<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.sequenceNo"
              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="expand">
              <template #default="props">
                <el-table
                  style="width: 100%"
                  :size="'mini'"
                  :data="props.row.good"
                  stripe
                  max-height="350"
                  border
                >
                  <el-table-column
                    label="产品编号"
                    prop="goodNo"
                    show-overflow-tooltip
                    width="125"
                  >
                  </el-table-column>
                  <el-table-column
                    label="商品名称"
                    prop="goodname"
                    show-overflow-tooltip
                  >
                  </el-table-column>
                  <el-table-column
                    label="品牌"
                    prop="brand"
                    width="80"
                    show-overflow-tooltip
                  >
                  </el-table-column>
                  <el-table-column
                    label="单位"
                    prop="unit"
                    width="80"
                    show-overflow-tooltip
                  >
                  </el-table-column>
                  <el-table-column
                    label="数量"
                    width="65"
                    show-overflow-tooltip
                  >
                    <template #default="scope">{{ scope.row.num }} </template>
                  </el-table-column>
                  <el-table-column
                    label="单价"
                    width="90"
                    show-overflow-tooltip
                  >
                    <template #default="scope"
                      >{{ scope.row.price }}
                    </template></el-table-column
                  >
                  <el-table-column
                    label="总价"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope"
                      >{{ scope.row.total_fee }}
                    </template>
                  </el-table-column>
                  <el-table-column
                    label="资金已核销金额"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope"
                      >{{ scope.row.apay_fee }}
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="paying_fee"
                    label="资金处理中的金额"
                    show-overflow-tooltip
                    min-width="120"
                  ></el-table-column>
                  <el-table-column
                    label="资金待核销金额"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope"
                      >{{ scope.row.wpay_fee }}
                    </template>
                  </el-table-column>
                  <el-table-column
                    label="关联资金状态"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope">
                      <el-tag
                        type="danger"
                        :size="'mini'"
                        v-if="scope.row.pay_status === '1'"
                        >未核销</el-tag
                      >
                      <el-tag
                        type="warning"
                        :size="'mini'"
                        v-else-if="scope.row.pay_status === '2'"
                        >部分核销</el-tag
                      >
                      <el-tag type="" :size="'mini'" v-else>全部核销</el-tag>
                    </template>
                  </el-table-column>
                  <el-table-column
                    label="发票已核销数量"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope"
                      >{{ scope.row.inv_num }}
                    </template>
                  </el-table-column>

                  <el-table-column
                    label="发票已核销金额"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope"
                      >{{ scope.row.ainv_fee }}
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="inving_fee"
                    label="发票处理中的金额"
                    show-overflow-tooltip
                    min-width="120"
                  ></el-table-column>
                  <el-table-column
                    label="发票待核销金额"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope"
                      >{{ scope.row.winv_fee }}
                    </template>
                  </el-table-column>
                  <el-table-column
                    label="关联发票状态"
                    width="105"
                    show-overflow-tooltip
                    ><template #default="scope">
                      <el-tag
                        type="danger"
                        :size="'mini'"
                        v-if="scope.row.inv_status === '1'"
                        >未核销</el-tag
                      >
                      <el-tag
                        type="warning"
                        :size="'mini'"
                        v-else-if="scope.row.inv_status === '2'"
                        >部分核销</el-tag
                      >
                      <el-tag type="" :size="'mini'" v-else>全部核销</el-tag>
                    </template>
                  </el-table-column>
                </el-table>
              </template>
            </el-table-column>
            <el-table-column
              type="selection"
              width="45"
                 fixed="left"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="sequenceNo"
              label="确认单号"
              show-overflow-tooltip
              width="140"
            ></el-table-column>
            <el-table-column
              prop="companyNo"
              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="contactor"
              label="联系人"
              show-overflow-tooltip
              min-width="70"
            ></el-table-column>
            <el-table-column
              prop="sales_name"
              label="业务员"
              show-overflow-tooltip
              min-width="70"
            ></el-table-column>
            <!-- <el-table-column
              prop="createdTime"
              label="创建时间"
              show-overflow-tooltip
              min-width="145"
            ></el-table-column> -->
            <el-table-column
              prop="total_fee"
              label="订单总金额"
              show-overflow-tooltip
              min-width="110"
            ></el-table-column>

            <el-table-column
              label="关联资金信息"
              show-overflow-tooltip
              align="center"
            >
              <el-table-column
                prop="apay_fee"
                label="已核销金额"
                show-overflow-tooltip
                min-width="110"
              ></el-table-column>
              <el-table-column
                prop="pay_fee"
                label="处理中的金额"
                show-overflow-tooltip
                min-width="110"
              ></el-table-column>
              <el-table-column
                prop="wpay_fee"
                label="未核销金额"
                show-overflow-tooltip
                min-width="110"
              ></el-table-column>
              <el-table-column
                label="核销状态"
                show-overflow-tooltip
                min-width="95"
              >
                <template slot-scope="scope">
                  <el-tag
                    type="danger"
                    :size="'mini'"
                    v-if="scope.row.pay_status === '1'"
                    >未核销</el-tag
                  >
                  <el-tag
                    type="warning"
                    :size="'mini'"
                    v-else-if="scope.row.pay_status === '2'"
                    >部分核销</el-tag
                  >
                  <el-tag type="" :size="'mini'" v-else>全部核销</el-tag>
                </template>
              </el-table-column>
            </el-table-column>
            <el-table-column
              label="关联发票信息"
              show-overflow-tooltip
              align="center"
            >
              <el-table-column
                prop="ainv_fee"
                label="已核销金额"
                show-overflow-tooltip
                min-width="110"
              ></el-table-column>
              <el-table-column
                prop="inv_fee"
                label="处理中的金额"
                show-overflow-tooltip
                min-width="110"
              ></el-table-column>
              <el-table-column
                prop="winv_fee"
                label="未核销金额"
                show-overflow-tooltip
                min-width="110"
              ></el-table-column>
              <el-table-column
                label="核销状态"
                show-overflow-tooltip
                min-width="95"
              >
                <template slot-scope="scope">
                  <el-tag
                    type="danger"
                    :size="'mini'"
                    v-if="scope.row.inv_status === '1'"
                    >未核销</el-tag
                  >
                  <el-tag
                    type="warning"
                    :size="'mini'"
                    v-else-if="scope.row.inv_status === '2'"
                    >部分核销</el-tag
                  >
                  <el-tag type="" :size="'mini'" v-else>全部核销</el-tag>
                </template>
              </el-table-column>
            </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 :span="24" style="text-align: right">
          <el-button type="primary" @click="submitForm"> 保 存 </el-button>
          <el-button @click="showModelThis = false">取 消</el-button>
        </el-col> -->
        </el-col>
      </el-row>
    </el-card>
  </el-dialog>
</template>

<script>
import asyncRequest from "@/apis/service/InvoiceSales/invoiceApply";
import mixinPage from "@/mixins/elPaginationHandle";
import resToken from "@/mixins/resToken";
export default {
  props: [
    "id",
    "showModel",
    "inv_status",
    "trade_status",
    "order_status",
    "onces",
    "isAll",
  ],
  mixins: [mixinPage, resToken],
  data() {
    return {
      loading: false,
      icon: "",
      count: 0,
      tableData: [],
      showModelThis: this.showModel,
      multipleSelection: [],
      parmValue: {
        starttime: "", // 起始时间
        endtime: "", //结束时间
        sequenceNo: "", // 订单编号
        companyNo: this.id, // 客户企业编码
        page: 1, // 页码
        size: 10, // 每页显示条数
        total_low: "", //最小金额
        total_up: "", //最大金额
        pay_status: "", //资金核销状态
        inv_status: "", //发票核销状态
        inv_low: "", //发票未核销最小金额
        inv_up: "", //发票未核销最大金额
        pay_low: "", //资金未核销最小金额
        pay_up: "", //资金未核销最大金额
      },
    };
  },
  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.sequenceNo = "";
      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.pay_status = this.trade_status; //资金核销状态
        this.parmValue.inv_status = this.inv_status; //发票核销状态
        const res = await asyncRequest.qrdlist(this.parmValue);
        if (res && res.code === 0 && res.data && res.data.list) {
          this.tableData = res.data.list;
          this.count = res.data.count;
        } else if (res && res.code >= 100 && res.code <= 104) {
          await this.logout();
        } else {
          this.tableData = [];
          this.count = 0;
        }
        this.loading = false;
      }
    },
    closeModel() {
      console.log("closeModel!!");
    },
    async submitForm() {
      let isok = true;
      this.multipleSelection.forEach((v1) => {
        if (this.inv_status === "4" && parseInt(v1.inv_fee) !== 0) {
          isok = false;
        }
        if (this.trade_status === "4" && parseInt(v1.pay_fee) !== 0) {
          isok = false;
        }
      });
      if (!isok) {
        if (this.inv_status === "4") {
          this.$message.warning("部分确认单信息：发票处理中的金额不为零！！");
          return;
        }
        if (this.trade_status === "4") {
          this.$message.warning("部分确认单信息：资金处理中的金额不为零！！");
          return;
        }
      }

      if (this.onces && this.multipleSelection.length > 1) {
        this.$message.warning("只能选择一条数据！");
        return;
      } else {
        if (this.isAll === true) {
          // 刷新
          this.showModelThis = false;
          this.$emit("refresh", this.multipleSelection);
        } else {
          let arr = [];
          this.multipleSelection.forEach((v1) => {
            v1.good.forEach((v2) => {
              console.log(v2);
              v2.orderNo = v1.sequenceNo;
              v2.good_num = parseInt(v2.num) - parseInt(v2.inv_num); //此次核销数量
              v2.over_num = parseInt(v2.num) - parseInt(v2.inv_num);
              v2.total = v2.total_fee;
              v2.total_fee = v2.winv_fee; //此次核销金额
              v2.over_total = v2.winv_fee;
              v2.remark = v2.goodname;
              arr.push(v2);
            });
          });
          // 刷新
          this.showModelThis = false;
          this.$emit("refresh", arr);
        }
      }
    },
  },
};
</script>

<style></style>
