184 lines
5.0 KiB
Vue
184 lines
5.0 KiB
Vue
<template>
|
||
<view>
|
||
<view class="" v-if="key_name == 'bodyData'">
|
||
<view class="flx flx_sb flx_ac">
|
||
<view class="flx">
|
||
<view class="">
|
||
<text class="iconfont icon-wode" :style="'font-size:40rpx;color:'+bodyData.BMI.color"></text>
|
||
</view>
|
||
<view class=" " style="margin: 0 10rpx;padding-top: 2rpx;">
|
||
{{ bodyData.BMI.name }}
|
||
</view>
|
||
<view class="" style="font-size: 24rpx;color: #999;padding-top: 6rpx;">
|
||
{{ item.hour_minute }}
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<text class="iconfont icon-right"></text>
|
||
</view>
|
||
</view>
|
||
<view class="flx flx_sb " >
|
||
<view class="" v-for="(v,i) in Object.keys(bodyData)" :key="i" style="width: 100%;margin-top: 20rpx;">
|
||
<view class="flx flx_ac flx_jc">
|
||
<view class="">
|
||
{{ item.data_msg[v] }}
|
||
</view>
|
||
<view class="" style="margin-left: 10rpx;">
|
||
<text :class="'iconfont ' + bodyData[v].icon_key " :style="'font-size:40rpx;color:'+bodyData[v].color"></text>
|
||
</view>
|
||
</view>
|
||
<view class="" style="font-size: 24rpx;color: #999;text-align: center;">
|
||
{{bodyData[v].title}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="" v-if="key_name == 'ECGData'">
|
||
<view class="flx flx_sb flx_ac">
|
||
<view class="flx">
|
||
|
||
<view class=" " style="margin: 0 10rpx;padding-top: 2rpx;">
|
||
<image src="../../static/icon/xinlv.png" style="width: 40rpx;" mode="widthFix"></image>
|
||
</view>
|
||
<view class="" style="font-size: 24rpx;color: #999;padding-top: 6rpx;">
|
||
{{ item.hour_minute }}
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<text class="iconfont icon-right"></text>
|
||
</view>
|
||
</view>
|
||
<view class="flx flx_sb " >
|
||
<view class="" v-for="(v,i) in Object.keys(ECGData)" :key="i" style="width: 100%;margin-top: 20rpx;">
|
||
<view class="flx flx_ac flx_jc">
|
||
<view class="">
|
||
{{ item.data_msg[v] }}
|
||
</view>
|
||
<view class="" style="margin-left: 10rpx; font-size: 24rpx;color: #666;">
|
||
{{ ECGData[v].unit }}
|
||
</view>
|
||
</view>
|
||
<view class="" style="font-size: 24rpx;color: #999;text-align: center;">
|
||
{{ ECGData[v].name }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="" v-if="key_name == 'bloodLiquid'">
|
||
<view class="flx flx_sb flx_ac">
|
||
<view class="flx">
|
||
<!-- <view class="">
|
||
<text class="iconfont icon-wode" :style="'font-size:40rpx;color:'+bodyData.BMI.color"></text>
|
||
</view> -->
|
||
<view class=" " style="margin: 0 10rpx;padding-top: 2rpx;font-size: 24rpx;">
|
||
(毫摩尔/升)
|
||
</view>
|
||
|
||
</view>
|
||
<view class="">
|
||
<view class="" style="font-size: 24rpx;color: #999;padding-top: 6rpx;">
|
||
{{ item.hour_minute }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="flx flx_sb d_box" style="margin-top: 20rpx;">
|
||
<view class="" :style="{backgroundColor:colorArr[0].bgColor,color:colorArr[0].color}">
|
||
{{item.data_msg.cholesterol/100}}
|
||
</view>
|
||
<view class="" :style="{backgroundColor:colorArr[1].bgColor,color:colorArr[1].color}">
|
||
{{item.data_msg.triacylglycerol/100}}
|
||
</view>
|
||
<view class="" :style="{backgroundColor:colorArr[2].bgColor,color:colorArr[2].color}">
|
||
{{item.data_msg.highDensity/100}}
|
||
</view>
|
||
<view class="" :style="{backgroundColor:colorArr[3].bgColor,color:colorArr[3].color}">
|
||
{{item.data_msg.lowDensity/100}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name:"detail_components",
|
||
props:{
|
||
key_name:{
|
||
type:String,
|
||
default:"bodyData"
|
||
},
|
||
item:Object
|
||
},
|
||
data() {
|
||
return {
|
||
bodyData:{
|
||
BMI:{},
|
||
bodyFatPercentage:{},
|
||
muscleRate:{}
|
||
},
|
||
// <view>心率:{{item.data_msg.meanHeartRate}} 次/分</view>
|
||
// <view>HRV：{{item.data_msg.averageHRV}} 毫秒</view>
|
||
// <view>QTc：{{item.data_msg.averageTimeInterval}} 毫秒</view>
|
||
ECGData:{
|
||
meanHeartRate:{
|
||
name:'心率',
|
||
unit:'次/分',
|
||
},
|
||
averageHRV:{
|
||
name:'HRV',
|
||
unit:'毫秒',
|
||
},
|
||
averageTimeInterval:{
|
||
name:'QTc',
|
||
unit:'毫秒',
|
||
}
|
||
},
|
||
colorArr:[
|
||
{
|
||
color:'#46b4ff',
|
||
bgColor:'#e1f3fd'
|
||
},
|
||
{
|
||
color:'#29cf6c',
|
||
bgColor:'#e2fff3'
|
||
},
|
||
{
|
||
color:'#fcc05d',
|
||
bgColor:'#fef5e3'
|
||
},
|
||
{
|
||
color:'#fa4e33',
|
||
bgColor:'#fee5e1'
|
||
}
|
||
]
|
||
};
|
||
},
|
||
mounted() {
|
||
if(this.key_name == 'bodyData'){
|
||
this.bodyData.BMI = this.$utils.getBodyKeyInfo(this.item.data_msg.BMI,'BMI')
|
||
this.bodyData.BMI.title = "BMI"
|
||
this.bodyData.bodyFatPercentage = this.$utils.getBodyKeyInfo(this.item.data_msg.bodyFatPercentage,'bodyFatPercentage')
|
||
this.bodyData.bodyFatPercentage.title = "体脂率"
|
||
this.bodyData.muscleRate = this.$utils.getBodyKeyInfo(this.item.data_msg.muscleRate,'muscleRate')
|
||
this.bodyData.muscleRate.title = "肌肉率"
|
||
}
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.d_box{
|
||
view{
|
||
width: 20%;
|
||
text-align: center;
|
||
border-radius: 20rpx;
|
||
font-size: 26rpx;
|
||
line-height: 40rpx;
|
||
color: #fff;
|
||
}
|
||
view:nth-child(1){
|
||
background-color: red;
|
||
}
|
||
}
|
||
</style> |