lkk
2024-12-05 81f0a7c8b364fe7b8d566b27bfc9c8ef11d2be7f
src/views/sampling/sampling/index.vue
@@ -8,10 +8,10 @@
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item label="体检号" prop="tjNum">
      <el-form-item label="体检号" prop="tjNumber">
        <el-input
          ref="inputName"
          v-model="queryParams.tjNum"
          v-model="queryParams.tjNumber"
          placeholder="请输入体检号"
          clearable
          @keyup.enter.native="handleQuery"
@@ -86,8 +86,8 @@
          @input="radioChange"
          style="margin: 10px 15px"
        >
          <el-radio-button label="1">未采样</el-radio-button>
          <el-radio-button label="0">已采样</el-radio-button>
          <el-radio-button label="1" :disabled="qiehuan && disabledId === 0">未采样</el-radio-button>
          <el-radio-button label="0" :disabled="qiehuan && disabledId === 1">已采样</el-radio-button>
        </el-radio-group>
      </el-col>
      <el-col
@@ -96,23 +96,18 @@
        v-if="samplingList.length > 0 && tjStatus == 1"
      >
        <el-button type="primary" @click="Merging">合并项目</el-button>
        <el-button
        <!-- <el-button
          type="primary"
          icon="el-icon-thumb"
          style="margin: 0 15px"
          v-hasPermi="['hosp:detail:add']"
          @click="Confirmreceipt"
          >确认采样</el-button
        >
        > -->
        <el-button type="primary" :disabled="!disabled" @click="Cancellation"
          >撤销合并</el-button
        >
        <el-button
          type="primary"
          :disabled="!selectList.length"
          @click="Collection"
          >采样打码</el-button
        >
        <el-button type="primary" @click="Confirmreceipt">采样打码</el-button>
      </el-col>
      <el-col
        :span="12"
@@ -190,15 +185,20 @@
        </el-table>
      </div>
      <div style="width: 50%">
        <!-- :default-sort="{ prop: 'specimenType', order: 'ascending' }"  :default-sort="{ prop: 'specimenType', order: 'ascending' }"
          @sort-change="handleSortChange"
          :span-method="objectSpanMethod"
          @selection-change="handleChange" ref="tab1"
          :row-class-name="tableRowClassName"-->
        <el-table
          v-loading="loading"
          :data="tableList"
          :span-method="objectSpanMethod"
          @selection-change="handleChange"
          border
          height="520px"
          :span-method="objectSpanMethod"
          ref="tab1"
          :row-class-name="tableRowClassName"
          border
          height="520px"
        >
          <el-table-column type="selection" width="40" align="center" />
          <!--  :selectable="selectEnable" -->
@@ -274,7 +274,14 @@
        <!-- 动态生成多个条形码的容器 -->
        <div v-for="(item, index) in selectList" :key="index">
          <svg :id="'barcode' + index"></svg>
          <div class="name">{{ item.proName }}</div>
          <div class="name">{{ getTruncatedName(item.proName).truncated }}</div>
          <div class="name1">
            {{ getTruncatedName(item.proName).remaining }}
          </div>
          <!-- <div class="name">{{ item.proName.slice(0, msg) }}</div>
          <div class="name1">
            {{ item.proName.slice(msg) }}
          </div> -->
          <div class="last">
            <p>{{ item.cusName }}</p>
            <div>
@@ -284,7 +291,9 @@
          </div>
          <div class="tj">
            <span>体检中心</span>
            <span>{{ item.cardId.substring(0, 14) }}</span>
            <!-- <span>{{ item.cardId.slice(0, 14) }}</span> -->
            <!-- <span>{{ item.cardId }}</span> -->
            <span>{{ item.cardId ? item.cardId.substring(0, 14) : "" }}</span>
          </div>
          <div class="tj">
            <span>{{ item.jyxh }}</span>
