完成管理评审搬迁

licp

2024-12-19 0ac8b28b5fd2285e2edad81419b1df6aa04f6288

完成管理评审搬迁

 src/components/do/a9-management-review/managementFormDIa.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,263 @@
<template>
  <div>
    <el-dialog v-loading="diaLoading" :close-on-click-modal="false"
               :close-on-press-escape="false"
               :visible.sync="formDia"
               title="管理评审计划"
               width="80%" @close="closeImplementDia">
      <el-form ref="form" :model="form" :rules="rules" label-position="right" label-width="auto" style="height: 75vh;overflow-y: auto;overflow-x: hidden;">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="评审时间" prop="reviewTime">
              <el-date-picker
                v-model="form.reviewTime"
                :disabled="operationType === 'ratify'"
                clearable
                format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                size="small" style="width: 100%"
                type="datetime" value-format="yyyy-MM-dd HH:mm:ss">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="评审地点" prop="judgingLocation">
              <el-input v-model="form.judgingLocation" :disabled="operationType === 'ratify'" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="评审目的" prop="judgingPurpose">
              <el-input v-model="form.judgingPurpose" :disabled="operationType === 'ratify'" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="评审方式" prop="judgingMethod">
              <el-input v-model="form.judgingMethod" :disabled="operationType === 'ratify'" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="参加人员" prop="participants">
              <!-- <el-input v-model="form.participants" :disabled="operationType === 'ratify'" clearable size="small"></el-input> -->
              <el-select v-model="form.participants" size="small" style="width: 100%;" filterable :disabled="operationType === 'ratify'" clearable multiple >
                <el-option
                  v-for="item in personList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="评审范围" prop="judgingScope">
              <el-input v-model="form.judgingScope" :disabled="operationType === 'ratify'" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="评审依据" prop="judgingBasis">
              <el-input v-model="form.judgingBasis"
                        :disabled="operationType === 'ratify'"
                        :rows="3"
                        clearable
                        size="small" type="textarea"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="评审主要内容" prop="mainContext">
              <el-input v-model="form.mainContext"
                        :disabled="operationType === 'ratify'"
                        :rows="3"
                        clearable
                        size="small" type="textarea"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="准备工作要求" prop="preparationRequirements">
              <el-input v-model="form.preparationRequirements"
                        :disabled="operationType === 'ratify'"
                        :rows="3"
                        clearable
                        size="small" type="textarea"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeImplementDia">取 æ¶ˆ</el-button>
        <el-button v-if="operationType === 'ratify'" :loading="loading" type="primary" @click="handleApproval(1)">批 å‡†</el-button>
        <el-button v-if="operationType !== 'ratify'" :loading="loading" type="primary" @click="handleEdit">提 äº¤</el-button>
      </span>
    </el-dialog>
    <el-dialog :visible.sync="approvalDialog" title="批准" width="30%" @close="approvalDialog = false">
      <span>
        æ‰¹å‡†å¤‡æ³¨ï¼š
        <el-input v-model="qualityRemark" type="textarea"></el-input>
      </span>
      <span slot="footer" class="dialog-footer">
        <el-button :loading="approvalLoading" @click="approvalDialog = false">取 æ¶ˆ</el-button>
        <el-button :loading="approvalLoading" type="primary" @click="handleApproval(0)">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { dateFormat } from '../../../util/date'
