fix: 保证家庭成员必填

src/App.vue

@@ -573,42 +573,82 @@
             <div class="form-row-2col">
               <div class="form-col">
                 <div class="item-label">关系 <span style="color: #ee0a24">*</span></div>
-                <div class="custom-input dropdown-input" @click="onFamilyRelationClick(i)">
-                  <span style="color: #323233">{{ fm.relation || '请选择' }}</span>
-                  <van-icon name="arrow-down" color="#969799" size="12" />
-                </div>
+                <van-field
+                  v-model="fm.relation"
+                  :name="`familyMembers.${i}.relation`"
+                  readonly
+                  clickable
+                  class="custom-field dropdown-input"
+                  :rules="[{ required: true, message: `请填写成员${i + 1}的关系` }]"
+                  :border="false"
+                  @click="onFamilyRelationClick(i)"
+                >
+                  <template #right-icon>
+                    <van-icon name="arrow-down" color="#969799" size="12" />
+                  </template>
+                </van-field>
               </div>
               <div class="form-col">
                 <div class="item-label">姓名 <span style="color: #ee0a24">*</span></div>
-                <div class="custom-input">
-                  <input v-model="fm.name" placeholder="姓名" class="native-input" />
-                </div>
+                <van-field
+                  v-model="fm.name"
+                  :name="`familyMembers.${i}.name`"
+                  class="custom-field"
+                  placeholder="姓名"
+                  :rules="[{ required: true, message: `请填写成员${i + 1}的姓名` }]"
+                  :border="false"
+                />
               </div>
             </div>
 
             <!-- Row 2 -->
             <div class="form-item">
               <div class="item-label">出生年月 <span style="color: #ee0a24">*</span></div>
-              <div class="date-input-box" @click="onFamilyBirthClick(i)">
-                <span>{{ fm.birthDate || 'YYYY-MM-DD' }}</span>
-                <van-icon name="calendar-o" color="#969799" />
-              </div>
+              <van-field
+                v-model="fm.birthDate"
+                :name="`familyMembers.${i}.birthDate`"
+                readonly
+                clickable
+                class="custom-field"
+                placeholder="YYYY-MM-DD"
+                :rules="[{ required: true, message: `请选择成员${i + 1}的出生年月` }]"
+                :border="false"
+                @click="onFamilyBirthClick(i)"
+              >
+                <template #right-icon>
+                  <van-icon name="calendar-o" color="#969799" />
+                </template>
+              </van-field>
             </div>
 
             <!-- Row 3 -->
             <div class="form-item">
               <div class="item-label">工作单位及职务 <span style="color: #ee0a24">*</span></div>
-              <div class="custom-input">
-                <input v-model="fm.companyAndJob" placeholder="单位与职务" class="native-input" />
-              </div>
+              <van-field
+                v-model="fm.companyAndJob"
+                :name="`familyMembers.${i}.companyAndJob`"
+                class="custom-field"
+                placeholder="单位与职务"
+                :rules="[{ required: true, message: `请填写成员${i + 1}的工作单位及职务` }]"
+                :border="false"
+              />
             </div>
 
             <!-- Row 4 -->
             <div class="form-item">
               <div class="item-label">联系方式 <span style="color: #ee0a24">*</span></div>
-              <div class="custom-input">
-                <input v-model="fm.contact" type="tel" placeholder="手机号" class="native-input" />
-              </div>
+              <van-field
+                v-model="fm.contact"
+                :name="`familyMembers.${i}.contact`"
+                type="tel"
+                class="custom-field"
+                placeholder="手机号"
+                :rules="[
+                  { required: true, message: `请填写成员${i + 1}的联系方式` },
+                  { pattern: /^1\d{10}$/, message: `成员${i + 1}的手机号格式错误` },
+                ]"
+                :border="false"
+              />
             </div>
 
             <!-- Row 5 -->
@@ -1311,31 +1351,32 @@ async function onSubmit() {
 
   submitting.value = true;
   try {
-    let externalResumeValue = '';
-    if (form.externalResumeItems && form.externalResumeItems.length > 0) {
-      for (const item of form.externalResumeItems) {
-        if (
-          !item.startDate ||
-          !item.endDate ||
-          !item.company ||
-          !item.position
-        ) {
-          showFailToast('个人履历填写不全，请检查！');
-          submitting.value = false;
-          return;
-        }
-        externalResumeValue += `${item.startDate}-${item.endDate} 在${item.company}担任${item.position}职务；\n`;
-      }
+    // 家庭成员最少填写一条，防止列表被清空后绕过校验
+    if (!form.familyMembers || form.familyMembers.length === 0) {
+      showFailToast('请至少填写一名家庭成员');
+      return;
+    }
+    // 外部个人履历最少填写一段，防止列表被清空后绕过校验
+    if (!form.externalResumeItems || form.externalResumeItems.length === 0) {
+      showFailToast('请至少填写一段外部个人履历');
+      submitting.value = false;
+      return;
     }
-    if (form.familyMembers && form.familyMembers.length > 0) {
-      for (const item of form.familyMembers) {
-        if (!item.name || !item.relation || !item.birthDate || !item.companyAndJob || !item.contact) {
-          showFailToast('家庭成员信息不全！');
-          submitting.value = false;
-          return;
-        }
+    let externalResumeValue = '';
+    for (const item of form.externalResumeItems) {
+      if (
+        !item.startDate ||
+        !item.endDate ||
+        !item.company ||
+        !item.position
+      ) {
+        showFailToast('个人履历填写不全，请检查！');
+        submitting.value = false;
+        return;
       }
+      externalResumeValue += `${item.startDate}-${item.endDate} 在${item.company}担任${item.position}职务；\n`;
     }
+    // 家庭成员必填，最少填写一条，由 van-form 各成员字段的 rules 统一校验
     const payload = {
       plateId: form.plateId,
       plate: form.plate,
@@ -1535,17 +1576,6 @@ void [phoneRules, idRules];
   color: #323233;
 }
 
-.native-input {
-  width: 100%;
-  border: none;
-  background: transparent;
-  outline: none;
-  padding: 0;
-  margin: 0;
-  font-size: 16px;
-  color: #323233;
-}
-
 .dropdown-input {
   display: flex;
   justify-content: space-between;