行政区域 新增数字校验

back/src/views/modules/sys/region-add-or-update.vue

@@ -8,7 +8,7 @@
         <el-input v-model="dataForm.name" :placeholder="$t('region.name')"></el-input>
       </el-form-item>
       <el-form-item prop="id" :label="$t('region.id')">
-        <el-input v-model="dataForm.id" :disabled="!insert" :placeholder="$t('region.id')"></el-input>
+        <el-input v-model="dataForm.id" :disabled="!insert" :placeholder="$t('region.id')" @change="changeId"></el-input>
       </el-form-item>
       <el-form-item prop="sort" :label="$t('region.sort')">
         <el-input-number v-model="dataForm.sort" controls-position="right" :min="0" :label="$t('region.sort')"></el-input-number>
@@ -26,6 +26,7 @@ import debounce from 'lodash/debounce'
 export default {
   data () {
     return {
+      flag: true,
       visible: false,
       insert: true,
       regionList: [],
@@ -60,7 +61,7 @@ export default {
       this.visible = true
       this.dataForm.pid = '0'
       this.$nextTick(() => {
-        this.$refs['dataForm'].resetFields()
+        this.$refs.dataForm.resetFields()
         this.dataForm.id = id
         if (this.dataForm.id) {
           this.insert = false
@@ -68,6 +69,13 @@ export default {
         }
       })
     },
+    changeId (val) {
+      if (val == parseInt(val)) {
+        this.flag = true
+      } else {
+        this.flag = false
+      }
+    },
     // 获取信息
     getInfo () {
       this.$http.get(`/sys/region/${this.dataForm.id}`).then(({ data: res }) => {
@@ -83,10 +91,17 @@ export default {
     },
     // 表单提交
     dataFormSubmitHandle: debounce(function () {
-      this.$refs['dataForm'].validate((valid) => {
+      this.$refs.dataForm.validate((valid) => {
         if (!valid) {
           return false
         }
+        if (!this.flag) {
+          this.$message({
+            message: '区域标识只能为数字！',
+            type: 'warning'
+          })
+          return false
+        }
         this.$http[this.insert ? 'post' : 'put']('/sys/region', this.dataForm).then(({ data: res }) => {
           if (res.code !== 0) {
             return this.$message.error(res.msg)
@@ -102,7 +117,7 @@ export default {
           })
         }).catch(() => {})
       })
-    }, 1000, { 'leading': true, 'trailing': false })
+    }, 1000, { leading: true, trailing: false })
   }
 }
 </script>