Преглед изворни кода

feat(form): 添加排序字段校验规则并优化报名条件表单结构

- 为分类管理表单添加 `sort` 字段的必填和数字格式校验
-重构赛事管理中报名条件的表单布局,使用 flex 布局提升可读性- 修复起始记分牌数量与道具数量输入框的整数校验逻辑
- 移除冗余注释代码,清理无效样式与属性绑定
- 增强用户输入提示信息,明确校验规则与错误反馈
fugui001 пре 3 месеци
родитељ
комит
c5d6a16ef8

+ 5 - 1
src/views/system/business/category/index.vue

@@ -145,7 +145,11 @@ const data = reactive<PageData<CategoryForm, CategoryQuery>>({
   rules: {
     id: [{ required: true, message: '不能为空', trigger: 'blur' }],
     name: [{ required: true, message: '分类名称不能为空', trigger: 'blur' }],
-    code: [{ required: true, message: '唯一编码,用于前端请求,如 hot/sports不能为空', trigger: 'blur' }]
+    code: [{ required: true, message: '唯一编码,用于前端请求,如 hot/sports不能为空', trigger: 'blur' }],
+    sort: [
+      { required: true, message: '排序不能为空', trigger: 'blur' },
+      { pattern: /^[0-9]*$/, message: '只能输入数字', trigger: 'blur' }
+    ]
   }
 });
 

+ 60 - 5
src/views/system/business/tournaments/index.vue

@@ -294,17 +294,43 @@
             <el-option v-for="dict in tournaments_time" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
           </el-select>
         </el-form-item>
+        <el-form-item label="报名条件" prop="itemsId">
+          <div style="display: flex; align-items: center; gap: 10px; width: 100%">
+            <el-select
+              v-model="form.itemsId"
+              placeholder="请选择道具类型"
+              :disabled="dialog.mode === 'view'"
+              style="flex: 1"
+            >
+              <el-option v-for="item in itemOptions" :key="item.id" :label="item.label" :value="item.id" />
+            </el-select>
 
+            <el-form-item prop="itemsNum" style="margin-bottom: 0; flex: 1">
+              <el-input v-model.number="form.itemsNum" placeholder="数量" :disabled="dialog.mode === 'view'" style="width: 100%" />
+            </el-form-item>
+          </div>
+        </el-form-item>
         <!-- 报名条件 -->
-        <el-form-item label="报名条件" prop="itemsId">
+        <!--        <el-form-item label="报名条件" prop="itemsId">
           <div style="display: flex; align-items: center; gap: 10px">
             <el-select v-model="form.itemsId" placeholder="请选择道具类型" :disabled="dialog.mode === 'view'">
               <el-option v-for="item in itemOptions" :key="item.id" :label="item.label" :value="item.id" />
             </el-select>
-            <el-input v-model="form.itemsNum" :min="1" placeholder="数量" :disabled="dialog.mode === 'view'" />
+            <el-input v-model="form.itemsNum" prop="itemsNum" :min="1" placeholder="数量" :disabled="dialog.mode === 'view'" />
           </div>
-        </el-form-item>
-
+        </el-form-item>-->
+        <!--        <el-form-item label="报名条件">
+          <div style="display: flex; align-items: center; gap: 10px">
+            <el-form-item prop="itemsId" style="margin-bottom: 0">
+              <el-select v-model="form.itemsId" placeholder="请选择道具类型" :disabled="dialog.mode === 'view'">
+                <el-option v-for="item in itemOptions" :key="item.id" :label="item.label" :value="item.id" />
+              </el-select>
+            </el-form-item>
+            <el-form-item prop="itemsNum" style="margin-bottom: 0">
+              <el-input v-model.number="form.itemsNum" placeholder="数量" :disabled="dialog.mode === 'view'"  />
+            </el-form-item>
+          </div>
+        </el-form-item>-->
         <!-- 盲注表 -->
         <el-form-item label="盲注表" prop="blindStructureId">
           <div style="display: flex; align-items: center">
@@ -635,7 +661,6 @@ const loadItemStructuresOptions = async () => {
     console.error('请求出错:', error);
   }
 };
-
 // 下拉选项数据
 const itemOptionsStructuresLevel = ref<{ id: number; label: string }[]>([]);
 
@@ -776,9 +801,39 @@ const data = reactive<PageData<TournamentsForm, TournamentsQuery>>({
       { required: true, message: '起始记分牌数量不能为空', trigger: 'blur' },
       {
         validator: (rule, value, callback) => {
+          // 检查是否为字符串类型且包含非数字字符
+          if (typeof value === 'string' && !/^\d+$/.test(value)) {
+            callback(new Error('起始记分牌数量必须为数字'));
+            return;
+          }
+
           const num = Number(value);
           if (isNaN(num) || num <= 0) {
             callback(new Error('起始记分牌数量必须大于0'));
+          } else if (!Number.isInteger(num)) {
+            callback(new Error('起始记分牌数量必须为整数'));
+          } else {
+            callback();
+          }
+        },
+        trigger: 'blur'
+      }
+    ],
+    itemsNum: [
+      { required: true, message: '数量不能为空', trigger: 'blur' },
+      {
+        validator: (rule, value, callback) => {
+          // 检查是否为字符串类型且包含非数字字符
+          if (typeof value === 'string' && !/^\d+$/.test(value)) {
+            callback(new Error('数量必须为正整数'));
+            return;
+          }
+
+          const num = Number(value);
+          if (isNaN(num) || num <= 0) {
+            callback(new Error('数量必须大于0'));
+          } else if (!Number.isInteger(num)) {
+            callback(new Error('数量必须为整数'));
           } else {
             callback();
           }