90 lines
2.4 KiB
Plaintext
90 lines
2.4 KiB
Plaintext
<van-nav-bar
|
||
title="身高SDS计算"
|
||
left-text=""
|
||
left-arrow
|
||
bind:click-left="onClickLeft"
|
||
class="nav-bar custom-nav"
|
||
/>
|
||
|
||
<view class="container">
|
||
<!-- 输入表单 -->
|
||
<view class="form-container">
|
||
<view class="form-group">
|
||
<text class="form-label">年龄（岁）</text>
|
||
<input
|
||
class="form-input"
|
||
type="digit"
|
||
placeholder="请输入年龄"
|
||
bindinput="inputAge"
|
||
value="{{age}}"
|
||
/>
|
||
</view>
|
||
|
||
<view class="form-group">
|
||
<text class="form-label">身高（cm）</text>
|
||
<input
|
||
class="form-input"
|
||
type="digit"
|
||
placeholder="请输入身高"
|
||
bindinput="inputHeight"
|
||
value="{{height}}"
|
||
/>
|
||
</view>
|
||
|
||
<view class="form-group">
|
||
<text class="form-label">性别</text>
|
||
<view class="gender-group">
|
||
<view
|
||
class="gender-item {{gender === 'male' ? 'active' : ''}}"
|
||
bindtap="selectGender"
|
||
data-gender="male"
|
||
>
|
||
男
|
||
</view>
|
||
<view
|
||
class="gender-item {{gender === 'female' ? 'active' : ''}}"
|
||
bindtap="selectGender"
|
||
data-gender="female"
|
||
>
|
||
女
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="button-group">
|
||
<view class="button" bindtap="calculate">计算</view>
|
||
<view class="button secondary" bindtap="reset">重置</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 计算结果 -->
|
||
<view class="result-container" wx:if="{{showResult}}">
|
||
<text class="result-title">计算结果</text>
|
||
|
||
<!-- 计算过程 -->
|
||
<view class="calculation-process">
|
||
<text class="process-title">计算过程：</text>
|
||
<view class="process-steps">
|
||
<text>{{calculationDetails.formula}}</text>
|
||
<text>{{calculationDetails.calculation}}</text>
|
||
<text>{{calculationDetails.difference}}</text>
|
||
<text>{{calculationDetails.result}}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 结果解释 -->
|
||
<view class="result-interpretation">
|
||
<text class="interpretation-text">{{calculationDetails.interpretation}}</text>
|
||
</view>
|
||
|
||
<view class="tips">
|
||
注：本计算结果仅供参考，具体诊断请咨询专业医生。
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 图表展示 -->
|
||
<view class="chart-container" wx:if="{{showResult}}">
|
||
<canvas canvas-id="growthChart" style="width: 100%; height: 100%;"></canvas>
|
||
</view>
|
||
</view>
|