居民详情列表

src/doctor/Doctor.vue

@@ -52,7 +52,7 @@ export default {
             if (!token) {
                 token = sessionStorage.getItem('token')
                 if (process.env.NODE_ENV !== 'production') {
-                    token = '8f7ab9cb-868b-4fa4-b64a-4a1a11521706'
+                    token = '3a247da4-e163-4e68-80da-4ed81f088ca5'
                 }
             }
             if (token) {

src/doctor/components/checkBtn/CheckBtn.vue

@@ -136,7 +136,12 @@ export default {
 }
 .check-btn[column-2] {
     .check-btn-item {
-        width: calc(50% - 5px)
+        width: calc(50% - 5px);
+    }
+}
+.check-btn[column-1] {
+    .check-btn-item {
+        width: 100%;
     }
 }
 </style>

src/doctor/patientDetail/PatientDetail.vue

@@ -5,13 +5,13 @@
                 <span class="text-primary">新增</span>
             </template>
         </DocNavBar>
-        <div class="grow" style="background: #f5f5f5">
-            <div :class="['px-4 pt-4 doc-list-card resident-info',
+        <div class="grow flex flex-col" style="background: #f5f5f5;min-height: 0px;">
+            <div :class="['px-4 pt-4 doc-list-card resident-info shrink-0',
                 {'resident-info-collapsed': collapsed}]">
                 <div class="mb-4">
-                    <span class="name mr-2">{{ residentInfo.residentName }}</span>
-                    <span class="tag mr-2">{{ residentInfo.currentAge }}岁</span>
-                    <span class="tag mr-2">{{ residentInfo.genderName }}</span>
+                    <span class="name mr-2">{{ residentInfo.residentName || '-' }}</span>
+                    <span class="tag mr-2">{{ residentInfo.currentAge || '-' }}岁</span>
+                    <span class="tag mr-2">{{ residentInfo.genderName || '-' }}</span>
                     <doc-icon type="doc-edit" class="text-primary" />
                 </div>
                 <div class="flex flex-col gap-y-2.5">
@@ -53,6 +53,13 @@
                     <doc-icon type="doc-left-1" />
                 </div>
             </div>
+            <van-tabs shrink v-model:active="activeTab" class="shrink-0 patient-detail-tabs">
+                <van-tab v-for="item in tabList" :key="item.id"
+                    :title="item.name"></van-tab>
+            </van-tabs>
+            <div class="grow py-3 px-2" style="min-height: 0px;">
+                <ScreeningList v-if="activeTabItem.id === 'SCREENING'"/>
+            </div>
         </div>
     </div>
 </template>
@@ -62,23 +69,53 @@ import DocNavBar from '@/doctor/components/docNavBar/DocNavBar.vue'
 import ChronicTag from '@/doctor/components/chronicTag/ChronicTag.vue'
 import { queryResidentInfo } from '@/api/doctor/resident.js'
 import { showNotify } from 'vant'
+import ScreeningList from './components/screening/Index.vue'
 
 export default {
     components: {
         DocNavBar,
-        ChronicTag
+        ChronicTag,
+        ScreeningList
     },
     data() {
         return {
             residentInfo: {},
             // 折叠
-            collapsed: false
+            collapsed: true,
+            // 标签页index
+            activeTab: 0
         }
     },
     computed: {
         residentInfoId() {
             return this.$route.query.residentInfoId
-        }
+        },
+        chronicTagsArray() {
+            const chronicTagsArray = this.residentInfo.chronicTagsArray || ''
+            return chronicTagsArray.split(',')
+        },
+        tabList() {
+             const diseaseList = [
+                { name: '高血压', value: 1, code: '1', id: 'HYPERTENSION' },
+                { name: '糖尿病', value: 3, code: '2', id: 'DIABETE' },
+                { name: '冠心病', value: 4, code: '4', id: 'COPD' },
+                { name: '脑卒中', value: 5, code: '8', id: 'STROKE' },
+                { name: '慢性阻塞性疾病', value: 6, code: '16', id: 'NEPHROPATHY' },
+                { name: '慢性肾病', value: 7, code: '32', id: 'KIDNEY' },
+                { name: '血脂异常', value: 8, code: '64', id: 'DYSLIPEMIA' }
+            ]
+            const result = [
+                { name: '筛查管理', id: 'SCREENING' },
+                ...diseaseList.filter(e => this.chronicTagsArray.includes(e.code)),
+                { name: '通用随访', id: 'CURRENCY' },
+                { name: '转诊记录', id: 'REFERRAL' },
+                { name: '会诊记录', id: 'CONSULTATION' }
+            ]
+            return result
+        },
+        activeTabItem() {
+            return this.tabList[this.activeTab] || {}
+        },
     },
     created() {
         if (!this.residentInfoId) {
@@ -125,4 +162,18 @@ export default {
         transform: rotate(-90deg);
     }
 }
+:deep(.patient-detail-tabs) {
+    .van-tab {
+        color: #262626;
+    }
+    .van-tab--active {
+        color: var(--van-tab-active-text-color);
+        font-weight: 500;
+    }
+    .van-tabs__line {
+        width: 28px;
+        height: 2px;
+        bottom: 22px;
+    }
+}
 </style>

src/doctor/patientDetail/components/screening/Index.vue

+<template>
+    <div class="h-full flex flex-col screening-index">
+        <van-tabs shrink type="card" class="shrink-0 doc-tab-round"
+            v-model:active="activeTab">
+            <van-tab title="筛查记录"></van-tab>
+            <van-tab title="随访记录"></van-tab>
+        </van-tabs>
+        <div class="grow py-3 overflow-y-auto">
+            <ScreenRecordList v-if="activeTab == 0"/>
+            <VisitList v-else-if="activeTab == 1"/>
+        </div>
+        
+    </div>
+</template>
+
+<script>
+import ScreenRecordList from './Record.vue'
+import VisitList from './Visit.vue'
+
+export default {
+    components: {
+        ScreenRecordList,
+        VisitList
+    },
+    data() {
+        return {
+            activeTab: 0
+        }
+    }
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>

src/doctor/patientDetail/components/screening/Record.vue

+<template>
+    <div class="record-list" style="height: 900px">
+        筛查记录
+    </div>
+</template>
+
+<script>
+export default {
+    
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>

src/doctor/patientDetail/components/screening/Visit.vue

+<template>
+    <div class="visit-list" style="height: 900px">
+        随访记录
+    </div>
+</template>
+
+<script>
+export default {
+    
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>