Commit b78c8d16 authored by Lowry's avatar Lowry

专病随访详情联调

parent 9c01d57f
......@@ -15,10 +15,6 @@
</div>
<div class="top-label">
<div class="mt-3 flex">
<!-- <div>
<span>随访方式:</span>
<span class="color-b">{{ info.visitWayName }}</span>
</div> -->
<div>
<span>随访日期:</span>
<span class="color-b">{{ info.visitDate }}</span>
......@@ -36,217 +32,31 @@
</div>
</div>
</div>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">摄盐情况(咸淡)</span>
<span class="text-end">{{ info.saltIntakeName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<!-- <div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div> -->
<div v-for="x in inspectList" :key="x.insType">
<div style="color: #262626" class="mt-2">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
<HypertensionDetail v-if="routerDetail.diseaseType === '1'" :visitInfo="info" />
<DiabetesDetail v-if="routerDetail.diseaseType === '2'" :visitInfo="info" />
<CoronaryHeartDiseaseDetail v-if="routerDetail.diseaseType === '3'" :visitInfo="info" />
<CerebralApoplexyDetail v-if="routerDetail.diseaseType === '4'" :visitInfo="info" />
<CopdDetail v-if="routerDetail.diseaseType === '5'" :visitInfo="info" />
<ChronicKidneyDiseaseDetail v-if="routerDetail.diseaseType === '6'" :visitInfo="info" />
<AbnormalBloodLipidsDetail v-if="routerDetail.diseaseType === '7'" :visitInfo="info" />
</div>
</template>
<script>
import { querySeparateFUDetail } from '@/api/residentWX/visit.js'
import { fetchDataHandle } from '@/utils/common.js'
import HypertensionDetail from './components/HypertensionDetail.vue'
import DiabetesDetail from './components/DiabetesDetail.vue'
import CoronaryHeartDiseaseDetail from './components/CoronaryHeartDiseaseDetail.vue'
import CerebralApoplexyDetail from './components/CerebralApoplexyDetail.vue'
import CopdDetail from './components/CopdDetail.vue'
import ChronicKidneyDiseaseDetail from './components/ChronicKidneyDiseaseDetail.vue'
import AbnormalBloodLipidsDetail from './components/AbnormalBloodLipidsDetail.vue'
export default {
components: { HypertensionDetail, DiabetesDetail, CoronaryHeartDiseaseDetail, CerebralApoplexyDetail, CopdDetail, ChronicKidneyDiseaseDetail, AbnormalBloodLipidsDetail },
data() {
return {
info: {},
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '心率', key: 'signHeartRate', unit: '次/分' },
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '腰围', key: 'signWaistline', unit: 'cm' },
{ title: '其他', key: 'signOther' }
],
collapseList: [
// { title: "居民信息", name: "1", columns: [], info: {} },
// { title: "随访详情", name: "2", columns: [], info: {} },
// { title: "随访机构", name: "3", columns: [], info: {} }
],
// 辅助检查
inspectList: []
info: {}
}
},
computed: {
......@@ -273,40 +83,8 @@ export default {
}
querySeparateFUDetail(params).then(res => {
let result = res.data || {}
// 字符串转数组
const form = fetchDataHandle(result, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [] } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
console.log(list)
this.info = result
})
},
// 折叠面板切换
collapseChange(val) {
if (val && val.length === this.collapseList.length) {
this.collapseAll = true
} else {
this.collapseAll = false
}
},
// 全部展开、收起
toggleAll() {
},
onBack() {
this.$router.back()
......@@ -336,44 +114,4 @@ export default {
color: #262626;
}
}
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式指导" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list mt-2">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">摄盐情况(咸淡)</span>
<span class="text-end">{{ info.saltIntakeName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="服药依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">服药依从性</span>
<span class="text-end">{{ info.medicationComplianceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="此次随访分类" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="目前诊断" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="用药情况" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">是否调整治疗方案</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1">
<div style="color: #262626" class="mt-2">用药</div>
<div v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="转诊" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="现场随访照片" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="13" title="下次随访日期" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="14" title="随访机构" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</template>
<script>
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
props: {
visitInfo: {
type: Object,
default: () => {}
}
},
data() {
return {
info: {},
store: useStore(),
// 辅助检查
inspectList: [],
// 用药情况
medicateCase: [],
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
// 居民信息
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
// 体征
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '心率', key: 'signHeartRate', unit: '次/分' },
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '其他', key: 'signOther' }
],
// 随访机构
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
]
}
},
computed: {
residentInfo() {
return this.info.residentsRecord || {}
}
},
methods: {
dataHandle() {
// 字符串转数组
const form = fetchDataHandle(this.visitInfo, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], medicateCase = [] } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
console.log(2, form)
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 15; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
// 折叠面板切换
collapseChange(val) {
if (val.length === 14) {
this.collapseAll = true
} else {
this.collapseAll = false
}
}
},
watch: {
visitInfo: {
handler() {
console.log(1, this.visitInfo)
this.dataHandle()
}
}
}
}
</script>
<style lang="less" scoped>
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式指导" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list mt-2">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">摄盐情况(咸淡)</span>
<span class="text-end">{{ info.saltIntakeName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="服药依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">服药依从性</span>
<span class="text-end">{{ info.medicationComplianceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="此次随访分类" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="目前诊断" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="用药情况" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">是否调整治疗方案</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1">
<div style="color: #262626" class="mt-2">用药</div>
<div v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="转诊" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="现场随访照片" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="13" title="下次随访日期" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="14" title="随访机构" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</template>
<script>
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
props: {
visitInfo: {
type: Object,
default: () => {}
}
},
data() {
return {
info: {},
store: useStore(),
// 辅助检查
inspectList: [],
// 用药情况
medicateCase: [],
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
// 居民信息
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
// 体征
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '心率', key: 'signHeartRate', unit: '次/分' },
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '其他', key: 'signOther' }
],
// 随访机构
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
]
}
},
computed: {
residentInfo() {
return this.info.residentsRecord || {}
}
},
methods: {
dataHandle() {
// 字符串转数组
const form = fetchDataHandle(this.visitInfo, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], medicateCase = [] } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
console.log(2, form)
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 15; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
// 折叠面板切换
collapseChange(val) {
if (val.length === 14) {
this.collapseAll = true
} else {
this.collapseAll = false
}
}
},
watch: {
visitInfo: {
handler() {
console.log(1, this.visitInfo)
this.dataHandle()
}
}
}
}
</script>
<style lang="less" scoped>
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式指导" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list mt-2">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">摄盐情况(咸淡)</span>
<span class="text-end">{{ info.saltIntakeName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="服药依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">服药依从性</span>
<span class="text-end">{{ info.medicationComplianceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="此次随访分类" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="目前诊断" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="用药情况" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">是否调整治疗方案</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1">
<div style="color: #262626" class="mt-2">用药</div>
<div v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="转诊" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="现场随访照片" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="13" title="下次随访日期" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="14" title="随访机构" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</template>
<script>
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
props: {
visitInfo: {
type: Object,
default: () => {}
}
},
data() {
return {
info: {},
store: useStore(),
// 辅助检查
inspectList: [],
// 用药情况
medicateCase: [],
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
// 居民信息
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
// 体征
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '心率', key: 'signHeartRate', unit: '次/分' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: '水肿', key: 'signEdemaName' },
{ title: '其他', key: 'signOther' }
],
// 随访机构
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
]
}
},
computed: {
residentInfo() {
return this.info.residentsRecord || {}
}
},
methods: {
dataHandle() {
// 字符串转数组
const form = fetchDataHandle(this.visitInfo, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], medicateCase = [] } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
console.log(2, form)
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 15; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
// 折叠面板切换
collapseChange(val) {
if (val.length === 14) {
this.collapseAll = true
} else {
this.collapseAll = false
}
}
},
watch: {
visitInfo: {
handler() {
console.log(1, this.visitInfo)
this.dataHandle()
}
}
}
}
</script>
<style lang="less" scoped>
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式指导" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div style="color: #262626" class="mt-2">呼吸锻炼</div>
<div class="box">
<div>
<span>有无呼吸锻炼:</span>
<span>{{ info.isBreathExerciseName }}</span>
</div>
<div v-if="info.isBreathExercise === 1">
<span>呼吸锻炼频率:</span>
<span>{{ info.breathExerciseWeek || '-' }}次/周、</span>
<span>{{ info.breathExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list mt-2">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">健康教育</span>
<span class="text-end">{{ info.healthEducationName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsAuxiliary" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="服药依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">服药依从性</span>
<span class="text-end">{{ info.medicationComplianceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="此次随访分类" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="目前诊断" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="用药情况" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">是否调整治疗方案</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1">
<div style="color: #262626" class="mt-2">用药</div>
<div v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="转诊" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="现场随访照片" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="13" title="下次随访日期" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="14" title="随访机构" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</template>
<script>
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
props: {
visitInfo: {
type: Object,
default: () => {}
}
},
data() {
return {
info: {},
store: useStore(),
// 辅助检查
inspectList: [],
// 用药情况
medicateCase: [],
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
// 居民信息
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
// 体征
columnsPhysical: [
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '口唇紫绀', key: 'signCyanosisName' },
{ title: '下肢水肿', key: 'signEdemaName' },
{ title: '其他', key: 'signOther' }
],
// 辅助检查
columnsAuxiliary: [
{ title: 'FEV1', key: 'fev1', unit: 'L' },
{ title: 'FVC', key: 'fvc', unit: 'L' },
{ title: 'FEV1%pred', key: 'fev1Pred', unit: '%' },
{ title: 'FVC%pred', key: 'fvcPred', unit: '%' },
{ title: 'FEV1/FVC', key: 'fev1Fvc', unit: '%' },
],
// 随访机构
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
]
}
},
computed: {
residentInfo() {
return this.info.residentsRecord || {}
}
},
methods: {
dataHandle() {
// 字符串转数组
const form = fetchDataHandle(this.visitInfo, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], medicateCase = [] } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
console.log(2, form)
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 15; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
// 折叠面板切换
collapseChange(val) {
if (val.length === 14) {
this.collapseAll = true
} else {
this.collapseAll = false
}
}
},
watch: {
visitInfo: {
handler() {
console.log(1, this.visitInfo)
this.dataHandle()
}
}
}
}
</script>
<style lang="less" scoped>
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式指导" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list mt-2">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">摄盐情况(咸淡)</span>
<span class="text-end">{{ info.saltIntakeName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="服药依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">服药依从性</span>
<span class="text-end">{{ info.medicationComplianceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="此次随访分类" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="目前诊断" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="用药情况" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">是否调整治疗方案</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1">
<div style="color: #262626" class="mt-2">用药</div>
<div v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="转诊" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="现场随访照片" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="13" title="下次随访日期" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="14" title="随访机构" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</template>
<script>
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
props: {
visitInfo: {
type: Object,
default: () => {}
}
},
data() {
return {
info: {},
store: useStore(),
// 辅助检查
inspectList: [],
// 用药情况
medicateCase: [],
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
// 居民信息
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
// 体征
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '心率', key: 'signHeartRate', unit: '次/分' },
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '其他', key: 'signOther' }
],
// 随访机构
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
]
}
},
computed: {
residentInfo() {
return this.info.residentsRecord || {}
}
},
methods: {
dataHandle() {
// 字符串转数组
const form = fetchDataHandle(this.visitInfo, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], medicateCase = [] } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
console.log(2, form)
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 15; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
// 折叠面板切换
collapseChange(val) {
if (val.length === 14) {
this.collapseAll = true
} else {
this.collapseAll = false
}
}
},
watch: {
visitInfo: {
handler() {
console.log(1, this.visitInfo)
this.dataHandle()
}
}
}
}
</script>
<style lang="less" scoped>
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式指导" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">主食</span>
<span class="text-end">{{ info.staplFood || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">目标主食</span>
<span class="text-end">{{ info.targetStaplFood || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsAuxiliary" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="服药依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">服药依从性</span>
<span class="text-end">{{ info.medicationComplianceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="低血糖反应" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">低血糖反应</span>
<span class="text-end">{{ info.glycopeniaReactionName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="此次随访分类" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="目前诊断" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="用药情况" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">是否调整治疗方案</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1">
<div style="color: #262626" class="mt-2">用药</div>
<div v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</div>
<div style="color: #262626" class="mt-2">胰岛素</div>
<div class="box">
<div>
<span>胰岛素种类:</span>
<span>{{ info.insulinTypeName }}</span>
</div>
<div>
<span>用法:</span>
<span>{{ info.insulinUsageName }}</span>
</div>
<div>
<span>用量:</span>
<span v-for="(item, index) in insulinDosage" :key="index">
<template v-if="item.checked">
<span>{{ item.name }}</span>
<span class="mr-1 ml-1">{{ item.dosage }}</span>
<span>IU、</span>
</template>
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="转诊" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="13" title="现场随访照片" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="14" title="下次随访日期" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="15" title="随访机构" name="15">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</template>
<script>
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
props: {
visitInfo: {
type: Object,
default: () => {}
}
},
data() {
return {
info: {},
store: useStore(),
// 辅助检查
inspectList: [],
// 用药情况
medicateCase: [],
// 胰岛素用量
insulinDosage: [],
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
// 居民信息
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
// 体征
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '腰围', key: 'signWaistline', unit: 'cm' },
{ title: '足背动脉搏动', key: 'signArteryPulsationName' },
{ title: '其他', key: 'signOther' }
],
// 随访机构
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
],
columnsAuxiliary: [
{ title: '空腹静脉血糖值', key: 'emptyBloodGlucose', unit: 'mmol/L' },
{ title: '空腹胰岛素', key: 'emptyInsulin', unit: 'mU/L' },
{ title: '空腹C肽', key: 'emptyPeptide', unit: 'pmol/L' },
{ title: '餐后2小时胰岛素', key: 'afterInsulin', unit: 'mU/L' },
{ title: '餐后2小时C肽', key: 'afterPeptide', unit: 'pmol/L' }
]
}
},
computed: {
residentInfo() {
return this.info.residentsRecord || {}
}
},
methods: {
dataHandle() {
// 字符串转数组
const form = fetchDataHandle(this.visitInfo, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], medicateCase = [], insulinDosage = [] } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
// 胰岛素用量处理
this.insulinDosage = JSON.parse(insulinDosage)
console.log(2, form)
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 16; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
// 折叠面板切换
collapseChange(val) {
if (val.length === 15) {
this.collapseAll = true
} else {
this.collapseAll = false
}
}
},
watch: {
visitInfo: {
handler() {
console.log(1, this.visitInfo)
this.dataHandle()
}
}
}
}
</script>
<style lang="less" scoped>
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式指导" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">摄盐情况(咸淡)</span>
<span class="text-end">{{ info.saltIntakeName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="目前高血压用药及依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="box">
<div>
<span>您目前是否在服用降压药、降脂(如他汀类)或抗血小板(如阿司匹林)等心血管病相关药物:</span>
<span>{{ info.medicationComplianceName }}</span>
</div>
<div>
<span>药物名称:</span>
<span>{{ currentMedicateCase.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ currentMedicateCase.dose }}</span>
<span>{{ store.getDictValue('CP00081', currentMedicateCase.unit) }}</span>
</div>
<div>
<span>用药频次:</span>
<span>{{ store.getDictValue('CP00084', currentMedicateCase.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', currentMedicateCase.usage) }}</span>
</div>
<div>
<span>服药依从性:</span>
<span>{{ store.getDictValue('CP00148', currentMedicateCase.compliance) }}</span>
</div>
<div>
<span>不依从原因:</span>
<span>{{ info.noComplianceReasonName }}</span>
</div>
<div v-if="(info.noComplianceReason || []).includes(3)">
<span>副作用原因:</span>
<span>{{ info.sideEffectReasonName }}</span>
</div>
</div>
<div v-for="(item, index) in addMedicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
<span class="ml-4">频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="此次随访分类" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="目前诊断" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="用药情况" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">本次就诊后的药物治疗方案:</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1" v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="转诊" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="现场随访照片" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="13" title="下次随访日期" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="14" title="随访机构" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</template>
<script>
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
props: {
visitInfo: {
type: Object,
default: () => {}
}
},
data() {
return {
info: {},
store: useStore(),
// 辅助检查
inspectList: [],
// 当前用药
currentMedicateCase: {},
addMedicateCase: [],
// 用药情况
medicateCase: [],
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
// 居民信息
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
// 体征
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '心率', key: 'signHeartRate', unit: '次/分' },
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '腰围', key: 'signWaistline', unit: 'cm' },
{ title: '其他', key: 'signOther' }
],
// 随访机构
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
]
}
},
computed: {
residentInfo() {
return this.info.residentsRecord || {}
}
},
methods: {
dataHandle() {
// 字符串转数组
const form = fetchDataHandle(this.visitInfo, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], currentMedicateCase = {}, addMedicateCase = [], medicateCase = [], } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 当前用药处理
this.currentMedicateCase = JSON.parse(currentMedicateCase)
this.addMedicateCase = JSON.parse(addMedicateCase)
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
console.log(2, form)
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 15; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
// 折叠面板切换
collapseChange(val) {
if (val.length === 14) {
this.collapseAll = true
} else {
this.collapseAll = false
}
}
},
watch: {
visitInfo: {
handler() {
console.log(1, this.visitInfo)
this.dataHandle()
}
}
}
}
</script>
<style lang="less" scoped>
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
<template>
<div class="flex flex-col" style="height: 100vh">
<div class="p-3 text-black text-center shrink-0 doc-nav-bar">
<span @click="onBack" class="text-12 back-bt">
<doc-icon type="doc-left2" />
</span>
<span>随访详情</span>
</div>
<div class="px-4 py-3 flex shrink-0 base-info">
<div class="flex w-full">
<img src="@/assets/image/residentWX/avatar.png" alt="" class="shrink-0" style="width: .56rem; height: .56rem">
<div class="grow flex flex-col justify-between pl-3">
<div class="flex justify-between">
<span class="name">{{ residentInfo.residentName }}</span>
</div>
<div class="top-label">
<div class="mt-3 flex">
<!-- <div>
<span>随访方式:</span>
<span class="color-b">{{ info.visitWayName }}</span>
</div> -->
<div>
<span>随访日期:</span>
<span class="color-b">{{ info.visitDate }}</span>
</div>
<div class="ml-2">
<span>病情状态:</span>
<span class="color-b">{{ info.visitTypeName }}</span>
</div>
</div>
<div>
<span>下次随访日期:</span>
<span class="color-b">{{ info.nextVisitDate }}</span>
</div>
</div>
</div>
</div>
</div>
<div class="p-3 grow cont-box">
<div class="p-3 h-full cont-inner">
<div class="flex justify-between collapse-head">
<span class="text-16">全部内容</span>
<span @click="toggleAll">
<span v-if="!collapseAll">展开全部</span>
<span v-else>收起全部</span>
<span :class="['ml-2 icon-down', { 'icon-down-expanded': collapseAll }]">
<doc-icon type="doc-down" />
</span>
</span>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse" @change="collapseChange">
<van-collapse-item key="1" title="居民信息" name="1">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsBase" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(residentInfo.idCard) || '-' }}</span>
<span class="text-end" v-else>
<span>{{ residentInfo[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="2" title="症状" name="2">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">症状</span>
<span class="text-end">
{{ info.symptomName || '-' }}
</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="3" title="体征" name="3">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsPhysical" :key="item.key">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">
<span>{{ info[item.key] || '-' }}</span>
<span v-if="item.unit" class="ml-1">{{ item.unit }}</span>
</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="4" title="生活方式" name="4">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div style="color: #262626">吸烟</div>
<div class="box">
<div>
<span>是否正在吸烟:</span>
<span>{{ info.isSmokingName }}</span>
</div>
<div v-if="info.isSmoking === 1">
<span>您大约从几岁起开始养成每天或基本每天都吸烟的习惯:</span>
<span>{{ info.startSmokeAge || '-' }}岁</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>您最近7天是否吸烟:</span>
<span>{{ info.lastSevenSmokeName }}</span>
</div>
<div v-if="info.isSmoking === 1 || info.isSmoking === 2">
<span>日吸烟量:</span>
<span>{{ info.daySmoking || '-' }}支</span>
<span class="ml-4">目标日吸烟量:</span>
<span>{{ info.goalDaySmoking || '-' }}支</span>
</div>
</div>
<div style="color: #262626" class="mt-2">饮酒</div>
<div class="box">
<div>
<span>是否正在饮酒:</span>
<span>{{ info.isDrinkName }}</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>日饮酒量:</span>
<span>{{ info.dayDrink || '-' }}ml</span>
<span class="ml-4">目标日饮酒量:</span>
<span>{{ info.goalDayDrink || '-' }}ml</span>
</div>
<div v-if="info.isDrink === 1 || info.isDrink === 2">
<span>白酒:</span>
<span>{{ info.drinkLiquor || '-' }}ml/日</span>
<span class="ml-2">啤酒:</span>
<span>{{ info.drinkBeer || '-' }}ml/日</span>
<span class="ml-2">红酒:</span>
<span>{{ info.drinkRed || '-' }}ml/日</span>
<span class="ml-2">黄酒:</span>
<span>{{ info.drinkYellow || '-' }}ml/日</span>
<span class="ml-2">其他:</span>
<span>{{ info.drinkOther || '-' }}ml/日</span>
</div>
</div>
<div style="color: #262626" class="mt-2">运动</div>
<div class="box">
<div>
<span>有无规律活动:</span>
<span>{{ info.regularExerciseName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>运动强度:</span>
<span>{{ info.exerciseStrengthName }}</span>
</div>
<div v-if="info.regularExercise === 1">
<span>目前运动情况:</span>
<span>{{ info.nowExerciseWeek || '-' }}次/周、</span>
<span>{{ info.nowExerciseMinute || '-' }}分钟/次</span>
</div>
</div>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">摄盐情况(咸淡)</span>
<span class="text-end">{{ info.saltIntakeName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">心理调整</span>
<span class="text-end">{{ info.psychologicalRecoveryName || '-' }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">遵医行为</span>
<span class="text-end">{{ info.doctorAdviceName || '-' }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="5" title="辅助检查" name="5">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in inspectList" :key="x.insType">
<div style="color: #262626" :class="[xIndex === 0 ? '' : 'mt-2']">{{ x.insName }}</div>
<div class="box">
<div v-for="y in x.items">
<span>{{ y.itemName }}:</span>
<span>{{ y.itemValue }}</span>
<span class="ml-1">{{ y.unit }}</span>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="6" title="目前高血压用药及依从性" name="6">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="box">
<div>
<span>您目前是否在服用降压药、降脂(如他汀类)或抗血小板(如阿司匹林)等心血管病相关药物:</span>
<span>{{ info.medicationComplianceName }}</span>
</div>
<div>
<span>药物名称:</span>
<span>{{ currentMedicateCase.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ currentMedicateCase.dose }}</span>
<span>{{ store.getDictValue('CP00081', currentMedicateCase.unit) }}</span>
</div>
<div>
<span>用药频次:</span>
<span>{{ store.getDictValue('CP00084', currentMedicateCase.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', currentMedicateCase.usage) }}</span>
</div>
<div>
<span>服药依从性:</span>
<span>{{ store.getDictValue('CP00148', currentMedicateCase.compliance) }}</span>
</div>
<div>
<span>不依从原因:</span>
<span>{{ info.noComplianceReasonName }}</span>
</div>
<div v-if="(info.noComplianceReason || []).includes(3)">
<span>副作用原因:</span>
<span>{{ info.sideEffectReasonName }}</span>
</div>
</div>
<div v-for="(item, index) in addMedicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
<span class="ml-4">频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="7" title="药物不良反应" name="7">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">药物不良反应</span>
<span class="text-end">{{ info.drugsAdverseName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="8" title="此次随访分类" name="8">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">此次随访分类</span>
<span class="text-end">{{ info.visitTypeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="9" title="目前诊断" name="9">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div v-for="(x, xIndex) in info.diagnoseInfoList" :key="xIndex">
<div style="color: #262626">
{{ (store.getDict('CP00086').find(e => e.value === x.currentDiagnoseType)).name }}
</div>
<div class="box" >
<div v-if="x.currentDiagnoseType === 1">
<span>高血压分级:</span>
<span>{{ x.diagnoseResultValue }}</span>
<span class="ml-4">高血压危险分层:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 2">
<span>糖尿病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 3">
<span>冠心病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 4">
<span>缺血性脑卒中:</span>
<span>{{ x.diagnoseResultValue || '-' }}</span>
<span class="ml-4">出血性脑卒中:</span>
<span>{{ x.diagnoseLevelValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 5">
<span>慢阻肺:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 6">
<span>慢性肾病:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div v-if="x.currentDiagnoseType === 7">
<span>血脂异常:</span>
<span>{{ x.diagnoseResultValue }}</span>
</div>
<div>
<span>纳入管理日期:</span>
<span>{{ x.inclusionManageDate }}</span>
</div>
<div v-for="(y, yIndex) in x.diagnoseItemList" :key="yIndex">
<div>
<span>诊断名称:</span>
<span>{{ y.diagnosisResultName }}</span>
</div>
<div>
<span>诊断日期:</span>
<span>{{ y.diagnosisDate }}</span>
</div>
<div>
<span>诊断单位:</span>
<span>{{ y.diagnosisUnitName }}</span>
</div>
<div>
<span>诊断科室:</span>
<span>{{ y.diagnosisOfficeName }}</span>
</div>
<div>
<span>诊断医生:</span>
<span>{{ y.diagnosisUserName }}</span>
</div>
</div>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="10" title="用药情况" name="10">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">本次就诊后的药物治疗方案:</span>
<span class="text-end">{{ info.adjustTreatName }}</span>
</div>
</div>
<div v-if="info.adjustTreat === 1" v-for="(item, index) in medicateCase" :key="index" class="box mt-2">
<div>
<span>药物名称:</span>
<span>{{ item.drugName }}</span>
<span class="ml-4">剂量:</span>
<span class="mr-1">{{ item.dose }}</span>
<span>{{ store.getDictValue('CP00081', item.unit) }}</span>
</div>
<div>
<span>频次:</span>
<span>{{ store.getDictValue('CP00084', item.frequency) }}</span>
<span class="ml-4">用法:</span>
<span>{{ store.getDictValue('CP00083', item.usage) }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="11" title="转诊" name="11">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊原因</span>
<span class="text-end">{{ info.referralReason }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊机构</span>
<span class="text-end">{{ info.referralUnitName }}</span>
</div>
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">转诊科室</span>
<span class="text-end">{{ info.referralOfficeName }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="12" title="现场随访照片" name="12">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
</van-collapse-item>
<van-collapse-item key="13" title="下次随访日期" name="13">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">下次随访日期</span>
<span class="text-end">{{ info.nextVisitDate }}</span>
</div>
</div>
</van-collapse-item>
<van-collapse-item key="14" title="随访机构" name="14">
<template #right-icon>
<doc-icon type="doc-down" />
</template>
<div class="list">
<div v-for="item in columnsOrg" :key="item.key" class="flex justify-between py-1 border-bottom item">
<span class="shrink-0 mr-2 label">{{ item.title }}</span>
<span class="text-end">{{ info[item.key] }}</span>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</div>
</template>
<script>
import { querySeparateFUDetail } from '@/api/residentWX/visit.js'
import { fetchDataHandle } from '@/utils/common.js'
import { useStore } from '@/resident/store/index.js'
export default {
data() {
return {
info: {},
// 全部展开、收起
collapseAll: false,
activeCollapse: [],
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderName' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'currentAge' },
{ title: '民族', key: 'nationalName' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeName' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeName' },
{ title: '详细地址', key: 'permanentAddress' }
],
columnsPhysical: [
{ title: '收缩压SBP', key: 'signSystolicPressure', unit: 'mmHg' },
{ title: '舒张压DBP', key: 'signDiastolicPressure', unit: 'mmHg' },
{ title: '心率', key: 'signHeartRate', unit: '次/分' },
{ title: '身高', key: 'signHeight', unit: 'cm' },
{ title: '体重', key: 'signWeight', unit: 'kg' },
{ title: 'BMI', key: 'signBmi', unit: 'kg/m²' },
{ title: '腰围', key: 'signWaistline', unit: 'cm' },
{ title: '其他', key: 'signOther' }
],
columnsOrg: [
{ title: '随访日期', key: 'visitDate' },
{ title: '随访单位', key: 'visitUnitName' },
{ title: '随访科室', key: 'visitOfficeName' },
{ title: '随访医生', key: 'visitDoctorName' },
{ title: '录入日期', key: 'createDate' },
{ title: '录入单位', key: 'createUnitName' },
{ title: '录入科室', key: 'createOfficeName' },
{ title: '录入医生', key: 'createDoctorName' },
],
collapseList: [
// { title: "居民信息", name: "1", columns: [], info: {} },
// { title: "随访详情", name: "2", columns: [], info: {} },
// { title: "随访机构", name: "3", columns: [], info: {} }
],
// 辅助检查
inspectList: [],
// 当前用药
currentMedicateCase: {},
addMedicateCase: [],
// 用药情况
medicateCase: [],
store: useStore()
}
},
computed: {
routerDetail() {
return this.$route.params
},
residentInfo() {
return this.info.residentsRecord || {}
}
},
created() {
this.load()
},
methods: {
load() {
const { relationId, diseaseType } = this.routerDetail
if (!relationId) {
showToast('未获取到信息')
return
}
let params = {
id: relationId,
diseaseType,
}
querySeparateFUDetail(params).then(res => {
let result = res.data || {}
// 字符串转数组
const form = fetchDataHandle(result, {
auxiliaryExamination: 'strToArrNum'
})
this.info = form
// 辅助检查处理
let { auxiliaryExamination = [], inspectList = [], currentMedicateCase = {}, addMedicateCase = [], medicateCase = [], } = form
let list = []
auxiliaryExamination.forEach(item => {
const items = inspectList.filter(e => e.insType === item)
if (items.length > 0) {
list.push({
insType: items[0].insType,
insName: items[0].insName,
items: [...items]
})
}
})
this.inspectList = list
// 当前用药处理
this.currentMedicateCase = JSON.parse(currentMedicateCase)
this.addMedicateCase = JSON.parse(addMedicateCase)
// 用药情况处理
this.medicateCase = JSON.parse(medicateCase)
})
},
// 折叠面板切换
collapseChange(val) {
console.log(val)
if (val.length === 14) {
this.collapseAll = true
} else {
this.collapseAll = false
}
// if (val && val.length === this.collapseList.length) {
// this.collapseAll = true
// } else {
// this.collapseAll = false
// }
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
let list = []
for (let i = 1; i < 15; i++) {
list.push(i.toString())
}
this.activeCollapse = list
}
this.collapseAll = !this.collapseAll
},
onBack() {
this.$router.back()
}
}
}
</script>
<style lang="less" scoped>
@import url('../../utils/common.less');
.base-info {
background: linear-gradient(to bottom, #DFF5F4, #fff 50%);
color: #8c8c8c;
.name {
font-weight: 600;
color: #000;
font-size: 18px;
}
.top-label {
font-size: 13px;
line-height: 22px;
}
.color-b {
color: #262626;
}
}
.cont-box {
background-color: #f9f9f9;
.cont-inner {
background: linear-gradient(to bottom, #DFF5F4, #fff .6rem);
border-top-left-radius: .08rem;
border-top-right-radius: .08rem;
}
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
.list {
color: #262626;
.label {
min-width: 5em;
}
}
.box {
background: #F8FAFC;
padding: 8px;
color: #4D5665;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment