标准调研历史数据页面

src/pages/processCenter/pages/creatProcess/bzdy/step1-9.vue

@@ -0,0 +1,392 @@
+<template>
+  <div class="bzdyStep9">
+    <!--    标准调研流程-->
+    <ProcessHeader toggle>
+      <template slot="proName">标准调研流程</template>
+      <template slot="proNode">工程研究总院院长审批</template>
+    </ProcessHeader>
+    <div class="headerTabs">
+      <div class="headerTabsItem" :class="active === '1' ? 'active' : ''" @click="handleTabs('1')">基础信息</div>
+      <div class="headerTabsItem" :class="active === '2' ? 'active' : ''" @click="handleTabs('2')">审批历史</div>
+    </div>
+    <div class="content" v-show="active === '1'">
+      <div style="flex: auto; overflow: auto;">
+        <el-form
+          ref="qbkwForm"
+          :model="form"
+          :rules="formRules"
+          class="label-input-form"
+          label-width="210px"
+        >
+          <ProcessTitle>
+            <template slot="title">基础信息</template>
+          </ProcessTitle>
+          <div class="prc-content-border">
+            <el-row :gutter="24">
+              <el-col :span="12">
+                <el-form-item label="调研标题" prop="title" class="add-form-item form-item-disabled">
+                  <el-input
+                    disabled
+                    v-model="form.title"
+                    placeholder="请输入调研标题"
+                    clearable
+                  ></el-input>
+                </el-form-item>
+                <el-form-item label="完成时间" prop="date" class="add-form-item form-item-disabled">
+                  <el-date-picker
+                    disabled
+                    v-model="form.date"
+                    type="date"
+                    placeholder="请选择完成时间">
+                  </el-date-picker>
+                </el-form-item>
+                <el-form-item label="汇总调研结果" prop="hzfileId" class="add-form-item form-item-disabled">
+                  <div v-if="form.hzfileName" @click="updateFile(form.hzfileId)" class="fileClass">
+                    {{ form.hzfileName }}
+                  </div>
+                  <div v-else>
+                    - -
+                  </div>
+                </el-form-item>
+                <!--                                <el-form-item label="批准意见" prop="textpz" class="add-form-item form-item-disabled">-->
+                <!--                                    <el-input-->
+                <!--                                            v-model="form.textpz"-->
+                <!--                                            placeholder="请输入批准意见"-->
+                <!--                                            clearable-->
+                <!--                                    ></el-input>-->
+                <!--                                </el-form-item>-->
+              </el-col>
+            </el-row>
+          </div>
+        </el-form>
+        <ProcessTitle>
+          <template slot="title">调研信息</template>
+        </ProcessTitle>
+        <div>
+          <el-table
+            :data="tableData"
+            tooltip-effect="dark"
+            class="drag-table"
+            style="width: 100%; flex: auto;"
+            border
+            :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+        fontWeight: 'bold', height: '48px'}"
+            ref="selection"
+          >
+            <el-table-column
+              type="index"
+              width="55"
+              align="center">
+            </el-table-column>
+            <el-table-column
+              prop="name"
+              label="责任人"
+              align="center">
+            </el-table-column>
+            <el-table-column
+              label="文件"
+              align="center">
+              <template slot-scope="scope">
+                <div @click="updateFile(scope.row.fileId)" class="fileClass">
+                  {{scope.row.fileName}}
+                </div>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+        <el-collapse accordion>
+          <el-collapse-item title="意见填写">
+            <div style="margin: 10px 0;">
+              <el-input
+                type="textarea"
+                :rows="3"
+                resize="none"
+                placeholder="请输入意见"
+                v-model="commentText">
+              </el-input>
+            </div>
+          </el-collapse-item>
+        </el-collapse>
+      </div>
+    </div>
+    <div class="content" v-show="active === '2'">
+      <el-table
+        height="100%"
+        ref="selection"
+        :data="histortData"
+        tooltip-effect="dark"
+        style="width: 100%"
+        border
+        row-key="id"
+        :header-cell-style="{background: '#f8f8f9', color: '#515a6e'}">
+        <el-table-column
+          prop="name"
+          label="任务步骤"
+          align="center"
+          sortable="custom"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="assignee"
+          label="任务受理人"
+          align="center"
+          sortable="custom"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="createTime"
+          label="创建时间"
+          sortable="custom"
+          align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.createTime ? $moment(scope.row.createTime).format('YYYY-MM-DD') : '' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="endTime"
+          label="完成时间"
+          align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.endTime ? $moment(scope.row.endTime).format('YYYY-MM-DD') : '' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="comment"
+          label="审批意见"
+          align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.commentText }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="completeFlag"
+          label="状态"
+          align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.endTime ? '已完成' : '未完成'}}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <el-dialog width='400px' :visible.sync="fileMadel" title="上传文件">
+      <el-upload
+        multiple
+        drag
+        :action="fileUrl"
+        ref="importfile"
+        name="file"
+        accept=".ZIP, .zip, .docx, .DOCX, .xls, .xlsx"
+        :before-upload="beginImportFile"
+        :on-success="importFileSuccess"
+        :show-file-list="false"
+      >
+        <div style="padding: 20px 0">
+          <i class="el-icon-upload" style="color: #3399ff"></i>
+          <p>点击或拖拽上传文件</p>
+        </div>
+      </el-upload>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import ProcessHeader from '../../components/ProcessHeader'
+import ProcessFooter from '../../components/ProcessFooter'
+import ProcessTitle from '../../components/ProcessTitle'
+import {inboundLiaisonDetail} from 'api/process'
+
+export default {
+  name: "bzdyStep1-9",
+  data() {
+    return {
+      histortData: [],
+      commentText: '',
+      tableData: [],
+      taskIds: this.$route.query.taskIds,
+      pId: this.$route.query.prcId,
+      active: '1', // 默认显示
+      isSubmit: false,
+      saveLoading: false,
+      form: {
+        title: '', // 调研标题
+        date: '', // 完成时间
+        hzfileId: '',
+        hzfileName: '',
+        textpz: ''
+      },
+      formRules: {
+        textpz: [
+          { required: true, message: '请输入审核意见', trigger: 'blur' },
+        ]
+      },
+      json: {},
+      fileUrl: 'api/att/attFile/upload',
+      fileMadel: false,
+    }
+  },
+  components: {
+    ProcessHeader,
+    ProcessFooter,
+    ProcessTitle
+  },
+  methods: {
+    getHistoryData () {
+      this.$http.get('lawss/activiti/get_list_by_instance', {
+        prcNum: this.$route.query.prcNum,
+      }, {}, res => {
+        this.histortData = res
+      }, e => {})
+    },
+    updateFile (fileId) {
+      window.location.href = '/api/att/attFile/downloadFile?fileId=' + fileId
+    },
+    // 导入按钮 上传之前的钩子
+    beginImportFile (file) {
+      var filename = file.name
+      var index1 = filename.lastIndexOf('.')
+      var index2 = filename.length
+      var fileSuffix = filename.substring(index1, index2)
+      // const fileSuffix = file.name.split('.')[1] // 后缀名
+      // 判断上传文件格式
+      if (fileSuffix === '.ppt' || fileSuffix === '.docx' || fileSuffix === '.DOCX' || fileSuffix === '.PPT' || fileSuffix === '.xls' || fileSuffix === '.xlsx') {
+        return true
+      } else {
+        this.spinShow = false
+        this.$message.error('文件' + file.name + '格式不正确，请上传PPT,DOCX,XLS文件')
+        return false
+      }
+      // 判断文件上传大小
+      // eslint-disable-next-line no-unreachable
+      if (file.size / 1024 / 1024 <= 200) {
+        return true
+      } else {
+        this.$message.error('文件' + file.name + '大小不超过200M')
+        return false
+      }
+      return true
+    },
+    // 导入标准数据成功后执行
+    importFileSuccess (response, file) {
+      if (response.ok) {
+        this.fileMadel = false
+        this.form.hzfileId = response.data.id
+        this.form.hzfileName = response.data.name
+        this.$message({
+          showClose: true,
+          message: response.message,
+          type: 'success'
+        })
+      }
+    },
+    fileUpload () {
+      this.fileMadel = true
+    },
+    handleTabs(name) {
+      this.active = name
+    },
+    handleSave() {},
+    handleSubmitNo() {
+      if (this.commentText) {
+        this.isSubmit = true
+        var json = this.json
+        json.commentText = this.commentText
+        json.actionFlag = 1
+        this.$http.post('lawss/activiti/completeTask', {
+          json: JSON.stringify(json),
+          taskId: this.taskIds,
+          userId: this.$store.getters.userInfo.userId
+        }, {}, res => {
+          if (res.success) {
+            this.$message.success('驳回成功')
+            this.$router.push('/processCenter')
+          }
+          this.isSubmit = false
+        })
+      } else {
+        this.$message.warning('请输入反馈意见')
+      }
+    },
+    getData() {
+      return new Promise((resolve, reject) => {
+        inboundLiaisonDetail({
+          taskIds: this.taskIds,
+          pId: this.pId
+        }).then(res => {
+          let data = JSON.parse(res.mesg)
+          this.form.title = data.title || data.form.title
+          this.form.date = data.date || data.form.date
+          this.json = data || data.form
+          this.tableData = data.responUserList || data.form.responUserList
+          this.form.hzfileId = data.hzfileId || data.form.hzfileId
+          this.form.hzfileName = data.hzfileName || data.form.hzfileName
+        }).catch(e => {
+        })
+      })
+    },
+  },
+  mounted () {
+    this.getHistoryData()
+    this.getData()
+  }
+}
+</script>
+
+<style lang="less" scoped>
+@import '~@/assets/styles/style';
+.bzdyStep9 {
+  /deep/.el-drawer__container {
+    .prc-content-border {
+      border: none;
+      padding: 0 20px 0;
+    }
+  }
+  position: relative;
+  height: 100%;
+  .fileClass {
+    cursor: pointer;
+  }
+  .fileClass:hover{
+    color: #0c91e5;
+  }
+  .headerTabs {
+    height: 52px;
+    display: flex;
+    align-items: center;
+    position: absolute;
+    top: 0;
+    right: 10px;
+    .headerTabsItem {
+      border: 1px solid #c1c1c1;
+      padding: 0 5px;
+      height: 30px;
+      line-height: 30px;
+      cursor: pointer;
+    }
+    .active {
+      border: 1px solid #E6A23C;
+      color: #fff;
+      background: #E6A23C;
+    }
+  }
+  .content {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    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;
+      }
+    }
+  }
+}
+</style>

src/pages/processCenter/pages/processDetail/index.vue

@@ -219,8 +219,12 @@ export default {
           }else{
             this.toProcessDetail('xmpg2Step1-2',row)
           }
+          //标准解读流程
         }else if(prcType === '9'){
           this.toProcessDetail('bzjdStep1-6',row)
+          //标准调研流程
+        }else if(prcType === '2'){
+          this.toProcessDetail('bzdyStep1-9',row)
         }
       } else {
         this.$message.warning('当前流程未全部办理完成，无法查看')

src/router/index.js

@@ -799,6 +799,15 @@ const routes = [
           title: '标准调研流程'
         }
       },
+      {
+        path: '/bzdyStep1-9',
+        name: 'bzdyStep1-9',
+        component: () => import('@/pages/processCenter/pages/creatProcess/bzdy/step1-9.vue'),
+        meta: {
+          requireAuth: true,
+          title: '标准调研流程'
+        }
+      },
       {
         path: '/bzjdStep1',
         name: 'bzjdStep1',