新增项目 表单校验

manifest.json

@@ -2,8 +2,8 @@
     "name" : "workload",
     "appid" : "__UNI__2F0D80E",
     "description" : "",
-    "versionName" : "2.0.5",
-    "versionCode" : 205,
+    "versionName" : "2.0.6",
+    "versionCode" : 206,
     "transformPx" : false,
     "app-plus" : {
         /* 5+App特有相关 */

pages/Project/add.vue

@@ -32,7 +32,7 @@
           </view>
         </picker>
       </uni-forms-item>
-      <uni-forms-item label="流程" name="form">
+      <uni-forms-item label="流程" name="flow">
         <picker disabled>
           <view class="select">
             {{
@@ -41,12 +41,16 @@
           </view>
         </picker>
       </uni-forms-item>
-      <uni-forms-item
-        label="行业名称"
-        name="industry"
-        v-show="!formData.type || (formData.type && formData.type.id != 7)"
-        required
-      >
+    </uni-forms>
+    <uni-forms
+      :modelValue="formData"
+      label-position="left"
+      class="form"
+      ref="fullForm"
+      :rules="rules"
+      v-show="!formData.type || (formData.type && formData.type.id != 7)"
+    >
+      <uni-forms-item label="行业名称" name="industry" required>
         <picker
           @change="selectChangeIndustry"
           :range="industryList"
@@ -64,12 +68,7 @@
           </view>
         </picker>
       </uni-forms-item>
-      <uni-forms-item
-        label="项目地区"
-        name="location"
-        v-show="!formData.type || (formData.type && formData.type.id != 7)"
-        required
-      >
+      <uni-forms-item label="项目地区" name="location" required>
         <picker
           mode="multiSelector"
           @columnchange="bindChangeLocationColumn"
@@ -86,12 +85,7 @@
           </view>
         </picker>
       </uni-forms-item>
-      <uni-forms-item
-        label="项目简称"
-        name="name"
-        v-show="!formData.type || (formData.type && formData.type.id != 7)"
-        required
-      >
+      <uni-forms-item label="项目简称" name="name" required>
         <uni-easyinput
           type="text"
           v-model="formData.name"
@@ -100,12 +94,7 @@
           @blur="onChangeName"
         />
       </uni-forms-item>
-      <uni-forms-item
-        label="项目期数"
-        name="version"
-        v-show="!formData.type || (formData.type && formData.type.id != 7)"
-        required
-      >
+      <uni-forms-item label="项目期数" name="version" required>
         <picker
           @change="selectChangeVersion"
           :range="versionList"
@@ -116,11 +105,7 @@
           </view>
         </picker>
       </uni-forms-item>
-      <uni-forms-item
-        label="项目编号"
-        name="code"
-        v-show="!formData.type || (formData.type && formData.type.id != 7)"
-      >
+      <uni-forms-item label="项目编号" name="code">
         <view>
           {{
             `${formData.code.type}-${formData.code.industry}-${formData.code.location}-${formData.code.name}-${formData.code.version}`
@@ -184,10 +169,12 @@ export default {
             },
           ],
         },
+      },
+      fullRules: {
         industry: {
           rules: [
             {
-              required: false,
+              required: true,
               errorMessage: "请选择行业名称",
             },
           ],
@@ -195,7 +182,7 @@ export default {
         location: {
           rules: [
             {
-              required: false,
+              required: true,
               errorMessage: "请选择地区",
             },
           ],
@@ -203,7 +190,7 @@ export default {
         name: {
           rules: [
             {
-              required: false,
+              required: true,
               errorMessage: "请输入项目简称",
             },
             {
@@ -224,7 +211,7 @@ export default {
         version: {
           rules: [
             {
-              required: false,
+              required: true,
               errorMessage: "请选择期数",
             },
           ],
@@ -250,50 +237,63 @@ export default {
     this.init(options);
   },
   onReady() {
-    this.$refs.form.setRules(this.rules);
+    this.$refs.fullForm.setRules(this.fullRules);
   },
   methods: {
+    async submitHelper(full) {
+      let payload = {
+        project_name: this.formData.project_name,
+        type_id: Number(this.formData.type.id),
+        flow_id: Number(this.formData.flow.id),
+        node_id: this.flowList.find((item) => item.id == this.formData.flow.id)
+          .Nodes[0].id,
+      };
+      if (full) {
+        payload = {
+          ...payload,
+          industry_id: Number(this.formData.industry.id),
+          location: this.formData.location.name,
+          location_code: this.formData.location.code,
+          name: this.formData.name,
+          version: this.formData.version + "",
+          project_full_code:
+            this.formData.code.type +
+            this.formData.code.industry +
+            this.formData.code.location +
+            this.formData.code.name +
+            this.formData.code.version,
+        };
+      }
+      if (this.project_id == 0) {
+        await createApproval(payload);
+      } else {
+        payload.id = Number(this.project_id);
+        await updateApproval(payload);
+      }
+      uni.navigateTo({
+        url: "./list",
+      });
+    },
     onHandleSubmit(value) {
       if (value) {
-        this.$refs.form.validate(async (err, formData) => {
-          if (!err) {
-            console.log("success", formData);
-            let payload = {
-              project_name: this.formData.project_name,
-              type_id: Number(this.formData.type.id),
-              flow_id: Number(this.formData.flow.id),
-              node_id: this.flowList.find(
-                (item) => item.id == this.formData.flow.id
-              ).Nodes[0].id,
-            };
-            if (formData.type != 7) {
-              payload = {
-                ...payload,
-                industry_id: Number(this.formData.industry.id),
-                location: this.formData.location.name,
-                location_code: this.formData.location.code,
-                name: this.formData.name,
-                version: this.formData.version + "",
-                project_full_code:
-                  this.formData.code.type +
-                  this.formData.code.industry +
-                  this.formData.code.location +
-                  this.formData.code.name +
-                  this.formData.code.version,
-              };
-            }
-            if (this.project_id == 0) {
-              await createApproval(payload);
-            } else {
-              payload.id = Number(this.project_id);
-              await updateApproval(payload);
-            }
-            uni.navigateTo({
-              url: "./list",
+        this.$refs.form.validate((err) => {
+          if (!this.formData.type || this.formData.type.id != 7) {
+            this.$refs.fullForm.validate((errFull) => {
+              if (!err && !errFull) {
+                this.submitHelper(1);
+              }
             });
+          } else {
+            if (!err) {
+              this.submitHelper(0);
+            }
           }
         });
-      } else uni.navigateTo({ url: "./list" });
+      } else {
+        uni.navigateTo({
+          url: "./list",
+        });
+      }
     },
     async init(options) {
       let res;
@@ -350,14 +350,14 @@ export default {
       }
     },
     binddata(name, value) {
-      this.$refs.form.setValue(name, value);
+      this.$refs.fullForm.setValue(name, value);
     },
     selectChangeType(e) {
       let form = this.formData;
       let code = this.formData.code;
       form.type = this.typeList[e.target.value];
       code.type = form.type.code;
-      this.binddata("type", e.target.value);
+      this.$refs.form.setValue("type", e.target.value);
       if (form.type.id == 7) {
         form.flow = this.flowList.find((item) => item.id == 4);
         form.industry = null;
@@ -404,6 +404,7 @@ export default {
         location.code.length == 4 ? location.code.substr(1) : location.code;
       this.formData.location = location;
       this.formData.code.location = location.code;
+      this.binddata("location", e.target.value);
     },
   },
 };