web_dist/src/views/crb-manage/CrbMzBlRecord.vue

<template>
  <div class="layout_container">
    <header>
      <el-input v-model.trim="patNo" class="w-50 m-2" style="width: 280px" placeholder="请输入门诊号/住院号" clearable>
        <template #prepend>门诊号/住院号</template>
      </el-input>
      <el-input v-model.trim="xm" class="w-50 m-2" style="width: 280px; margin-left: 3px" placeholder="请输入姓名" clearable>
        <template #prepend>姓名</template>
      </el-input>
      <el-input v-model.trim="idCard" class="w-50 m-2" style="width: 280px; margin-left: 3px" placeholder="请输入身份证号码" clearable>
        <template #prepend>身份证号码</template>
      </el-input>
      <el-select  v-model="tjType" placeholder="请选择类型" style="width: 120px; margin-left: 3px">
        <el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value">
        </el-option>
      </el-select>
      <el-date-picker v-model="dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" :clearable="false"
                      end-placeholder="结束日期" :shortcuts="shortcuts" style="width: 300px; margin-left: 3px">
      </el-date-picker>
      <el-divider direction="vertical" />
      <el-button type="primary" icon="Search" @click="queryEmrBaseInfo" style="margin-left: 5px">查询</el-button>
    </header>
    <div class="layout_main">
      <el-tabs class="el-tabs__fill" v-model="editableTabsValue" type="border-card" @tab-click="handleClick">
        <el-tab-pane key="mzBlRecord" label="门(急)诊病历记录上传" name="mzBlRecord">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table :data="mzBlRecordData.slice(pageSize * (currentPage - 1), pageSize * currentPage)" border
                        stripe highlight-current-row height="100%">
                <el-table-column type="index" label="序号" width="50" fixed/>
                <el-table-column prop="uploadFlag" label="上传状态" width="100" fixed>
                  <template #default="scope">
                    <el-button v-if="scope.row.uploadFlag === 0 " type="danger" size="small" class="cancel-btn">上传失败</el-button>
                    <el-button v-else-if="scope.row.uploadFlag === 1 " type="primary" size="small" class="cancel-btn">上传成功</el-button>
                    <el-button v-else type="warning" size="small" class="cancel-btn">未上传</el-button>
                  </template>
                </el-table-column>
                <el-table-column prop="uploadMsg" label="上传结果信息" width="180" show-overflow-tooltip fixed/>
                <el-table-column prop="id" label="ID" width="145" fixed/>
                <el-table-column prop="patientId" label="患者ID" width="80" fixed/>
                <el-table-column prop="serialNumber" label="就诊流水号" width="80" />
                <el-table-column prop="patientName" label="患者姓名" width="100"/>
                <el-table-column prop="idCardTypeCode" label="身份证件类别代码" width="120" />
                <el-table-column prop="idCardTypeName" label="身份证件类别名称" width="140" />
                <el-table-column prop="idCard" label="身份证件号码" width="140" >
                  <template #default="scope">
                    {{!scope.row.idCard ? '' : scope.row.idCard.replace(reg, '\$1******\$2')}}
                  </template>
                </el-table-column>
                <el-table-column prop="allergyHisFlag" label="过敏史标志" width="180" show-overflow-tooltip/>
                <el-table-column prop="allergyHis" label="过敏史" width="180" show-overflow-tooltip/>
                <el-table-column prop="outpatientDate" label="就诊日期时间" width="130"/>
                <el-table-column prop="initalDiagnosisCode" label="初诊标志代码" width="140"/>
                <el-table-column prop="chiefComplaint" label="主诉" width="180" show-overflow-tooltip/>
                <el-table-column prop="presentIllnessHis" label="现病史" width="160" show-overflow-tooltip/>
                <el-table-column prop="pastIllnessHis" label="既往史" width="160" show-overflow-tooltip/>
                <el-table-column prop="infectionHis" label="传染病史" width="160" show-overflow-tooltip/>
                <el-table-column prop="vaccinationHis" label="预防接种史" width="160" show-overflow-tooltip/>
                <el-table-column prop="operationHis" label="手术史" width="160" show-overflow-tooltip/>
                <el-table-column prop="bloodTransfusion" label="输血史" width="160" show-overflow-tooltip/>
                <el-table-column prop="personalHis" label="个人史" width="160" show-overflow-tooltip/>
                <el-table-column prop="maritalHis" label="婚育史" width="160" show-overflow-tooltip/>
                <el-table-column prop="menstrualHis" label="月经史" width="160" show-overflow-tooltip/>
                <el-table-column prop="familyHis" label="家族史" width="160" show-overflow-tooltip/>
                <el-table-column prop="physicalExamination" label="体格检查" width="160" show-overflow-tooltip/>
                <el-table-column prop="observationResult" label='中医“四诊”观察结果' width="160" show-overflow-tooltip/>
                <el-table-column prop="studiesSummaryResult" label="辅助检查" width="160" show-overflow-tooltip/>
                <el-table-column prop="wmDiagnosisCode" label="西医疾病诊断编码" width="140" show-overflow-tooltip/>
                <el-table-column prop="wmDiagnosisName" label="西医疾病诊断名称" width="120" show-overflow-tooltip/>
                <el-table-column prop="tcmInitalDiagnosisCode" label="中医病名代码" width="140"/>
                <el-table-column prop="tcmInitalDiagnosisName" label="中医病名名称" width="120" show-overflow-tooltip/>
                <el-table-column prop="tcmInitalSyndromeCode" label="中医证候编码" width="140"/>
                <el-table-column prop="tcmInitalSyndromeName" label="中医证候名称" width="120" show-overflow-tooltip/>
                <el-table-column prop="differentiationBasis" label="辨证依据" width="120" show-overflow-tooltip/>
                <el-table-column prop="treatment" label="治则治法" width="120" show-overflow-tooltip/>
                <el-table-column prop="course" label="急诊留观病程记录" v-if="tjType === '2'" width="140" show-overflow-tooltip/>
                <el-table-column prop="observationDate" label="收入观察室日期时间" v-if="tjType === '2'" width="130"/>
                <el-table-column prop="notes" label="注意事项" width="140" v-if="tjType === '2'" show-overflow-tooltip/>
                <el-table-column prop="deptCode" label="科室代码" width="180" show-overflow-tooltip/>
                <el-table-column prop="deptName" label="科室名称" width="180"/>
                <el-table-column prop="orgCode" label="医疗机构代码" width="120"/>
                <el-table-column prop="orgName" label="医疗机构名称" width="120"/>
                <el-table-column prop="operatorId" label="操作人ID" width="80"/>
                <el-table-column prop="operationTime" label="操作时间" width="140"/>
                <el-table-column fixed="right" label="操作" min-width="80" width="80" center>
                  <template #default="scope">
                    <el-button type="primary" size="small" @click="uploadMzBlRecord(scope.row)">上传</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="[10, 15, 20, 25]"
                             :total="mzBlRecordData.length" layout="total, sizes, prev, pager, next, jumper"
                             style="margin-top: 5px" @size-change="handleSizeChange"
                             @current-change="handleCurrentChange">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script setup name="CrbMzBlRecord">
