材料请购单-增加表单验证

src/views/production/materialprocurement/materialProcurementList.vue

@@ -319,8 +319,8 @@
             this.$message.warning('请选择数据！')
           }else if(this.selectedRowKeys.length>1){
             this.$message.warning('请选择一条数据！')
-          }else if(this.selectedRows[0].state!=='自由'){
-            this.$message.warning('请选择状态为自由的数据 ！')
+          }else if(this.selectedRows[0].state!=='开立'){
+            this.$message.warning('请选择状态为开立的数据 ！')
           }else{
             this.$refs.materialProcurementAdd.visible=true
             this.$refs.materialProcurementAdd.defaultMethod='edit'

src/views/production/materialprocurement/modules/materialProcurementAdd.vue

@@ -10,80 +10,80 @@
       >
       <a-card :bordered="false" class="top" style="margin-bottom:1%;margin-top:1%" :loading = 'loading'>
         <div class="table-page-search-wrapper">
-            <a-form layout="inline" @keyup.enter.native="searchQuery">
+            <a-form-model layout="inline" @keyup.enter.native="searchQuery" :model="form" :rules="rules"  ref="form">
                 <a-row :gutter="24">
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="生产组织">
+                        <a-form-model-item label="生产组织" prop='orgName'>
                             <a-input-search placeholder="请输入" v-model="form.orgName" @search="onSearchPlanOrg" readOnly></a-input-search>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col  :md="4" :sm="24">
-                        <a-form-item label="单据号">
+                        <a-form-model-item label="单据号">
                             <a-input placeholder="请输入" v-model="form.orderCode"></a-input>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="单据日期">
+                        <a-form-model-item label="单据日期" prop='orderDate'>
                             <a-date-picker showTime valueFormat="YYYY-MM-DD" format = "YYYY-MM-DD" v-model="form.orderDate" style="width:100%"/>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                    <a-col :md="4" :sm="24">
-                        <a-form-item label="单据状态">
+                        <a-form-model-item label="单据状态">
                             <a-select v-model="form.state"  style='width:100%' disabled>
                                 <a-select-option value='开立'> 开立</a-select-option>
                                 <a-select-option value='审核'> 审核</a-select-option>
                                 <a-select-option value='已运算'> 已运算</a-select-option>
                                 <a-select-option value='关闭'> 关闭</a-select-option>
                             </a-select>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="业务员">
+                        <a-form-model-item label="业务员">
                             <a-input-search placeholder="请输入" v-model="form.salesperson"  @search="onSearchPerson" readOnly></a-input-search>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="计划部门">
+                        <a-form-model-item label="计划部门">
                             <a-input-search placeholder="请输入" v-model="form.planDept" @search="onSearchDept" readOnly></a-input-search>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="项目编码">
+                        <a-form-model-item label="项目编码" prop='projectCode'>
                             <a-input placeholder="请输入" v-model="form.projectCode" disabled></a-input>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="项目名称">
+                        <a-form-model-item label="项目名称" prop='projectName'>
                             <a-input-search placeholder="请输入" v-model="form.projectName" @search="onSearchProject" readOnly></a-input-search>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="业务类型">
+                        <a-form-model-item label="业务类型" prop='type'>
                             <a-select v-model="form.type"  style='width:100%' >
                                 <a-select-option value='家装'>家装</a-select-option>
                                 <a-select-option value='工装'>工装</a-select-option>
                             </a-select>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="制单人">
+                        <a-form-model-item label="制单人">
                             <a-input placeholder="请输入" v-model="form.createBy" disabled></a-input>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="审批人">
+                        <a-form-model-item label="审批人">
                             <a-input placeholder="请输入" v-model="form.reviewer" disabled></a-input>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                     
                     <a-col :md="4" :sm="24">
-                        <a-form-item label="工单号">
+                        <a-form-model-item label="工单号" prop='workNo'>
                             <a-input placeholder="请输入" v-model="form.workNo"></a-input>
-                        </a-form-item>
+                        </a-form-model-item>
                     </a-col>
                 </a-row>
-            </a-form>
+            </a-form-model>
         </div>
      </a-card>
      <a-card :bordered="false" class="three" style="margin-bottom:1%" :loading = 'loading'>
@@ -91,7 +91,7 @@
             <a-button type="danger" size="small"  @click="addList">增行</a-button>
             <a-button size="small" @click="delectRow">删行</a-button>
        </div>
-       <a-form-model ref="formRef">
+       <a-form-model ref="formRef" :model="formTable">
         <a-table
           ref="table"
           size="middle"
@@ -99,12 +99,18 @@
           id='sonList'
           :columns="columns"
            rowKey="rowNo"
-          :dataSource="dataSource"
+          :dataSource="formTable.dataSource"
           :pagination="false"
           :scroll="{ x: 4500, y: 300 }"
           :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
           @change="handleTableChange"
           >
+            <span slot="quantityTitle" class="form-table-heard">
+                    主数量
+            </span>
+            <span slot="unQuantityTitle" class="form-table-heard">
+                    辅数量
+            </span>
             <template slot="batch" slot-scope="text, record, index">
                 <a-form-model-item prop="batch" class='sonItem'>
                     <a-input placeholder="请输入" v-model="record.batch"></a-input>
@@ -136,12 +142,12 @@
                 </a-form-model-item>
             </template>
             <template slot="quantity" slot-scope="text, record, index">
-                <a-form-model-item prop="quantity" class='sonItem'>
+                <a-form-model-item :prop="'dataSource.'+index+'.quantity'" class='sonItem' :rules="rules1.quantity">
                     <a-input placeholder="请输入" v-model="record.quantity" @blur="chengQuantity(record)"></a-input>
                 </a-form-model-item>
             </template>
             <template slot="unQuantity" slot-scope="text, record, index">
-                <a-form-model-item prop="unQuantity" class='sonItem'>
+                <a-form-model-item  :prop="'dataSource.'+index+'.unQuantity'" class='sonItem' :rules="rules1.unQuantity">
                     <a-input placeholder="请输入" v-model="record.unQuantity" @blur="chengQuantity(record)"></a-input>
                 </a-form-model-item>
             </template>
@@ -271,7 +277,7 @@
                 </a-form-model-item>
             </template>
         </a-table>
-       </a-form-model">
+       </a-form-model>
     </a-card>
     <projectPopup ref="projectPopup" @okData="okData"></projectPopup>
     <inventoryPopup ref="inventoryPopup" @okData="okDataInvent"></inventoryPopup>
@@ -306,7 +312,33 @@
             visible:false,
             form:{},
             defaultMethod:'add',
-            dataSource:[],
+            formTable:{
+                dataSource:[],
+            },
+            rules:{
+              orgName: [
+                { required: true, trigger: 'change' },
+              ],
+              orderDate:[
+                { required: true, trigger: 'change' },
+              ],
+              projectName:[
+                { required: true, trigger: 'change' },
+              ],
+              projectCode:[
+                { required: true, trigger: 'change' },
+              ],
+              type:[
+                { required: true, trigger: 'change' },
+              ],
+              workNo:[
+                { required: true, trigger: 'change' },
+              ],
+            },
+            rules1:{
+                quantity:{required:true,message:"不可为空"},
+                unQuantity:{required:true,message:"不可为空"},
+            },
             loading:false,
             // ipagination:{},
             selectedRowKeys:[],
@@ -374,19 +406,21 @@
                     ellipsis: true,
                 },
                 {
-                    title: '主数量',
+                    // title: '主数量',
                     align:"center",
                     dataIndex: 'quantity',
                     ellipsis: true,
-                    scopedSlots: { customRender: 'quantity' } 
+                    scopedSlots: { customRender: 'quantity' } ,
+                    slots:{title:'quantityTitle'},
 
                 },
                 {
-                    title: '辅数量',
+                    // title: '辅数量',
                     align:"center",
                     dataIndex: 'unQuantity',
                     ellipsis: true,
-                    scopedSlots: { customRender: 'unQuantity' } 
+                    scopedSlots: { customRender: 'unQuantity' } ,
+                    slots:{title:'unQuantityTitle'},
                 },
                 {
                     title: '换算率',
@@ -572,43 +606,50 @@
             handleCancel(){
                 this.visible=false
                 this.defaultMethod='add'
-                this.dataSource = [] 
+                this.formTable.dataSource = [] 
                 this.form={}
             },
             handleOk(){
-                var mergedObj = this.form
-                mergedObj.madeMaterialRequisitionDetailList = this.dataSource
-                if(this.dataSource.length==0){
-                    this.$message.warning('请添加子表数据！')
-                }else{
-                    this.loading = true
-                    if(this.defaultMethod=='add'){
-                        postAction('/materialRequisition/madeMaterialRequisition/add', mergedObj).then((res) => {
-                            if (res.success) {
-                                this.$message.success('添加成功！');
-                                this.handleCancel()
-                                this.$emit('ok')
-                            } else {
-                                this.$message.error(res.message);
-                            }
-                        }).finally(() => {
-                            this.loading = false
-                        })
-                    }else{
-                        postAction('/materialRequisition/madeMaterialRequisition/edit', mergedObj).then((res) => {
-                            if (res.success) {
-                                this.$message.success('编辑成功！');
-                                this.handleCancel()
-                                this.$emit('ok')
-                            } else {
-                                this.$message.error(res.message);
+                this.$refs.form.validate(success => {
+                    if (success) {
+                        this.$refs.formRef.validate(val => {
+                            if (val) {
+                                var mergedObj = this.form
+                                mergedObj.madeMaterialRequisitionDetailList = this.formTable.dataSource
+                                if(this.formTable.dataSource.length==0){
+                                    this.$message.warning('请添加子表数据！')
+                                }else{
+                                    this.loading = true
+                                    if(this.defaultMethod=='add'){
+                                        postAction('/materialRequisition/madeMaterialRequisition/add', mergedObj).then((res) => {
+                                            if (res.success) {
+                                                this.$message.success('添加成功！');
+                                                this.handleCancel()
+                                                this.$emit('ok')
+                                            } else {
+                                                this.$message.error(res.message);
+                                            }
+                                        }).finally(() => {
+                                            this.loading = false
+                                        })
+                                    }else{
+                                        postAction('/materialRequisition/madeMaterialRequisition/edit', mergedObj).then((res) => {
+                                            if (res.success) {
+                                                this.$message.success('编辑成功！');
+                                                this.handleCancel()
+                                                this.$emit('ok')
+                                            } else {
+                                                this.$message.error(res.message);
+                                            }
+                                        }).finally(() => {
+                                            this.loading = false
+                                        })
+                                    }
+                                }
                             }
-                        }).finally(() => {
-                            this.loading = false
                         })
                     }
-                }
-                
+                })                
             },
             onSelectChange(selectedRowKeys, selectionRows) {
                 this.selectedRowKeys = selectedRowKeys;
@@ -636,8 +677,8 @@
             getSonData(id){
                 getAction('/materialRequisition/madeMaterialRequisition/querymadeMaterialRequisitionDetailByMainId',{id:id}).then(res=>{
                     if(res.success){
-                       this.dataSource =res.result
-                       this.dataSource.map((item,index)=>{
+                       this.formTable.dataSource =res.result
+                       this.formTable.dataSource.map((item,index)=>{
                         item.rowNo =index+1
                        })
                        
@@ -647,7 +688,7 @@
                 })
             },
             addList(){
-                this.dataSource.unshift({rowNo: this.dataSource.length+1,projectCode:this.form.projectCode,projectName:this.form.projectName,rate:''})
+                this.formTable.dataSource.unshift({rowNo: this.formTable.dataSource.length+1,projectCode:this.form.projectCode,projectName:this.form.projectName,rate:''})
             },
             onSearchProject(){
                 if(this.form.orgName&&this.form.orgName!==''){
@@ -687,10 +728,16 @@
                 this.$set(this.form,'projectCode',data.Code)
                 this.$set(this.form,'projectName',data.Name)
                 this.$set(this.form,'project',data.ID)
-                this.dataSource.map(item=>{
+                this.formTable.dataSource.map(item=>{
                     item.projectCode = data.Code
                     item.projectName = data.Name
                 })
+                if(this.form.projectName&&this.form.projectName!==''){
+                    this.$refs.form.clearValidate(['projectName']);
+                }
+                if(this.form.projectCode&&this.form.projectCode!==''){
+                    this.$refs.form.clearValidate(['projectCode']);
+                }
             },
             chengQuantity(record){
                 if(record.quantity&&record.quantity!==''&&record.unQuantity&&record.unQuantity!==''){
@@ -723,13 +770,16 @@
                 this.$set(this.form,'orgName',data.Name)
                 this.$set(this.form,'orgCode',data.Code)
                 this.$set(this.form,'planOrg',data.ID)
+                if(this.form.orgName&&this.form.orgName!==''){
+                    this.$refs.form.clearValidate(['orgName']);
+                }
             },
             delectRow(){
                 if( this.selectedRowKeys.length==0){
                     this.$message.warning('请勾选子表数据！')
                 }else{
                     this.selectedRowKeys.map(event=>{
-                        this.dataSource =  this.dataSource.filter( (x)=> {return x.rowNo !== event});
+                        this.formTable.dataSource =  this.formTable.dataSource.filter( (x)=> {return x.rowNo !== event});
                     })
                 }
             },
@@ -797,4 +847,15 @@
     /deep/#sonList>.ant-spin-nested-loading>.ant-spin-container>.ant-table>.ant-table-content>.ant-table-scroll>.ant-table-body>.ant-table-fixed>.ant-table-tbody > tr > td {
         padding: 0px 8px !important;
     }
+     // 表单校验隐藏提示文字
+    //  /deep/.ant-form-explain{
+    //   display:none
+    // }
+    .form-table-heard:before {
+        content:'*';
+        color:red
+   }
+   /deep/.ant-form-explain, .ant-form-split {
+        display: none;
+   }
   </style>

src/views/production/productionTotalOrder/modules/material.vue

@@ -461,7 +461,7 @@
                     scopedSlots: { customRender: 'glassNumber' } 
                 },
           ],
-          rules:{
+        rules:{
             quantity:{required:true,message:"不可为空"},
             unQuantity:{required:true,message:"不可为空"},
         },