Skip to content

F
frontend-h5
Commit 2c7ea394 authored by gengchunlei's avatar gengchunlei
Browse files
Options

居民端小程序 随访列表样式调整

parent 9dcd3e18
Show whitespace changes
Inline Side-by-side
Showing with 40 additions and 82 deletions
src/residentWX/visit/List.vue
View file @ 2c7ea394
<template> <template>
<div class='h-full flex flex-col visit'> <div class='class="flex flex-col visit-list" style="height: 100vh"'>
<div class="p-3 text-black text-center shrink-0 doc-nav-bar"> <div class="p-3 text-black text-center shrink-0 doc-nav-bar">
<span>慢病筛查记录</span> <span>随访记录</span>
</div> </div>
<van-tabs v-model:active='activeTab' class='shrink-0 ' v-if='tabList.length' <van-tabs v-model:active='activeTab' class='shrink-0 doc-tabs' v-if='tabList.length'
@change='tabChange' @change='tabChange'
shrink> shrink>
<van-tab v-for='item in tabList' :key='item.name' <van-tab v-for='item in tabList' :key='item.name'
:title='item.title' :name='item.name'></van-tab> :title='item.title' :name='item.name'></van-tab>
</van-tabs> </van-tabs>
<div class='grow overflow-y-auto card-list' ref='list'> <div class='grow overflow-y-auto' ref='list'>
<van-pull-refresh v-model='loadingRefresh' @refresh='onRefresh' <van-pull-refresh v-model='loadingRefresh' @refresh='onRefresh'
:disabled='isRefreshDisable'> :disabled='isRefreshDisable'>
<van-list <van-list
...@@ -19,61 +19,36 @@ ...@@ -19,61 +19,36 @@
:immediate-check='false' :immediate-check='false'
@load='onMore' @load='onMore'
> >
<div v-for='item in list' :key='item.id' class='p-4 mt-3 card' @click.stop='toDetail(item)'> <div class="p-2 flex flex-col gap-y-2.5 card-list">
<div class='flex items-center'> <div v-for='item in list' :key='item.id' class='py-3 px-4 card' @click.stop='toDetail(item)'>
<div class='detail-left'> <div>
慢病类型 <span class="label">慢病类型</span>
<span>{{ item.diseaseTypeName }}</span>
</div> </div>
<div class='detail-right'> <div>
{{ item.diseaseTypeName }} <span class="label">随访日期</span>
<span>{{ item.serveDate }}</span>
</div> </div>
<div>
<span class="label">下次随访日期</span>
<span> {{ item.nextVisitDate || '-' }}</span>
</div> </div>
<div class='mt-3 flex items-center'> <div>
<div class='detail-left'> <span class="label">随访医生</span>
随访日期 <span> {{ item.serveDoctorName }}</span>
</div> </div>
<div class='detail-right'> <div>
{{ item.serveDate }} <span class="label">随访方式</span>
<span> {{ item.serveTypeName }}</span>
</div> </div>
<div>
<span class="label">随访机构</span>
<span> {{ item.serveUnitName }}</span>
</div> </div>
<div class='mt-3 flex items-center'>
<div class='detail-left'>
下次随访日期
</div>
<div class='detail-right'>
{{ item.nextVisitDate || '-' }}
</div>
</div>
<div class='mt-3 flex items-center'>
<div class='detail-left'>
随访医生
</div>
<div class='detail-right'>
{{ item.serveDoctorName }}
</div>
</div>
<div class='mt-3 flex items-center'>
<div class='detail-left'>
随访方式
</div>
<div class='detail-right'>
{{ item.serveTypeName }}
</div>
</div>
<div class='mt-3 flex items-center'>
<div class='detail-left'>
随访机构
</div>
<div class='detail-right'>
{{ item.serveUnitName }}
</div>
</div>
<van-divider class='mt-3' />
<span class="tag tag-red" v-show="item.serveType == '1'">高危筛查</span> <span class="tag tag-red" v-show="item.serveType == '1'">高危筛查</span>
<span class="tag tag-blue" v-show="item.serveType == '2'">专病筛查</span> <span class="tag tag-blue" v-show="item.serveType == '2'">专病筛查</span>
</div> </div>
</div>
</van-list> </van-list>
<div class='text-center shrink-0 empty' v-if='!list.length'> <div class='text-center shrink-0 empty' v-if='!list.length'>
<img src='@/assets/image/doctor/empty.png' alt='' style='width: 1.2rem;'> <img src='@/assets/image/doctor/empty.png' alt='' style='width: 1.2rem;'>
...@@ -235,48 +210,30 @@ export default { ...@@ -235,48 +210,30 @@ export default {
</script> </script>
<style lang='less' scoped> <style lang='less' scoped>
@import url('../utils/common.less');
.visit-list {
background-color: #f9f9f9;
}
.card-list { .card-list {
padding-bottom: 76px; padding-bottom: 76px;
} }
.card { .card {
position: relative; position: relative;
background-color: #fff; background-color: #fff;
border-radius: 12px;
.detail-left { >div {
width: 8em; position: relative;
color: #8C8C8C; display: flex;
flex-shrink: 0; margin-bottom: 8px;
&:last-child {
margin-bottom: 0;
} }
.card-bt {
font-size: 14px;
color: #607FF0;
background-color: #F0F3FF;
border: 0;
height: 26px;
} }
.label {
.float-bt { min-width: 6em;
position: absolute; color: #8C8C8C;
top: 10px;
right: 0;
background-color: var(--van-primary-color);
color: #fff;
border-top-left-radius: 40px;
border-bottom-left-radius: 40px;
height: 26px;
line-height: 26px;
} }
} }
.floor {
position: fixed;
bottom: 0;
left: 0;
right: 0;
}
.tag { .tag {
position: absolute; position: absolute;
top: 8px; top: 8px;
...@@ -296,3 +253,4 @@ export default { ...@@ -296,3 +253,4 @@ export default {
background-color: #F0F5FF; background-color: #F0F5FF;
} }
</style> </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