export default {
  name: 'managementFormDIa',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: {},
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      formDia: false,
      diaLoading: false,
      loading: false,
      form: {
        id: '',
        reviewTime: '',
        judgingLocation: '',
        judgingPurpose: '',
        judgingMethod: '',
        participants: [],
        judgingScope: '',
        judgingBasis: '',
        mainContext: '',
        preparationRequirements: '',
      },
      rules: {
        reviewTime: [{required: true, message: '请选择评审时间',trigger: 'blur'}],
        judgingLocation: [{required: true, message: '请填写评审地点',trigger: 'blur'}],
        judgingPurpose: [{required: true, message: '请填写评审目的',trigger: 'blur'}],
        judgingMethod: [{required: true, message: '请填写评审方式',trigger: 'blur'}],
        participants: [{required: true, message: '请填写参加人员',trigger: 'change'}],
        judgingScope: [{required: true, message: '请填写评审范围',trigger: 'blur'}],
        judgingBasis: [{required: true, message: '请填写评审依据',trigger: 'blur'}],
        mainContext: [{required: true, message: '请填写评审主要内容',trigger: 'blur'}],
        preparationRequirements: [{required: true, message: '请填写准备工作要求',trigger: 'blur'}],
      },
      operationType: '',
      approvalDialog: false,
      approvalLoading: false,
      qualityRemark: '',
      personList:[],
    };
  },
  mounted() {
    this.getAuthorizedPerson()
  },
  // æ–¹æ³•é›†åˆ
  methods: {
    // æ‰“开弹框
    openDia (type, row) {
      this.formDia = true
      this.operationType = type
      if (type !== 'add') {
        this.form = row
        this.form.participants = row.participants ? row.participants.split(',').map(m=>Number(m)) : []
      }
    },
    // æŸ¥è¯¢è¯¦æƒ…
    // searchInfo (row) {
    //   this.diaLoading = true
    //   this.$axios(this.$api.internalReport.getInternalReportOne + '?reportId=' + row.reportId).then(res => {
    //     this.diaLoading = false
    //     if (res.code === 201) return
    //     this.form = res.data
    //   }).catch(err => {
    //     console.log(err)
    //     this.diaLoading = false
    //   })
    // },
    // æäº¤å¼¹æ¡†æ•°æ®
    handleEdit () {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.loading = true
          const internalReport = this.HaveJson(this.form)
          internalReport.participants = internalReport.participants.join(',')
          if (this.operationType === 'add') {
            this.$axios.post(this.$api.manageReviewProgram.addReviewProgram, internalReport, {
              headers: {
                "Content-Type": "application/json"
              },
              noQs: true
            }).then(res => {
              this.loading = false
              if (res.code === 201) return
              this.$message.success('操作成功')
              this.closeImplementDia()
            }).catch(err => {
              console.log('err---', err);
              this.loading = false
            })
          } else if (this.operationType === 'edit') {
            this.$axios.put(this.$api.manageReviewProgram.modifyReviewProgram, internalReport, {
              headers: {
                "Content-Type": "application/json"
              },
              noQs: true
            }).then(res => {
              this.loading = false
              if (res.code === 201) return
              this.$message.success('操作成功')
              this.closeImplementDia()
            }).catch(err => {
              console.log('err---', err);
              this.loading = false
            })
          }
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    // æäº¤æ‰¹å‡†ä¿¡æ¯
    handleApproval (qualityStatus) {
      this.approvalLoading = true
      const internalReport = this.HaveJson(this.form)
      internalReport.approve = JSON.parse(localStorage.getItem("user")).name
      internalReport.approveDate = dateFormat(new Date())
      internalReport.participants = internalReport.participants.join(',')
      this.$axios.put(this.$api.manageReviewProgram.modifyReviewProgram, internalReport, {
        headers: {
          'Content-Type': 'application/json'
        },
        noQs: true
      }).then(res => {
        if (res.code === 200) {
          this.$message.success('提交成功！');
          this.approvalDialog = false
          this.closeImplementDia(this.departId);
        }
        this.approvalLoading = false
      }).catch(() => {
        this.approvalLoading = false
      })
    },
    closeImplementDia () {
      this.$refs.form.resetFields();
      this.formDia = false
      this.$emit('closeImplementDia')
    },
    getAuthorizedPerson() {
      this.$axios.get(this.$api.user.getUserMenu).then(res => {
        let data = []
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          })
        })
        this.personList = data
      })
    },
  }
};
</script>

<style scoped>
>>>.el-dialog {
  margin: 6vh auto 50px !important;
}
</style>

 src/components/do/a9-management-review/managementReviewPlan.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,325 @@
<template>
  <div>
    <div class="search-background">
      <span class="search-group">
        <span style="width: 160px">评审地点：</span>
        <el-input v-model="searchForm.judgingLocation" clearable size="small"></el-input>
        <el-button size="medium"  style="margin-left: 10px" @click="resetSearchForm">重 ç½®</el-button>
        <el-button size="medium" type="primary" @click="searchList">查 è¯¢</el-button>
      </span>
      <span class="search-group">
        <el-button size="medium" type="primary" @click="openFormDia('add')">新 å¢ž</el-button>
      </span>
    </div>
    <div class="table">
      <ZTTable
        :column="tableColumn"
        :height="'calc(100vh - 20em)'"
        :table-data="tableData"
        :table-loading="tableLoading"
        style="padding: 0 10px;margin-bottom: 16px">
      </ZTTable>
      <el-pagination :current-page="1" :page-size="page.size" :page-sizes="[10, 20, 30, 50, 100]"
                     :total="total" layout="->,total, sizes, prev, pager, next, jumper"
                     @size-change="handleSizeChange"
                     @current-change="handleCurrentChange">
      </el-pagination>
    </div>
    <management-form-d-ia v-if="managementFormDIa" ref="managementFormDIa" @closeImplementDia="closeImplementDia"></management-form-d-ia>
    <el-dialog :visible.sync="listDialogVisible" top="15vh"
    title="文件查看"
    width="400px">
    <div style="max-height:60vh;overflow-y: auto;">
      <p v-for="(item,index) in fileList" :key="index">
        <span>{{ item.fileName }}</span>
        <el-button size="small" type="text" icon="el-icon-view" @click="lookFile(item.url,item.fileName)" style="margin-left: 20px;">预览</el-button>
        <el-button size="small" type="text" icon="el-icon-bottom" @click="handleDown0(item.url,item.fileName)" style="margin-left: 20px;">下载</el-button>
      </p>
    </div>
    </el-dialog>
    <el-dialog
      title="查看附件"
      :visible.sync="lookDialogVisible"
      width="800px" top="5vh" fullscreen>
      <filePreview v-if="lookDialogVisible" :fileUrl="javaApi+'/word/'+currentInfo.url"
      :currentFile="{}" style="height: 90vh;overflow-y: auto;"/>
    </el-dialog>
  </div>
