fix:validate

src/i18n/en.ts

@@ -91,6 +91,8 @@ export default {
   passwordChangeFail:'Password change failed',
   confirm:'Confirm',
   cancel:'Cancel',
+  pleaseEnterNumber:'Please enter a number',
+  pleaseEnterValidNumber:'Please enter a valid number',
 
 
 }

src/i18n/es.ts

@@ -91,5 +91,8 @@ export default {
   passwordChangeFail:'Cambio de contraseña fallido',
   confirm:'confirmación',
   cancel:'cancelación',
+  pleaseEnterNumber:'Por favor ingrese un número',
+  pleaseEnterValidNumber:'Por favor ingrese un número válido',
+
 
 }

src/views/pages/rule.vue

@@ -11,7 +11,7 @@
         <Ruleform @getPageData="getPageData" :formData="pageData[2]" />
       </el-tab-pane>
       <el-tab-pane :label="$t('customRoom')" name="customRoom">
-        <el-form :model="formData">
+        <el-form :model="formData" ref="formRef" label-suffix=":">
           <el-form-item>
             <span style="width: 360px;">{{$t('customizeRoom')}}：</span>
           </el-form-item>
@@ -53,6 +53,7 @@ import request from '@/utils/request';
 import { ElMessage } from 'element-plus';
 import i18n from '@/utils/i18n'
 const pageData = ref([{}, {}, {}]);
+const formRef = ref(null)
 const activeName = ref('primaryField')
 const formData = reactive({
   roomNumber: ''
@@ -69,11 +70,15 @@ const getPageData = async () => {
   }
 };
 const handleSubmit = async() => {
-  const res = await request('post', 'admin/updateSystemConfigure', {...formData,roomNumber:'customRoom'})
-  if (res.code === 200) {
-    ElMessage.success(i18n.global.t('successfulOperation'))
-    getPageData()
-  }
+  formRef.value.validate(async (valid)=>{
+    if(valid){
+      const res = await request('post', 'admin/updateSystemConfigure', {...formData,roomNumber:'customRoom'})
+      if (res.code === 200) {
+        ElMessage.success(i18n.global.t('successfulOperation'))
+        getPageData()
+      }
+    }
+  })
 }
 const handleClick = async(tab) => {
   if (tab.paneName === 'customRoom') {

src/views/pages/user.vue

@@ -49,16 +49,21 @@
   </Group>
   <el-dialog 
   :title="$t('topUp')"
+  @close="resetForm"
   v-model="dialogVisible"
   append-to-body
   close-on-click-modal>
   <el-form :model="formData" ref="formRef" label-suffix=":">
-    <el-form-item :label="$t('topUp')">
+    <el-form-item :label="$t('topUp')" prop="coinValue" :rules="[
+      { required: true, message: $t('pleaseEnter'), trigger: 'blur' },
+      { type: 'number', message: $t('pleaseEnterNumber'), trigger: 'blur', transform: (value) => Number(value) },
+      { pattern: /^\d+(\.\d{1,2})?$/, message: $t('pleaseEnterValidNumber'), trigger: 'blur' }
+    ]">
       <el-input v-model="formData.coinValue" :placeholder="$t('pleaseEnter')" clearable ></el-input>
     </el-form-item>
   </el-form>
   <template #footer>
-      <el-button @click="resetForm" size="small">{{ $t('cancel') }}</el-button>
+      <el-button @click="dialogVisible = false" size="small">{{ $t('cancel') }}</el-button>
       <el-button type="primary" @click="submit" size="small">{{ $t('confirm') }}</el-button>
     </template>
 </el-dialog>
@@ -138,12 +143,16 @@ const submit = async() => {
   console.log(rowClone, 'row');
   
   try {
-      const res = await request('post', 'admin/pay/rechargeByHand',{userId:rowClone.id, coin:Number(formData.coinValue)})
-      if (res.code === 200) {
-        resetForm()
+    formRef.value.validate(async (valid)=>{
+      if(valid){
+        const res = await request('post', 'admin/pay/rechargeByHand',{userId:rowClone.id, coin:Number(formData.coinValue)})
+        if (res.code === 200) {
+          resetForm()
         ElMessage.success(i18n.global.t('successfulOperation'))
-        feachTableData()
+          feachTableData()
+        }
       }
+    })
   } catch (error) {
     dialogVisible.value = false
   }