feat(health): 优化血糖记录类型选择交互

- 将血糖类型选择器改为按钮切换样式
- 动态显示血糖类型标签和单位
- 添加 setType 方法用于设置类型索引
- 更新样式以支持新的按钮切换效果
- 调整输入框布局并增加单位显示
- 保留原有 picker 选择逻辑兼容性

src/pages/health/details/blood-glucose.vue

@@ -49,16 +49,20 @@
             </picker>
           </view>
 
-          <view class="form-row">
+          <view class="form-row type-toggle">
             <text class="label">类型</text>
-            <picker mode="selector" :range="types" :value="typeIndex" @change="onTypeChange">
-              <view class="picker-display">{{ types[typeIndex] }}</view>
-            </picker>
+            <view class="type-buttons">
+              <button :class="['type-btn', { active: typeIndex === 0 }]" @click="setType(0)">{{ types[0] }}</button>
+              <button :class="['type-btn', { active: typeIndex === 1 }]" @click="setType(1)">{{ types[1] }}</button>
+            </view>
           </view>
 
           <view class="form-row">
-            <text class="label">血糖 (mmol/L)</text>
-            <input type="number" v-model.number="addGlucose" class="input" placeholder="例如 5.6" />
+            <text class="label">{{ types[typeIndex] }}血糖</text>
+            <view style="display:flex;align-items:center;gap:8px">
+              <input type="number" v-model.number="addGlucose" class="input" :placeholder="`${types[typeIndex]}血糖`" />
+              <text class="unit">mmol/L</text>
+            </view>
           </view>
         </view>
 
@@ -297,6 +301,8 @@ const types = ['空腹', '随机']
 const typeIndex = ref(0)
 const addGlucose = ref<number | null>(null)
 
+function setType(idx: number) { typeIndex.value = idx }
+
 function onTypeChange(e: any) { typeIndex.value = e?.detail?.value ?? e }
 function onRulerUpdate(v: number) { addGlucose.value = Number(v.toFixed ? Number(v.toFixed(1)) : v) }
 function onRulerChange(v: number) { addGlucose.value = Number(v.toFixed ? Number(v.toFixed(1)) : v) }
@@ -355,6 +361,10 @@ function confirmDeleteRecord(id: string) { if (typeof uni !== 'undefined' && uni
 .modal-header { display: flex; align-items: center; justify-content: center; gap: 12rpx; margin-bottom: 6rpx }
 .label { color: #666 }
 .ruler-wrap { margin: 12rpx 0 }
+.type-buttons { display: flex; gap: 12rpx }
+.type-btn { padding: 8rpx 18rpx; border-radius: 12rpx; border: 1rpx solid #eee; background: #fff; color: #333 }
+.type-btn.active { background: #ff6a00; color: #fff; border-color: #ff6a00 }
+.unit { color: #666; font-size: 28rpx }
 .fixed-footer { position: absolute; left: 0; right: 0; bottom: 40rpx; padding: 0 24rpx }
 .btn-full { width: 100%; padding: 18rpx; border-radius: 12rpx; }
 </style>