</template>

<script>
import ZTTable from '../../caorui/ZTTable/index.vue';
import ManagementFormDIa from './managementFormDIa.vue';
import filePreview from '../../tool/file-preview.vue'

export default {
  name: 'managementReviewPlan',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: { ManagementFormDIa, ZTTable,filePreview },
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      searchForm: {
         judgingLocation: '',
      },
      listDialogVisible:false,
      lookDialogVisible:false,
      fileList:[],
      currentInfo:{},
      tableColumn: [
        {
          label: '评审时间',
          prop: 'reviewTime',
        },
        {
          label: '评审地点',
          prop: 'judgingLocation',
        },
        {
          label: '评审目的',
          prop: 'judgingPurpose',
        },
        {
          label: '评审方式',
          prop: 'judgingMethod',
        },
        {
          label: '评审范围',
          prop: 'judgingScope',
        },
        // {
        //   dataType: 'tag',
        //   label: '批准状态',
        //   prop: 'approve',
        //   minWidth: '100',
        //   formatData: (params) => {
        //     if (params === 0) {
        //       return '不通过';
        //     } else if (params === 1) {
        //       return '通过';
        //     } else {
        //       return null;
        //     }
        //   },
        //   formatType: (params) => {
        //     if (params === 0) {
        //       return 'danger';
        //     } else if (params === 1) {
        //       return 'success';
        //     } else {
        //       return null;
        //     }
        //   }
        // },
        {
          dataType: 'action',
          minWidth: '110',
          label: '操作',
          operation: [
            {
              name: '编辑',
              type: 'text',
              clickFun: (row) => {
                this.openFormDia('edit', row);
              },
              disabled: (row) => {
                return !!row.approve
              },
            },
            {
              name: '上传',
              type: 'upload',
              multiple:true,
              limit:20,
              accept:'.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.pdf',
              clickFun: async (row,file, fileList) => {
                const formData = new FormData();
                formData.append('file',file.raw); // æ–‡ä»¶å­—段
                formData.append('id', row.id); // æ–‡ä»¶åå­—段
                let res = await this.$axios.post(this.$api.manageReviewProgram.addReviewProgramFile, formData,{
                  headers: {
                      'Content-Type': 'multipart/form-data;'
                  },
                  noQs: true
                })
                if(res.code==200){
                  this.$message({ message: '上传成功', type: 'success' });
                  // this.searchList()
                  return
                }else{
                  this.$message({ message: '上传失败', type: 'error' });
                  return
                }
              },
              disabled: (row) => {
                return !!row.approve
              },
            },
            {
              name: '查看附件',
              type: 'text',
              clickFun: (row) => {
                this.$axios.get(this.$api.manageReviewProgram.selectReviewProgramFile + '?id='+row.id).then(res => {
                  this.listDialogVisible = true;
                  this.fileList = res.data.fileList
                });
              },
            },
            {
              name: '批准',
              type: 'text',
              clickFun: (row) => {
                this.openFormDia('ratify', row);
              },
              disabled: (row) => {
                return !!row.approve
              },
            },
            {
              name: '删除',
              type: 'text',
              color: '#f56c6c',
              clickFun: (row) => {
                this.delPlan(row)
              },
              disabled: (row) => {
                if (row.qualityStatus === 1) {
                  return true
                } else {
                  return false
                }
              },
            },
            {
              name: '下载',
              type: 'text',
              clickFun: (row) => {
                this.handleDown(row)
              }
            },
          ]
        }
      ],
      tableData: [],
      tableLoading: false,
      page: {
        size: 20,
        current: 1,
      },
      total: 0,
      managementFormDIa: false,
    };
  },
  mounted() {
    this.searchList()
  },
  // æ–¹æ³•é›†åˆ
  methods: {
    // æŸ¥è¯¢åˆ—表
    searchList () {
      this.tableLoading = true
      this.$axios.get(this.$api.manageReviewProgram.getPageReviewProgram + '?judgingLocation=' + this.searchForm.judgingLocation + '&pages=' + this.page.current + '&size=' + this.page.size).then(res => {
        this.tableLoading = false
        if (res.code === 201) return
        this.tableData = res.data.records
        this.total = res.data.total
      }).catch(err => {
        console.log('err---', err);
        this.tableLoading = false
      })
    },
    // æ–°å¢žï¼Œç¼–辑，批准弹框
    openFormDia (type, row) {
      this. managementFormDIa = true
      this.$nextTick(() => {
        this.$refs. managementFormDIa.openDia(type, row)
      })
    },
    closeImplementDia () {
      this. managementFormDIa = false
      this.searchList()
    },
    // é‡ç½®æŸ¥è¯¢æ¡ä»¶
    resetSearchForm () {
      this.searchForm.judgingLocation = '';
      this.searchList()
    },
    // åˆ é™¤
    delPlan (row) {
      this.$confirm('此操作将永久删除该数据, æ˜¯å¦ç»§ç»­?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.tableLoading = true
        this.$axios.delete(this.$api.manageReviewProgram.deleteReviewProgram + '?id=' + row.id).then(res => {
          this.tableLoading = false
          if (res.code === 201) return
          this.$message.success('删除成功')
          this.searchList()
        }).catch(err => {
          this.tableLoading = false
          console.log('err---', err);
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    // åˆ†é¡µ
    handleSizeChange(val) {
      this.page.size = val;
      this.searchList();
    },
    handleCurrentChange(val) {
      this.page.current = val;
      this.searchList();
    },
    handleDown(row){
      this.$axios.post(this.$api.manageReviewProgram.exportReviewProgram,{id:row.id},{responseType: "blob"}).then(res => {
        if(res.code == 201){
          this.$message.error(res.message)
          return
        }
        this.$message.success('下载成功')
        const blob = new Blob([res],{ type: 'application/octet-stream' });
        const url = URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.href = url;
        link.download = '评审计划.docx';
        link.click();
      })
    },
    lookFile(url,name){
      this.currentInfo.url = url
      this.currentInfo.name = name
      this.lookDialogVisible = true
    },
    handleDown0(url,name){
      if(!url) return this.$message.warning('文件未上传')
      let url0 = this.javaApi+'/word/'+url
      const link = document.createElement('a');
      link.href = url0;
      link.target = '_blank';
      link.click();
    }
  }
};
</script>

<style scoped>
.search-background {
  width: 100%;
  height: 60px;
  line-height: 60px;
  display: flex;
  justify-content: space-between;
}
.search-group {
  display: flex;
  align-items: center;
  margin: 0 20px;
}
</style>

 src/components/do/a9-management-review/meetingRecords.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,207 @@
<template>
  <div>
    <div class="search-background">
      <span class="search-group">
        <span style="width: 160px">会议地点：</span>
        <el-input v-model="searchForm.place" clearable size="small"></el-input>
        <el-button size="medium"  style="margin-left: 10px" @click="resetSearchForm">重 ç½®</el-button>
        <el-button size="medium" type="primary" @click="searchList">查 è¯¢</el-button>
      </span>
      <span class="search-group">
        <el-button size="medium" type="primary" @click="openFormDia('add')">新 å¢ž</el-button>
      </span>
    </div>
    <div class="table">
      <ZTTable
        :column="tableColumn"
        :height="'calc(100vh - 20em)'"
        :table-data="tableData"
        :table-loading="tableLoading"
        style="padding: 0 10px;margin-bottom: 16px">
      </ZTTable>
      <el-pagination :current-page="1" :page-size="page.size" :page-sizes="[10, 20, 30, 50, 100]"
                     :total="total" layout="->,total, sizes, prev, pager, next, jumper"
                     @size-change="handleSizeChange"
                     @current-change="handleCurrentChange">
      </el-pagination>
    </div>
    <meeting-records-dia v-if="meetingRecordsDia" ref="meetingRecordsDia" @closeYearDia="closeYearDia"></meeting-records-dia>
  </div>
</template>

<script>
import ZTTable from '../../caorui/ZTTable/index.vue';
import MeetingRecordsDia from './meetingRecordsDia.vue';
import ManagementFormDIa from './managementFormDIa.vue';

export default {
  name: 'meetingRecords',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: { ManagementFormDIa, MeetingRecordsDia, ZTTable },
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      searchForm: {
        place: '',
      },
      tableColumn: [
        {
          label: '时间',
          prop: 'meetingTime',
          minWidth: '100'
        },
        {
          label: '主持人',
          prop: 'compere',
          minWidth: '100'
        },
        {
          label: '会议地点',
          prop: 'place',
          minWidth: '100'
        },
        {
          label: '会议内容摘要',
          prop: 'content',
          minWidth: '100'
        },
        {
          dataType: 'action',
          minWidth: '120',
          label: '操作',
          operation: [
            {
              name: '编辑',
              type: 'text',
              clickFun: (row) => {
                this.openFormDia('edit', row);
              },
            },
            {
              name: '删除',
              type: 'text',
              color: '#f56c6c',
              clickFun: (row) => {
                this.delPlan(row)
              }
            },
            {
              name: '下载',
              type: 'text',
              clickFun: (row) => {
                this.handleDown(row)
              }
            },
          ]
        }
      ],
      tableData: [],
      tableLoading: false,
      page: {
        size: 20,
        current: 1,
      },
      total: 0,
      meetingRecordsDia: false
    };
  },
  mounted() {
    this.searchList()
  },
  // æ–¹æ³•é›†åˆ
  methods: {
    // æŸ¥è¯¢åˆ—表
    searchList () {
      this.tableLoading = true
      this.$axios.get(this.$api.manageMeeting.getPageMeeting + '?place=' + this.searchForm.place + '&pages=' + this.page.current + '&size=' + this.page.size).then(res => {
        this.tableLoading = false
        if (res.code === 201) return
        this.tableData = res.data.records
        this.total = res.data.total
      }).catch(err => {
        console.log('err---', err);
        this.tableLoading = false
      })
    },
    // æ–°å¢žï¼Œç¼–辑弹框
    openFormDia (type, row) {
      this. meetingRecordsDia = true
      this.$nextTick(() => {
        this.$refs. meetingRecordsDia.openDia(type, row)
      })
    },
    closeYearDia () {
      this. meetingRecordsDia = false
      this.searchList()
    },
    // é‡ç½®æŸ¥è¯¢æ¡ä»¶
    resetSearchForm () {
      this.searchForm.place = '';
      this.searchList()
    },
    // åˆ é™¤
    delPlan (row) {
      this.$confirm('此操作将永久删除该数据, æ˜¯å¦ç»§ç»­?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.tableLoading = true
        this.$axios.delete(this.$api.manageMeeting.deleteMeeting + '?id=' + row.id).then(res => {
          this.tableLoading = false
          if (res.code === 201) return
          this.$message.success('删除成功')
          this.searchList()
        }).catch(err => {
          this.tableLoading = false
          console.log('err---', err);
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    // åˆ†é¡µ
    handleSizeChange(val) {
      this.page.size = val;
      this.searchList();
    },
    handleCurrentChange(val) {
      this.page.current = val;
      this.searchList();
    },
    handleDown(row){
      this.$axios.post(this.$api.manageMeeting.exportMeeting,{id:row.id},{responseType: "blob"}).then(res => {
        if(res.code == 201){
          this.$message.error(res.message)
          return
        }
        this.$message.success('下载成功')
        const blob = new Blob([res],{ type: 'application/octet-stream' });
        const url = URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.href = url;
        link.download = '会议记录.docx';
        link.click();
      })
    },
  }
};
</script>

<style scoped>
.search-background {
  width: 100%;
  height: 60px;
  line-height: 60px;
  display: flex;
  justify-content: space-between;
}
.search-group {
  display: flex;
  align-items: center;
  margin: 0 20px;
}
</style>

 src/components/do/a9-management-review/meetingRecordsDia.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,173 @@
<template>
  <div>
    <el-dialog v-loading="diaLoading" :close-on-click-modal="false"
               :close-on-press-escape="false"
               :visible.sync="formDia"
               title="管理评审会议记录"
               width="1000px" @close="closeYearDia">
      <el-form ref="form" :model="form" :rules="rules" label-position="top" label-width="auto">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="时间" prop="meetingTime">
              <el-date-picker
                v-model="form.meetingTime"
                clearable
                format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                size="small" style="width: 100%"
                type="datetime" value-format="yyyy-MM-dd HH:mm:ss">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地点" prop="place">
              <el-input v-model="form.place" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="主持人" prop="compere">
              <el-input v-model="form.compere" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="会议内容摘要" prop="content">
              <el-input v-model="form.content" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="参会人员" prop="participant">
              <el-select v-model="form.participant"
                         clearable
                         filterable
                         multiple
                         placeholder="请选择"
                         size="small" style="width: 100%;">
                <el-option v-for="(item,i) in personList" :key="i" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeYearDia">取 æ¶ˆ</el-button>
        <el-button :loading="loading" type="primary" @click="handleEdit">提 äº¤</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: 'meetingRecordsDia',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: {},
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      formDia: false,
      diaLoading: false,
      loading: false,
      form: {
        id: '',
        meetingTime: '',
        compere: '',
        place: '',
        content: '',
        participant: [],
      },
      rules: {
        meetingTime: [{required: true, message: '请填写会议时间',trigger: 'blur'}],
        compere: [{required: true, message: '请填写主持人',trigger: 'blur'}],
        place: [{required: true, message: '请填写地点',trigger: 'blur'}],
        content: [{required: true, message: '请填写会议内容摘要',trigger: 'blur'}],
        participant: [{required: true, message: '请选择参加人员',trigger: 'change'}],
      },
      operationType: '',
      personList: []
    };
  },
  mounted() {

  },
  // æ–¹æ³•é›†åˆ
  methods: {
    // æ‰“开弹框
    openDia (type, row) {
      this.operationType = type
      this.getAuthorizedPerson()
      if (type !== 'add') {
        this.form = row
        this.form.participant = row.participant.split(',').map(a => {
          a = Number(a)
          return a
        })
      }
      this.formDia = true
    },
    // æäº¤å¼¹æ¡†æ•°æ®
    handleEdit () {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.loading = true
          const internalMeeting = this.HaveJson(this.form)
          internalMeeting.participant = internalMeeting.participant.join(',')
          if (this.operationType === 'add') {
            this.$axios.post(this.$api.manageMeeting.addMeeting, internalMeeting, {
              headers: {
                "Content-Type": "application/json"
              },
              noQs: true
            }).then(res => {
              this.loading = false
              if (res.code === 201) return
              this.$message.success('操作成功')
              this.closeYearDia()
            }).catch(err => {
              console.log('err---', err);
              this.loading = false
            })
          } else if (this.operationType === 'edit') {
            this.$axios.put(this.$api.manageMeeting.modifyMeeting, internalMeeting, {
              headers: {
                "Content-Type": "application/json"
              },
              noQs: true
            }).then(res => {
              this.loading = false
              if (res.code === 201) return
              this.$message.success('操作成功')
              this.closeYearDia()
            }).catch(err => {
              console.log('err---', err);
              this.loading = false
            })
          }
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    closeYearDia () {
      this.$refs.form.resetFields();
      this.formDia = false
      this.$emit('closeYearDia')
    },
    getAuthorizedPerson() {
      this.$axios.get(this.$api.user.getUserMenu).then(res => {
        let data = []
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          })
        })
        this.personList = data
      })
    },
  }
};
</script>

