<template>
  <div>
    <el-card class="el-card">
      <div>
        <el-form :inline="true" :model="erpQuery" style="display: flex" size="mini">
          <el-form-item class="query-form-item">
            <el-input
              v-model="erpQuery.code"
              placeholder="存货编码"
              @keyup.enter.native="keyupErp_submit($event)"
            ></el-input>
          </el-form-item>
          <el-form-item class="query-form-item">
            <el-input
              v-model="erpQuery.name"
              placeholder="存货产品名称"
              @keyup.enter.native="keyup_submit($event)"
            ></el-input>
          </el-form-item>

          <el-form-item style="display: flex">
            <el-button type="primary" icon="search" @click="getErpList">查询</el-button>
          </el-form-item>
        </el-form>

        <el-table
          :data="erpList"
          style="width: 100%"
          highlight-current-row="true"
          v-loading="erpLloading"
          :row-class-name="tableRowClassName"
          @current-change="handleErpChange"
        >
          <el-table-column label="序号" type="index"></el-table-column>
          <el-table-column label="第三方编码" prop="code"></el-table-column>
          <el-table-column label="存货名称" prop="name"></el-table-column>
          <el-table-column label="计量单位" prop="measname"></el-table-column>
          <el-table-column label="规格型号" prop="invspec"></el-table-column>
        </el-table>
        <el-pagination
          :page-size="erpQuery.limit"
          @current-change="handleErpPageChange"
          layout="prev, pager, next"
          :total="pageTotal"
        ></el-pagination>

        <div style="text-align: center">
          <el-button type="primary" size="small" icon="search" @click="combine"
            >确定</el-button
          >
          <el-button type="primary" size="small" icon="search" @click="intentBack"
            >取消</el-button
          >
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
import { modifyRel, addErp } from "../../api/basic/udiRelevance";
import { getInvbasdoc } from "../../api/basic/getErps";
export default {
  name: "closeDialog",
  props: {
    uuid: {
      type: Object,
      required: true,
    },

    relId: {
      type: Number,
      required: true,
    },

    isImport: {
      type: Boolean,
      required: true,
    },

    closeDialog: {
      type: Function,
      required: true,
    },
  },

  data() {
    return {
      erpQuery: {
        code: "",
        name: "",
        page: 1,
        limit: 10,
      },

      combineQuery: {
        thirdId: "",
        relId: "",
        erpName: "",
        keys: [],
      },

      udidlList: [],
      erpList: [],
      pageTotal: 1,
      total: 1,
      currentRow: null,
      loading: false,
      erpLloading: false,
      multipleUdiSelection: [],
    };
  },
  methods: {
    tableRowClassName({ row, rowIndex }) {
      if (row.checked) return "warning-row";
      return "";
    },
    checkSelectable(row, index) {
      return !row.check;
    },
    handleCurrentChange(val) {
      this.unionQuery.page = val;
      this.getList();
    },
    handleErpChange(val) {
      console.log(val);
      this.currentRow = val;
    },
    handleErpPageChange(val) {
      this.erpQuery.page = val;
      this.getErpList();
    },
    keyup_submit(event) {
      this.getErpList();
      event.target.select();
    },
    getErpList() {
      this.erplLoading = true;
      getInvbasdoc(this.erpQuery)
        .then((response) => {
          this.erplLoading = false;
          this.erpList = response.data.list || [];
          this.pageTotal = response.data.total || 0;
        })
        .catch(() => {
          this.erplLoading = false;
          this.erpList = [];
          this.pageTotal = 0;
        });
    },
    intentBack() {
      this.closeDialog();
    },
    combine() {
      this.combineQuery.relId = this.relId;
      this.combineQuery.thirdId = this.currentRow.code;
      this.combineQuery.erpName = this.currentRow.name;
      if (this.isImport) {
        addErp(this.combineQuery)
          .then((response) => {
            if (response.code == 20000) {
              this.$emit("closeUdi", true);
            } else {
              this.$emit("closeUdi", false);
            }
          })
          .catch(() => {
            this.$emit("closeUdi", false);
          });
      } else {
        modifyRel(this.combineQuery)
          .then((response) => {
            if (response.code == 20000) {
              this.$emit("closeUdi", true);
            } else {
              this.$emit("closeUdi", false);
            }
          })
          .catch(() => {
            this.$emit("closeUdi", false);
          });
      }
    },

    addErp() {
      this.combineQuery.relId = this.relId;
      this.combineQuery.thirdId = this.currentRow.code;
      this.combineQuery.erpName = this.currentRow.name;
    },

    handleSelectionUdiChange(val) {
      console.log("----" + val);
      this.multipleUdiSelection = val;
    },
  },
  created() {
    console.log("-------------" + this.uuid);
  },
};
</script>

<style scoped>
.checkitemTag {
  float: left;
  text-align: left;
  margin-top: 5px;
  width: 100%;
}

div /deep/.el-table .warning-row {
  background: #bebebe;
}
div /deep/.el-table .success-row {
  background: #ffffff;
}
</style>
