增加验证

src/views/twoweb/service/comDemand/detail.vue

@@ -4,7 +4,7 @@
       <el-col :span="24" class="main">
         <div class="w_1200">
           <el-col :span="24" class="info">
-            <el-form :model="form" :rules="rules" ref="form">
+            <el-form :model="form" :rules="rules" ref="form" label-width="125px">
               <el-col :span="24" class="one">
                 <el-col :span="24" class="title">
                   {{ data.title }}
@@ -48,7 +48,7 @@
                 </el-col>
               </el-col>
               <el-col :span="24" class="btn">
-                <el-button type="primary" size="mini" @click="onSubmit">提交</el-button>
+                <el-button type="primary" size="mini" @click="onSubmit('form')">提交</el-button>
               </el-col>
             </el-form>
           </el-col>
@@ -86,7 +86,43 @@ export default {
         products: [],
         cooperation: [],
       },
-      rules: {},
+      rules: {
+        name: [{ required: true, message: '请输入企业名称', trigger: 'blur' }],
+        address: [{ required: true, message: '请输入通讯地址', trigger: 'blur' }],
+        postal: [{ required: true, message: '请输入邮编', trigger: 'blur' }],
+        web_site: [{ required: true, message: '请输入网址', trigger: 'blur' }],
+        register_type: [{ required: true, message: '请选择', trigger: 'change' }],
+        field: [{ required: true, message: '请选择', trigger: 'change' }],
+        register_time: [{ required: true, message: '请选择', trigger: 'change' }],
+        funds: [{ required: true, message: '请输入注册资金', trigger: 'blur' }],
+        register_address: [{ required: true, message: '请选择', trigger: 'change' }],
+        brief: [{ required: true, message: '请输入企业概况', trigger: 'blur' }],
+        legal_person: {
+          name: [{ required: true, message: '请输入企业法人', trigger: 'blur' }],
+          gender: [{ required: true, message: '请选择', trigger: 'change' }],
+          birth: [{ required: true, message: '请选择', trigger: 'change' }],
+          education: [{ required: true, message: '请选择', trigger: 'change' }],
+        },
+        person_number: [{ required: true, message: '请输入企业职工数', trigger: 'blur' }],
+        bk_number: [{ required: true, message: '请输入本科以上人数', trigger: 'blur' }],
+        research_number: [{ required: true, message: '请输入研究开发人数', trigger: 'blur' }],
+        advanced_number: [{ required: true, message: '请输入高级职称人数', trigger: 'blur' }],
+        contact: [{ required: true, message: '请输入企业联系人', trigger: 'blur' }],
+        contact_tel: [{ required: true, message: '请输入联系电话', trigger: 'blur' }],
+        email: [{ required: true, message: '请输入E-mail', trigger: 'blur' }],
+        qq: [{ required: true, message: '请输入OO', trigger: 'blur' }],
+
+        techol_name: [{ required: true, message: '请输入需求名称', trigger: 'blur' }],
+        urgent: [{ required: true, message: '请选择', trigger: 'change' }],
+        budget: [{ required: true, message: '请输入投资预算', trigger: 'blur' }],
+        cooperation: [{ required: true, message: '请选择', trigger: 'change' }],
+        requirement: {
+          p1: [{ required: true, message: '请输入技术说明', trigger: 'blur' }],
+          p2: [{ required: true, message: '请输入预期目标', trigger: 'blur' }],
+          p3: [{ required: true, message: '请输入合作条件及要求', trigger: 'blur' }],
+          p4: [{ required: false, message: '请输入其他需求', trigger: 'blur' }],
+        },
+      },
     };
   },
   created() {
@@ -102,17 +138,24 @@ export default {
       }
     },
     // 提交