<style scoped>
</style>

 src/components/do/a9-management-review/reviewReport.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,279 @@
<template>
  <div>
    <div class="search-background">
      <span class="search-group">
        <span style="width: 160px">地点：</span>
        <el-input v-model="searchForm.place" clearable size="small"></el-input>
        <el-button size="medium"  style="margin-left: 10px" @click="resetSearchForm">重 ç½®</el-button>
        <el-button size="medium" type="primary" @click="searchList">查 è¯¢</el-button>
      </span>
      <span class="search-group">
        <el-button size="medium" type="primary" @click="openFormDia('add')">新 å¢ž</el-button>
      </span>
    </div>
    <div class="table">
      <ZTTable
        :column="tableColumn"
        :height="'calc(100vh - 20em)'"
        :table-data="tableData"
        :table-loading="tableLoading"
        style="padding: 0 10px;margin-bottom: 16px">
      </ZTTable>
      <el-pagination :current-page="1" :page-size="page.size" :page-sizes="[10, 20, 30, 50, 100]"
                     :total="total" layout="->,total, sizes, prev, pager, next, jumper"
                     @size-change="handleSizeChange"
                     @current-change="handleCurrentChange">
      </el-pagination>
    </div>
    <review-report-dia  v-if="reviewReportDia" ref="reviewReportDia" @closeYearDia="closeYearDia"></review-report-dia>
  </div>