import {nextTick, onMounted, ref} from "vue";
import {
  selectOutpatientObs, selectOutpatientRecord,
  uploadEmrOutpatientObs, uploadEmrOutpatientRecord
} from "@/api/crb-manage/crb-mz-bl-record.js";
import {ElMessage, ElMessageBox} from "element-plus";
import {shortcuts} from "@/data/shortcuts.js";
import {formatDatetime, getDateRangeFormatDate} from "@/utils/date.js";

const patNo = ref('')
const xm = ref('')
const idCard = ref('')
const tjType = ref('1')
const typeList = [{ value: "1", label: "普通记录" }, { value: "2", label: "留观记录" }]
const editableTabsValue = ref("mzBlRecord")
const mzBlRecordData = ref([])
const dateRange = ref([])
const start = formatDatetime(shortcuts[0].value[0])
const end = formatDatetime(shortcuts[0].value[0])

const pageSize = ref(20)
const currentPage = ref(1)
const handleSizeChange = (val) => {
  pageSize.value = val
}
const handleCurrentChange = (val) => {
  currentPage.value = val
}

const paramInfo = ref({
  startTime: '',
  endTime: '',
  patNo: '', // 门诊号
  patName: '', // 姓名
  idCard: '', // 身份证号码
  tjType: '', // 1：普通记录； 2：留观记录
})

