udi-spms-vue/src/views/basic/product/UdiinfoSelectVersion.vue

<template>
  <div>
    <el-card class="el-card">
      <div>
        <el-table
          :data="udidlList"
          style="width: 100%"
          v-loading="loading"
          highlight-current-row="true"
          :row-class-name="tableRowClassName"
          @current-change="handleErpChange"
          @selection-change="handleSelectionUdiChange"
          border
        >
          <el-table-column label="序号" type="index"></el-table-column>

          <el-table-column
            label="版本号"
            prop="versionNumber"
            show-overflow-tooltip
          ></el-table-column>

          <el-table-column
            label="产品标识"
            prop="nameCode"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            label="产品名称"
            prop="cpmctymc"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            label="规格型号"
            prop="ggxh"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            label="医疗器械注册人"
            prop="ylqxzcrbarmc"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            label="注册证编号"
            prop="zczbhhzbapzbh"
            show-overflow-tooltip
          ></el-table-column>

          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button
                type="text"
                size="small"
                @click="diDetail(scope.row)"
              >详情
              </el-button
              >
              <el-button
                type="text"
                size="small"
                :disabled="scope.row.uuid === originUuid"
                @click="checkCombine(scope.row)"
              >选入
              </el-button
              >

            </template>
          </el-table-column>

        </el-table>
        <pagination
          v-show="total>0"
          :total="total"
          :limit.sync="unionQuery.limit"
          :page.sync="unionQuery.page"
          @pagination="handleCurrentChange"
        ></pagination>

      </div>
    </el-card>
    <el-dialog
      title="器械信息详情"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :visible.sync="selectDialog"
      width="65%"
      append-to-body
      v-if="selectDialog"
    >
      <selectDiDetail :editQuery="diDetails"
      ></selectDiDetail>
    </el-dialog>

  </div>
</template>

<script>
import {filterByVersion, filterCompany,} from "@/api/basic/product/udiInfo";
import {changeVersion, checkExitUdi} from "@/api/basic/product/udiRelevance";
import selectDiDetail from "./SelectDIDetailDialog"

export default {
  name: "UdiinfoSelectVersion",
  props: {
    relId: {
      type: Object,
      required: true,
    },
    uuid: {
      type: Object,
      required: true,
    },
    originUuid: {
      type: Object,
      required: true,
    },

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

  data() {
    return {
      unionQuery: {
        uuid: null
      },
      combineLoading: false,
      combineQuery: {
        idSpliUdi: false,
        thirdId: "",
        relId: "",
        erpName: "",
        thirdName: null,
        keys: [],
        devKeys: [],
      },

      checked: true,
      udidlList: [],
      erpList: [],
      pageTotal: 1,
      total: 1,
      currentRow: null,
      fromOptions: [],
      loading: false,
      erpLloading: false,
      multipleUdiSelection: [],
      selectDialog: false,
      diDetails: null,
    };
  },
  methods: {


    getList() {
      this.loading = true;
      filterByVersion(this.unionQuery)
        .then((response) => {
          this.loading = false;
          if (response.code == 20000) {
            this.udidlList = response.data.list || [];
            this.total = response.data.total || 0;
          } else {
            this.$message.error(response.message);
          }


        })
        .catch(() => {
          this.loading = false;
          this.udidlList = [];
          this.total = 0;
        });
    },


    checkSelectable(row) {
      return !row.check;
    },

    diDetail(row) {
      this.diDetails = row;
      this.selectDialog = true;
    },

    handleCurrentChange(val) {
      this.unionQuery.page = val.page;
      this.getList();
    },
    tableRowClassName({row, rowIndex}) {
      if (row.check) return "warning-row";
      return "";
    },
    handleErpChange(val) {
      console.log(val);
      this.currentRow = val;
    },
    intentBack() {
      this.closeDialog();
    },

    checkCombine(row) {
      this.combineQuery.keys = [];
      if (this.relId != null) {
        this.combineQuery.relId = this.relId;
        this.combineQuery.keys.push(row.uuid);
        this.combineQuery.devKeys.push(row.deviceRecordKey);
      } else
        return;
      this.combineLoading = true;
      checkExitUdi(this.combineQuery)
        .then((response) => {
          this.combineLoading = false;
          if (response.code == 20000) {
            this.combine();
          } else if (response.code == 499) {
            this.$confirm(response.message, {type: "warning"})
              .then(_ => {
                this.combine();
              })
              .catch(_ => {

                this.combineQuery.keys = [];
              });
          }
        })
        .catch(() => {
          this.combineLoading = false;
          this.$emit("closeDialog", false);
        });


    },

    combine() {
      changeVersion(this.combineQuery)
        .then((response) => {
          this.combineLoading = false;
          if (response.code == 20000) {
            this.$message.success("切换成功！");
            this.$emit("closeUdi", true);
          } else {
            this.$message.error(response.message);
            this.$emit("closeUdi", false);
          }
        })
        .catch(() => {
          this.combineLoading = false;
          this.intentBack();
        });
    },

    handleSelectionUdiChange(val) {
      this.multipleUdiSelection = val;
    },
  },
  components: {
    selectDiDetail,
  },
  created() {
    this.unionQuery.uuid = this.uuid;
    this.getList();
  },
};
</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;
}

.el-card {
  margin-right: 20px;
  /*transition: all .5s;*/
}

.query-form-item {
  display: block !important;
  margin-right: 10px;
  margin-bottom: 5px;
}

</style>