You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
295 lines
7.0 KiB
295 lines
7.0 KiB
<template>
|
|
<view class="container" style="height:100vh">
|
|
<view>
|
|
<h1 class="header-h1">{{userInfo.nickName}}</h1>
|
|
<view style="display: flex;justify-content: space-between;align-items: center;margin-bottom: 17px;">
|
|
<h2 class="header-h2">老年健康与医养结合服务</h2>
|
|
<view class="view-export" @click="handleExport">导出</view>
|
|
</view>
|
|
|
|
<view class="view-search">
|
|
<image class="view-search-img" src="./icon_search.png"></image>
|
|
<u-input class='view-search-input' v-model="queryParam.param.name" placeholder="请输入首字母/姓名" />
|
|
</view>
|
|
<!-- 类型查询条件 -->
|
|
<view class="type-search">
|
|
<view :class="queryParam.param.type == 0 ? 'type-search-select':''" @click="handleType(0)">全部({{listNum.totality}}人)</view>
|
|
<view :class="queryParam.param.type == 1 ? 'type-search-select':''" @click="handleType(1)">失能老人({{listNum.disability}}人)</view>
|
|
<view :class="queryParam.param.type == 2 ? 'type-search-select':''" @click="handleType(2)">80岁及以上老人({{listNum.advancedAgeNum}}人)</view>
|
|
</view>
|
|
</view>
|
|
<!-- 列表 -->
|
|
<view style="flex: 1; position: relative;">
|
|
<scroll-view scroll-y="true" :lower-threshold="50" scroll-with-animation @scrolltolower="scrolltolower">
|
|
<view class="view-ul">
|
|
<view class="view-li" v-for="(item,index) in listData" :key="index">
|
|
<view class="view-li-left">
|
|
<!-- 姓名，性别，年龄 -->
|
|
<view class="li-left-header">
|
|
<h1>{{item.name}}</h1>
|
|
<p><span>{{!item.sex ? '男' : '女'}} </span> <b>|</b> <span> {{item.age}}岁</span></p>
|
|
</view>
|
|
<!-- 身份证手机号地址 -->
|
|
<view class="li-left-info">
|
|
<view><image class="left-info-img" src="../../imgs/sfz.png"></image>{{item.idCard}} </view>
|
|
<view><image class="left-info-img" src="../../imgs/sjh.png"></image>{{item.phone}} </view>
|
|
<view style="margin-bottom: 0;"><image class="left-info-img" src="../../imgs/wz.png"></image>{{item.address}} </view>
|
|
</view>
|
|
</view>
|
|
<view class="view-li-iright">
|
|
<view class="li-iright-but" :class="item.snStatus ? 'li-iright-sn':''" @click="handlePatientRegister(item,1)">失能登记</view>
|
|
<view class="li-iright-but" :class="item.gldjStatus ? 'li-iright-gl':''" @click="handlePatientRegister(item,2)" v-if="item.glFlag">高龄登记</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<!-- 新增按钮 -->
|
|
<view class="listadd" @click="handlePatientAdd">
|
|
<image class="listadd-img" src="../../imgs/icon_tianjia.png"></image>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {userInfo,patientQuery,queryNum} from '@/common/api.js';
|
|
export default {
|
|
data() {
|
|
return {
|
|
userInfo:{},
|
|
listData:[
|
|
// {
|
|
// name:'周忠林',
|
|
// sex:0,
|
|
// age:'82',
|
|
// idCard:'142734********0011',
|
|
// phone:'13704551289',
|
|
// address:'郑州市二七教苑小区',
|
|
// },
|
|
],
|
|
queryParam: {
|
|
pageNum: 1,
|
|
pageSize: 20,
|
|
param: {
|
|
name: '',
|
|
type: 0, // 0全部，1失能老人 2 80岁及以上老人
|
|
},
|
|
},
|
|
listNum:{}
|
|
}
|
|
},
|
|
methods: {
|
|
// 查询统计数量
|
|
async getQueryNum(){
|
|
const res = await queryNum()
|
|
if(res.code == 200){
|
|
this.listNum = res.data
|
|
}
|
|
},
|
|
// 获取用户信息
|
|
async getUserInfo(){
|
|
const res = await userInfo()
|
|
if(res.code == 200){
|
|
this.userInfo = res.user
|
|
}
|
|
},
|
|
// 导出
|
|
handleExport(){},
|
|
// 患者登记
|
|
handlePatientRegister(_item,_type){
|
|
uni.navigateTo({ url: `/pages/healthService/healthService?id=${_item.id}&type=${_type}` });
|
|
},
|
|
// 新增患者
|
|
handlePatientAdd(){
|
|
uni.navigateTo({
|
|
url: '/pages/patientAdd/patientAdd'
|
|
})
|
|
},
|
|
// 类型查询
|
|
handleType(_type){
|
|
this.queryParam.param.type = _type
|
|
this.getList(true)
|
|
},
|
|
// 列表数据
|
|
async getList(_type) {
|
|
if (_type) {
|
|
this.listData = [];
|
|
}
|
|
const res = await patientQuery(this.queryParam)
|
|
if (res.code == 200) {
|
|
// 返回数据为空时pageNUm-1
|
|
if (!res.data.list.length && this.queryParam.pageNum > 1) {
|
|
this.queryParam.pageNum--;
|
|
}
|
|
this.listData = [...this.listData, ...res.data.list];
|
|
}
|
|
},
|
|
// 触底加载
|
|
scrolltolower() {
|
|
this.queryParam.pageNum++;
|
|
console.log(this.queryParam.pageNum)
|
|
this.getList()
|
|
},
|
|
},
|
|
created() {
|
|
|
|
},
|
|
onShow() {
|
|
this.getUserInfo()
|
|
this.getList(true)
|
|
this.getQueryNum()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.view-export{
|
|
width: 44px;
|
|
height: 31px;
|
|
line-height: 31px;
|
|
font-size: 10px;
|
|
color: #FFFFFF;
|
|
background: #1B7FEB;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
}
|
|
.listadd{
|
|
position: fixed;
|
|
right: 0px;
|
|
bottom: 20px;
|
|
width: 100px;
|
|
height: 100px;
|
|
.listadd-img{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
.view-li{
|
|
padding: 12px;
|
|
border-radius: 8px 8px 8px 8px;
|
|
background: #FFFFFF;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 14px;
|
|
.view-li-iright{
|
|
.li-iright-but{
|
|
width: 84px;
|
|
height: 31px;
|
|
line-height: 31px;
|
|
text-align: center;
|
|
font-size: 12px;
|
|
border-radius: 15px;
|
|
margin-bottom: 15px;
|
|
border: 1px solid #999999;
|
|
}
|
|
.li-iright-sn{
|
|
color: #1B7FEB;
|
|
background: rgba(27,127,235,0.08);
|
|
border: 1px solid #1B7FEB;
|
|
}
|
|
.li-iright-gl{
|
|
color: #FF981F;
|
|
background: rgba(255,152,31,0.08);
|
|
border: 1px solid #FF981F;
|
|
}
|
|
}
|
|
|
|
.view-li-left{
|
|
flex:1;
|
|
.li-left-info{
|
|
font-size: 12px;
|
|
color: #3D3D3D;
|
|
view{
|
|
margin-bottom: 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.left-info-img{
|
|
width: 20px;
|
|
height: 20px;
|
|
margin-right: 10px;
|
|
}
|
|
}
|
|
.li-left-header{
|
|
display: flex;
|
|
align-items: flex-end;
|
|
margin-bottom: 12px;
|
|
h1{
|
|
font-size: 15px;
|
|
color: #3D3D3D;
|
|
margin-right: 5px;
|
|
}
|
|
p{
|
|
font-size: 12px;
|
|
color: #888888;
|
|
b{
|
|
font-weight: 500;
|
|
margin: 0 5px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.type-search{
|
|
background: #fcf2e6;
|
|
height: 32px;
|
|
line-height: 32px;
|
|
border-radius: 16px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 16px;
|
|
view{
|
|
padding: 0 10px;
|
|
font-size: 12px;
|
|
color: #3D3D3D;
|
|
|
|
}
|
|
.type-search-select{
|
|
background: #FF981F;
|
|
border-radius: 16px;
|
|
color: #fff;
|
|
}
|
|
|
|
}
|
|
.view-search{
|
|
height: 35px;
|
|
line-height: 35px;
|
|
border: 1px solid rgba(255,152,31,0.2);
|
|
background: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 16px;
|
|
.view-search-img{
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-left:10px;
|
|
}
|
|
.view-search-input{
|
|
border: none;
|
|
}
|
|
|
|
}
|
|
.header-h1{
|
|
font-size: 18px;
|
|
color: #3D3D3D;
|
|
margin-bottom: 29px;
|
|
}
|
|
.header-h2{
|
|
font-size: 20px;
|
|
color: #3D3D3D;
|
|
}
|
|
.container{
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-sizing: border-box;
|
|
padding: 46px 16px 20px 16px;
|
|
background: linear-gradient(130deg,#ffe8cc 8%,#fcfcfc,#fcfcfc,#fcfcfc);
|
|
}
|
|
</style>
|
|
<style>
|
|
scroll-view {
|
|
height: 100%;
|
|
position: absolute;
|
|
}
|
|
</style>
|