@@ -347,10 +356,11 @@
  getCusCyList,
  mergeCaiYang,
  chexiaoCaiYang,
  getTxmmccd,
  getTxmkd,
} from "@/api/sampling/sampling";
import { getNewDateList } from "@/api/hosp/order";
import moment from "moment";
import ItemVue from "../../../layout/components/Sidebar/Item.vue";
export default {
  dicts: [
@@ -363,6 +373,8 @@
  name: "Sampling",
  data() {
    return {
      msg: "",
      getNumbr: null,
      list: [],
      selectList: [],
      selectedRows: [],
@@ -398,7 +410,7 @@
        pageNum: 1,
        pageSize: 20,
        name: null,
        tjNum: null,
        tjNumber: null,
        applicationTime: null,
        isSignFor: null,
        tjTime: null,
@@ -446,7 +458,9 @@
  },
  created() {
    // this.getNowTime();
    getTxmmccd().then((res) => {
      this.msg = Number(res.msg);
    });
    this.getdate();
  },
  mounted() {
@@ -461,8 +475,55 @@
        this.selectList[this.selectList.length - 1].isMerge === 1
      );
    },
    qiehuan() {
      return (
        this.selectList.length > 0
      );
    },
    disabledId() {
      return (
        this.tjStatus == "1" ? 1 :  0
      );
    },
  },
  methods: {
    getTruncatedName(proName) {
      // 去掉所有空格
      const trimmedProName = proName.replace(/\s+/g, "");
      const number = this.msg;
      const truncated =
        trimmedProName.length > number
          ? trimmedProName.slice(0, number)
          : trimmedProName;
      let remaining =
        trimmedProName.length > number ? trimmedProName.slice(number) : "";
      if (remaining.length > number) {
        remaining = remaining.slice(0, number) + "...";
      }
      return { truncated, remaining }; // 返回结果
    },
    /* getTruncatedName(proName) {
      const trimmedProName = proName.replace(/\s+/g, ""); // 去掉所有空格
      const truncated =
        trimmedProName.length > 35
          ? trimmedProName.slice(0, 35)
          : trimmedProName;
      const remaining =
        trimmedProName.length > 35 ? trimmedProName.slice(35) : "";
      return { truncated, remaining };
    }, */
    // 示例的日期格式化方法
    formatDate(date) {
      const options = { year: "numeric", month: "2-digit", day: "2-digit" };
      return new Date(date).toLocaleDateString(undefined, options);
    },
    getdate() {
      getNewDateList().then((res) => {
        this.createTimeList = [
@@ -533,11 +594,11 @@
            return;
          } else {
            this.samplingList = response.data.list;
            console.log(this.samplingList, 888);
            // console.log(this.samplingList, 888);
            // 判断是否需要刷新右边表格
            this.$nextTick(() => {
              this.$refs.tb.toggleRowSelection(this.samplingList[0], true);
              this.fetchData(this.samplingList[0].cusId);
              // this.fetchData(this.samplingList[0].tjNumber);
            });
          }
          this.total = response.data.total;
@@ -587,7 +648,7 @@
      this.form = {
        id: null,
        samplingNumber: null,
        cusId: null,
        tjNumber: null,
        applicationTime: null,
        isSignFor: null,
        tjTime: null,
@@ -600,11 +661,9 @@
        updateTime: null,
        deleted: null,
      };
      this.resetForm("form");
    },
    hb() {
      // console.log(this.queryParams.tjNum);
      if (this.queryParams.tjNum != null) {
      if (this.queryParams.tjNumber != null) {
        this.handleQuery();
      }
    },
@@ -616,7 +675,6 @@
    /** 重置按钮操作 */
    resetQuery() {
      this.createTimeList = [];
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 单选框选中数据
@@ -650,9 +708,10 @@
      // 只有一个人被选中时进行操作
      if (selection.length === 1) {
        const selectedPerson = selection[0]; // 获取选中的那个人
        const cusId = selectedPerson.cusId; // 假设cusId在选中的对象中
        const tjNumber = selectedPerson.tjNumber;
        console.log(selectedPerson.tjNumber, 6363);
        this.fetchData(cusId);
        this.fetchData(tjNumber);
      } else {
        // 如果选中多人,则取消选中
        if (selection.length > 1) {
@@ -668,16 +727,15 @@
      this.selectedRows = selection;
    },
    fetchData(cusId) {
    fetchData(tjNumber) {
      this.loading = true; // 显示加载状态
      console.log(this.tjStatus, 999);
      getCusCyList(cusId, this.tjStatus) // 调用API获取数据
      getCusCyList(tjNumber, this.tjStatus) // 调用API获取数据
        .then((response) => {
          if (response.data) {
            console.log(response, 2525);
            this.tableList = response.data; // 确认 list 存在后再进行赋值
            console.log(this.tableList, 123);
          } else {
            // 如果没有数据或 list 为空,清空表格并提示
            this.tableList = [];
@@ -691,35 +749,6 @@
        });
    },
    /* 点击合并按钮 */
    /* Merging() {
      // 检查是否选中了数据
      if (this.selectedRows.length === 0) {
        this.$message.error("至少选中一个人");
        return;
      }
      if (this.selectList.length === 0) {
        this.$message.error("请选择要合并项目");
        return;
      }
      // 获取 tableList 第一行的 specimenTypeCode 作为基准
      const baseSpecimenTypeCode = this.selectList[0].specimenTypeCode;
      // 检查 specimenTypeCode 是否一致
      const canMergeBySpecimenTypeCode = this.selectList.every(
        (row) => row.specimenTypeCode === baseSpecimenTypeCode
      );
      // 根据 canMergeBySpecimenTypeCode 判断是否合并
      if (canMergeBySpecimenTypeCode) {
        this.$message.success("合并成功。");
        console.log("合并的行:", this.selectedRows);
      } else {
        this.$message.error("项目的 不一致,无法合并!");
      }
    }, */
    /* 点击合并按钮 */
    Merging() {
      // 检查是否选中了数据
@@ -745,7 +774,7 @@
          mergeCaiYang(data).then((response) => {
            this.$message.success("合并成功。");
            console.log("合并的行:", this.selectedRows);
            // console.log("合并的行:", this.selectedRows);
            // this.getList();
            this.fetchData(this.selectedRows[0].cusId);
          });
@@ -767,7 +796,7 @@
        return;
      }
      console.log("撤销的已合并项目ID:", data);
      // console.log("撤销的已合并项目ID:", data);
      // 调用撤销采样的接口
      chexiaoCaiYang(data)
@@ -784,20 +813,22 @@
        .catch((error) => {
          this.$message.error("请求失败,请重试!");
        });
      // chexiaoCaiYang(data).then((res) => {});
    },
    /** 点击补打条码按钮 **/
    Collection() {
    async Collection() {
      // console.log("selectList:", this.selectList);
      const jyxh = this.selectList.map((item) => item.jyxh);
      // const selectedData = this.selectList.map((item) => ({
      //   jyxh: item.jyxh,
      // }));
      console.log(this.selectList, 999);
      // console.log(selectedData, 888);
      console.log("jyxh:", jyxh);
      try {
        // 请求接口并获取宽度值
        const widthResponse = await getTxmkd();
        const barcodeWidth = `${Number(widthResponse.msg)}%` || "70%"; // 获取宽度值,默认使用 70%
      this.$nextTick(() => {
        // const jyxh = this.selectList.map((item) => item.jyxh);
        // await this.$nextTick(); // 确保 DOM 更新
        jyxh.forEach((number, index) => {
          const barcodeContent = number; // 确保 jyxh 是有效的
          if (barcodeContent && barcodeContent !== "未提供体检号") {
@@ -811,16 +842,15 @@
            console.log(`条形码内容无效: ${barcodeContent}`); // 调试输出
          }
        });
      });
      this.$nextTick(() => {
        const barcodeElement = document.querySelector("#barcode");
        // const barcodeElements = selectedData.map((_, index) =>
        //   document.querySelector(`#barcode${index}`)
        // );
        // await this.$nextTick();
        if (barcodeElement) {
          barcodeElement.forEach((element) => {
        const barcodeElements = jyxh.map((_, index) =>
          document.querySelector(`#barcode${index}`)
        );
        if (barcodeElements) {
          barcodeElements.forEach((element) => {
            if (element) {
              console.log(element.innerHTML); // 打印条形码的内容,看看是否生成成功
            }
@@ -828,83 +858,98 @@
        } else {
          console.log("条形码元素未找到");
        }
        const newWindow = window.open("", "_blank", "width=800,height=600");
        const printContents = document.getElementById("printSection").innerHTML;
        console.log(printContents);
        // console.log(printContents);
        newWindow.document.write(`
       <html>
      <html>
        <head>
          <title>Print Barcode</title>
          <style>
            @media print {
             * {
                 margin: 0;
                 padding: 0; /* 重置所有元素的 margin 和 padding */
                 box-sizing: border-box; /* 使内边距和边框包含在元素的总宽度和高度内 */
               }
               body {
                  margin: 0;
                  padding: 0;
                }
                .barcode-container {
                  width: 100%; /* 根据需要调整 */
                  text-align: center; /* 确保条形码居中 */
                }
                .name {
                  padding: 0;
                  margin: -5px auto 0;
                  padding-left: 20px;
                  font-size: 18px;
                  width: 90%;
                  display: -webkit-box;
                  -webkit-box-orient: vertical;
                  -webkit-line-clamp: 2;
                  overflow: hidden;
                  white-space: normal;
                }
              * {
                margin: 0;
                padding: 0; /* 重置所有元素的 margin 和 padding */
                box-sizing: border-box; /* 使内边距和边框包含在元素的总宽度和高度内 */
              }
              .name, .name1, .last, .tj, .last div span, .last p, .tj span {
                font-family: Arial, sans-serif !important; /* 重新指定字体 */
                font-weight: bold !important; /* 强制加粗 */
              }
              body {
                margin: 0;
                padding: 0;
              }
              .barcode-container {
                // width: 100%; /* 根据需要调整 */
                // text-align: center; /* 确保条形码居中 */
              }
              .name, .name1 {
                padding: 0;
                font-size: 18px;
                width: 70%;
                font-family: "Arial Black", sans-serif; /* 设置黑体 */
              }
              p {
                margin: 0;
                padding: 0;
              }
              svg {
                display: block;
                width: ${barcodeWidth}; /* 使用从接口获取的宽度 */
                margin-left: 10mm;
                height: auto;
                margin-bottom: 0;
              }
              .last {
                width: 66%;
                display: flex;
                font-size: 19px;
                justify-content: space-between;
                // font-weight: bold;
                // font-family: "Arial Black", sans-serif !important;
              }
              .last div span {
              // font-weight: bold;
                margin-left: 10px;
                // font-family: "Arial Black", sans-serif !important;
              }
              .last p {
              // font-weight: bold;
                margin-left: 10px;
                // font-family: "Arial Black", sans-serif !important;
              }
                p {
                  margin: 0;
                  padding: 0;
                }
                svg {
                  display: block;
                  width: 70%;
                  margin: 0 auto;
                  height: auto;
                  margin-bottom: 0;
                }
                .last {
                  width: 66%;
                  display: flex;
                  font-size: 19px;
                  margin-left: 20px;
                  justify-content: space-between;
                }
                  .last div span{
                  margin-left: 10px
                  }
                .tj{
                  width: 70%;
                  display: flex;
                  font-size: 19px;
                  margin-left: 10px;
                  justify-content: space-between;
                }
                .tj span{
                  margin-left:10px;
                }
                margin-left: 10px;
                // font-weight: bold;
                // font-family: "Arial Black", sans-serif !important;
              }
              .tj {
                width: 70%;
                display: flex;
                font-size: 19px;
                justify-content: space-between;
                // font-weight: bold;
                 font-family: "Arial Black", sans-serif !important;
              }
              .tj span {
                margin-left: 10px;
              }
            }
          </style>
        </head>
        <body>${printContents}</body>
      </html>
      `);
    `);
        newWindow.document.close();
        newWindow.focus();
        newWindow.print();
        newWindow.close();
      });
      } catch (error) {
        console.error("获取宽度时出错:", error); // 捕获错误
      }
    },
    tableRowClassName({ row, rowIndex }) {
@@ -916,9 +961,10 @@
    },
    handleChange(selection) {
      console.log(selection);
      // console.log(selection);
      this.selectList = selection;
      console.log(this.selectList, 5555);
      this.ids = selection.map((item) => item.id);
    },
@@ -938,46 +984,71 @@
    // 确认采样
    Confirmreceipt() {
      let data = this.ids;
      if (data.length === 0) {
        // 如果没有已合并的项目,给出提示信息
        this.$message.error("没有已合并的项目可以撤销!");
        return;
      }
      confirmSampling(data).then((res) => {
        this.$modal.msgSuccess("采样成功");
        this.getList();
      console.log(this.ids, 999);
      const loadingInstance = this.$loading({
        lock: true, // 锁定屏幕
        text: "加载中...", // 加载文本
        spinner: "el-icon-loading", // 自定义加载图标
        background: "rgba(255, 255, 255, 0.7)", // 背景颜色
      });
      confirmSampling(this.ids)
        .then((res) => {
          if (res.code === 200) {
            // this.$modal.msgSuccess("采样成功");
            this.Collection();
            this.getList();
          } else {
            this.$message.error(res.msg);
          }
          // this.getList();
        })
        .catch((error) => {
          this.$message.error("采样失败");
        })
        .finally(() => {
          loadingInstance.close();
        });
    },
    // 单选按钮
    radioChange(value) {
      this.loading = true;
      this.queryParams.isSignFor = value;
      getList(this.queryParams).then((response) => {
        if (response.data) {
          if (response.data.list == null) {
      if (this.selectList.length > 0) {
        alert("已选中后禁止切换");
      } else {
        console.log("切换");
        this.loading = true;
        this.queryParams.isSignFor = value;
        getList(this.queryParams).then((response) => {
          if (response.data) {
            if (response.data.list == null) {
              this.samplingList = [];
              this.tableList = [];
              this.loading = false;
            } else {
              this.samplingList = response.data.list;
              this.loading = false;
              if (this.samplingList.length != 0) {
                this.$nextTick(() => {
                  this.$refs.tb.toggleRowSelection(this.samplingList[0], true);
                });
              } else {
                this.$refs.tb.clearSelection();
              }
            }
            this.total = response.data.total;
            this.loading = false;
          } else {
            this.samplingList = [];
            this.tableList = [];
            this.loading = false;
          } else {
            this.samplingList = response.data.list;
            this.loading = false;
            if (this.samplingList.length != 0) {
              this.$nextTick(() => {
                this.$refs.tb.toggleRowSelection(this.samplingList[0], true);
              });
            } else {
              this.$refs.tb.clearSelection();
            }
          }
          this.total = response.data.total;
          this.loading = false;
        } else {
          this.samplingList = [];
          this.tableList = [];
          this.loading = false;
        }
      });
        });
      }
    },
    // 默认接受四个值 { 当前行的值, 当前列的值, 行的下标, 列的下标 }
@@ -1014,15 +1085,6 @@
.el-table .warning-row {
  background-color: #e5f3ff !important;
  /* font-weight: bold; */
}
/* .last {
  display: flex;
  justify-content: space-around;
  justify-content: space-evenly;
  background-color:aqua
} */
/* .last p:nth-child(2) {
  margin: 20px;
  font-size: 16px;
} */
</style>