web_dist/src/views/medical-advice/patient-info/AddBabyInfo.vue

<template>
    <el-container>
      <el-header>
        <el-row :gutter="10">
          <el-col :span="6">
            <el-select   filterable v-model="queryParam.wardCode" clearable style="width: 130px;" size="small" @change="selectPatList">
              <el-option v-for="item in ward" :key="item.code" :label="item.name" :value="item.code">
                <span style="color: #8492a6; font-size: 12px">{{ item.code }}</span>
                <el-divider direction="vertical"></el-divider>
                <span>{{ item.name }}</span>
              </el-option>
            </el-select>
          </el-col>
          <el-col :span="8">
            住院号:
            <el-popover :visible="visible" width="690" placement="right-end" trigger="click">
              <template #reference>
               <el-input v-model="queryParam.inpatientNo"    @click="visible = true" style="width: 100px" clearable />
              </template>
              <div style="width: 670px;">
                <div style="text-align: right">
                  <el-button icon="CloseBold" @click="visible = false"></el-button>
                </div>
                <el-table :data="patList" style="width: 100%" @row-click="fetchPatInfo"  height="400">
                  <el-table-column  property="inpatientNo" label="住院号" />
                  <el-table-column  property="name" label="姓名" />
                  <el-table-column  property="sexName" label="性别" />
                  <el-table-column  property="bedNo" label="床号" />
                </el-table>
              </div>
              <div style="text-align: center">
                <el-button size="small" type="danger" @click="visible = false">关闭</el-button>
              </div>
            </el-popover>
          </el-col>
          <el-col :span="3">
            <el-button type="success" icon="Money" @click="addBaby">增加</el-button>
          </el-col>
          <el-col>
            <div  style="color: red;"> 增加BB时,请补充相应的BB信息(如性别,出生日期,出生体重,出生身高)</div>
          </el-col>
        </el-row>
      </el-header>
      <el-main>
         <div>
           <PatientInfo :patientInfo="patientInfo"></PatientInfo>
         </div>
         <div>
           <div style="margin-top: 10px">
             <el-tag>婴儿补充信息</el-tag>
           </div>
           <div >
             <el-table :data="babyList" style="width: 100%"   :height="windowHeight-170">
               <el-table-column  property="inpatientNo" label="住院号" />
               <el-table-column  property="name" label="姓名" />
               <el-table-column  property="sexName" label="性别" />
               <!-- <el-table-column  property="birthDate" label="出生日期" /> -->
               <el-table-column  property="birthDateTime" label="出生时间" />
               <el-table-column  property="babyBirthWeight" label="出生体重(克)" />
               <el-table-column  property="babyBirthHeight" label="出生身高(厘米)" />
               <el-table-column  property="birthOrder" label="出生顺序" />
               <el-table-column label="操作">
                 <template #default="scope">
                   <el-button  icon="Edit" type="primary" @click="openEdit(scope.row)">编辑</el-button>
                   <el-button  icon="Delete" type="danger" @click="delBaBy(scope.$index,scope.row)">删除</el-button>
                 </template>
               </el-table-column>
             </el-table>
           </div>
         </div>
      </el-main>
    </el-container>
  <el-dialog v-model="editBabyDialog" :title="dialogTitle" width="400">
    <el-form :model="editBaByInfo">
      <el-form-item label="性别" >
        <el-select v-model="editBaByInfo.sex">
          <el-option label="男" value="1" />
          <el-option label="女" value="2" />
        </el-select>
      </el-form-item>
      <el-form-item label="出生日期" >
        <el-date-picker v-model="editBaByInfo.birthDate" type="datetime" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"  />
      </el-form-item>
      <el-form-item label="出生体重(克)" >
        <el-input v-model="editBaByInfo.babyBirthWeight" type="number" placeholder="请输入出生体重" />
      </el-form-item>
      <el-form-item label="出生身高(厘米)" >
        <el-input v-model="editBaByInfo.babyBirthHeight" type="number" placeholder="请输入出生身高" />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button type="danger" @click="editBabyDialog = false">取消</el-button>
        <el-button type="success"  @click="onSubmit"> 保存</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup lang="ts" name = "addBabyInfo">
import {onMounted, ref, defineAsyncComponent} from "vue";
import {getAllWards} from "@/api/zhu-yuan-yi-sheng/resident-doctor";
import {getPatientBaseInfo,queryPatientInfo} from "@/api/medical-advice/medical-advice-management";
import {queryBabyInfo,deleteBaby,saveBabyInfo,editBabyInfo} from "@/api/medical-advice/patient-info";
import {ElMessageBox} from "element-plus";

