项目评估-项目 流程的第6步的批量编辑功能

src/pages/processCenter/pages/creatProcess/xmpg2/step6.vue

@@ -42,6 +42,12 @@
         <process-title>
           <template slot="title">填写信息</template>
         </process-title>
+        <div class="tableTitle">
+          <div class="tableButton">
+            <el-button class="common-button-primary add-button" type="primary" size="mini" @click="batchEdit">批量编辑
+            </el-button>
+          </div>
+        </div>
         <el-table
           :data="dataList"
           style="width: 100%; border: 1px solid #cccccc"
@@ -237,6 +243,17 @@
               </el-table-column>
             </el-table-column>
           </el-table-column>
+<!--          以后全选可能用-->
+<!--          <el-table-column-->
+<!--              prop="productionCompletionTime"-->
+<!--              align="center"-->
+<!--              fixed="right"-->
+<!--              width="160"-->
+<!--              label="操作">-->
+<!--            <template slot-scope="scope">-->
+<!--              <el-button style="width: 98%" size="small" type="primary" @click="">{{ "批量编辑" }}</el-button>-->
+<!--            </template>-->
+<!--          </el-table-column>-->
         </el-table>
       </div>
       <div>
@@ -331,6 +348,73 @@
       @submit="handleSubmit"
     >
     </ProcessFooter>
+    <el-drawer
+        title="批量填写"
+        :visible.sync="modalshowflag"
+        :wrapperClosable="false"
+        size="800px">
+      <div class="demo-drawer-content">
+        <el-form :model="batchEditForm" class="label-input-form" ref="projectComplianceForm" label-width="150">
+          <el-divider><span><b>在研产品</b></span></el-divider>
+          <el-formItem label="合规原因" class="add-form-item" >
+            <el-input
+                v-model="batchEditForm.complianceReasons"
+                placeholder="请输入合规原因"
+            ></el-input>
+          </el-formItem>
+          <el-form-item label="不合规项目" class="add-form-item" >
+            <el-input
+                v-model="batchEditForm.noCompliance"
+                placeholder="请输入不合规项目"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="不合规应对措施" class="add-form-item" >
+            <el-input
+                v-model="batchEditForm.countermeasures"
+                placeholder="请输入不合规应对措施"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="完成时间" class="add-form-item" >
+            <el-date-picker
+                v-model="batchEditForm.completionTime"
+                type="date"
+                placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+          <br>
+          <el-divider><span><b>在产产品</b></span></el-divider>
+          <el-formItem label="合规原因" class="add-form-item" >
+            <el-input
+                v-model="batchEditForm.zcComplianceReasons"
+                placeholder="请输入合规原因"
+            ></el-input>
+          </el-formItem>
+          <el-form-item label="不合规项目" class="add-form-item" >
+            <el-input
+                v-model="batchEditForm.zcNoCompliance"
+                placeholder="请输入不合规项目"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="不合规应对措施" class="add-form-item" >
+            <el-input
+                v-model="batchEditForm.zcCountermeasures"
+                placeholder="请输入不合规应对措施"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="完成时间" class="add-form-item" >
+            <el-date-picker
+                v-model="batchEditForm.zcCompletionTime"
+                type="date"
+                placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="demo-drawer-footer">
+        <el-button class="common-button-primary" size="mini" icon="el-icon-check" type="primary" @click="saveBatchEditForm">确定</el-button>
+        <el-button class="common-button-default" size="mini" icon="el-icon-close" @click="cancelBatchEditForm">取消</el-button>
+      </div>
+    </el-drawer>
   </div>
 </template>
 