-    async onSubmit() {
-      let data = this.form;
-      let res = await this.create(data);
-      if (this.$checkRes(res, '提交成功', '提交失败')) {
-        let arr = this.form;
-        arr.techol_name = '';
-        arr.urgent = '';
-        arr.cooperation = [];
-        arr.requirement = {};
-        this.$set(this, `form`, arr);
-      }
+    async onSubmit(formName) {
+      this.$refs[formName].validate(async valid => {
+        if (valid) {
+          let data = this.form;
+          let res = await this.create(data);
+          if (this.$checkRes(res, '提交成功,可继续填写企业需求信息', '提交失败')) {
+            let arr = this.form;
+            arr.techol_name = '';
+            arr.urgent = '';
+            arr.cooperation = [];
+            arr.requirement = {};
+            this.$set(this, `form`, arr);
+          }
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
     },
   },
   computed: {

src/views/twoweb/service/comDemand/parts/four.vue

@@ -3,80 +3,78 @@
     <el-row>
       <el-col :span="24" class="main">
         <el-col :span="24" class="one">
-          <el-form :model="form" :rules="rules" ref="form" label-width="110px">
-            <el-col :span="24">
-              <el-form-item label="需求名称" prop="techol_name">
-                <el-input v-model="form.techol_name" placeholder="请输入需求名称"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="紧急程度" prop="urgent">
-                <el-select v-model="form.urgent" placeholder="请选择" style="width:100%">
-                  <el-option v-for="(item, index) in urgentList" :key="index" :label="item" :value="item"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="投资预算(万元)" prop="budget">
-                <el-input v-model="form.budget" type="number" placeholder="请输入投资预算"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item label="合作方式" prop="cooperation">
-                <el-checkbox-group v-model="form.cooperation" class="checkbox">
-                  <el-checkbox v-for="(item, index) in cooperationList" :key="index" :label="item" name="type"></el-checkbox>
-                </el-checkbox-group>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item label="技术说明" prop="name">
-                <el-input
-                  v-model="form.requirement.p1"
-                  placeholder="请输入技术说明"
-                  type="textarea"
-                  :autosize="{ minRows: 4, maxRows: 6 }"
-                  maxlength="1000"
-                  show-word-limit
-                ></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item label="预期目标" prop="name">
-                <el-input
-                  v-model="form.requirement.p2"
-                  placeholder="请输入预期目标"
-                  type="textarea"
-                  :autosize="{ minRows: 4, maxRows: 6 }"
-                  maxlength="1000"
-                  show-word-limit
-                ></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item label="合作条件及要求" prop="name">
-                <el-input
-                  v-model="form.requirement.p3"
-                  placeholder="请输入合作条件及要求"
-                  type="textarea"
-                  :autosize="{ minRows: 4, maxRows: 6 }"
-                  maxlength="1000"
-                  show-word-limit
-                ></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item label="其他需求" prop="name">
-                <el-input
-                  v-model="form.requirement.p4"
-                  placeholder="请输入其他需求"
-                  type="textarea"
-                  :autosize="{ minRows: 4, maxRows: 6 }"
-                  maxlength="1000"
-                  show-word-limit
-                ></el-input>
-              </el-form-item>
-            </el-col>
-          </el-form>
+          <el-col :span="24">
+            <el-form-item label="需求名称" prop="techol_name">
+              <el-input v-model="form.techol_name" placeholder="请输入需求名称"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="紧急程度" prop="urgent">
+              <el-select v-model="form.urgent" placeholder="请选择" style="width:100%">
+                <el-option v-for="(item, index) in urgentList" :key="index" :label="item" :value="item"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="投资预算(万元)" prop="budget">
+              <el-input v-model="form.budget" type="number" placeholder="请输入投资预算"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="合作方式" prop="cooperation">
+              <el-checkbox-group v-model="form.cooperation" class="checkbox">
+                <el-checkbox v-for="(item, index) in cooperationList" :key="index" :label="item" name="type"></el-checkbox>
+              </el-checkbox-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="技术说明" prop="requirement.p1">
+              <el-input
+                v-model="form.requirement.p1"
+                placeholder="请输入技术说明"
+                type="textarea"
+                :autosize="{ minRows: 4, maxRows: 6 }"
+                maxlength="1000"
+                show-word-limit
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="预期目标" prop="requirement.p2">
+              <el-input
+                v-model="form.requirement.p2"
+                placeholder="请输入预期目标"
+                type="textarea"
+                :autosize="{ minRows: 4, maxRows: 6 }"
+                maxlength="1000"
+                show-word-limit
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="合作条件及要求" prop="requirement.p3">
+              <el-input
+                v-model="form.requirement.p3"
+                placeholder="请输入合作条件及要求"
+                type="textarea"
+                :autosize="{ minRows: 4, maxRows: 6 }"
+                maxlength="1000"
+                show-word-limit
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="其他需求" prop="requirement.p4">
+              <el-input
+                v-model="form.requirement.p4"
+                placeholder="请输入其他需求"
+                type="textarea"
+                :autosize="{ minRows: 4, maxRows: 6 }"
+                maxlength="1000"
+                show-word-limit
+              ></el-input>
+            </el-form-item>
+          </el-col>
         </el-col>
       </el-col>
     </el-row>

src/views/twoweb/service/comDemand/parts/one.vue

@@ -3,72 +3,70 @@
     <el-row>
       <el-col :span="24" class="main">
         <el-col :span="24" class="one">
-          <el-form :model="form" :rules="rules" ref="form" label-width="100px">
-            <el-col :span="24">
-              <el-form-item label="企业名称" prop="name">
-                <el-input v-model="form.name" placeholder="请输入企业名称"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item label="通讯地址" prop="address">
-                <el-input v-model="form.address" placeholder="请输入通讯地址"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item label="邮编" prop="postal">
-                <el-input v-model="form.postal" placeholder="请输入邮编"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item label="网址" prop="web_site">
-                <el-input v-model="form.web_site" placeholder="请输入网址"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item label="注册登记类型(可多选)" prop="register_type">
-                <el-checkbox-group v-model="form.register_type" class="checkbox">
-                  <el-checkbox v-for="(item, index) in typeList" :key="index" :label="item" name="type"></el-checkbox>
-                </el-checkbox-group>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item label="所属领域(可多选)" prop="field">
-                <el-checkbox-group v-model="form.field" class="checkbox">
-                  <el-checkbox v-for="(item, index) in fieldList" :key="index" :label="item" name="type"></el-checkbox>
-                </el-checkbox-group>
-              </el-form-item>
-            </el-col>
-            <el-col :span="8">
-              <el-form-item label="注册时间" prop="register_time">
-                <el-date-picker v-model="form.register_time" placeholder="请选择" value-format="yyyy-MM-dd" format="yyyy-MM-dd" type="date" style="width:100%">
-                </el-date-picker>
-              </el-form-item>
-            </el-col>
-            <el-col :span="8">
-              <el-form-item label="注册资金(万元)" prop="funds" label-width="120px">
-                <el-input v-model="form.funds" type="number" placeholder="请输入注册资金"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="8">
-              <el-form-item label="注册地" prop="register_address">
-                <el-select v-model="form.register_address" placeholder="请选择" style="width:100%">
-                  <el-option v-for="(item, index) in register_addressList" :key="index" :label="item" :value="item"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col :span="24">
-              <el-form-item label="企业概况" prop="brief">
-                <el-input
-                  v-model="form.brief"
-                  placeholder="请输入企业概况"
-                  type="textarea"
-                  :autosize="{ minRows: 4, maxRows: 6 }"
-                  maxlength="500"
-                  show-word-limit
-                ></el-input>
-              </el-form-item>
-            </el-col>
-          </el-form>
+          <el-col :span="24">
+            <el-form-item label="企业名称" prop="name">
+              <el-input v-model="form.name" placeholder="请输入企业名称"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="通讯地址" prop="address">
+              <el-input v-model="form.address" placeholder="请输入通讯地址"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="邮编" prop="postal">
+              <el-input v-model="form.postal" type="number" placeholder="请输入邮编"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="网址" prop="web_site">
+              <el-input v-model="form.web_site" placeholder="请输入网址"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="注册登记类型(可多选)" prop="register_type">
+              <el-checkbox-group v-model="form.register_type" class="checkbox">
+                <el-checkbox v-for="(item, index) in typeList" :key="index" :label="item" name="type"></el-checkbox>
+              </el-checkbox-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="所属领域(可多选)" prop="field">
+              <el-checkbox-group v-model="form.field" class="checkbox">
+                <el-checkbox v-for="(item, index) in fieldList" :key="index" :label="item" name="type"></el-checkbox>
+              </el-checkbox-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="注册时间" prop="register_time">
+              <el-date-picker v-model="form.register_time" placeholder="请选择" value-format="yyyy-MM-dd" format="yyyy-MM-dd" type="date" style="width:100%">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="注册资金(万元)" prop="funds" label-width="120px">
+              <el-input v-model="form.funds" type="number" placeholder="请输入注册资金"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="注册地" prop="register_address">
+              <el-select v-model="form.register_address" placeholder="请选择" style="width:100%">
+                <el-option v-for="(item, index) in register_addressList" :key="index" :label="item" :value="item"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="企业概况" prop="brief">
+              <el-input
+                v-model="form.brief"
+                placeholder="请输入企业概况"
+                type="textarea"
+                :autosize="{ minRows: 4, maxRows: 6 }"
+                maxlength="500"
+                show-word-limit
+              ></el-input>
+            </el-form-item>
+          </el-col>
         </el-col>
       </el-col>
     </el-row>

src/views/twoweb/service/comDemand/parts/thr.vue

@@ -3,22 +3,20 @@
     <el-row>
       <el-col :span="24" class="main">
         <el-col :span="24" class="one">
-          <el-form :model="form" :rules="rules" ref="form" label-width="100px">
-            <el-col :span="24" class="list">
-              <el-table :data="form.products" border style="width: 100%" empty-text="请添加">
-                <el-table-column prop="name" label="主要产品名称" align="center" show-overflow-tooltip> </el-table-column>
-                <el-table-column prop="mix" label="占企业销售收入总额比例(%)" width="200px" show-overflow-tooltip> </el-table-column>
-                <el-table-column label="" width="100px" align="center">
-                  <template slot-scope="scope">
-                    <el-button size="mini" type="danger" @click="toDel(scope.$index, scope.row)">删除</el-button>
-                  </template>
-                </el-table-column>
-              </el-table>
-            </el-col>
-            <el-col :span="24" class="btn">
-              <el-button type="primary" size="small" @click="toAdd()">添加</el-button>
-            </el-col>
-          </el-form>
+          <el-col :span="24" class="list">
+            <el-table :data="form.products" border style="width: 100%" empty-text="请添加">
+              <el-table-column prop="name" label="主要产品名称" align="center" show-overflow-tooltip> </el-table-column>
+              <el-table-column prop="mix" label="占企业销售收入总额比例(%)" width="200px" show-overflow-tooltip> </el-table-column>
+              <el-table-column label="" width="100px" align="center">
+                <template slot-scope="scope">
+                  <el-button size="mini" type="danger" @click="toDel(scope.$index, scope.row)">删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-col>
+          <el-col :span="24" class="btn">
+            <el-button type="primary" size="small" @click="toAdd()">添加</el-button>
+          </el-col>
         </el-col>
       </el-col>
     </el-row>

src/views/twoweb/service/comDemand/parts/two.vue

@@ -3,80 +3,78 @@
     <el-row>
       <el-col :span="24" class="main">
         <el-col :span="24" class="one">
-          <el-form :model="form" :rules="rules" ref="form" label-width="100px">
-            <el-col :span="6">
-              <el-form-item label="企业法人" prop="name">
-                <el-input v-model="form.legal_person.name" placeholder="请输入企业法人"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="性別" prop="gender">
-                <el-select v-model="form.legal_person.gender" placeholder="请选择" style="width:100%">
-                  <el-option v-for="(item, index) in genderList" :key="index" :label="item" :value="item"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="出生年月" prop="birth">
-                <el-date-picker
-                  v-model="form.legal_person.birth"
-                  placeholder="请选择"
-                  value-format="yyyy-MM-dd"
-                  format="yyyy-MM-dd"
-                  type="date"
-                  style="width:100%"
-                >
-                </el-date-picker>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="最高学历" prop="education">
-                <el-select v-model="form.legal_person.education" placeholder="请选择" style="width:100%">
-                  <el-option v-for="(item, index) in educationList" :key="index" :label="item" :value="item"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="企业职工数" prop="person_number">
-                <el-input v-model="form.person_number" type="number" placeholder="请输入企业职工数"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="本科以上人数" prop="bk_number">
-                <el-input v-model="form.bk_number" type="number" placeholder="请输入本科以上人数"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="研究开发人数" prop="research_number">
-                <el-input v-model="form.research_number" type="number" placeholder="请输入研究开发人数"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="高级职称人数" prop="advanced_number">
-                <el-input v-model="form.advanced_number" type="number" placeholder="请输入高级职称人数"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="企业联系人" prop="contact">
-                <el-input v-model="form.contact" placeholder="请输入企业联系人"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="联系电话" prop="contact_tel">
-                <el-input v-model="form.contact_tel" placeholder="请输入联系电话"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="E-mail" prop="email">
-                <el-input v-model="form.email" placeholder="请输入E-mail"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="QQ" prop="qq">
-                <el-input v-model="form.qq" placeholder="请输入OO"></el-input>
-              </el-form-item>
-            </el-col>
-          </el-form>
+          <el-col :span="6">
+            <el-form-item label="企业法人" prop="legal_person.name">
+              <el-input v-model="form.legal_person.name" placeholder="请输入企业法人"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="性別" prop="legal_person.gender">
+              <el-select v-model="form.legal_person.gender" placeholder="请选择" style="width:100%">
+                <el-option v-for="(item, index) in genderList" :key="index" :label="item" :value="item"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出生年月" prop="legal_person.birth">
+              <el-date-picker
+                v-model="form.legal_person.birth"
+                placeholder="请选择"
+                value-format="yyyy-MM-dd"
+                format="yyyy-MM-dd"
+                type="date"
+                style="width:100%"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="最高学历" prop="legal_person.education">
+              <el-select v-model="form.legal_person.education" placeholder="请选择" style="width:100%">
+                <el-option v-for="(item, index) in educationList" :key="index" :label="item" :value="item"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="企业职工数" prop="person_number">
+              <el-input v-model="form.person_number" type="number" placeholder="请输入企业职工数"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="本科以上人数" prop="bk_number">
+              <el-input v-model="form.bk_number" type="number" placeholder="请输入本科以上人数"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="研究开发人数" prop="research_number">
+              <el-input v-model="form.research_number" type="number" placeholder="请输入研究开发人数"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="高级职称人数" prop="advanced_number">
+              <el-input v-model="form.advanced_number" type="number" placeholder="请输入高级职称人数"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="企业联系人" prop="contact">
+              <el-input v-model="form.contact" placeholder="请输入企业联系人"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="联系电话" prop="contact_tel">
+              <el-input v-model="form.contact_tel" placeholder="请输入联系电话"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="E-mail" prop="email">
+              <el-input v-model="form.email" placeholder="请输入E-mail"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="QQ" prop="qq">
+              <el-input v-model="form.qq" placeholder="请输入OO"></el-input>
+            </el-form-item>
+          </el-col>
         </el-col>
       </el-col>
     </el-row>