基础数据表单验证

src/views/BasicsData/cargoInformation/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="cargoInformationForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="货代名称" size="default">
+                <el-form-item
+                  label="货代名称"
+                  size="default"
+                  prop="agentName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.agentName"
                     placeholder="请输入货代名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="货代编码" size="default">
+                <el-form-item
+                  label="货代编码"
+                  size="default"
+                  prop="agentCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.agentCode"
                     placeholder="请输入货代编码"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -207,8 +222,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const cargoInformationForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  cargoInformationForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/containerMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="containerMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="容器名称" size="default">
+                <el-form-item
+                  label="容器名称"
+                  size="default"
+                  prop="containerName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.containerName"
                     placeholder="请输入容器名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="标识符" size="default">
+                <el-form-item
+                  label="标识符"
+                  size="default"
+                  prop="containerCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.containerCode"
                     placeholder="请输入标识符"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -206,8 +221,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const containerMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  containerMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/deployNode/index.vue

@@ -27,10 +27,15 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form :model="tableForm" :rules="formRules" ref="deployNodeForm">
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="名称" size="default">
+                <el-form-item
+                  label="名称"
+                  size="default"
+                  prop="nodeName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.nodeName"
                     placeholder="请输入名称"
@@ -38,7 +43,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="编码" size="default">
+                <el-form-item
+                  label="编码"
+                  size="default"
+                  prop="nodeCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.nodeCode"
                     placeholder="请输入航站名称"
@@ -67,6 +77,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -207,8 +218,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const deployNodeForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  deployNodeForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;
@@ -254,6 +272,6 @@ getQuery();
 </script>
 <style lang="scss" scoped>
 ::v-deep .el-form-item__label {
-  width: 50px;
+  width: 70px;
 }
 </style>

src/views/BasicsData/equipmentMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="equipmentMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="设备名称" size="default">
+                <el-form-item
+                  label="设备名称"
+                  size="default"
+                  prop="deviceName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.deviceName"
                     placeholder="请输入设备名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="设备类型" size="default">
+                <el-form-item
+                  label="设备类型"
+                  size="default"
+                  prop="deviceType"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.deviceType"
                     placeholder="请输入设备类型"
@@ -46,7 +60,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="设备IP" size="default">
+                <el-form-item
+                  label="设备IP"
+                  size="default"
+                  prop="deviceIP"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     type="textarea"
                     v-model="tableForm.deviceIP"
@@ -67,6 +86,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -209,8 +229,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const equipmentMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  equipmentMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/modelMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="modelMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="机型名称" size="default">
+                <el-form-item
+                  label="机型名称"
+                  size="default"
+                  prop="modelName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.modelName"
                     placeholder="请输入机型名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="标识符" size="default">
+                <el-form-item
+                  label="标识符"
+                  size="default"
+                  prop="modelType"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.modelType"
                     placeholder="请输入标识符"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -222,8 +237,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const modelMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  modelMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/shippingSpace/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="shippingSpaceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="舱位名称" size="default">
+                <el-form-item
+                  label="舱位名称"
+                  size="default"
+                  prop="storingName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.storingName"
                     placeholder="请输入舱位名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="舱位编码" size="default">
+                <el-form-item
+                  label="舱位编码"
+                  size="default"
+                  prop="storingCode"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.storingCode"
                     placeholder="请输入舱位编码"
@@ -66,6 +80,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const route = useRoute();
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
@@ -208,8 +223,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const shippingSpaceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  shippingSpaceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;

src/views/BasicsData/specialCargoMaintenance/index.vue

@@ -27,10 +27,19 @@
         @delRemove="delRemove"
       >
         <div class="diacont">
-          <el-form :model="tableForm">
+          <el-form
+            :model="tableForm"
+            :rules="formRules"
+            ref="specialCargoMaintenanceForm"
+          >
             <el-row :gutter="24">
               <el-col>
-                <el-form-item label="类型名称" size="default">
+                <el-form-item
+                  label="类型名称"
+                  size="default"
+                  prop="specialTypeName"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.specialTypeName"
                     placeholder="请输入类型名称"
@@ -38,7 +47,12 @@
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item label="类型编码" size="default">
+                <el-form-item
+                  label="类型编码"
+                  size="default"
+                  prop="specialType"
+                  :rules="formRules.isNotNull"
+                >
                   <el-input
                     v-model="tableForm.specialType"
                     placeholder="请输入类型编码"
@@ -67,6 +81,7 @@ import Minheader from "@/components/minheader/index.vue";
 import Dialog from "@/components/dialog/index.vue";
 import { Query, GeneralDataReception } from "@/api/webApi";
 import { ElMessage } from "element-plus";
+const formRules = useElement().formRules;
 const page = ref<number>(0); //分页参数
 const dataContent = ref<object>({});
 const noMore = ref<Boolean>(false);
@@ -206,8 +221,15 @@ const getQuery = async () => {
   }
 };
 //确认提交
+const specialCargoMaintenanceForm: any = ref(null);
 const submitForm = () => {
-  generalDataReception(tableForm);
+  specialCargoMaintenanceForm.value.validate((valid: any) => {
+    if (valid) {
+      generalDataReception(tableForm);
+    } else {
+      return false;
+    }
+  });
 };
 const resetTable = () => {
   page.value = 0;