@@ -349,6 +433,27 @@ export default {
   },
   data() {
     return {
+      batchEditForm: {
+        // 在研产品
+        // 合规
+        complianceReasons :'',
+        // 不合规
+        noCompliance :'',
+        // 应对措施
+        countermeasures :'',
+        // 完成时间
+        completionTime :'',
+
+        // 在产产品
+        // 合规
+        zcComplianceReasons :'',
+        // 不合规
+        zcNoCompliance:'',
+        // 应对措施
+        zcCountermeasures:'',
+        // 完成时间
+        zcCompletionTime:''
+      },
       hasChildren: true,
       active: "1",
       loading: false,
@@ -398,6 +503,83 @@ export default {
     };
   },
   methods: {
+    //批量编辑确定按钮事件
+    saveBatchEditForm() {
+
+      // console.log(this.selectList)
+      for( let a = 0; a < this.dataList.length; a++) {
+        for ( let b = 0; b < this.selectList.length; b++) {
+          if (this.dataList[a].id === this.selectList[b]) {
+            //合规
+            this.dataList[a].complianceReasons = this.batchEditForm.complianceReasons
+            //不合规
+            this.dataList[a].noCompliance = this.batchEditForm.noCompliance
+            //应对措施
+            this.dataList[a].countermeasures = this.batchEditForm.countermeasures
+            //完成时间
+            this.dataList[a].completionTime = this.batchEditForm.completionTime
+            //合规
+            this.dataList[a].zcComplianceReasons = this.batchEditForm.zcComplianceReasons
+            //不合规
+            this.dataList[a].zcNoCompliance = this.batchEditForm.zcNoCompliance
+            //应对措施
+            this.dataList[a].zcCountermeasures = this.batchEditForm.zcCountermeasures
+            //完成时间
+            this.dataList[a].zcCompletionTime = this.batchEditForm.zcCompletionTime
+          }else {
+            for (let i=0;i<this.dataList[a].children.length;i++){
+              if (this.dataList[a].children[i].id === this.selectList[b]){
+                //合规
+                this.dataList[a].children[i].complianceReasons = this.batchEditForm.complianceReasons
+                //不合规
+                this.dataList[a].children[i].noCompliance = this.batchEditForm.noCompliance
+                //应对措施
+                this.dataList[a].children[i].countermeasures = this.batchEditForm.countermeasures
+                //完成时间
+                this.dataList[a].children[i].completionTime = this.batchEditForm.completionTime
+                //合规
+                this.dataList[a].children[i].zcComplianceReasons = this.batchEditForm.zcComplianceReasons
+                //不合规
+                this.dataList[a].children[i].zcNoCompliance = this.batchEditForm.zcNoCompliance
+                //应对措施
+                this.dataList[a].children[i].zcCountermeasures = this.batchEditForm.zcCountermeasures
+                //完成时间
+                this.dataList[a].children[i].zcCompletionTime = this.batchEditForm.zcCompletionTime
+              }
+            }
+          }
+
+        }
+      }
+      this.modalshowflag = false
+    },
+    cancelBatchEditForm() {
+      this.modalshowflag = false
+    },
+    //批量编辑
+    batchEdit() {
+      if (this.selectList.length > 0) {
+        //合规
+        this.batchEditForm.complianceReasons = ''
+        //不合规
+        this.batchEditForm.noCompliance = ''
+        //应对措施
+        this.batchEditForm.countermeasures = ''
+        //完成时间
+        this.batchEditForm.completionTime = ''
+        //合规
+        this.batchEditForm.zcComplianceReasons = ''
+        //不合规
+        this.batchEditForm.zcNoCompliance = ''
+        //应对措施
+        this.batchEditForm.zcCountermeasures = ''
+        //完成时间
+        this.batchEditForm.zcCompletionTime = ''
+        this.modalshowflag = true
+      } else {
+        this.$message.warning('请选择要编辑的数据')
+      }
+    },
     // 点击查看
     handlePreview(item) {
       let routeUrl = this.$router.resolve({
@@ -525,7 +707,11 @@ export default {
     },
     //标准表格选择框改变
     selectStandChange(data) {
-      this.selectList = data;
+      this.selectList = [];
+      for (let i = 0; i < data.length; i++) {
+        this.selectList.push(data[i].id);
+      }
+
     },
     getTree() {
       this.$http.get("SarInstitution/institution/institutionAndUser", {}, {}, res => {
@@ -605,6 +791,25 @@ export default {
     height: calc(~'100% - 103px');
     overflow: auto;
 
+    .tableTitle {
+      margin-bottom: 10px;
+      height: 30px;
+      line-height: 30px;
+      position: relative;
+      font-size: 13px;
+      font-weight: bold;
+
+      .tableButton {
+        position: absolute;
+        right: 0;
+        top: 0;
+      }
+
+      .accessStandardsAndRegulations {
+        height: 100%;
+      }
+    }
+
     .accessStandardsAndRegulations {
       height: 100%;
     }