udiwms-vue/src/views/basic/UdiInfoSelectLocalUdi.vue

<template>
  <div>
    <el-card class="el-card">
      <div>
        <el-form :inline="true" :model="unionQuery" class="query-form" size="mini">
          <el-row>
            <el-form-item class="query-form-item">
              <el-input
                v-model="unionQuery.nameCode"
                size="mini"
                placeholder="最小单元销售标识"
                @keyup.enter.native="keyup_submit($event)"
              ></el-input>
            </el-form-item>
            <el-form-item class="query-form-item">
              <el-input
                v-model="unionQuery.cpmctymc"
                size="mini"
                placeholder="产品通用名"
              ></el-input>
            </el-form-item>
            <el-form-item class="query-form-item">
              <el-input
                v-model="unionQuery.ylqxzcrbarmc"
                size="mini"
                placeholder="医疗器械注册人"
              ></el-input>
            </el-form-item>
            <el-form-item class="query-form-item">
              <el-input
                v-model="unionQuery.ggxh"
                placeholder="规格型号"
                size="mini"
              ></el-input>
            </el-form-item>

            <el-form-item class="query-form-item">
              <el-button-group>
                <el-button type="primary" icon="search" @click="getList" size="mini"
                  >查询</el-button
                >
              </el-button-group>
            </el-form-item>
          </el-row>
        </el-form>

        <el-table
          :data="udidlList"
          style="width: 100%"
          @row-click="intentDetail"
          v-loading="loading"
          highlight-current-row="true"
          :row-class-name="tableRowClassName"
          @current-change="handleErpChange"
        >
          <!-- <el-table-column
            type="selection"
            width="55"
            :selectable="checkSelectable"
          ></el-table-column> -->
          <el-table-column label="序号" type="index"></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>
        <el-pagination
          :page-size="unionQuery.limit"
          @current-change="handleCurrentChange"
          layout="prev, pager, next"
          :total="total"
        ></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 { getUdiInfos } from "../../api/basic/udiInfo";
import { combineUdi } from "../../api/basic/udiRelevance";

export default {
  name: "closeDialog",
  props: {
    closeDialog: {
      type: Function,
      required: true,
    },
    relId: {
      type: Number,
      required: true,
    },
  },

  data() {
    return {
      unionQuery: {
        page: 1,
        limit: 20,
        nameCode: "",
        cpmctymc: "",
        ylqxzcrbarmc: "",
        ggxh: "",
      },

      combineQuery: {
        thirdId: "",
        relId: "",
        erpName: "",
        keys: [],
      },
      checked: true,
      udidlList: [],
      erpList: [],
      pageTotal: 1,
      total: 1,
      currentRow: null,
      loading: false,
      erpLloading: false,
      multipleUdiSelection: [],
    };
  },
  methods: {
    getList() {
      if (
        this.unionQuery.nameCode == "" &&
        this.unionQuery.cpmctymc == "" &&
        this.unionQuery.ylqxzcrbarmc == "" &&
        this.unionQuery.ggxh == ""
      ) {
        this.$message.warning("请输入查询条件");
        return;
      }
      this.loading = true;
      getUdiInfos(this.unionQuery)
        .then((response) => {
          this.loading = false;
          this.udidlList = response.data.list || [];
          this.total = response.data.total || 0;
        })
        .catch(() => {
          this.loading = false;
          this.udidlList = [];
          this.total = 0;
        });
    },

    keyup_submit(event) {
      console.log("全选----");
      this.getList();
      event.target.select();
    },

    checkSelectable(row, index) {
      return !row.check;
    },
    handleCurrentChange(val) {
      this.unionQuery.page = val;
      this.getList();
    },
    tableRowClassName({ row, rowIndex }) {
      if (row.checked) return "warning-row";
      return "";
    },
    handleErpChange(val) {
      console.log(val);
      this.currentRow = val;
    },
    intentBack() {
      this.closeDialog();
    },
    combine() {
      this.combineQuery.keys.push(this.currentRow.uuid);
      this.combineQuery.relId = this.relId;

      combineUdi(this.combineQuery)
        .then((response) => {
          if (response.code == 20000) {
            this.$emit("closeUdi", true);
          } else {
            this.$emit("closeUdi", false);
          }
        })
        .catch(() => {
          this.$emit("closeUdi", false);
        });
    },

    handleSelectionUdiChange(val) {
      console.log("----" + val);
      this.multipleUdiSelection = val;
    },
  },
};
</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>