// 异步导入PatientInfo组件
const PatientInfo = defineAsyncComponent(() => import("@/components/medical-advice/PatientInfo.vue"));

const windowHeight = window.innerHeight

interface PatientInfoType {
  name?: string;
  [key: string]: any;
}

interface QueryParamType {
  wardCode?: string;
  inpatientNo?: string;
  admissTimes?: number | null;
  [key: string]: any;
}

interface EditBabyInfoType {
  name?: string;
  inpatientNo?: string;
  sex?: string;
  birthDate?: string;
  birthDateTime?: string;
  babyBirthWeight?: string | number;
  babyBirthHeight?: string | number;
  [key: string]: any;
}

const patientInfo = ref<PatientInfoType>({})
const queryParam = ref<QueryParamType>({
  wardCode:'',
  inpatientNo:'',
  admissTimes:null,
})

const editBaByInfo = ref<EditBabyInfoType>({
  name:'',
  inpatientNo:'',
  sex:'',
  birthDate:'',
  birthDateTime:'',
  babyBirthWeight:'', // 新增：婴儿出生体重
  babyBirthHeight:'', // 新增：婴儿出生身高
})

const editBabyDialog  = ref(false)
const dialogTitle = ref('增加婴儿信息')
const isEdit = ref(false)

const saveData=()=>{
  editBaByInfo.value.name = patientInfo.value.name
  editBaByInfo.value.inpatientNo= queryParam.value.inpatientNo
  // 设置完整出生日期时间
  editBaByInfo.value.birthDateTime = editBaByInfo.value.birthDate
  saveBabyInfo(editBaByInfo.value).then((res)=>{
   editBabyDialog.value = false
    queryBaby()
  })
}

const onSubmit = ()=>{
  if(isEdit.value){
    // 方案A：提交前将控件值传到后端可解析字段
    editBaByInfo.value.birthDateTime = editBaByInfo.value.birthDate
    editBabyInfo(editBaByInfo.value).then(()=>{
      editBabyDialog.value = false
      queryBaby()
    })
  }else{
    saveData()
  }
}

const visible = ref<boolean>(false)
const patList  =ref([])
const fetchPatInfo = (row)=>{
    queryParam.value.inpatientNo = row.inpatientNo
    queryParam.value.admissTimes = row.admissTimes
    visible.value = false
   queryInfo()
  queryBaby()
}

const queryBaby=()=>{
  queryBabyInfo(queryParam.value).then((res:any)=>{
    babyList.value = res
  })
}

const addBaby = ()=>{
   dialogTitle.value = '增加婴儿信息'
   isEdit.value = false
   Object.assign(editBaByInfo.value,{name:'',inpatientNo:'',sex:'',birthDate:'',birthDateTime:'',babyBirthWeight:'',babyBirthHeight:''})
   editBabyDialog.value = true
}
const openEdit = (row)=>{
  dialogTitle.value = '编辑婴儿信息'
  isEdit.value = true
  Object.assign(editBaByInfo.value,{
    name: patientInfo.value.name,
    inpatientNo: row.inpatientNo,
    sex: row.sex,
    birthDate: row.birthDateTime || row.birthDate,
    birthDateTime: row.birthDateTime,
    babyBirthWeight: row.babyBirthWeight,
    babyBirthHeight: row.babyBirthHeight,
  })
  editBabyDialog.value = true
}
const babyList = ref()

const selectPatList = ()=>{
  queryPatientInfo('',queryParam.value.wardCode,'0').then((res:any) => {
    if(res.length > 0){
      patList.value = res.filter(item=>(!item.inpatientNo.includes('$')))
    }else {
      patList.value = []
    }
  })
}

const ward = ref<any>([])
onMounted(()=>{
  getAllWards().then((res:any)=>{
    ward.value =res
    queryParam.value.wardCode = res[0].code
  })

})

const delBaBy = (index,row) =>{
  ElMessageBox.confirm('确认删除婴儿信息？', '提示', {
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    distinguishCancelAndClose: true
  }).then(() => {
      deleteBaby(row).then((res)=>{
        queryBaby()
      })
  })
}
const queryInfo = ()=>{
  let params = {inpatientNo:queryParam.value.inpatientNo,
    admissTimes:queryParam.value.admissTimes,inOutStatusFlag:'0'}
  getPatientBaseInfo(params).then((res:any)=>{
    patientInfo.value =res
  })
}

</script>
<style scoped lang="scss">

</style>