fix: The form must be filled out to trigger verification, and the verification prompt is not eliminated after assignment

Author: shaohuzhang1

ui/src/components/dynamics-form/FormItem.vue

@@ -119,6 +119,7 @@ const to_rule = (rule: any) => {
   }
   return rule
 }
+
 /**
  * 校验
  */
@@ -127,7 +128,7 @@ const rules = computed(() => {
     ? props_info.value.rules.map(to_rule)
     : {
         message: errMsg.value,
-        trigger: 'blur',
+        trigger: ['blur', 'change'],
         required: props.formfield.required === false ? false : true
       }
 })

ui/src/components/dynamics-form/items/radio/RadioCard.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="radio_content" :style="radioContentStyle">
     <el-row :gutter="12" class="w-full">
-      <template v-for="(item,index) in option_list" :key="index">
+      <template v-for="(item, index) in option_list" :key="index">
         <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
           <el-card
             :key="item.value"
@@ -21,9 +21,10 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { computed, ref } from 'vue'
+import { computed, ref, inject } from 'vue'
 import type { FormField } from '@/components/dynamics-form/type'
-import { useFormDisabled } from 'element-plus'
+import { useFormDisabled, formItemContextKey } from 'element-plus'
+
 const inputDisabled = useFormDisabled()
 
 const props = defineProps<{
@@ -37,11 +38,14 @@ const props = defineProps<{
   modelValue?: any
   disabled?: boolean
 }>()
-
+const elFormItem = inject(formItemContextKey, void 0)
 const selected = (activeValue: string | number) => {
   emit('update:modelValue', activeValue)
+  if (elFormItem?.validate) {
+    elFormItem.validate('change')
+  }
 }
-const emit = defineEmits(['update:modelValue'])
+const emit = defineEmits(['update:modelValue', 'change'])
 const width = ref<number>()
 const radioContentStyle = computed(() => {
   if (width.value) {
@@ -55,11 +59,7 @@ const radioContentStyle = computed(() => {
   }
   return {}
 })
-const resize = (wh: any) => {
-  if (wh.height) {
-    width.value = wh.width
-  }
-}
+
 const textField = computed(() => {
   return props.formField.text_field ? props.formField.text_field : 'key'
 })

ui/src/components/dynamics-form/items/radio/RadioRow.vue

@@ -12,9 +12,9 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { computed } from 'vue'
+import { computed, inject } from 'vue'
 import type { FormField } from '@/components/dynamics-form/type'
-import { useFormDisabled } from 'element-plus'
+import { useFormDisabled, formItemContextKey } from 'element-plus'
 const inputDisabled = useFormDisabled()
 const props = defineProps<{
   formValue?: any
@@ -26,9 +26,12 @@ const props = defineProps<{
   // 选中的值
   modelValue?: any
 }>()
-
+const elFormItem = inject(formItemContextKey, void 0)
 const selected = (activeValue: string | number) => {
   emit('update:modelValue', activeValue)
+  if (elFormItem?.validate) {
+    elFormItem.validate('change')
+  }
 }
 const emit = defineEmits(['update:modelValue'])