<template>
  <div>
    <el-card style="margin-top: -20px">
      <el-form :model="formData" ref="dataForm" label-width="100px">
        <el-button-group style="display: flex;margin: 0px 0 10px 80%; height: 35px">
          <el-button
            type="primary"
            @click.native="finishAccept()"
          >完成验收
          </el-button
          >
          <el-button
            type="primary"
            @click.native="renewAccept()"
          >重新验收
          </el-button
          >
        </el-button-group>

        <el-row>
          <el-col :span="11">
            <el-form-item prop="fromCorp" label="单据编号:">
              <el-input v-model="formData.orderId" auto-complete="off"
                        disabled
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item prop="fromCorp" label="单据时间:">
              <el-input v-model="formData.createTime" auto-complete="off"
                        disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="11">
            <el-form-item prop="fromCorp" label="收货仓库:">
              <el-input v-model="formData.invName" auto-complete="off"
                        disabled
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item prop="fromCorp" label="备注说明:">
              <el-input v-model="formData.remark" auto-complete="off"
                        disabled
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="20">
            <el-form-item prop="code" label="UDI码:">
              <el-input
                id="inputer"
                placeholder="请输入UDI码"
                @focus="getInputFocus($event)"
                @keypress.enter.native="enterKey($event)"
                ref='inputRef'
                style="ime-mode:disabled"
                type="tel"
                v-model="udiCode"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="2">
            <el-button
              type="primary"
              size="small"
              @click.native.stop="addCode()"
              style="height: 31px; margin-left: 20px"
            >添加
            </el-button
            >
          </el-col>
        </el-row>
      </el-form>
    </el-card>

    <el-card>
      <el-table v-loading="loading" :data="codeArray" style="width: 100%;" :row-class-name="tableRowClassName" border
                highlight-current-row max-height="300" height="300" ref="multipleTable">
        <el-table-column label="序号" type="index" width="50"></el-table-column>
        <el-table-column label="物资名称" prop="productName" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column label="规格型号" prop="spec" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column width="150" label="批次号" prop="batchNo"></el-table-column>
        <el-table-column width="180" label="生产日期(yyMMdd)" prop="productDate"></el-table-column>
        <el-table-column width="180" label="失效日期(yyMMdd)" prop="expireDate"></el-table-column>
        <el-table-column width="150" label="送货数量" prop="count"></el-table-column>
        <el-table-column width="150" label="验收数量" prop="acceptCount"></el-table-column>
        <el-table-column label="注册/备案号" prop="zczbhhzbapzbh" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column label="生产企业" prop="manufactory" width="150" show-overflow-tooltip></el-table-column>
        <el-table-column label="医疗器械注册人" prop="ylqxzcrbarmc" width="150" show-overflow-tooltip></el-table-column>
      </el-table>
    </el-card>

  </div>
</template>

<script>
import draggable from "vuedraggable";
import {getAcceptOrder, acceptClear, acceptAddCode, updateStatus} from "@/api/purchase/purDelivery";

export default {
  name: "purDeliveryAuditDialog",
  props: {
    closeDialog: {
      type: Function,
      required: true,
    },
    formData: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      code: "",
      codeArray: [],
      total: 0,
      loading: false,
      index: null,
      formLoading: false,
      formVisible: false,
      deleteLoading: false,
      orderNo: null,
      statusMap: {
        1: "草稿",
        2: "未审核",
        3: "已审核",
      },
      typeMap: {
        1: "预入库",
        2: "普通采购",
      },
      orderEditor: true,
      sOptions: [],
      sValue: [],
      sList: [],
      sLoading: false,
      busTypes: [],
      currentRow: {},
      udiCode: null
    };
  },
  components: {
    draggable,
  },
  methods: {
    getOrderDetail() {
      this.detailLoading = true;
      let query = {
        billNo: this.formData.orderId,
      }
      getAcceptOrder(query)
        .then((response) => {
          this.detailLoading = false;
          this.detailList = response.data.orderDetailEntities || [];
          if (response.data.exitAccept) {
            this.$confirm("检测到上一次验收操作未完成, 是否继续上一次验收?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
              })
              .catch(() => {
                this.renewAccept();
              });
          }

        })
        .catch(() => {
          this.detailLoading = false;
          this.detailList = [];
        });
    },
    getInputFocus(event) {
      event.currentTarget.select();
    },
    enterKey(event) {
      this.checkSuccess = true;
      let tQuery = {
        originCode: this.originCode,
        code: this.udiCode.trim(),
      }

    },
    addCode() {
      if (this.$isBlank(this.udiCode)) {
        this.$message.error("UDI码不能为空！");
      }
      let postQuery = {
        billNo: this.orderQuery.billNo,
        orderDetailEntities: this.detailList,
        code: this.udiCode,
      }
      acceptAddCode(postQuery)
        .then((response) => {
          if (response.code == 20000) {
            this.detailLoading = false;
            this.detailList = response.data.orderDetailEntities || [];
            if (response.data.finishAccept) {
              this.$confirm("校验完成，是否立即完成验收?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
              })
                .then(() => {
                  this.finishAccept();
                })
                .catch(() => {
                });
            }else {
              this.$message.success("匹配成功！");
            }

          } else {
            this.$message.error(response.message);
          }


        })
        .catch(() => {
          this.detailLoading = false;
        });
    },
    finishAccept() {
      this.$confirm('是否确定完成验收此单据？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let query = {
          orderId: this.orderQuery.billNo,
          finishAccept: true
        };
        updateStatus(query)
          .then((response) => {
            if (response.code == 20000) {
              this.$message.success("验收成功！");
              this.closeDialog();
            } else {
              this.$message.error(response.message);
            }
          })
          .catch(() => {
          });
      }).catch(() => {
        // this.$message.info('回退失败');
      });
    },

    renewAccept() {
      let query = {
        billNo: this.orderQuery.billNo,
      }
      acceptClear(query)
        .then((response) => {
          this.detailLoading = false;
          this.detailList = response.data.orderDetailEntities || [];
        })
        .catch(() => {
          this.detailLoading = false;
          this.detailList = [];
        });
    },
  },
  filters: {},
  mounted() {
    document.body.ondrop = function (event) {
      event.preventDefault();
      event.stopPropagation();
    };
  },
  created() {
    this.getOrderDetail();
  },
};
</script>
<style>

.ao-text {
  width: 100%;
  font-size: 13px;
  font-family: "Microsoft YaHei";
  float: right;
  text-align: right;
  margin-top: 10px;
}

</style>



