xinelu-applet-ui/pagesB/threeHundredAndSixty/threeHundredAndSixty.vue
2024-06-25 18:25:50 +08:00

564 lines
13 KiB
Vue

<template>
<view class="app">
<view class="top">
<u-tabs ref="tabs" :scrollable="false" :list="tabslist" bar-height="6" bar-width="60" active-color='#26A888'
:is-scroll="false" :current="tabscurrent" gutter="50" @change="tabschange"></u-tabs>
</view>
<!-- 健康指数 -->
<view class="health" v-if="tabscurrent==0">
<healthindex></healthindex>
</view>
<!-- 健康处方 -->
<view class="" v-if="tabscurrent==2">
<Prescriptionrecords></Prescriptionrecords>
</view>
<!-- 疾病预警 -->
<view class="disease" v-if="tabscurrent==1">
<image :src="baseurl+ '/profile/weChatPicture/beijing.png'" class="background-image" />
<view class="btnleftalls">
<view class="left">
<view class="btnleftall">
<view class="btnleft" @tap="diseasecv">
<image :src="require('../images/zitikuang.png')" />
<span class="item">脑血管疾病</span>
</view>
</view>
<view class="btnleftall">
<view class="btnleft" @tap="diseaselc">
<image :src="require('../images/zitikuang.png')" />
<span class="item">缺血性心血管疾病风险</span>
</view>
</view>
<view class="btnleftall">
<view class="btnleft" @tap="diseaselu">
<image :src="require('../images/zitikuang.png')" />
<span class="item">肺癌风险</span>
</view>
</view>
<view class="btnleftall">
<view class="btnleft" @tap="diseaseck">
<image :src="require('../images/zitikuang.png')" />
<span class="item">肾功能不全风险</span>
</view>
</view>
</view>
<view class="btnright">
<image :src="baseurl+ '/profile/weChatPicture/renti.png'" />
</view>
</view>
</view>
<!-- 心血管 -->
<u-popup v-model="lookopen" mode="center" border-radius="30" :closeable='true'>
<view class="popuptitle">未来十年心血管发病风险:
{{lcdEvaRecord.riskLevel==1?'低危':''}}
{{lcdEvaRecord.riskLevel==2?'中危':''}}
{{lcdEvaRecord.riskLevel==3?'高危':''}}
</view>
<view style="font-size: 30rpx;">
危险因素:
</view>
<u-table>
<u-tr>
<u-th>危险因素</u-th>
<u-th>结果</u-th>
<u-th>参考值</u-th>
</u-tr>
<u-tr>
<u-td>年龄</u-td>
<u-td v-if="lcdEvaRecord.age">{{lcdEvaRecord.age}}</u-td>
<u-td v-else></u-td>
<u-td>-</u-td>
</u-tr>
<u-tr>
<u-td>糖尿病病史</u-td>
<u-td v-if="lcdEvaRecord.disChd">
{{lcdEvaRecord.disChd==1?'有':''}}
{{lcdEvaRecord.disChd==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>BMI</u-td>
<u-td v-if="lcdEvaRecord.bmi">{{lcdEvaRecord.bmi}}</u-td>
<u-td v-else></u-td>
<u-td>
大于等于18.5小于等于24
</u-td>
</u-tr>
<u-tr>
<u-td>总胆固醇</u-td>
<!-- <u-td>{{cvdEvaRecord.tc}}</u-td> -->
<u-td v-if="lcdEvaRecord.tc">{{lcdEvaRecord.tc}}</u-td>
<u-td v-else></u-td>
<u-td> 小于5.18mmol/L</u-td>
</u-tr>
<u-tr>
<u-td>收缩压</u-td>
<u-td v-if="lcdEvaRecord.sbp">{{lcdEvaRecord.sbp}}</u-td>
<u-td v-else></u-td>
<u-td>小于140mmHg</u-td>
</u-tr>
<u-tr>
<u-td>吸烟情况</u-td>
<u-td v-if="lcdEvaRecord.smoke">
{{lcdEvaRecord.smoke==0?'不吸烟':''}}
{{lcdEvaRecord.smoke==1?'偶尔吸烟':''}}
{{lcdEvaRecord.smoke==2?'经常吸烟':''}}</u-td>
<u-td v-else></u-td>
<u-td>不吸烟</u-td>
</u-tr>
</u-table>
</u-popup>
<!-- 脑血管 -->
<u-popup v-model="open" mode="center" border-radius="30" :closeable='true'>
<view class="popuptitle">未来十年脑血管发病风险:
{{cvdEvaRecord.riskLevel==1?'低危':''}}
{{cvdEvaRecord.riskLevel==2?'中危':''}}
{{cvdEvaRecord.riskLevel==3?'高危':''}}
</view>
<view style="font-size: 30rpx;">
危险因素:
</view>
<u-table>
<u-tr>
<u-th>危险因素</u-th>
<u-th>结果</u-th>
<u-th>参考值</u-th>
</u-tr>
<u-tr>
<u-td>年龄</u-td>
<u-td v-if="cvdEvaRecord.age">{{cvdEvaRecord.age}}</u-td>
<u-td v-else></u-td>
<u-td>-</u-td>
</u-tr>
<u-tr>
<u-td>冠心病病史</u-td>
<u-td v-if="cvdEvaRecord.disChd">
{{cvdEvaRecord.riskLevel==1?'有':''}}
{{cvdEvaRecord.riskLevel==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>脑血管疾病家族史</u-td>
<u-td v-if="cvdEvaRecord.famDisCvd">
{{cvdEvaRecord.famDisCvd==1?'有':''}}
{{cvdEvaRecord.famDisCvd==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>BMI</u-td>
<u-td v-if="cvdEvaRecord.bmi">{{cvdEvaRecord.bmi}}</u-td>
<u-td v-else></u-td>
<u-td>
大于等于18.5小于等于24
</u-td>
</u-tr>
<u-tr>
<u-td>总胆固醇</u-td>
<!-- <u-td>{{cvdEvaRecord.tc}}</u-td> -->
<u-td v-if="cvdEvaRecord.tc">{{cvdEvaRecord.tc}}</u-td>
<u-td v-else></u-td>
<u-td> 小于5.18mmol/L</u-td>
</u-tr>
<u-tr>
<u-td>收缩压</u-td>
<u-td v-if="cvdEvaRecord.sbp">{{cvdEvaRecord.sbp}}</u-td>
<u-td v-else></u-td>
<u-td>小于140mmHg</u-td>
</u-tr>
<u-tr>
<u-td>吸烟情况</u-td>
<u-td v-if="cvdEvaRecord.smoke">
{{cvdEvaRecord.smoke==0?'不吸烟':''}}
{{cvdEvaRecord.smoke==1?'偶尔吸烟':''}}
{{cvdEvaRecord.smoke==2?'经常吸烟':''}}</u-td>
<u-td v-else></u-td>
<u-td>不吸烟</u-td>
</u-tr>
<u-tr>
<u-td>饮酒情况</u-td>
<u-td v-if="cvdEvaRecord.smoke">
{{cvdEvaRecord.drink==0?'不饮酒':''}}
{{cvdEvaRecord.drink==1?'偶尔饮酒':''}}
{{cvdEvaRecord.drink==2?'经常饮酒':''}}</u-td>
<u-td v-else></u-td>
<u-td>不饮酒</u-td>
</u-tr>
</u-table>
</u-popup>
<!-- 肺癌 -->
<u-popup v-model="openfeiai" mode="center" border-radius="30" :closeable='true'>
<view class="popuptitle">未来十年肺癌发病风险:
{{lucaEvaRecord.riskLevel==1?'低危':''}}
{{lucaEvaRecord.riskLevel==2?'中危':''}}
{{lucaEvaRecord.riskLevel==3?'高危':''}}
</view>
<view style="font-size: 30rpx;">
危险因素:
</view>
<u-table>
<u-tr>
<u-th>危险因素</u-th>
<u-th>结果</u-th>
<u-th>参考值</u-th>
</u-tr>
<u-tr>
<u-td>肺癌家族史</u-td>
<u-td v-if="lucaEvaRecord.famDisLuca">
{{lucaEvaRecord.famDisLuca==1?'有':''}}
{{lucaEvaRecord.famDisLuca==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>慢支炎/肺气肿疾病史</u-td>
<u-td v-if="lucaEvaRecord.disCopd">
{{lucaEvaRecord.disCopd==1?'有':''}}
{{lucaEvaRecord.disCopd==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>吸烟情况</u-td>
<u-td v-if="lucaEvaRecord.smoke">
{{lucaEvaRecord.smoke==0?'不吸烟':''}}
{{lucaEvaRecord.smoke==1?'偶尔吸烟':''}}
{{lucaEvaRecord.smoke==2?'经常吸烟':''}}</u-td>
<u-td v-else></u-td>
<u-td>不吸烟</u-td>
</u-tr>
</u-table>
</u-popup>
<!-- 肾功能不全 -->
<u-popup v-model="lookopenck" mode="center" border-radius="30" :closeable='true'>
<view class="popuptitle">未来十年肾功能不全发病风险:
{{ckdEvaRecord.riskLevel==1?'低危':''}}
{{ckdEvaRecord.riskLevel==2?'中危':''}}
{{ckdEvaRecord.riskLevel==3?'高危':''}}
</view>
<view style="font-size: 30rpx;">
危险因素:
</view>
<u-table>
<u-tr>
<u-th>危险因素</u-th>
<u-th>结果</u-th>
<u-th>参考值</u-th>
</u-tr>
<u-tr>
<u-td>肾脏疾病家族史</u-td>
<u-td v-if="ckdEvaRecord.famDisKd">
{{ckdEvaRecord.famDisKd==1?'有':''}}
{{ckdEvaRecord.famDisKd==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>高血压疾病史</u-td>
<u-td v-if="ckdEvaRecord.disHbp">
{{ckdEvaRecord.disHbp==1?'有':''}}
{{ckdEvaRecord.disHbp==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>糖尿病疾病史</u-td>
<u-td v-if="ckdEvaRecord.disDm">
{{ckdEvaRecord.disDm==1?'有':''}}
{{ckdEvaRecord.disDm==0?'无':''}}</u-td>
<u-td v-else></u-td>
<u-td>无</u-td>
</u-tr>
<u-tr>
<u-td>吸烟情况</u-td>
<u-td v-if="ckdEvaRecord.smoke">
{{ckdEvaRecord.smoke==0?'不吸烟':''}}
{{ckdEvaRecord.smoke==1?'偶尔吸烟':''}}
{{ckdEvaRecord.smoke==2?'经常吸烟':''}}</u-td>
<u-td v-else></u-td>
<u-td>不吸烟</u-td>
</u-tr>
<u-tr>
<u-td>饮酒情况</u-td>
<u-td v-if="ckdEvaRecord.drink">
{{ckdEvaRecord.drink==0?'不饮酒':''}}
{{ckdEvaRecord.drink==1?'偶尔饮酒':''}}
{{ckdEvaRecord.drink==2?'经常饮酒':''}}</u-td>
<u-td v-else></u-td>
<u-td>不吸烟</u-td>
</u-tr>
</u-table>
</u-popup>
<u-toast ref="uToast" />
</view>
</template>
<script>
import {
riskWarning,
} from '@/api/pagesB/threeHundredAndSixty/threeHundredAndSixty.js'
import Prescriptionrecords from '../Prescriptionrecords/Prescriptionrecords.vue'
import Healthindex from '../Healthindex/Healthindex.vue'
import baseurl from '@/api/baseurl.js'
export default {
components: {
Prescriptionrecords,
Healthindex
},
data() {
return {
baseurl: '',
lookopen: false,
open: false,
openfeiai: false,
lookopenck: false,
chartData: {},
tabscurrent: 0,
tabslist: [{
name: '健康指数',
orderStatus: '',
}, {
name: '疾病预警',
orderStatus: 'WAIT_PAY',
}, {
name: '健康处方',
orderStatus: 'WAIT_RECEIVED_GOODS',
}],
datalist: null,
identity: '',
cvdEvaRecord: {},
lcdEvaRecord: {},
ckdEvaRecord: {},
lucaEvaRecord: {},
};
},
onLoad() {
this.baseurl = baseurl
},
onReady() {},
methods: {
goodsOrderinfo() {
this.identity = uni.getStorageSync('userinfo').cardNo
riskWarning(this.identity).then(res => {
if (res.code == 200) {
this.cvdEvaRecord = res.data.cvdEvaRecord
this.lucaEvaRecord = res.data.lucaEvaRecord
this.lcdEvaRecord = res.data.lcdEvaRecord
this.ckdEvaRecord = res.data.ckdEvaRecord
} else {
this.$refs.uToast.show({
title: res.msg,
type: 'error'
})
}
})
},
// 脑
diseasecv(item) {
if (this.cvdEvaRecord) {
this.open = true
} else {
this.$refs.uToast.show({
title: '暂无内容',
type: 'error'
})
}
},
// 心
diseaselc() {
if (this.lcdEvaRecord) {
this.lookopen = true
} else {
this.$refs.uToast.show({
title: '暂无内容',
type: 'error'
})
}
},
// 肺癌
diseaselu() {
if (this.lucaEvaRecord) {
this.openfeiai = true
} else {
this.$refs.uToast.show({
title: '暂无内容',
type: 'error'
})
}
},
diseaseck() {
if (this.ckdEvaRecord) {
this.lookopenck = true
} else {
this.$refs.uToast.show({
title: '暂无内容',
type: 'error'
})
}
},
//点击tabs
tabschange(index) {
console.log(index)
this.tabscurrent = index;
if (this.tabscurrent == 1) {
this.goodsOrderinfo();
}
// this.orderTypeList.orderStatus = this.tabslist[index].orderStatus
},
},
}
</script>
<style lang="scss">
::v-deep .u-mode-center-box {
width: 94% !important;
padding: 40rpx 0;
}
.popuptitle {
font-size: 30rpx;
padding: 20rpx 50rpx 30rpx;
text-align: center;
}
.app {
width: 100%;
height: 100vh;
background-repeat: no-repeat;
text-align: center;
font-size: 36rpx;
padding: 0;
.top {
height: 100rpx;
width: 104%;
transform: translateX(-2%);
::v-deep .u-tabs {
width: 100%;
position: fixed;
z-index: 999;
}
::v-deep .u-tabs-scroll-flex {
background: #fff;
}
::v-deep .u-tabs__wrapper__nav__item {
background: #FFFFFF;
}
}
// .healths {
// font-size: 22rpx;
// }
// }
// }
.health_body {
width: 100%;
.healthitem {
text-align: left;
padding: 0 0 40rpx 62rpx;
}
}
.zx {
width: 100%;
height: 300rpx;
// background: red;
}
// }
.disease {
width: 100%;
position: relative;
height: calc(100vh - 100rpx);
z-index: 999;
padding-top: 40rpx;
color: #fff !important;
.background-image {
width: 100%;
height: calc(100vh - 100rpx);
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.btnleftalls {
display: flex;
width: 100%;
}
.left {
display: flex;
flex-wrap: wrap;
width: 30%;
height: 55vh;
}
.btnleftall {
width: 100%;
}
.btnleft {
position: relative;
width: 86%;
height: 160rpx;
text-align: center;
font-size: 20rpx;
margin: 0 auto;
image {
position: absolute;
width: 100%;
height: 160rpx;
left: 0;
top: 0;
}
.item {
display: inline-block;
width: 80%;
line-height: 30rpx;
text-align: center;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
}
.btnright {
height: 55vh;
width: 70%;
image {
width: 100%;
height: 100%;
// position: absolute;
display: inline-block;
// left: 21%;
}
}
}
}
</style>