const reg = /^(.{6})\d+(.{4})$/

onMounted(() => {
  nextTick(() => {
    paramInfo.value.startTime = start;
    paramInfo.value.endTime = end + " 23:59:59";
    dateRange.value = [start, end];
    queryMzBlRecord()
  })
})

const handleClick = (tab, event) => {
  // 查询哪个tab页面
  editableTabsValue.value = tab.props.name;
  if (editableTabsValue.value === "mzBlRecord") {
    queryMzBlRecord()
  }
}

const queryEmrBaseInfo = () => {
  if (editableTabsValue.value === "mzBlRecord") {
    queryMzBlRecord()
  }
}

// 查询门(急)诊病历记录
const queryMzBlRecord = () => {
  if (dateRange.value) {
    let dateS = getDateRangeFormatDate(dateRange.value)
    paramInfo.value.startTime = dateS.startTime
    paramInfo.value.endTime = dateS.endTime
  }
  paramInfo.value.patNo = patNo.value
  paramInfo.value.patName = xm.value
  paramInfo.value.idCard = idCard.value
  paramInfo.value.tjType = tjType.value

  if("1" === tjType.value){
    selectOutpatientRecord(paramInfo.value).then((res) => {
      mzBlRecordData.value = res
    })
  } else {
    selectOutpatientObs(paramInfo.value).then((res) => {
      mzBlRecordData.value = res
    })
  }

}
const uploadMzBlRecord = (row) => {
  // 上传门(急)诊病历
  if("1" === tjType.value){
    ElMessageBox.confirm('确定上传门(急)诊病历？', {
      cancelButtonText: '取消',
      confirmButtonText: '确定',
      type: 'warning',
      distinguishCancelAndClose: true,
      dangerouslyUseHTMLString: true
    }).then(() => {
      uploadEmrOutpatientRecord(row).then((res) => {
        if(res.result){
          ElMessage({
            type: "success",
            message: res.desc,
            duration: 2500,
            showClose: true,
          });
        } else {
          ElMessage({
            type: "error",
            message: res.desc,
            duration: 2500,
            showClose: true,
          });
        }
        queryMzBlRecord()
      })
    }).catch((action) => {
      if (action === 'cancel') {
        console.log("已取消。。。")
      }
    })
  } else {
    // 上传门(急)诊留观记录
    ElMessageBox.confirm('确定上传门(急)诊留观记录？', {
      cancelButtonText: '取消',
      confirmButtonText: '确定',
      type: 'warning',
      distinguishCancelAndClose: true,
      dangerouslyUseHTMLString: true
    }).then(() => {
      uploadEmrOutpatientObs(row).then((res) => {
        if(res.result){
          ElMessage({
            type: "success",
            message: res.desc,
            duration: 2500,
            showClose: true,
          });
        } else {
          ElMessage({
            type: "error",
            message: res.desc,
            duration: 2500,
            showClose: true,
          });
        }
        queryMzBlRecord()
      })
    }).catch((action) => {
      if (action === 'cancel') {
        console.log("已取消。。。")
      }
    })
  }
}
</script>
<style scoped>
.cancel-btn:hover {
  cursor: default !important;
}
</style>