You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
101 lines
2.5 KiB
Vue
101 lines
2.5 KiB
Vue
2 years ago
|
<script setup lang="ts">
|
||
|
|
import { queryMedicalRecInfo } from "@/api/medicalRecord";
|
||
|
|
import BasicInfo from "./compontents/basicInfo.vue";
|
||
|
|
import AskInquiry from "./compontents/askInquiry.vue";
|
||
|
|
import DisposalPlan from "./compontents/DisposalPlan.vue";
|
||
|
|
import { ref } from "vue";
|
||
|
|
import { reactive, onMounted } from "vue";
|
||
|
|
import { useRoute } from "vue-router";
|
||
|
|
|
||
|
|
const activeName = ref(["1", "2"]);
|
||
|
|
const showFlag = ref(false);
|
||
|
|
let detailInfo = reactive({
|
||
|
|
patient: {},
|
||
|
|
physicalList: [],
|
||
|
|
ancillaryList: [],
|
||
|
|
qaList: [],
|
||
|
|
diseaseName: "",
|
||
|
|
treatmentPlanList: [],
|
||
|
|
patientSelfDesc: ""
|
||
|
|
});
|
||
|
|
const route = useRoute();
|
||
|
|
const getDetail = async () => {
|
||
|
|
const res: any = await queryMedicalRecInfo({
|
||
|
|
id: route.query.id
|
||
|
|
});
|
||
|
|
detailInfo = res.data;
|
||
|
|
detailInfo.patient.patientSelfDesc = detailInfo.patientSelfDesc;
|
||
|
|
showFlag.value = true;
|
||
|
|
};
|
||
|
|
onMounted(() => {
|
||
|
|
getDetail();
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div class="case_detail">
|
||
|
|
<el-collapse v-if="showFlag" class="case_detail_main" v-model="activeName">
|
||
|
|
<el-collapse-item name="1">
|
||
|
|
<template #title>
|
||
|
|
<div class="title">
|
||
|
|
<span>病历信息</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<BasicInfo
|
||
|
|
:dataInfo="detailInfo.patient"
|
||
|
|
:diseaseName="detailInfo.diseaseName"
|
||
|
|
/>
|
||
|
|
</el-collapse-item>
|
||
|
|
<el-collapse-item name="2">
|
||
|
|
<template #title>
|
||
|
|
<div class="title">
|
||
|
|
<span>问诊检查</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<AskInquiry
|
||
|
|
:bodyList="detailInfo?.physicalList"
|
||
|
|
:supportList="detailInfo?.ancillaryList"
|
||
|
|
/>
|
||
|
|
</el-collapse-item>
|
||
|
|
<el-collapse-item name="3">
|
||
|
|
<template #title>
|
||
|
|
<div class="title">
|
||
|
|
<span>问诊问题</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<div class="question_list">
|
||
|
|
<div v-for="(item, index) in detailInfo.qaList" :key="index">
|
||
|
|
{{ item.questionList[0] }}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</el-collapse-item>
|
||
|
|
<el-collapse-item name="4">
|
||
|
|
<template #title>
|
||
|
|
<div class="title">
|
||
|
|
<span>处置计划</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<DisposalPlan :dataList="detailInfo.treatmentPlanList" />
|
||
|
|
</el-collapse-item>
|
||
|
|
</el-collapse>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.case_detail {
|
||
|
|
:deep(.el-collapse-item__header) {
|
||
|
|
width: 100%;
|
||
|
|
height: 40px;
|
||
|
|
background: rgb(0 127 245 / 9%);
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.el-collapse-item) {
|
||
|
|
margin-bottom: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
width: 100%;
|
||
|
|
padding-left: 16px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|