194 lines
4.0 KiB
Vue
194 lines
4.0 KiB
Vue
<template>
|
|
<view>
|
|
<view class="">
|
|
<view class="flx flx_ac" style="background-color: #fff;padding: 30rpx 0 0 30rpx;">
|
|
<view class="">
|
|
<text class="iconfont icon-wode" :style="'font-size: 50rpx;margin-right:10rpx;color:'+bodyDesc.color "></text>
|
|
</view>
|
|
<view class="">
|
|
<text >{{bodyDesc.name}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="" style="position: relative;">
|
|
<image src="../../static/image/body.png" style="width: 100%;" mode="widthFix"></image>
|
|
<view class="left_position postion ">
|
|
<view class="desc_box">
|
|
<view class="flx flx_ac">
|
|
<view class="tt">
|
|
{{ dataInfo.data_msg.basalMetabolicRate }}
|
|
</view>
|
|
<view class="unit" >
|
|
千卡
|
|
</view>
|
|
</view>
|
|
<view class="name">
|
|
基础代谢
|
|
</view>
|
|
</view>
|
|
<view class="desc_box">
|
|
<view class="flx flx_ac">
|
|
<view class="tt">
|
|
{{ dataInfo.data_msg.boneMass }}
|
|
</view>
|
|
<view class="unit" >
|
|
千克
|
|
</view>
|
|
</view>
|
|
<view class="name">
|
|
骨重
|
|
</view>
|
|
</view>
|
|
<view class="desc_box">
|
|
<view class="flx flx_ac">
|
|
<view class="tt">
|
|
{{ dataInfo.data_msg.waterContent }}
|
|
</view>
|
|
<view class="unit" >
|
|
千克
|
|
</view>
|
|
</view>
|
|
<view class="name">
|
|
水分
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="right_position postion">
|
|
<view class="desc_box">
|
|
<view class="flx flx_ac">
|
|
<view class="tt">
|
|
{{ dataInfo.data_msg.fatMass }}
|
|
</view>
|
|
<view class="unit" >
|
|
千克
|
|
</view>
|
|
</view>
|
|
<view class="name">
|
|
脂肪
|
|
</view>
|
|
</view>
|
|
<view class="desc_box" style="margin-bottom: 0;margin-top: 174rpx;">
|
|
<view class="flx flx_ac">
|
|
<view class="tt">
|
|
{{ dataInfo.data_msg.proteinAmount }}
|
|
</view>
|
|
<view class="unit" >
|
|
千克
|
|
</view>
|
|
</view>
|
|
<view class="name">
|
|
蛋白质
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="postion center_posion">
|
|
|
|
</view>
|
|
</view>
|
|
<view class="radius_box" style="padding: 0;margin: 30rpx;">
|
|
<view class="" v-for="(v,i) in arr" :key="i">
|
|
<body_info_components :key_name="v" :value="parseFloat(dataInfo.data_msg[v])"></body_info_components>
|
|
</view>
|
|
</view>
|
|
<view class="" style="height: 40rpx;">
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
export default {
|
|
data() {
|
|
return {
|
|
dataInfo:{},
|
|
bodyDesc:{},
|
|
arr:[
|
|
'BMI',
|
|
'bodyFatPercentage',
|
|
'leanBodyMass',
|
|
'muscleRate',
|
|
'muscleMass',
|
|
'subcutaneousFat',
|
|
'bodyMoisture',
|
|
'skeletalMuscleRate',
|
|
'boneMass',
|
|
'proteinAmount',
|
|
'basalMetabolicRate',
|
|
]
|
|
}
|
|
},
|
|
onLoad() {
|
|
const dataKey = 'bodyData'; // 同上面设置的key
|
|
let get = uni.getStorageSync(dataKey)
|
|
|
|
if(!get){
|
|
uni.showToast({
|
|
title:"读取数据失败"
|
|
})
|
|
setTimeout(() => {
|
|
uni.navigateBack({
|
|
delta:-1
|
|
})
|
|
},2000)
|
|
return
|
|
}
|
|
const data = JSON.parse(get);
|
|
this.dataInfo = data;
|
|
console.log(this.dataInfo)
|
|
// this.getUserInfo()
|
|
this.bodyDesc = this.$utils.getBodyKeyInfo(this.dataInfo.data_msg.BMI,'BMI')
|
|
// uni.removeStorageSync(dataKey);
|
|
},
|
|
computed: {
|
|
...mapGetters({
|
|
getActiceDevice: "api/getActiceDevice"
|
|
})
|
|
},
|
|
methods: {
|
|
getUserInfo(){
|
|
this.$store.dispatch('api/getUserInfo',{
|
|
device_id:this.getActiceDevice.device_id
|
|
}).then(res => {
|
|
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.postion{
|
|
position: absolute;
|
|
}
|
|
.left_position{
|
|
left: 40rpx;
|
|
top:12%
|
|
}
|
|
.right_position{
|
|
right: 40rpx;
|
|
top:15%
|
|
}
|
|
.center_posion{
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
.desc_box{
|
|
margin-bottom: 64rpx;
|
|
.tt{
|
|
font-size: 30rpx;
|
|
font-weight: bold;
|
|
margin-right: 10rpx;
|
|
}
|
|
.unit{
|
|
font-size: 24rpx;
|
|
color: #666;
|
|
}
|
|
.name{
|
|
font-size: 24rpx;
|
|
color: #999;
|
|
}
|
|
}
|
|
</style>
|