8/19 dev bug

src/views/system/Sdb/ChargeItem/index.vue

@@ -6,7 +6,13 @@
         <el-card shadow="hover">
           <el-form ref="queryFormRef" :rules="rules" :model="queryParams" :inline="true" @submit.prevent="handleQuery">
             <el-form-item label="项目名称" prop="itemName">
-              <el-input maxlength="20" v-model="queryParams.itemName" placeholder="请输入项目名称" clearable @keyup.enter.prevent="handleQuery" />
+              <el-input
+                maxlength="20"
+                v-model.trim="queryParams.itemName"
+                placeholder="请输入项目名称"
+                clearable
+                @keyup.enter.prevent="handleQuery"
+              />
             </el-form-item>
             <el-form-item>
               <el-button type="primary" @click="handleQuery">搜索</el-button>
@@ -131,12 +137,22 @@ const data = reactive<PageData<ChargeItemForm, ChargeItemQuery>>({
   rules: {
     itemName: [
       {
-        validator: (_: any, value: string | number, callback: (arg0?: Error) => any) => {
-          if (value === '' || value === undefined) {
-            return callback();
+        validator: (_: any, value: string, callback: (error?: Error) => void) => {
+          if (!value || value.trim() === '') {
+            callback();
+            return;
           }
-          return !validator(value, 'fullFilterReg') ? callback() : callback(new Error('请输入正确的项目名称'));
-        }
+
+          // 使用 Character 正则验证(只允许字母、数字、中文、下划线、横线)
+          const isValid = validator(value, 'Character');
+
+          if (!isValid) {
+            callback(new Error('只能输入中文、字母、数字、下划线和横线'));
+          } else {
+            callback();
+          }
+        },
+        trigger: 'blur'
       }
     ]
   }
@@ -159,13 +175,19 @@ const getList = async () => {
 
 /** 搜索按钮操作 */
 const handleQuery = () => {
-  queryParams.value.pageNum = 1;
-  getList();
+  queryFormRef.value.validate((valid: boolean) => {
+    console.log(valid);
+    if (valid) {
+      queryParams.value.pageNum = 1;
+      getList();
+    }
+  });
 };
 
 /** 重置按钮操作 */
 const resetQuery = () => {
   queryFormRef.value?.resetFields();
+  queryParams.value.itemName = undefined;
   handleQuery();
 };