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.
73 lines
1.4 KiB
73 lines
1.4 KiB
<template>
|
|
<view class="header">
|
|
<view class="flex info">
|
|
<view class="flex label">
|
|
<text>BMI 指数</text>
|
|
<text class="highlight">{{ BMI || '-' }}</text>
|
|
</view>
|
|
<view class="progress">
|
|
<!-- todo: check -->
|
|
<progressBar :progress="BMI" :total="30"></progressBar>
|
|
</view>
|
|
</view>
|
|
<view class="desc">
|
|
* 你的身体质量指数BMI=19.8 kg/m2，属于正常范围，请继续均衡饮食＋合理运动。
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import progressBar from '@/pages_order/components/progressBar.vue';
|
|
|
|
export default {
|
|
components: {
|
|
progressBar,
|
|
},
|
|
props: {
|
|
BMI: {
|
|
type: Number,
|
|
default: null,
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.info {
|
|
column-gap: 32rpx;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.label {
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 36rpx;
|
|
line-height: 1.2;
|
|
color: #252545CC;
|
|
|
|
.highlight {
|
|
margin-left: 8rpx;
|
|
font-size: 64rpx;
|
|
font-weight: 600;
|
|
line-height: 1.4;
|
|
font-family: PingFang SC;
|
|
color: transparent;
|
|
background-image: linear-gradient(to right, #4B348F, #845CFA);
|
|
background-clip: text;
|
|
display: inline-block;
|
|
}
|
|
}
|
|
|
|
.progress {
|
|
width: 222rpx;
|
|
}
|
|
|
|
.desc {
|
|
margin-top: 4rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
line-height: 1.5;
|
|
color: #989898;
|
|
}
|
|
</style>
|