数字的输入

src/modules/admin/app-deploy/AppDeployControlKey.vue

@@ -6,16 +6,14 @@
       style="width: 100%"
       placeholder="请输入内容"
       clearable
-      @change="dataChange"
+      @input="dataChange"
     ></el-input>
     <el-input
       v-if="keyType === 'number'"
       v-model.number="data"
-      type="number"
       style="width: 140px"
-      :controls="false"
       placeholder="请输入数字"
-      @change="dataChange"
+      @input="dataChange"
     ></el-input>
     <el-radio-group
       v-if="keyType === 'boolean'"

src/modules/admin/app-deploy/ModifyAppDeploy.vue

@@ -44,7 +44,11 @@
       </el-form-item>
 
       <template v-for="cont in DEPLOY_CONTROL_KEYS">
-        <el-form-item :key="cont.code" :label="`${cont.name}：`">
+        <el-form-item
+          :key="cont.code"
+          :label="`${cont.name}：`"
+          :prop="`control.${cont.code}`"
+        >
           <app-deploy-control-key
             v-model="modalForm.control[cont.code]"
             :key-type="cont.type"
@@ -53,7 +57,11 @@
       </template>
       <!-- custom param -->
       <template v-for="cont in customOptions">
-        <el-form-item :key="cont.key" :label="`${cont.name}：`">
+        <el-form-item
+          :key="cont.key"
+          :label="`${cont.name}：`"
+          :prop="`control.custom.${cont.key}`"
+        >
           <app-deploy-control-key
             v-model="modalForm.control.custom[cont.key]"
             :key-type="cont.type"
@@ -135,6 +143,17 @@ export default {
         ],
       },
       customOptions: [],
+      numberValidator: {
+        validator: (rule, value, callback) => {
+          const val = this.getModalFromVal(rule.field);
+          if (isNaN(Number(val))) {
+            callback(new Error("请输入数字"));
+          } else {
+            callback();
+          }
+        },
+        trigger: "change",
+      },
     };
   },
   methods: {
@@ -159,6 +178,9 @@ export default {
           controlVals[cont.code] === false
             ? controlVals[cont.code]
             : defaultVal;
+        if (cont.type === "number") {
+          this.rules[`control.${cont.code}`] = [{ ...this.numberValidator }];
+        }
       });
       this.modalForm.control = control;
 
@@ -172,6 +194,11 @@ export default {
           customVals[cont.key] === false
             ? customVals[cont.key]
             : defaultVal;
+        if (cont.type === "number") {
+          this.rules[`control.custom.${cont.key}`] = [
+            { ...this.numberValidator },
+          ];
+        }
       });
       this.modalForm.control.custom = custom;
 
@@ -184,6 +211,16 @@ export default {
       await this.getCustomParams();
       this.initData(this.instance);
     },
+    getModalFromVal(key) {
+      if (!key) return;
+      const ks = key.split(".");
+      let val = this.modalForm;
+      ks.forEach((k) => {
+        if (!val) return;
+        val = val[k];
+      });
+      return val;
+    },
     cancel() {
       this.modalIsShow = false;
     },