</template>

<script>
import ZTTable from '../../caorui/ZTTable/index.vue';
import ReviewReportDia from './reviewReportDia.vue';

export default {
  name: 'reviewReport',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: { ReviewReportDia, ZTTable },
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      searchForm: {
        place: '',
      },
      tableColumn: [
        {
          label: '目的',
          prop: 'objective',
          minWidth: '100'
        },
        {
          label: '地点',
          prop: 'place',
          minWidth: '100'
        },
        {
          label: '主持人',
          prop: 'compere',
          minWidth: '100'
        },
        {
          label: '记录人',
          prop: 'recordPeople',
          minWidth: '100'
        },
        {
          label: '日期',
          prop: 'date',
          minWidth: '100'
        },
        {
          label: '页次',
          prop: 'page',
          minWidth: '100'
        },
        {
          label: '评审方式',
          prop: 'judgingMethod',
          minWidth: '100'
        },
        {
          label: '评审依据',
          prop: 'reviewBasis',
          minWidth: '100'
        },
        {
          dataType: 'action',
          minWidth: '160',
          label: '操作',
          operation: [
            {
              name: '编辑',
              type: 'text',
              clickFun: (row) => {
                this.openFormDia('edit', row);
              },
              disabled:(row)=>{
                return !!row.audit||!!row.approval
              }
            },
            {
              name: '审核',
              type: 'text',
              clickFun: (row) => {
                this.$confirm('确定审核通过?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.submit('audit',row)
                }).catch(() => {
                });
              },
              disabled:(row)=>{
                return !!row.audit
              }
            },
            {
              name: '批准',
              type: 'text',
              clickFun: (row) => {
                this.$confirm('确定批准通过?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.submit('approval',row)
                }).catch(() => {
                });
              },
              disabled:(row)=>{
                return !row.audit||!!row.approval
              }
            },
            {
              name: '删除',
              type: 'text',
              color: '#f56c6c',
              clickFun: (row) => {
                this.delPlan(row)
              }
            },
            {
              name: '下载',
              type: 'text',
              clickFun: (row) => {
                this.handleDown(row)
              }
            },
          ]
        }
      ],
      tableData: [],
      tableLoading: false,
      page: {
        size: 20,
        current: 1,
      },
      total: 0,
      reviewReportDia: false,
    };
  },
  mounted() {
    this.searchList()
  },
  // æ–¹æ³•é›†åˆ
  methods: {
    // æŸ¥è¯¢åˆ—表
    searchList () {
      this.tableLoading = true
      this.$axios.get(this.$api.manageReviewReport.getPageReviewReport + '?place=' + this.searchForm.place + '&pages=' + this.page.current + '&size=' + this.page.size).then(res => {
        this.tableLoading = false
        if (res.code === 201) return
        this.tableData = res.data.records
        this.total = res.data.total
      }).catch(err => {
        console.log('err---', err);
        this.tableLoading = false
      })
    },
    // æ–°å¢žï¼Œç¼–辑弹框
    openFormDia (type, row) {
      this. reviewReportDia = true
      this.$nextTick(() => {
        this.$refs. reviewReportDia.openDia(type, row)
      })
    },
    closeYearDia () {
      this. reviewReportDia = false
      this.searchList()
    },
    // é‡ç½®æŸ¥è¯¢æ¡ä»¶
    resetSearchForm () {
      this.searchForm.place = '';
      this.searchList()
    },
    // åˆ é™¤
    delPlan (row) {
      this.$confirm('此操作将永久删除该数据, æ˜¯å¦ç»§ç»­?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.tableLoading = true
        this.$axios.delete(this.$api.manageReviewReport.deleteReviewReport + '?id=' + row.id).then(res => {
          this.tableLoading = false
          if (res.code === 201) return
          this.$message.success('删除成功')
          this.searchList()
        }).catch(err => {
          this.tableLoading = false
          console.log('err---', err);
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    // åˆ†é¡µ
    handleSizeChange(val) {
      this.page.size = val;
      this.searchList();
    },
    handleCurrentChange(val) {
      this.page.current = val;
      this.searchList();
    },
    handleDown(row){
      this.$axios.post(this.$api.manageReviewReport.exportReviewReport,{id:row.id},{responseType: "blob"}).then(res => {
        if(res.code == 201){
          this.$message.error(res.message)
          return
        }
        this.$message.success('下载成功')
        const blob = new Blob([res],{ type: 'application/octet-stream' });
        const url = URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.href = url;
        link.download = '评审报告.docx';
        link.click();
      })
    },
    submit(type,row){
      let obj = row
      obj[type] = JSON.parse(localStorage.getItem("user")).name;
      this.$axios.put(this.$api.manageReviewReport.modifyReviewReport, obj, {
        headers: {
          "Content-Type": "application/json"
        },
        noQs: true
      }).then(res => {
        if (res.code === 201) return
        this.$message.success('操作成功')
        this.searchList()
      }).catch(err => {
        console.log('err---', err);
      })
    }
  }
};
</script>

<style scoped>
.search-background {
  width: 100%;
  height: 60px;
  line-height: 60px;
  display: flex;
  justify-content: space-between;
}
.search-group {
  display: flex;
  align-items: center;
  margin: 0 20px;
}
</style>

 src/components/do/a9-management-review/reviewReportDia.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,280 @@
<template>
  <div>
    <el-dialog v-loading="diaLoading" :close-on-click-modal="false"
               :close-on-press-escape="false"
               :visible.sync="formDia"
               title="管理评审会议记录"
               width="1000px" @close="closeYearDia">
      <el-form ref="form" :model="form" :rules="rules" label-position="top" label-width="auto" style="height: 75vh;overflow-y: auto;overflow-x: hidden;">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="目的" prop="objective">
              <el-input v-model="form.objective" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地点" prop="place">
              <el-input v-model="form.place" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="主持人" prop="compere">
              <el-input v-model="form.compere" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="记录人" prop="recordPeople">
              <el-input v-model="form.recordPeople" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="日期" prop="date">
              <el-date-picker
                v-model="form.date"
                clearable
                format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                size="small" style="width: 100%"
                type="datetime" value-format="yyyy-MM-dd HH:mm:ss">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="页次" prop="page">
              <el-input v-model="form.page" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="评审方式" prop="judgingMethod">
              <el-input v-model="form.judgingMethod" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="评审依据" prop="reviewBasis">
              <el-input v-model="form.reviewBasis" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="出席人员" prop="attendess">
              <!-- <el-input v-model="form.attendess    " clearable size="small"></el-input> -->
              <el-select v-model="form.attendess" size="small" style="width: 100%;" filterable clearable multiple >
                <el-option
                  v-for="item in personList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="评审输入情况" prop="reviewInputs">
              <el-input v-model="form.reviewInputs" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="评审过程概况" prop="reviewProcess">
              <el-input v-model="form.reviewProcess" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="主要议题概述" prop="mainTopic">
              <el-input v-model="form.mainTopic"
                        :rows="5"
                        clearable
                        placeholder="请输入内容，可输入几千字"
                        size="small"
                        type="textarea">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="事项" prop="matters">
              <el-input v-model="form.matters" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="负责人" prop="head">
              <el-input v-model="form.head" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="完成日期" prop="completionDate">
              <el-date-picker
                v-model="form.completionDate"
                clearable
                format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"
                size="small" style="width: 100%"
                type="datetime" value-format="yyyy-MM-dd HH:mm:ss">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="跟踪确认人" prop="trackingConfirmed">
              <el-input v-model="form.trackingConfirmed" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="跟踪情况确认记录" prop="follerUp">
              <el-input v-model="form.follerUp" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="体系评价" prop="overallEvaluation">
              <el-input v-model="form.overallEvaluation" clearable size="small"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeYearDia">取 æ¶ˆ</el-button>
        <el-button :loading="loading" type="primary" @click="handleEdit">提 äº¤</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: 'reviewReportDia',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: {},
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      formDia: false,
      diaLoading: false,
      loading: false,
      form: {
        id: '',
        objective: '',
        place: '',
        compere: '',
        recordPeople: '',
        date: '',
        page: '',
        judgingMethod: '',
        reviewBasis: '',
        attendess    : [],
        reviewInputs    : '',
        reviewProcess    : '',
        mainTopic    : '',
        matters    : '',
        head    : '',
        completionDate    : '',
        trackingConfirmed    : '',
        follerUp    : '',
        overallEvaluation    : '',
      },
      rules: {
        objective: [{required: true, message: '请填写目的',trigger: 'blur'}],
        place: [{required: true, message: '请填写地点',trigger: 'blur'}],
        compere: [{required: true, message: '请填写主持人',trigger: 'blur'}],
        recordPeople: [{required: true, message: '请填写记录人',trigger: 'blur'}],
        date: [{required: true, message: '请选择日期',trigger: 'change'}],
        completionDate: [{required: true, message: '请选择完成日期',trigger: 'change'}],
        page: [{required: true, message: '请填写页次',trigger: 'blur'}],
        judgingMethod: [{required: true, message: '请填写评审方式',trigger: 'blur'}],
        reviewBasis: [{required: true, message: '请填写评审依据',trigger: 'blur'}],
        attendess    : [{required: true, message: '请填写出席人员',trigger: 'change'}],
        reviewInputs    : [{required: true, message: '请填写评审输入情况',trigger: 'blur'}],
        reviewProcess    : [{required: true, message: '请填写评审输入情况',trigger: 'blur'}],
        mainTopic    : [{required: true, message: '请填写主要议题概述',trigger: 'blur'}],
        matters    : [{required: true, message: '请填写主要议题概述',trigger: 'blur'}],
        head    : [{required: true, message: '请填写负责人',trigger: 'blur'}],
        trackingConfirmed    : [{required: true, message: '请填写跟踪确认人',trigger: 'blur'}],
        follerUp    : [{required: true, message: '请填写跟踪确认人',trigger: 'blur'}],
        overallEvaluation    : [{required: true, message: '请填写体系评价',trigger: 'blur'}],
      },
      operationType: '',
      personList: []
    };
  },
  mounted() {

  },
  // æ–¹æ³•é›†åˆ
  methods: {
    // æ‰“开弹框
    openDia (type, row) {
      this.formDia = true
      this.operationType = type
      this.getAuthorizedPerson()
      if (type !== 'add') {
        this.form = row
        this.form.attendess = this.form.attendess?this.form.attendess.split(',').map(m=>Number(m)):[]
      }
    },
    // æäº¤å¼¹æ¡†æ•°æ®
    handleEdit () {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.loading = true
          const internalMeeting = this.HaveJson(this.form)
          internalMeeting.attendess = internalMeeting.attendess?internalMeeting.attendess.join(','):''
          if (this.operationType === 'add') {
            this.$axios.post(this.$api.manageReviewReport.addReviewReport, internalMeeting, {
              headers: {
                "Content-Type": "application/json"
              },
              noQs: true
            }).then(res => {
              this.loading = false
              if (res.code === 201) return
              this.$message.success('操作成功')
              this.closeYearDia()
            }).catch(err => {
              console.log('err---', err);
              this.loading = false
            })
          } else if (this.operationType === 'edit') {
            this.$axios.put(this.$api.manageReviewReport.modifyReviewReport, internalMeeting, {
              headers: {
                "Content-Type": "application/json"
              },
              noQs: true
            }).then(res => {
              this.loading = false
              if (res.code === 201) return
              this.$message.success('操作成功')
              this.closeYearDia()
            }).catch(err => {
              console.log('err---', err);
              this.loading = false
            })
          }
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    closeYearDia () {
      this.$refs.form.resetFields();
      this.formDia = false
      this.$emit('closeYearDia')
    },
    getAuthorizedPerson() {
      this.$axios.get(this.$api.user.getUserMenu).then(res => {
        let data = []
        res.data.forEach(a => {
          data.push({
            label: a.name,
            value: a.id
          })
        })
        this.personList = data
      })
    },
  }
};
</script>

<style scoped>
>>>.el-dialog {
  margin: 4vh auto 50px !important;
}
>>>.el-dialog__body {
  max-height: 600px;
  overflow-y: auto;
}
</style>

 src/components/view/a9-management-review.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,47 @@
<template>
  <div class="main">
    <el-tabs v-model="activeName" class="tab-panel" type="border-card">
      <el-tab-pane label="管理评审计划" name="yearPlan">
        <management-review-plan></management-review-plan>
      </el-tab-pane>
      <el-tab-pane label="会议记录" name="implementationPlan">
        <meeting-records></meeting-records>
      </el-tab-pane>
      <el-tab-pane label="评审报告" name="meetingSignIn">
        <review-report></review-report>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import ManagementReviewPlan from '../do/a9-management-review/managementReviewPlan.vue';
import MeetingRecords from '../do/a9-management-review/meetingRecords.vue';
import ReviewReport from '../do/a9-management-review/reviewReport.vue';

export default {
  name: 'a9-management-review',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: { ReviewReport, MeetingRecords, ManagementReviewPlan},
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      activeName: 'yearPlan',
    };
  },
  mounted() {

  },
  // æ–¹æ³•é›†åˆ
  methods: {}
};
</script>

<style scoped>
.main {
  padding: 15px 0;
}
.tab-panel {
  background: #fff;
}
</style>