hospital/admin-ui/src/views/work/patient/check/checkProjectDetailReport.vue

<script>
import CheckReportItem from "./checkReportItem.vue";

export default {
  name: "checkDetailReport",
  components: { CheckReportItem },
  props: {
    obr: {
      type: Object,
      required: true,
      default: function () {
        return {
          medTechProCode: "医疗技术单号",
        };
      },
    },
  },
  methods: {
    // generateReportItem() {
    //   // 获取prop报告表单的数据obr的所有键值，同时把形如id, cardId, reportEntryId等键值过滤掉
    //   return Object.keys(this.$props.obr).filter(
    //     (key) => !key.match(/[a-z]Id|id/),
    //   );
    // },
    /**
     * 填充报告单项
     */
    fillReportItem(reportItemLabelList) {
      const filledList = [...reportItemLabelList];

      const remainder =  filledList.length % 3
      const num = 3 - remainder;

      for (let i = num; i >0; i--) {
        filledList.push({key: `filled${i}`, label: "null"})
      }
      return filledList;
    }
  },
  data() {
    return {
      // itemLabels: {
      //   label: "content",
      // },
      reportItemLabelList: [
        { key: "reportNo", label: "报告单号" },
        // { key: "medTechProCode", label: "医技号" },
        { key: "medTechProName", label: "医技项目名称" },
        { key: "reportClass", label: "报告单类别名称" },
        { key: "reportCompleteTime", label: "报告完成时间" },
        { key: "signs", label: "危机标志" },
        { key: "sampleReceivedDate", label: "样本收到日期" },
        { key: "checkpoint", label: "检查部位或样本" },
        { key: "executeDepartmentName", label: "执行科室名称" },
        // { key: "applyDoctorName", label: "申请医生" },
        // { key: "testingDoctorName", label: "检验医生信息名称" },
        { key: "reviewDoctorName", label: "审核医生" },
        { key: "reportDate", label: "报告单日期" },
      ],
      /*
      {
    "id": 27,
    "orcId": 27,
    "medTechProCode": null,
    "medTechProName": "丙型肝炎抗体测定(Anti-HCV),人免疫缺陷病毒抗体测定(Anti-HIV),梅毒螺旋体特异抗体测定",
    "reportClass": "3",
    "reportCompleteTime": "2024-07-23 11:43:50",
    "signs": "0",
    "sampleReceivedDate": "2024-07-22 09:50:34",
    "checkpoint": "血清",
    "executeDepartmentCode": "313",
    "executeDepartmentName": "检验科",
    "isFlag": "0",
    "reviewDoctorCode": "1356",
    "reviewDoctorName": "梁静",
    "reportDate": "2024-07-23 11:43:50",
    "reportNo": "3455018"
}
       */
    };
  },
  created() {
    // this.$data.itemLabels = this.generateReportItem();
  },
};
</script>

<template>
  <div id="check-report">
    <check-report-item
      item-width="30%"
      v-for="item in fillReportItem(reportItemLabelList)"
      :key="item.key"
      :report-label="item.label"
      :report-content="obr[item.key] || ''"
      :item-hide = "item.label === 'null'"
    />
  </div>
</template>

<style scoped>
#check-report {
  padding: 1% 5%;
  width: 100%;
  display: flex;
  justify-content: space-evenly;

  flex-wrap: wrap;
  overflow: scroll;
}
</style>