必填字段处理

pages/investigation/task.vue

@@ -32,7 +32,7 @@
 				</view>
 			</view>
 			<view class="formBox" v-if="active === 1">
-				<uni-forms :modelValue="formData" border>
+				<uni-forms :modelValue="formData" border :rules="rules">
 
 					<view class="label-box">
 						<view class="border"></view> 隐患信息
@@ -65,7 +65,7 @@
 					<view class="label-box">
 						<view class="border"></view> {{sectionName}}
 					</view>
-					<uni-forms-item label="道路类型">
+					<uni-forms-item label="道路类型" name="roadType" required label-width="80">
 						<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
 							<input v-if="isEdit" type="text" class="BorderNone Height100 formInput" 
 								v-model="formData.roadType" placeholder="请输入道路类型" @focus="focus" />
@@ -73,7 +73,7 @@
 							<view class="Height100"></view>
 						</view>
 					</uni-forms-item>
-					<uni-forms-item label="道路宽度">
+					<uni-forms-item label="道路宽度" name="roadWidth" required label-width="80">
 						<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
 							<input v-if="isEdit" type="number" class="BorderNone Height100 formInput"
 								v-model="formData.roadWidth" placeholder="请输入道路宽度" @focus="focus" />
@@ -81,12 +81,12 @@
 							<view class="Height100">米</view>
 						</view>
 					</uni-forms-item>
-					<uni-forms-item label="车道数">
+					<uni-forms-item label="车道数" name="laneCount" required label-width="80">
 						<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
 							<input v-if="isEdit" type="number" class="BorderNone Height100 formInput"
 								v-model="formData.laneCount" placeholder="请输入车道数" @focus="focus" />
 							<view class="Height100" v-else>{{ formData.laneCount }}</view>
-							<view class="Height100">辆</view>
+							<view class="Height100">道</view>
 						</view>
 					</uni-forms-item>
 					<uni-forms-item label="路面结构">
@@ -113,7 +113,7 @@
 							<view class="Height100"></view>
 						</view>
 					</uni-forms-item>
-					<uni-forms-item label="设计时速">
+					<uni-forms-item label="设计时速" name="designSpeed" required label-width="80">
 						<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
 							<input v-if="isEdit" type="number" class="BorderNone Height100 formInput"
 								v-model="formData.designSpeed" placeholder="请输入设计时速" @focus="focus" />
@@ -121,7 +121,7 @@
 							<view class="Height100">Km/h</view>
 						</view>
 					</uni-forms-item>
-					<uni-forms-item label="限速">
+					<uni-forms-item label="限速" name="limitSpeed" required label-width="80">
 						<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
 							<input v-if="isEdit" type="number" class="BorderNone Height100 formInput"
 								v-model="formData.limitSpeed" placeholder="请输入限速" @focus="focus" />
@@ -381,9 +381,8 @@
 			<view class="blank" />
 		</view>
 		<bottom-button-two :type="type" v-if="active === 1" @cancel="isEdit = !isEdit" :cancelText="isEdit?'取消':'更改'"
-			@confirm="
-        isEdit = false;
-        active = 2;
+			@confirm="bottomButtonTwo
+       
       " />
 		<bottom-button :type="type" v-else-if="active === 2" :secondText="isEditStep2?'取消':'更改'"
 			@second="isEditStep2 = !isEditStep2" @first="active = 1" @last="active = 3" />
@@ -513,6 +512,18 @@
 					designSpeed: "",
 					limitSpeed: "",
 				},
+				rules: {
+					// 对name字段进行必填验证
+					roadType: {
+						rules: [{
+								required: true,
+								errorMessage: '请选择道路类型',
+							},
+							
+						]
+					},
+					
+				},
 				describe: {
 					bigCategory: "",
 					smallCategory: "",
@@ -1229,6 +1240,25 @@
 					);
 				}
 			},
+			bottomButtonTwo(){
+				if(!this.formData.roadType){
+					return this.$.toast("请输入道路类型");
+				}
+				if(!this.formData.roadWidth){
+					return this.$.toast("请输入道路宽度");
+				}
+				if(!this.formData.laneCount){
+					return this.$.toast("请输入车道数");
+				}
+				if(!this.formData.designSpeed){
+					return this.$.toast("请输入设计时速");
+				}
+				if(!this.formData.limitSpeed){
+					return this.$.toast("请输入限速");
+				}
+				this.isEdit = false;
+				this.active = 2;
+			},
 			submit(temporary) {
 				//查看情况下 直接返回上一页
 				if (this.type == 'view') {
@@ -1828,4 +1858,7 @@
 	.border-top {
 		border-top: 1px #eee solid;
 	}
+	// .uni-forms-item__labe{
+	// 	width: ;
+	// }
 </style>