暂无数据处理

pages/shengzhangTools/shengzhangTools.vue

@@ -54,7 +54,7 @@
     <view class="test-info-section">
         <view class="test-date-row">
             <text class="label">本次测评日期</text>
-            <view class="date-container">
+            <view class="date-container" @click="showDatePicker">
                 <text class="date-value">2025-06-06</text>
                 <image class="edit-icon" src="/static/shengzhangTool/editIcon.png" mode="aspectFit"></image>
             </view>
@@ -92,8 +92,9 @@
                     <image class="input-bg" src="/static/shengzhangTool/numBg.png" mode="aspectFit"></image>
                     <picker-view
                         class="measurement-picker" 
+                        :class="{ 'measurement-picker-disabled': isHeightTipActive }"
                         :value="heightPickerValue" 
-                        @change="onHeightChange"
+                        @change="isHeightTipActive ? null : onHeightChange"
                         :indicator-style="indicatorStyle"
                     >
                         <picker-view-column>
@@ -108,10 +109,11 @@
             <view class="input-item">
                 <view class="input-container">
                     <image class="input-bg" src="/static/shengzhangTool/numBg.png" mode="aspectFit"></image>
-                    <picker-view 
+                    <picker-view
                         class="measurement-picker" 
+                        :class="{ 'measurement-picker-disabled': isWeightTipActive }"
                         :value="weightPickerValue" 
-                        @change="onWeightChange"
+                        @change="isWeightTipActive ? null : onWeightChange"
                         :indicator-style="indicatorStyle"
                     >
                         <picker-view-column>
@@ -128,8 +130,9 @@
                     <image class="input-bg" src="/static/shengzhangTool/numBg.png" mode="aspectFit"></image>
                     <picker-view 
                         class="measurement-picker" 
+                        :class="{ 'measurement-picker-disabled': isHeadTipActive }"
                         :value="headPickerValue" 
-                        @change="onHeadChange"
+                        @change="isHeadTipActive ? null : onHeadChange"
                         :indicator-style="indicatorStyle"
                     >
                         <picker-view-column>
@@ -145,14 +148,14 @@
 
 		<!-- 底部提示 -->
         <view class="tips-section">
-            <view class="tip-item">
-                <text class="tip-text">暂无数据</text>
+            <view class="tip-item0" @click="toggleHeightTip">
+                <text class="tip-text" :class="{ 'tip-text-active': isHeightTipActive }">暂无数据</text>
             </view>
-            <view class="tip-item">
-                <text class="tip-text">暂无数据</text>
+            <view class="tip-item1" @click="toggleWeightTip">
+                <text class="tip-text" :class="{ 'tip-text-active': isWeightTipActive }">暂无数据</text>
             </view>
-            <view class="tip-item">
-                <text class="tip-text">暂无数据</text>
+            <view class="tip-item2" @click="toggleHeadTip">
+                <text class="tip-text" :class="{ 'tip-text-active': isHeadTipActive }">暂无数据</text>
             </view>
         </view>
     </view>
@@ -251,9 +254,14 @@ const generateRange = (min, max, step = 0.1) => {
     return range
 }
 
+const showDatePicker = () => {
+	console.log('显示日期选择器')
+}
+
 const showFeedingPopup = () => {
     console.log('显示喂养方式弹窗')
     showFeedSwitchPopup.value = true
+	currentFeedIndex.value = 1;//默认选中"母乳+奶粉混合喂养"
 }
 
 // 身高范围 (40-80cm)
@@ -348,6 +356,63 @@ const onFeedChange = (feedOption, index) => {
     // 比如更新 feeding-select 中的文本
 }
 
+// 身高提示状态管理
+const isHeightTipActive = ref(false)
+
+// 处理身高提示点击
+const toggleHeightTip = () => {
+	if(!canClick(0)) return;
+
+	pushCount(0);
+    isHeightTipActive.value = !isHeightTipActive.value
+    console.log('身高提示状态:', isHeightTipActive.value)
+}
+
+// 体重提示状态管理
+const isWeightTipActive = ref(false)
+
+// 处理体重提示点击
+const toggleWeightTip = () => {
+	if(!canClick(1)) return;
+
+	pushCount(1);
+    isWeightTipActive.value = !isWeightTipActive.value
+    console.log('体重提示状态:', isWeightTipActive.value)
+}
+
+// 头围提示状态管理
+const isHeadTipActive = ref(false)
+
+// 处理头围提示点击
+const toggleHeadTip = () => {
+	if(!canClick(2)) return;
+
+	pushCount(2);
+    isHeadTipActive.value = !isHeadTipActive.value
+    console.log('头围提示状态:', isHeadTipActive.value)
+}
+
+const selectCountArr = ref([])
+//数组内存在当前索引可以点击，如果不存在，在判断是不是已经选择两个了，如果已经选择两个，则不能点击
+const canClick = (val)=>{
+	if(selectCountArr.value.indexOf(val) == -1){
+		if(selectCountArr.value.length >= 2){
+			return false
+		}
+		return true
+	}else{
+		return true;
+	}
+}
+
+const pushCount = (val)=>{
+	if(selectCountArr.value.indexOf(val) == -1){
+		selectCountArr.value.push(val)
+	}else{
+		selectCountArr.value.splice(selectCountArr.value.indexOf(val), 1)
+	}
+}
+
 onMounted(() => {
 	
 })
@@ -597,7 +662,10 @@ onMounted(() => {
 							height: 400rpx;
 							background: transparent;
 
-							
+							&.measurement-picker-disabled {
+								opacity: 0.4;
+								pointer-events: none;
+							}
 							
 							.picker-item {
 								display: flex;
@@ -626,14 +694,61 @@ onMounted(() => {
 			.tips-section {
 				display: flex;
 				
-				.tip-item {
+				.tip-item0 {
 					flex: 1;
 					text-align: center;
+					// cursor: pointer;
+					
+					&:hover {
+						opacity: 0.8;
+					}
 					
 					.tip-text {
 						font-size: 24rpx;
 						color: #1d1e26;
 						text-decoration: underline;
+						
+						&.tip-text-active {
+							color: red !important;
+						}
+					}
+				}
+				.tip-item1 {
+					flex: 1;
+					text-align: center;
+					// cursor: pointer;
+					
+					&:hover {
+						opacity: 0.8;
+					}
+					
+					.tip-text {
+						font-size: 24rpx;
+						color: #1d1e26;
+						text-decoration: underline;
+						
+						&.tip-text-active {
+							color: red !important;
+						}
+					}
+				}
+				.tip-item2 {
+					flex: 1;
+					text-align: center;
+					// cursor: pointer;
+					
+					&:hover {
+						opacity: 0.8;
+					}
+					
+					.tip-text {
+						font-size: 24rpx;
+						color: #1d1e26;
+						text-decoration: underline;
+						
+						&.tip-text-active {
+							color: red !important;
+						}
 					}
 				}
 			}