Skip to content

F
frontend-h5
Commit 0494c808 authored by songrui's avatar songrui
Browse files
Options

随访详情

parent ca03238a
Show whitespace changes
Inline Side-by-side
Showing with 943 additions and 275 deletions
src/tumour/api/screening.js
View file @ 0494c808
......@@ -9,3 +9,8 @@ export function addSimpleScreen(params, loading = true) {
export function getSimpleScreenById(id, loading = true) {
return fetchBase({ url: `/tumour-admin/v1/h5-app/simple-screen-detail/${id}`, loading })
}
// 获取检验项目对码表
export function getInspectCode() {
return fetchBase({ url: `/tumour-admin/v1/h5-app/dict-code-table`})
}
\ No newline at end of file
src/tumour/screening/simpleV2/detail/Detail.vue
View file @ 0494c808
......@@ -94,6 +94,9 @@ import DocNavBar from '@/components/docNavBar/DocNavBar.vue'
// http://192.168.1.108:8086/#/tumour/screening/simple/detail?id=49167
export default {
components: {
DocNavBar
},
data() {
return {
info: {},
......@@ -155,10 +158,7 @@ export default {
}
}
},
components: {
DocNavBar
},
}
}
</script>
......
src/tumour/visit/detail/Detail.vue
View file @ 0494c808
......@@ -3,134 +3,112 @@
<DocNavBar home v-if="embed !== 'wx'">
随访详情
</DocNavBar>
<div class="px-4 py-3 flex shrink-0 base-info">
<div class="flex w-full">
<div class="grow flex flex-col justify-between">
<div class="flex justify-between">
<span class="name">{{ baseInfo.residentName || '-' }}</span>
<div class="grow overflow-y-auto">
<div class="notice text-12 pl-4 py-2 flex items-center">
<doc-icon type="doc-exclamation" class="mr-1"/>
<span class="black-5">仅能查询部分检验报告,此结果仅作参考,以医院纸质报告为准</span>
</div>
<div class='top-label'>
<div class='mt-3 flex'>
<div><span>随访方式：</span><span class='color-b'>{{ info.visitModeTrans }}</span></div>
<div class='ml-4'>随访日期：<span class='color-b'>{{ info.visitDate }}</span></div>
<div class="resident-info black-1">
<div class="visit-unit">{{ info.visitUnitName || '-' }}</div>
<div class="mb-3 mt-1">{{ info.diseaseName }}随访与治疗报告</div>
<div style="font-size: .1rem;">随访日期：{{ info.visitDate || '-' }}</div>
<img src="@/assets/image/detail-trim.png" alt="">
</div>
<div><span>下次随访日期：</span>
<span class='color-b'>{{ info.nextVisitDate || '-' }}</span>
<div class="px-4 mt-2">
<div class="panel">
<div class="flex items-center">
<span class="text-16 text-black">{{ baseInfo.residentName }}</span>
<span class="mx-4">{{ baseInfo.genderTrans }}</span>
<span class="black-2">{{ baseInfo.age }}岁</span>
</div>
<div class="visit-items mt-2">
<div class="visit-item p-2">
<div class="black-4">癌症类型</div>
<div class="high-risk-text mt-2">{{ info.diseaseName }}</div>
</div>
<div class="visit-item p-2">
<div class="black-4">随访方式</div>
<div class="black-3 mt-2">{{ info.visitModeTrans }}</div>
</div>
<div class="visit-item p-2">
<div class="black-4">随访医生</div>
<div class="black-3 mt-2">{{ info.visitDoctorName }}</div>
</div>
<div class="visit-item p-2">
<div class="black-4">下次随访日期</div>
<div class="black-3 mt-2">{{ info.nextVisitDate }}</div>
</div>
<div class="visit-item p-2" style="grid-column: 2 / 4;">
<div class="black-4">随访类型</div>
<div class="black-3 mt-2">{{ info.visitTypeTrans }}</div>
</div>
<div class='p-3 grow cont-box'>
<div class='p-3 h-full cont-inner'>
<div class='flex justify-between collapse-head mt-2'>
<span class='text-16 font-semibold'>全部内容</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 :model-value="activeCollapse" ref='collapse' class='doc-collapse'
@change='collapseChange'>
</div>
<van-collapse v-model="activeCollapse" ref="collapse" class="doc-collapse">
<van-collapse-item v-for="item in collapseList" :key='item.name'
:title='item.title' :name='item.name'>
:title="item.title" :name='item.name'>
<template #right-icon>
<doc-icon type='doc-down' />
<doc-icon type="doc-down2" class="right-icon"/>
</template>
<!-- 基本信息 -->
<template #icon>
<doc-icon type="doc-item" class="left-icon"/>
</template>
<!-- 随访内容 -->
<div v-if="item.name === '1'">
<div v-for='item in columnsBase' :key='item.key' class="info-item">
<span class='shrink-0 mr-2'>{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(baseInfo.idCard) || '-'
}}</span>
<span class='text-end' v-else>
<span>{{ baseInfo[item.key] || '-' }}</span>
<span v-if='item.unit' class='ml-1'>{{ item.unit }}</span>
</span>
</div>
</div>
<!-- 随访信息 -->
<div v-if="item.name === '2'">
<div class="info-item" v-if="visitCategory == 2">
<span class='shrink-0 mr-2'>随访人群</span>
<span class='text-end'>{{ info.speciesTrans }}</span>
</div>
<div class="info-item" v-else-if="visitCategory == 1">
<span class='shrink-0 mr-2'>确诊肿瘤</span>
<span class='text-end'>{{ info.diseaseName }}</span>
<div class="info-item" style="margin-top: 0;">
<span class="black-2">身高</span>
<span>{{ visitContent.physicalHeight || '-' }} cm</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访方式</span>
<span class='text-end'>{{ info.visitModeTrans }}</span>
<span class="black-2">体重</span>
<span>{{ visitContent.physicalWeight || '-' }} kg</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访类型</span>
<span class='text-end'>{{ info.visitTypeTrans }}</span>
</div>
<div class="info-item" v-if="info.lastStatus == 2">
<span class='shrink-0 mr-2'>失访原因</span>
<span class='text-end'>
<span>{{ info.loseReasonTrans }}</span>
<span v-if="info.loseReason == 99" class="ml-2">{{ info.loseReasonOther }}</span>
</span>
</div>
<div class="info-item" v-if="info.lastStatus == 1">
<span class='shrink-0 mr-2'>下次随访日期</span>
<span class='text-end'>{{ info.nextVisitDate }}</span>
<span class="black-2">BMI</span>
<span>{{ visitContent.physicalBmi || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访日期</span>
<span class='text-end'>{{ info.visitDate }}</span>
<span class="black-2">腰围</span>
<span>{{ visitContent.physicalWaist || '-' }} cm</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访单位</span>
<span class='text-end'>{{ info.visitUnitName }}</span>
<span class="black-2">心率</span>
<span>{{ visitContent.physicalHeartRate || '-' }} bmp</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访科室</span>
<span class='text-end'>{{ info.visitDepartName }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访医生</span>
<span class='text-end'>{{ info.visitDoctorName }}</span>
<div class="black-2">家族遗传史</div>
<div>
{{ visitContent.familyHistory == 1 ? visitContent.familySpeciesTrans : '无' }}
</div>
</div>
<!-- 随访内容 -->
<div v-if="item.name === '3'">
<div class="info-item">
<span class='shrink-0 mr-2'>家族遗传史</span>
<span class='text-end'>{{ visitContent.familyHistory == 1 ? visitContent.familySpeciesTrans : '无' }}</span>
<span class="black-2">是否吸烟</span>
<span>{{ visitContent.smokeStateTrans }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>是否吸烟</span>
<span class='text-end'>{{ visitContent.smokeStateTrans }}</span>
</div>
<div v-if="visitContent.smokeState != 4" class="info-item-block p-2">
<div v-if="visitContent.smokeState != 4" class="panel-2 text-12 mt-1">
<div v-if="![4].includes(visitContent.smokeState)">吸烟开始年龄: {{ visitContent.smokeAge || '-' }}</div>
<div v-if="[1,2,3].includes(visitContent.smokeState)">最近7天是否吸烟: {{ visitContent.smokeAge || '-' }}</div>
<div v-if="[1,2].includes(visitContent.smokeState)">日吸烟量: {{ visitContent.smokeDay || '-' }}</div>
<div v-if="[1,2].includes(visitContent.smokeState)">目标吸烟量: {{ visitContent.smokeTarget || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>饮酒</span>
<span class='text-end'>
<span class='black-2'>饮酒</span>
<span>
<span>{{ visitContent.drinkStateTrans }}</span>
<span v-if="visitContent.drinkRate = 1">（{{ visitContent.drinkRateTrans }}）</span>
</span>
</div>
<div v-if="[1,2].includes(visitContent.drinkState)" class="info-item-block p-2">
<div v-if="[1,2].includes(visitContent.drinkState)" class="panel-2 text-12 mt-1">
<div>日饮酒量: {{ visitContent.drinkDay || '-' }}<span class="ml-1">ml</span></div>
<div>目标饮酒量: {{ visitContent.drinkTarget || '-' }}<span class="ml-1">ml</span></div>
<div>饮酒种类: {{ visitContent.drinkDayTypeTrans || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>运动</span>
<span class='text-end'>{{ visitContent.sportsStateTrans }}</span>
<span class="black-2">运动</span>
<span>{{ visitContent.sportsStateTrans }}</span>
</div>
<div v-if="visitContent.sportsState == 1" class="info-item-block p-2">
<div v-if="visitContent.sportsState == 1" class="panel-2 text-12 mt-1">
<div>运动强度: {{ visitContent.sportsStrengthTrans || '-' }}</div>
<div>目标运动强度:
<span>{{ visitContent.sportsTargetWeek }}</span>
......@@ -140,108 +118,158 @@
</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>饮食</span>
<span class='text-end'>{{ visitContent.foodStateTrans }}</span>
<span class='black-2'>饮食</span>
<span>{{ visitContent.foodStateTrans }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>是否复发患者</span>
<span class='text-end'>{{ visitContent.relapseTrans }}</span>
<span class='black-2'>是否复发患者</span>
<span>{{ visitContent.relapseTrans }}</span>
</div>
<div class="info-item" v-if="visitContent.relapse == 1">
<span class='shrink-0 mr-2'>复发时间</span>
<span class='text-end'>{{ visitContent.relapseDate }}</span>
<span class='black-2'>复发时间</span>
<span>{{ visitContent.relapseDate }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>是否转移患者</span>
<span class='text-end'>{{ visitContent.transferTrans }}</span>
<span class='black-2'>是否转移患者</span>
<span>{{ visitContent.transferTrans }}</span>
</div>
<div class="info-item" v-if="visitContent.transfer == 1">
<span class='shrink-0 mr-2'>转移时间</span>
<span class='text-end'>{{ visitContent.transferDate }}</span>
<span class='black-2'>转移时间</span>
<span>{{ visitContent.transferDate }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>目前病情</span>
<span class='text-end'>
<span class='black-2'>目前病情</span>
<span>
<span v-if="visitContent.currentCondition == 4">{{ visitContent.currentConditionOther }}</span>
<span v-else>{{ visitContent.currentConditionTrans }}</span>
</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>治疗情况</span>
<span class='text-end'>{{ visitContent.treatSituationTrans }}</span>
<span class='black-2'>治疗情况</span>
<span >{{ visitContent.treatSituationTrans }}</span>
</div>
<div class="info-item" v-if="visitContent.treatSituation == 2">
<span class='shrink-0 mr-2'>治疗方式</span>
<span class='text-end'>
<span class='black-2'>治疗方式</span>
<span >
<span>{{ visitContent.treatItemTrans }}</span>
<span v-if="visitContent.treatItem.includes(10)" class="ml-2">{{ visitContent.treatItemOther }}</span>
</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>用药不良反应</span>
<span class='text-end'>{{ visitContent.adverseDrugReactionsTrans }}</span>
<span class='black-2'>用药不良反应</span>
<span >{{ visitContent.adverseDrugReactionsTrans }}</span>
</div>
<div v-if="visitContent.adverseDrugReactions == 1" class="info-item-block p-2">
<div v-if="visitContent.adverseDrugReactions == 1" class="panel-2 text-12 mt-1">
<div>不良反应: {{ visitContent.adverseReactions || '-' }}</div>
<div>医生处置: {{ visitContent.doctorDisposal || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访情况</span>
<span class='text-end'>{{ visitContent.visitSituation }}</span>
<span class='black-2'>随访情况</span>
<span >{{ visitContent.visitSituation }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>处置意见</span>
<span class='text-end'>{{ visitContent.disposalOpinions }}</span>
<span class='black-2'>处置意见</span>
<span >{{ visitContent.disposalOpinions }}</span>
</div>
<div class="py-1">图片上传</div>
<div class='black-2'>图片</div>
<ImagePreview :imgList="visitContent.imgUrlList" class="mt-1"
v-if="visitContent.imgUrlList.length"/>
<span v-if="!visitContent.imgUrlList || !visitContent.imgUrlList.length">-</span>
</div>
<!-- 检验项目 -->
<div v-if="item.name === '2'">
<div v-for="row in visitInspectionList" :key="row.insType" class="mb-2">
<div class="sub-title">{{ row.insName }}</div>
<div v-for="item in row.items" :key="item.itemCode" class="info-item">
<span class="black-2">{{ item.itemName }}</span>
<div class="flex justify-between">
<span v-if="item.itemType === 2">
{{ item.itemValueTrans || '-' }}
</span>
<span v-else class="mr-2">
{{ item.itemValue || '-' }}
</span>
<div v-if="item.unit">
<span class="black-2">{{ item.unit }}</span>
</div>
</div>
</div>
</div>
</div>
<!-- 检查项目 -->
<div v-if="item.name === '3'">
<div v-for="item in visitCheckList" :key="item.checkTypeCode" class="mb-2">
<div class="sub-title">{{ item.checkTypeCodeTrans }}</div>
<div class="info-item">
<span class="black-2">检查项目</span>
<span>{{ item.checkItem || '-' }}</span>
</div>
<div class="info-item">
<span class="black-2">检查部位</span>
<span>{{ item.checkSite || '-' }}</span>
</div>
<div class="black-2">检查所见</div>
<div class="panel-2 text-12 mt-1" style="white-space: pre-line;">
{{item.checkSeen}}
</div>
<div class="black-2">诊断意见（检查提示）</div>
<div class="panel-2 text-12 mt-1">
{{ item.diagnosticOpinion || '-' }}
</div>
<div class="info-item">
<span class="black-2">阴阳性</span>
<span>{{ item.negativePositiveTrans || '-' }}</span>
</div>
<div class='black-2'>图片</div>
<ImagePreview :imgList="[item.reportImgDTO]" class="mt-1"
v-if="item.reportImgDTO"/>
<span v-if="!item.reportImgDTO">-</span>
</div>
</div>
<!-- 肿瘤信息 -->
<div v-if="item.name === '4'">
<div class="py-1">临床TNM分期</div>
<div class="info-item-block p-2">
<div class='black-2'>临床TNM分期</div>
<div class="panel-2 text-12 mt-1">
<div>T: {{ tumourInfo.clinicalTnmTTrans || '-' }}</div>
<div>N: {{ tumourInfo.clinicalTnmNTrans || '-' }}</div>
<div>M: {{ tumourInfo.clinicalTnmMTrans || '-' }}</div>
</div>
<div class="py-1">病理TNM分期</div>
<div class="info-item-block p-2">
<div class='black-2'>病理TNM分期</div>
<div class="panel-2 text-12 mt-1">
<div>T: {{ tumourInfo.pathologyTnmTTrans || '-' }}</div>
<div>N: {{ tumourInfo.pathologyTnmNTrans || '-' }}</div>
<div>M: {{ tumourInfo.pathologyTnmMTrans || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>临床分期</span>
<span class='text-end'>{{ tumourInfo.clinicalStagesTrans || '-' }}</span>
<span class='black-2'>临床分期</span>
<span>{{ tumourInfo.clinicalStagesTrans || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>病理诊断名称</span>
<span class='text-end'>{{ tumourInfo.diagnosisResultName || '-' }}</span>
<span class='black-2'>病理诊断名称</span>
<span>{{ tumourInfo.diagnosisResultName || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>病理诊断编码</span>
<span class='text-end'>{{ tumourInfo.diagnosisResultCode || '-' }}</span>
<span class='black-2'>病理诊断编码</span>
<span>{{ tumourInfo.diagnosisResultCode || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>继发部位</span>
<span class='text-end'>{{ tumourInfo.secondarySite || '-' }}</span>
<span class='black-2'>继发部位</span>
<span>{{ tumourInfo.secondarySite || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>继发部位时间</span>
<span class='text-end'>{{ tumourInfo.secondarySiteDate || '-' }}</span>
<span class='black-2'>继发部位时间</span>
<span>{{ tumourInfo.secondarySiteDate || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>分子分型</span>
<span class='text-end'>{{ tumourInfo.molecularTypingName || '-' }}</span>
<span class='black-2'>分子分型</span>
<span>{{ tumourInfo.molecularTypingName || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>分子分型记录时间</span>
<span class='text-end'>{{ tumourInfo.molecularTypingDate || '-' }}</span>
<span class='black-2'>分子分型记录时间</span>
<span>{{ tumourInfo.molecularTypingDate || '-' }}</span>
</div>
<div class="py-1">ICD-O-3编码</div>
<div class="info-item-block p-2">
<div class='black-2'>ICD-O-3编码</div>
<div class="panel-2 text-12 mt-1">
<div>解剖学C: {{ tumourInfo.anatomyCName || '-' }}</div>
<div>形态学M: {{ tumourInfo.morphologyCName || '-' }}</div>
<div>行为: {{ tumourInfo.morphologyMName || '-' }}</div>
......@@ -251,29 +279,29 @@
<!-- 疗效评估 -->
<div v-if="item.name === '5'">
<div class="info-item">
<span class='shrink-0 mr-2'>疗效评估</span>
<span class='text-end'>{{ efficacyInfo.curativeTrans || '-' }}</span>
<span class='black-2'>疗效评估</span>
<span>{{ efficacyInfo.curativeTrans || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>其他评估</span>
<span class='text-end'>{{ efficacyInfo.otherEvaluationsTrans || '-' }}</span>
<span class='black-2'>其他评估</span>
<span>{{ efficacyInfo.otherEvaluationsTrans || '-' }}</span>
</div>
<div class="info-item-block p-2" v-if="efficacyInfo?.otherEvaluations?.includes(1)">
<div class="panel-2 text-12 mt-1" v-if="efficacyInfo?.otherEvaluations?.includes(1)">
<div>NRS疼痛评分</div>
<div>{{ efficacyInfo.nrsPainTrans }}</div>
<div>评分结果: {{ efficacyInfo.nrsPainScore || '-' }} 分</div>
</div>
<div class="info-item-block p-2 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(2)">
<div class="panel-2 text-12 mt-1 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(2)">
<div>痛主诉疼痛分级</div>
<div>{{ efficacyInfo.painTrans }}</div>
<div>评分结果: {{ efficacyInfo.painScore || '-' }} 分</div>
</div>
<div class="info-item-block p-2 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(3)">
<div class="panel-2 text-12 mt-1 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(3)">
<div>肿瘤患者ECOG体力状态评分</div>
<div>{{ efficacyInfo.ceogTrans }}</div>
<div>评分结果: {{ efficacyInfo.ceogScore || '-' }} 分</div>
</div>
<div class="info-item-block p-2 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(4)">
<div class="panel-2 text-12 mt-1 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(4)">
<div>体能状态评分</div>
<div>{{ efficacyInfo.staminaTrans }}</div>
<div>评分结果: {{ efficacyInfo.staminaScore || '-' }} 分</div>
......@@ -281,7 +309,7 @@
</div>
<!-- 健康指导 -->
<div v-if="item.name === '6'">
<div class="info-item-block p-2">
<div>
<div v-for="item in guideTextList" class="flex">
<span class="shrink-0">{{item.templateModeTrans}}：</span>
<span class="grow text-wrap">{{ item.templateContent }}</span>
......@@ -290,70 +318,58 @@
</div>
<!-- 健康宣教 -->
<div v-if="item.name === '7'">
<div class="info-item-block p-2" v-if="propagandaTextList.length">
<div v-if="propagandaTextList.length">
<div class="sub-title">文本</div>
<div class="panel-2 text-12 mt-1">
<div v-for="item in propagandaTextList" class="flex">
<span class="shrink-0">{{item.textModeTrans}}：</span>
<span class="grow text-wrap">{{ item.content }}</span>
</div>
</div>
</div>
<div class="mt-2" v-if="mp4List.length">
<div class="sub-title">视频文件</div>
<Mp4 :files="mp4List" :activeMediaUrl="activeMediaUrl"
@play="e => activeMediaUrl = e.annexUrl"/>
</div>
<div class="flex flex-col mt-2" style="row-gap: .06rem;" v-if="mp3List.length">
<div class="sub-title">音频文件</div>
<Mp3 :file="item" v-for="item in mp3List" :key="item.annexId" :activeMediaUrl="activeMediaUrl"
@play="e => activeMediaUrl = e.annexUrl"/>
</div>
</div>
<!-- 催检 -->
<div v-if="item.name === '8'">
<div class="py-1">催检内容</div>
<div class="info-item-block p-2">
<div>{{ info.urgentInsContent || '-' }}</div>
</div>
</div>
<!-- 推送渠道 -->
<div v-if="item.name === '9'">
<div class="info-item-block p-2">
<span class="mr-2">{{ info.pushMethodTrans }}</span>
<span v-if="info.pushMethod.includes(2)">
{{ info.pushTellTypeTrans }}
<span v-if="info.pushTellType == 1">{{ baseInfo.telephone }}</span>
<span v-if="info.pushTellType == 2">
{{ baseInfo.contactRelation1Trans || '-' }}
{{ baseInfo.contactName1 || '-' }}
{{ baseInfo.contactPhone1 }}
</span>
</span>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</div>
</template>
<script>
import { showNotify } from 'vant'
import { getVisitById } from '@/tumour/api/visit.js'
import { getInspectCode } from '@/tumour/api/screening.js'
import { fetchDataHandle } from '@/utils/common.js'
import DocNavBar from '@/components/docNavBar/DocNavBar.vue'
import ImagePreview from '@/components/imagePreview/ImagePreview.vue'
import Mp3 from '@/components/mediaPlay/Mp3.vue'
import Mp4 from '@/components/mediaPlay/Mp4.vue'
// http://192.168.1.108:8086/#/tumour/visit/detail?id=233095&embed=wx
const DefaultCollapseList = [
{ title: '居民信息', name: '1' },
{ title: '随访信息', name: '2' },
{ title: '随访内容', name: '3' },
{ title: '随访内容', name: '1' },
{ title: '检验项目', name: '2' },
{ title: '检查项目', name: '3' },
{ title: '肿瘤信息', name: '4' },
{ title: '疗效评估', name: '5' },
{ title: '健康指导', name: '6' },
{ title: '健康宣教', name: '7' },
{ title: '催检', name: '8' },
{ title: '推送渠道', name: '9' }
{ title: '催检', name: '8' }
]
export default {
......@@ -366,23 +382,10 @@ export default {
data() {
return {
info: {},
activeCollapse: [],
// 检验配置项
inspectCode: [],
activeCollapse: ['1'],
collapseList: [],
// 全部展开、收起
collapseAll: false,
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderTrans' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'age' },
{ title: '民族', key: 'nationalTrans' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeTrans' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeTrans' },
{ title: '详细地址', key: 'permanentAddress' }
],
activeMediaUrl: null
}
},
......@@ -428,7 +431,8 @@ export default {
return fetchDataHandle(visitContent, {
familySpecies: 'strToArrNum',
foodState: 'strToArrNum',
treatItem: 'strToArrNum'
treatItem: 'strToArrNum',
symptom: 'strToArrNum'
})
},
//诊断
......@@ -443,9 +447,32 @@ export default {
efficacyInfo() {
return this.info.visitCurativeEffect || {}
},
// 检查
visitCheckList() {
return this.info.visitCheckList || []
},
// 检验
visitInspectionList() {
const inspectionList = this.info.visitInspectionList || []
const insItem = this.info?.inspectionProject || []
inspectionList.forEach(e => {
const temp = this.inspectCode.find(i => i.itemCode === e.itemCode) || {}
e.unit = temp.unit
})
return insItem.map(val => {
const items = inspectionList.filter(e => e.insType === val)
if (!items.length) return {}
return {
insName: items[0].insName,
insType: val.value,
items: [...items]
}
})
}
},
created() {
document.title = '随访详情'
document.documentElement.style.setProperty('--van-primary-color', '#54CCBD')
if (!this.id) {
showNotify({ type: 'warning', message: '未获取到患者信息', duration: 0 })
return
......@@ -463,136 +490,173 @@ export default {
visitType: 'strToArrNum',
drinkDayType: 'strToArrNum',
pushMethod: 'strToArrNum',
checkProject: 'strToArrNum',
inspectionProject: 'strToArrNum'
})
console.log('this.info', this.info)
const exclude = []
if (!this.visitType.includes(1)) { exclude.push('3') }
if (this.info.isTumour != 1) { exclude.push('4') }
if (this.info.isCurativeEffect != 1) { exclude.push('5') }
if (!this.visitType.includes(1)) { exclude.push('1') } // 随访内容
if (!this.visitInspectionList.length) { exclude.push('2') } // 检验
if (!this.visitCheckList.length) { exclude.push('3') } // 检查
if (this.info.isTumour != 1) { exclude.push('4') } // 肿瘤信息
if (this.info.isCurativeEffect != 1) { exclude.push('5') } // 疗效评估
if (!this.visitType.includes(2)) { exclude.push('6') }
if (!this.visitType.includes(3)) { exclude.push('7') }
if (!this.visitType.includes(4)) { exclude.push('8') }
if (!this.info.pushMethod.length) { exclude.push('9') }
this.collapseList = DefaultCollapseList.filter(e => !exclude.includes(e.name))
})
},
// 折叠面板切换
collapseChange(val) {
// console.log(val, this.activeCollapse)
if (val && val.length <= 2) {
this.activeCollapse = val.slice(val.length - 1)
} else {
if (this.activeCollapse.length > val.length) {
this.activeCollapse = val
}
if (this.activeCollapse.length < val.length) {
this.activeCollapse = val.slice(val.length - 1)
}
}
if (val && val.length === this.collapseList.length) {
this.collapseAll = true
} else {
this.collapseAll = false
getInspectCode().then(res => {
this.inspectCode = res.data || []
})
setTimeout(() => {
console.log('setTimeout', this.visitInspectionList, this.visitCheckList)
}, 3000);
}
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
this.activeCollapse = this.collapseList.map(e => e.name)
}
this.collapseAll = !this.collapseAll
}
}
}
</script>
<style lang="less" scoped>
.base-info {
background: linear-gradient(to bottom, #DFF5F4 , #fff 50%);
color: #8c8c8c;
.name {
font-weight: 600;
color: #000;
font-size: 18px;
}
.top-label {
line-height: 22px;
}
.color-b {
color: #262626;
}
:root:root {
--van-primary-color: #54CCBD;
}
.visit-detail {
background: linear-gradient(to bottom, #DEF6FF, #DEF6FF59) no-repeat top/100% 340px,
linear-gradient(to bottom, #DEF6FF59, #eff2f7) no-repeat 0 340px/100%;
}
.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;
}
.notice {
background-color: #F5FCFF;
}
.collapse-head {
.icon-down {
vertical-align: middle;
font-size: .12rem;
.svg-icon {
transition: all .2s;
}
}
.icon-down-expanded {
.svg-icon {
transform: rotate(-180deg);
.resident-info {
padding: 24px 28px 0 28px;
position: relative;
.visit-unit {
position: relative;
font-size: 18px;
max-width: 230px;
word-break: break-all;
z-index: 2;
}
img {
width: 84px;
position: absolute;
top: calc(50% + 10px);
right: 24px;
transform: translateY(-50%);
}
}
.info-item {
display: flex;
justify-content: space-between;
padding: 4px 0;
}
.info-item-block {
background: #F8FAFC;
color: #4D5665;
font-size: 13px;
.visit-items {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 8px;
.visit-item {
background-color: #EDFAFF;
border-radius: 4px;
}
}
// 折叠面板
:deep(.doc-collapse) {
margin-top: .1rem;
&::after {
display: none;
}
.van-cell {
padding: .1rem 0;
color: #8C8C8C;
font-weight: 600;
background: transparent;
&::after {
display: none;
.left-icon {
font-size: 20px;
margin-right: 10px;
}
.svg-icon {
font-size: .12rem;
transition: all .2s;
.right-icon {
font-size: 10px;
}
.van-collapse-item__title {
display: flex;
align-items: center;
}
.van-collapse-item {
.van-collapse-item__content {
padding: 0;
color: #262626;
.van-cell__title {
font-size: 16px;
}
.van-collapse-item {
border-radius: 8px;
background-color: #fff;
margin-top: 8px;
&::after {
display: none;
}
}
.van-cell {
background-color: transparent;
padding: 8px 12px;
}
.van-collapse-item__content {
background-color: transparent;
padding: 12px;
padding-top: 8px;
color: #262626;
font-size: 14px;
}
// 展开
.van-collapse-item__title--expanded {
.svg-icon {
.right-icon {
transform: rotate(-180deg);
}
}
}
.info-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 4px 0;
}
.panel {
padding: 12px;
border-radius: 8px;
background-color: #fff;
}
.panel-2 {
padding: 4px 12px;
border-radius: 4px;
background-color: #F8FAFC;
}
.sub-title {
font-size: 16px;
display: flex;
align-items: center;
&::before {
content: '';
display: inline-block;
width: 4px;
height: 14px;
background: linear-gradient(to bottom, #80E8FF, #00B6C1);
border-radius: 4px;
margin-right: 4px;
}
}
.black-1 {
color: #2D2D2D;
}
.black-2 {
color: #595959;
}
.black-3 {
color: #56707D;
}
.black-4 {
color: #65889A;
}
.black-5 {
color: #768092;
}
.high-risk-text {
color: #FF0306;
@supports (-webkit-background-clip: text) or (background-clip: text) {
background: linear-gradient(135deg, #FF0306, #FF2F7F);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
}
}
</style>
src/tumour/visit/detail/Detail_.vue 0 → 100644
View file @ 0494c808
<template>
<div class="h-full flex flex-col visit-detail">
<DocNavBar home v-if="embed !== 'wx'">
随访详情
</DocNavBar>
<div class="px-4 py-3 flex shrink-0 base-info">
<div class="flex w-full">
<div class="grow flex flex-col justify-between">
<div class="flex justify-between">
<span class="name">{{ baseInfo.residentName || '-' }}</span>
</div>
<div class='top-label'>
<div class='mt-3 flex'>
<div><span>随访方式：</span><span class='color-b'>{{ info.visitModeTrans }}</span></div>
<div class='ml-4'>随访日期：<span class='color-b'>{{ info.visitDate }}</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 mt-2'>
<span class='text-16 font-semibold'>全部内容</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 :model-value="activeCollapse" ref='collapse' class='doc-collapse'
@change='collapseChange'>
<van-collapse-item v-for="item in collapseList" :key='item.name'
:title='item.title' :name='item.name'>
<template #right-icon>
<doc-icon type='doc-down' />
</template>
<!-- 基本信息 -->
<div v-if="item.name === '1'">
<div v-for='item in columnsBase' :key='item.key' class="info-item">
<span class='shrink-0 mr-2'>{{ item.title }}</span>
<span v-if="item.key === 'idCard'">{{ $idCardHide(baseInfo.idCard) || '-'
}}</span>
<span class='text-end' v-else>
<span>{{ baseInfo[item.key] || '-' }}</span>
<span v-if='item.unit' class='ml-1'>{{ item.unit }}</span>
</span>
</div>
</div>
<!-- 随访信息 -->
<div v-if="item.name === '2'">
<div class="info-item" v-if="visitCategory == 2">
<span class='shrink-0 mr-2'>随访人群</span>
<span class='text-end'>{{ info.speciesTrans }}</span>
</div>
<div class="info-item" v-else-if="visitCategory == 1">
<span class='shrink-0 mr-2'>确诊肿瘤</span>
<span class='text-end'>{{ info.diseaseName }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访方式</span>
<span class='text-end'>{{ info.visitModeTrans }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访类型</span>
<span class='text-end'>{{ info.visitTypeTrans }}</span>
</div>
<div class="info-item" v-if="info.lastStatus == 2">
<span class='shrink-0 mr-2'>失访原因</span>
<span class='text-end'>
<span>{{ info.loseReasonTrans }}</span>
<span v-if="info.loseReason == 99" class="ml-2">{{ info.loseReasonOther }}</span>
</span>
</div>
<div class="info-item" v-if="info.lastStatus == 1">
<span class='shrink-0 mr-2'>下次随访日期</span>
<span class='text-end'>{{ info.nextVisitDate }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访日期</span>
<span class='text-end'>{{ info.visitDate }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访单位</span>
<span class='text-end'>{{ info.visitUnitName }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访科室</span>
<span class='text-end'>{{ info.visitDepartName }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访医生</span>
<span class='text-end'>{{ info.visitDoctorName }}</span>
</div>
</div>
<!-- 随访内容 -->
<div v-if="item.name === '3'">
<div class="info-item">
<span class='shrink-0 mr-2'>家族遗传史</span>
<span class='text-end'>{{ visitContent.familyHistory == 1 ? visitContent.familySpeciesTrans : '无' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>是否吸烟</span>
<span class='text-end'>{{ visitContent.smokeStateTrans }}</span>
</div>
<div v-if="visitContent.smokeState != 4" class="info-item-block p-2">
<div v-if="![4].includes(visitContent.smokeState)">吸烟开始年龄: {{ visitContent.smokeAge || '-' }}</div>
<div v-if="[1,2,3].includes(visitContent.smokeState)">最近7天是否吸烟: {{ visitContent.smokeAge || '-' }}</div>
<div v-if="[1,2].includes(visitContent.smokeState)">日吸烟量: {{ visitContent.smokeDay || '-' }}</div>
<div v-if="[1,2].includes(visitContent.smokeState)">目标吸烟量: {{ visitContent.smokeTarget || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>饮酒</span>
<span class='text-end'>
<span>{{ visitContent.drinkStateTrans }}</span>
<span v-if="visitContent.drinkRate = 1">（{{ visitContent.drinkRateTrans }}）</span>
</span>
</div>
<div v-if="[1,2].includes(visitContent.drinkState)" class="info-item-block p-2">
<div>日饮酒量: {{ visitContent.drinkDay || '-' }}<span class="ml-1">ml</span></div>
<div>目标饮酒量: {{ visitContent.drinkTarget || '-' }}<span class="ml-1">ml</span></div>
<div>饮酒种类: {{ visitContent.drinkDayTypeTrans || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>运动</span>
<span class='text-end'>{{ visitContent.sportsStateTrans }}</span>
</div>
<div v-if="visitContent.sportsState == 1" class="info-item-block p-2">
<div>运动强度: {{ visitContent.sportsStrengthTrans || '-' }}</div>
<div>目标运动强度:
<span>{{ visitContent.sportsTargetWeek }}</span>
<span class="ml-1">次/周，</span>
<span>{{ visitContent.sportsTargetMinute }}</span>
<span class="ml-1">分钟/次</span>
</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>饮食</span>
<span class='text-end'>{{ visitContent.foodStateTrans }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>是否复发患者</span>
<span class='text-end'>{{ visitContent.relapseTrans }}</span>
</div>
<div class="info-item" v-if="visitContent.relapse == 1">
<span class='shrink-0 mr-2'>复发时间</span>
<span class='text-end'>{{ visitContent.relapseDate }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>是否转移患者</span>
<span class='text-end'>{{ visitContent.transferTrans }}</span>
</div>
<div class="info-item" v-if="visitContent.transfer == 1">
<span class='shrink-0 mr-2'>转移时间</span>
<span class='text-end'>{{ visitContent.transferDate }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>目前病情</span>
<span class='text-end'>
<span v-if="visitContent.currentCondition == 4">{{ visitContent.currentConditionOther }}</span>
<span v-else>{{ visitContent.currentConditionTrans }}</span>
</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>治疗情况</span>
<span class='text-end'>{{ visitContent.treatSituationTrans }}</span>
</div>
<div class="info-item" v-if="visitContent.treatSituation == 2">
<span class='shrink-0 mr-2'>治疗方式</span>
<span class='text-end'>
<span>{{ visitContent.treatItemTrans }}</span>
<span v-if="visitContent.treatItem.includes(10)" class="ml-2">{{ visitContent.treatItemOther }}</span>
</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>用药不良反应</span>
<span class='text-end'>{{ visitContent.adverseDrugReactionsTrans }}</span>
</div>
<div v-if="visitContent.adverseDrugReactions == 1" class="info-item-block p-2">
<div>不良反应: {{ visitContent.adverseReactions || '-' }}</div>
<div>医生处置: {{ visitContent.doctorDisposal || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>随访情况</span>
<span class='text-end'>{{ visitContent.visitSituation }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>处置意见</span>
<span class='text-end'>{{ visitContent.disposalOpinions }}</span>
</div>
<div class="py-1">图片上传</div>
<ImagePreview :imgList="visitContent.imgUrlList" class="mt-1"
v-if="visitContent.imgUrlList.length"/>
<span v-if="!visitContent.imgUrlList || !visitContent.imgUrlList.length">-</span>
</div>
<!-- 肿瘤信息 -->
<div v-if="item.name === '4'">
<div class="py-1">临床TNM分期</div>
<div class="info-item-block p-2">
<div>T: {{ tumourInfo.clinicalTnmTTrans || '-' }}</div>
<div>N: {{ tumourInfo.clinicalTnmNTrans || '-' }}</div>
<div>M: {{ tumourInfo.clinicalTnmMTrans || '-' }}</div>
</div>
<div class="py-1">病理TNM分期</div>
<div class="info-item-block p-2">
<div>T: {{ tumourInfo.pathologyTnmTTrans || '-' }}</div>
<div>N: {{ tumourInfo.pathologyTnmNTrans || '-' }}</div>
<div>M: {{ tumourInfo.pathologyTnmMTrans || '-' }}</div>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>临床分期</span>
<span class='text-end'>{{ tumourInfo.clinicalStagesTrans || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>病理诊断名称</span>
<span class='text-end'>{{ tumourInfo.diagnosisResultName || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>病理诊断编码</span>
<span class='text-end'>{{ tumourInfo.diagnosisResultCode || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>继发部位</span>
<span class='text-end'>{{ tumourInfo.secondarySite || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>继发部位时间</span>
<span class='text-end'>{{ tumourInfo.secondarySiteDate || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>分子分型</span>
<span class='text-end'>{{ tumourInfo.molecularTypingName || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>分子分型记录时间</span>
<span class='text-end'>{{ tumourInfo.molecularTypingDate || '-' }}</span>
</div>
<div class="py-1">ICD-O-3编码</div>
<div class="info-item-block p-2">
<div>解剖学C: {{ tumourInfo.anatomyCName || '-' }}</div>
<div>形态学M: {{ tumourInfo.morphologyCName || '-' }}</div>
<div>行为: {{ tumourInfo.morphologyMName || '-' }}</div>
<div>分级: {{ tumourInfo.gradeName || '-' }}</div>
</div>
</div>
<!-- 疗效评估 -->
<div v-if="item.name === '5'">
<div class="info-item">
<span class='shrink-0 mr-2'>疗效评估</span>
<span class='text-end'>{{ efficacyInfo.curativeTrans || '-' }}</span>
</div>
<div class="info-item">
<span class='shrink-0 mr-2'>其他评估</span>
<span class='text-end'>{{ efficacyInfo.otherEvaluationsTrans || '-' }}</span>
</div>
<div class="info-item-block p-2" v-if="efficacyInfo?.otherEvaluations?.includes(1)">
<div>NRS疼痛评分</div>
<div>{{ efficacyInfo.nrsPainTrans }}</div>
<div>评分结果: {{ efficacyInfo.nrsPainScore || '-' }} 分</div>
</div>
<div class="info-item-block p-2 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(2)">
<div>痛主诉疼痛分级</div>
<div>{{ efficacyInfo.painTrans }}</div>
<div>评分结果: {{ efficacyInfo.painScore || '-' }} 分</div>
</div>
<div class="info-item-block p-2 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(3)">
<div>肿瘤患者ECOG体力状态评分</div>
<div>{{ efficacyInfo.ceogTrans }}</div>
<div>评分结果: {{ efficacyInfo.ceogScore || '-' }} 分</div>
</div>
<div class="info-item-block p-2 mt-2" v-if="efficacyInfo?.otherEvaluations?.includes(4)">
<div>体能状态评分</div>
<div>{{ efficacyInfo.staminaTrans }}</div>
<div>评分结果: {{ efficacyInfo.staminaScore || '-' }} 分</div>
</div>
</div>
<!-- 健康指导 -->
<div v-if="item.name === '6'">
<div class="info-item-block p-2">
<div v-for="item in guideTextList" class="flex">
<span class="shrink-0">{{item.templateModeTrans}}：</span>
<span class="grow text-wrap">{{ item.templateContent }}</span>
</div>
</div>
</div>
<!-- 健康宣教 -->
<div v-if="item.name === '7'">
<div class="info-item-block p-2" v-if="propagandaTextList.length">
<div v-for="item in propagandaTextList" class="flex">
<span class="shrink-0">{{item.textModeTrans}}：</span>
<span class="grow text-wrap">{{ item.content }}</span>
</div>
</div>
<div class="mt-2" v-if="mp4List.length">
<Mp4 :files="mp4List" :activeMediaUrl="activeMediaUrl"
@play="e => activeMediaUrl = e.annexUrl"/>
</div>
<div class="flex flex-col mt-2" style="row-gap: .06rem;" v-if="mp3List.length">
<Mp3 :file="item" v-for="item in mp3List" :key="item.annexId" :activeMediaUrl="activeMediaUrl"
@play="e => activeMediaUrl = e.annexUrl"/>
</div>
</div>
<!-- 催检 -->
<div v-if="item.name === '8'">
<div class="py-1">催检内容</div>
<div class="info-item-block p-2">
<div>{{ info.urgentInsContent || '-' }}</div>
</div>
</div>
<!-- 推送渠道 -->
<div v-if="item.name === '9'">
<div class="info-item-block p-2">
<span class="mr-2">{{ info.pushMethodTrans }}</span>
<span v-if="info.pushMethod.includes(2)">
{{ info.pushTellTypeTrans }}
<span v-if="info.pushTellType == 1">{{ baseInfo.telephone }}</span>
<span v-if="info.pushTellType == 2">
{{ baseInfo.contactRelation1Trans || '-' }}
{{ baseInfo.contactName1 || '-' }}
{{ baseInfo.contactPhone1 }}
</span>
</span>
</div>
</div>
</van-collapse-item>
</van-collapse>
</div>
</div>
</div>
</template>
<script>
import { showNotify } from 'vant'
import { getVisitById } from '@/tumour/api/visit.js'
import { fetchDataHandle } from '@/utils/common.js'
import DocNavBar from '@/components/docNavBar/DocNavBar.vue'
import ImagePreview from '@/components/imagePreview/ImagePreview.vue'
import Mp3 from '@/components/mediaPlay/Mp3.vue'
import Mp4 from '@/components/mediaPlay/Mp4.vue'
const DefaultCollapseList = [
{ title: '居民信息', name: '1' },
{ title: '随访信息', name: '2' },
{ title: '随访内容', name: '3' },
{ title: '肿瘤信息', name: '4' },
{ title: '疗效评估', name: '5' },
{ title: '健康指导', name: '6' },
{ title: '健康宣教', name: '7' },
{ title: '催检', name: '8' },
{ title: '推送渠道', name: '9' }
]
export default {
components: {
DocNavBar,
ImagePreview,
Mp3,
Mp4
},
data() {
return {
info: {},
activeCollapse: [],
collapseList: [],
// 全部展开、收起
collapseAll: false,
columnsBase: [
{ title: '姓名', key: 'residentName' },
{ title: '证件号码', key: 'idCard' },
{ title: '性别', key: 'genderTrans' },
{ title: '出生日期', key: 'dataBirth' },
{ title: '年龄', key: 'age' },
{ title: '民族', key: 'nationalTrans' },
{ title: '本人电话', key: 'telephone' },
{ title: '现住址', key: 'presentCodeTrans' },
{ title: '详细地址', key: 'nowAddress' },
{ title: '户籍地址', key: 'registeredCodeTrans' },
{ title: '详细地址', key: 'permanentAddress' }
],
activeMediaUrl: null
}
},
computed: {
id() {
return this.$route.query.id
},
embed() {
return this.$route.query.embed
},
baseInfo() {
return this.info.residentsInfo || {}
},
// 随访类型
visitType() {
return this.info.visitType || []
},
// 通用 专病
visitCategory() {
return this.info.visitCategory
},
// 健康指导内容
guideTextList() {
const list = this.info.visitHealthGuideList || []
return list.filter(e => e.templateContent)
},
// 健康宣教
propagandaTextList() {
const list = this.info.visitPublicizeList || []
return list.filter(e => e.type == '1')
},
mp3List() {
const list = this.info.visitPublicizeList || []
return list.filter(e => e.type == '2')
},
mp4List() {
const list = this.info.visitPublicizeList || []
return list.filter(e => e.type == '3')
},
// 随访内容
visitContent() {
const visitContent = this.info.visitContent || {}
return fetchDataHandle(visitContent, {
familySpecies: 'strToArrNum',
foodState: 'strToArrNum',
treatItem: 'strToArrNum'
})
},
//诊断
diagnosisFormInfo() {
return this.info.visitDiagnosisInfoList || []
},
//肿瘤
tumourInfo() {
return this.info.visitTumourInfo || {}
},
//疗效评估
efficacyInfo() {
return this.info.visitCurativeEffect || {}
},
},
created() {
document.title = '随访详情'
if (!this.id) {
showNotify({ type: 'warning', message: '未获取到患者信息', duration: 0 })
return
}
this.load()
},
methods: {
load() {
getVisitById(this.id).then(res => {
this.info = fetchDataHandle(res.data, {
healthPushWay: 'strToArrNum',
publicizePushWay: 'strToArrNum',
urgentPushWay: 'strToArrNum',
publicizeType: 'strToArrNum',
visitType: 'strToArrNum',
drinkDayType: 'strToArrNum',
pushMethod: 'strToArrNum',
})
console.log('this.info', this.info)
const exclude = []
if (!this.visitType.includes(1)) { exclude.push('3') }
if (this.info.isTumour != 1) { exclude.push('4') }
if (this.info.isCurativeEffect != 1) { exclude.push('5') }
if (!this.visitType.includes(2)) { exclude.push('6') }
if (!this.visitType.includes(3)) { exclude.push('7') }
if (!this.visitType.includes(4)) { exclude.push('8') }
if (!this.info.pushMethod.length) { exclude.push('9') }
this.collapseList = DefaultCollapseList.filter(e => !exclude.includes(e.name))
})
},
// 折叠面板切换
collapseChange(val) {
// console.log(val, this.activeCollapse)
if (val && val.length <= 2) {
this.activeCollapse = val.slice(val.length - 1)
} else {
if (this.activeCollapse.length > val.length) {
this.activeCollapse = val
}
if (this.activeCollapse.length < val.length) {
this.activeCollapse = val.slice(val.length - 1)
}
}
if (val && val.length === this.collapseList.length) {
this.collapseAll = true
} else {
this.collapseAll = false
}
},
// 全部展开、收起
toggleAll() {
if (this.collapseAll) {
this.activeCollapse = []
} else {
this.activeCollapse = this.collapseList.map(e => e.name)
}
this.collapseAll = !this.collapseAll
}
}
}
</script>
<style lang="less" scoped>
.base-info {
background: linear-gradient(to bottom, #DFF5F4 , #fff 50%);
color: #8c8c8c;
.name {
font-weight: 600;
color: #000;
font-size: 18px;
}
.top-label {
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);
}
}
}
.info-item {
display: flex;
justify-content: space-between;
padding: 4px 0;
}
.info-item-block {
background: #F8FAFC;
color: #4D5665;
font-size: 13px;
}
// 折叠面板
:deep(.doc-collapse) {
margin-top: .1rem;
&::after {
display: none;
}
.van-cell {
padding: .1rem 0;
color: #8C8C8C;
font-weight: 600;
background: transparent;
&::after {
display: none;
}
.svg-icon {
font-size: .12rem;
transition: all .2s;
}
}
.van-collapse-item {
.van-collapse-item__content {
padding: 0;
color: #262626;
}
&::after {
display: none;
}
}
// 展开
.van-collapse-item__title--expanded {
.svg-icon {
transform: rotate(-180deg);
}
}
}
</style>
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