From 17919a03f78838a35016196b32519f1f1a1046b0 Mon Sep 17 00:00:00 2001
From: shenyanpei <shenyanpei>
Date: Wed, 27 Oct 2021 16:59:33 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=96=E9=83=A8=E6=A0=87=E5=87=86=E5=8C=96?=
 =?UTF-8?q?=E5=8D=8F=E4=BC=9A=E5=8F=82=E4=BC=9A=E6=B5=81=E7=A8=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pages/creatProcess/bzhHd-rh/step1.vue     |  10 +-
 .../pages/creatProcess/bzhHd-rh/step2.vue     |   1 +
 .../pages/creatProcess/bzhHy-ch/step1.vue     | 450 +++++++++++++++++-
 .../pages/creatProcess/bzhHy-ch/step2.vue     | 367 +++++++++++++-
 .../pages/creatProcess/bzhHy-ch/step3.vue     | 394 ++++++++++++++-
 .../pages/creatProcess/bzhHy-ch/step4.vue     | 371 ++++++++++++++-
 .../pages/creatProcess/bzhHy-ch/step5.vue     | 365 +++++++++++++-
 7 files changed, 1934 insertions(+), 24 deletions(-)

diff --git a/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step1.vue b/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step1.vue
index 78d9bd1d8..dd60c72b3 100644
--- a/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step1.vue
+++ b/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step1.vue
@@ -33,7 +33,7 @@
               <el-col :span="8">
                 <el-form-item v-if="rh_pageData.comityName !== ''">
                   <el-select
-                    v-model="rh_pageData.comityName2"
+                    v-model="rh_pageData.comityNameOne"
                     placeholder="请选择分标委">
                     <el-option
                       v-for="item in comityNameOptions"
@@ -44,9 +44,9 @@
                 </el-form-item>
               </el-col>
               <el-col :span="8">
-                <el-form-item label="" v-if="rh_pageData.comityName !== '' && rh_pageData.comityName2 !== ''">
+                <el-form-item label="" v-if="rh_pageData.comityName !== '' && rh_pageData.comityNameOne !== ''">
                   <el-select
-                    v-model="rh_pageData.comityName3"
+                    v-model="rh_pageData.comityNameTwo"
                     placeholder="请选择工作组">
                     <el-option
                       v-for="item in comityNameOptions"
@@ -388,8 +388,8 @@ export default {
       active: '1', // 默认显示
       rh_pageData: {
         comityName: '',
-        comityName2: '',
-        comityName3: '',
+        comityNameOne: '',
+        comityNameTwo: '',
         comityRole: '',
         comityState: '',
         comityKind: '',
diff --git a/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step2.vue b/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step2.vue
index 23a0d5765..da483b5c1 100644
--- a/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step2.vue
+++ b/src/pages/processCenter/pages/creatProcess/bzhHd-rh/step2.vue
@@ -115,6 +115,7 @@
             </ProcessTitle>
             <el-form-item label="入会人员:">
               <el-input
+                clearable
                 style="width: 30%"
                 placeholder="请选择入会人员"
                 v-model="rh_pageData.comityInRole"
diff --git a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step1.vue b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step1.vue
index 62a87e0b5..c3dc1c60a 100644
--- a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step1.vue
+++ b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step1.vue
@@ -1,13 +1,455 @@
+<!--外部标准化协会参会流程-->
 <template>
-
+  <div class="bzchStep1">
+    <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;">
+        <ProcessTitle>
+          <template slot="title">基础信息</template>
+        </ProcessTitle>
+        <div class="content_form">
+          <el-form ref="ch_pageData" :model="ch_pageData" :rules="ch_rules" label-width="auto">
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议名称:">
+                  <el-input
+                    v-model="ch_pageData.meetingName"
+                    placeholder="请填写"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="主办单位:">
+                  <el-input v-model="ch_pageData.primaryUnit" placeholder="请填写"/>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="协会名称:">
+                  <el-select v-model="ch_pageData.associaName" placeholder="请选择"></el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8" v-if="ch_pageData.associaName !== ''">
+                <el-form-item>
+                  <el-select v-model="ch_pageData.associaNameOne" placeholder="请选择"></el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8" v-if="ch_pageData.associaName !== '' && ch_pageData.associaNameOne !== ''">
+                <el-form-item>
+                  <el-select v-model="ch_pageData.associaNameTwo" placeholder="请选择"></el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议时间:">
+                  <el-date-picker
+                    v-model="ch_pageData.meetingTime"
+                    type="datetime"
+                    placeholder="选择日期时间"
+                    align="right">
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="会议地点:">
+                  <el-input v-model="ch_pageData.meetingPlace" placeholder="请填写"/>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="费用标准:">
+                  <el-input v-model="ch_pageData.feeStand" placeholder="请填写"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="费用列支:">
+                  <el-select v-model="ch_pageData.feeKind" placeholder="请选择"></el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="上传附件:" prop="uploadFile">
+                  <el-upload></el-upload>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="类别:">
+                  <el-radio v-model="ch_pageData.sort" label="1">计划内</el-radio>
+                  <el-radio v-model="ch_pageData.sort" label="2">计划外</el-radio>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item>
+              <div class="table_btn">
+                <el-button type="primary" size="small" @click="meeting_add">添加</el-button>
+                <el-button type="danger" size="small" @click="meeting_delete">批量删除</el-button>
+              </div>
+              <el-table
+                class="meeting_table"
+                :data="ch_pageData.meetingTable"
+                border
+                ref="entryTable"
+                height="49%"
+                @selection-change="selectedDelete"
+                style="width: 100%"
+                :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '20px'}">
+                <el-table-column type="selection" width="55" align="center"/>
+                <el-table-column type="index" width="50" align="center"/>
+                <el-table-column label="议题" align="center">
+                  <template slot-scope="scope">
+                    <el-input v-model="scope.row.meetingTheme" placeholder="请填写"></el-input>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+    </div>
+    <div class="content" v-show="active === '2'">
+      <div class="block" style="padding-top: 20px;">
+        <el-timeline>
+          <el-form
+            ref="roleForm"
+            :model="roleForm"
+            :rules="roleFormRules"
+            class="label-input-form">
+            <el-timeline-item timestamp="发起流程" placement="top" :color="roleForm.startUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="startUserName" style="margin-bottom: 0">
+                  <h4>流程发起人</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.startUser" :disabled="true" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.startUserName" :disabled="true" placeholder="流程发起人"></el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="指派人员" placement="top" :color="roleForm.dockUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>分委会主任/部门中心主任</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.dockUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.dockUserName" placeholder="选择指派人员" @click.native="choiceZRR('dockUser', '选择指派人员', roleForm.dockUser)">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="填写信息" placement="top" :color="roleForm.dockUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>责任工程师</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.dutyUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.dutyUserName" :disabled="true" placeholder="责任工程师">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="审批" placement="top" :color="roleForm.uploadUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>参会人员所在部门中心主任</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.uploadUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.uploadUserName" :disabled="true" placeholder="参会人员所在部门中心主任">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="汇总修订" placement="top" :color="roleForm.dockUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>标准法规部人员</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.dockUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.dockUserName" :disabled="true" placeholder="选择标准法规部人员" @click.native="choiceZRR('dockUser', '选择标准法规部人员', roleForm.dockUser)">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="审批" placement="top" :color="roleForm.dockUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>标准法规部主管中心主任</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.dockUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.dockUserName" :disabled="true" placeholder="选择标准法规部主管中心主任" @click.native="choiceZRR('dockUser', '选择标准法规部主管中心主任', roleForm.dockUser)">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="会签" placement="top" :color="roleForm.dockUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>管理推荐部</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.dockUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.dockUserName" :disabled="true" placeholder="选择管理推荐部" @click.native="choiceZRR('dockUser', '选择管理推荐部', roleForm.dockUser)">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="审定" placement="top" :color="roleForm.dockUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>技术委员会常务副主任/总院院长</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.dockUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.dockUserName" :disabled="true" placeholder="选择人员" @click.native="choiceZRR('dockUser', '选择人员', roleForm.dockUser)">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="批准" placement="top" :color="roleForm.dockUser ? '#66b1ff' : ''">
+              <el-card>
+                <el-form-item prop="dockUserName" style="margin-bottom: 0">
+                  <h4>技术委员会主任</h4>
+                  <div style="margin-top: 10px;width: 300px;">
+                    <el-input v-model="roleForm.dockUser" style="display: none;"></el-input>
+                    <el-input v-model="roleForm.dockUserName" :disabled="true" placeholder="选择技术委员会主任" @click.native="choiceZRR('dockUser', '选择技术委员会主任', roleForm.dockUser)">
+                    </el-input>
+                  </div>
+                </el-form-item>
+              </el-card>
+            </el-timeline-item>
+          </el-form>
+        </el-timeline>
+      </div>
+    </div>
+    <ProcessFooter
+      show-save
+      show-submit
+      :submitLoading="isSubmit"
+      :saveLoading="saveLoading"
+      @save="handleSave"
+      @submit="handleSubmit"
+    >
+    </ProcessFooter>
+    <Role-tree
+      check-box
+      is-title="选择人员信息"
+      :is-visible.sync="roleShowflag"
+      :nodeList="nodeList"
+      @checkedRole="drawerCheck"
+    />
+  </div>
 </template>
 
 <script>
+import ProcessHeader from '../../components/ProcessHeader'
+import ProcessFooter from '../../components/ProcessFooter'
+import ProcessTitle from '../../components/ProcessTitle'
+import { startProcess, saveTaskFirst,completeTask } from '@/api/process.js'
 export default {
-  name: "bzchStep1"
+  components: {
+    ProcessHeader,
+    ProcessFooter,
+    ProcessTitle
+  },
+  name: "bzchStep1",
+  data() {
+    return {
+      active: '1',
+
+      ch_pageData: {
+        meetingName: '',
+        primaryUnit: '',
+        associaName: '',
+        associaNameOne: '',
+        associaNameTwo: '',
+        meetingTime: '',
+        meetingPlace: '',
+        feeStand: '',
+        feeKind: '',
+        uploadFile: '',
+        sort: '1',
+        meetingTable: [],
+      },
+      ch_rules: {},
+      roleForm: {
+        startUserName: this.$store.getters.userInfo.userName,
+        startUser: this.$store.getters.userInfo.userId,
+        dockUserName: '',
+        dockUser: ''
+      },
+      roleFormRules: {
+        dockUserName: [{ required: true, message: "请选择标准法规工程师", trigger: ['blur', 'change']}]
+      },
+      deleteDataList: [],
+
+      nodeList: [],
+      roleShowflag: false,
+      isSubmit: false,
+      saveLoading: false,
+    }
+  },
+  methods: {
+    // 右上标签页面切换
+    handleTabs(name) {
+      this.active = name
+    },
+
+    meeting_add() {
+      var list = {
+        meetingTheme: this.meetingTheme,
+      }
+      this.ch_pageData.meetingTable.push(list)
+    },
+    meeting_delete() {
+      if (this.deleteDataList.length < 1) {
+        this.$message.warning("请选择一条数据进行删除");
+      } else {
+        this.$confirm("您确认删除这些数据?", "提示", {
+          confirmButtonText: "确认",
+          confirmButtonClass: "common-button-primary",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(() => {
+          let exits = [];
+          this.deleteDataList.map(item => {
+            let index
+            index = this.ch_pageData.meetingTable.findIndex(items => {
+              return items === item
+            })
+            if (index > -1) {
+              this.ch_pageData.meetingTable.splice(index, 1)
+            }
+            exits.push(item)
+          })
+          this.deleteDataList = []
+        }).catch(() => {
+        })
+      }
+    },
+    selectedDelete(val) {
+      this.deleteDataList = val
+    },
+    // 流程阶段负责人选择
+    choiceZRR (type, title, id) {
+      this.nodeList = []
+      this.nodeList.push(id)
+      this.type = type
+      this.drawerTitle = title
+      this.roleShowflag = true
+    },
+    drawerCheck (data) {
+      this.unqualidiedData.forEach(item => {
+        item.engineer = data[0].name
+        item.engineerId = data[0].id
+      })
+      this.roleForm.dockUser = data[0].id
+      this.roleForm.dockUserName = data[0].name
+      this.roleShowflag = false
+    },
+    /** 保存按钮*/
+    handleSave() {},
+    /** 提交按钮*/
+    handleSubmit() {}
+
+  }
 }
 </script>
 
-<style scoped>
-
+<style lang="less" scoped>
+@import '~@/assets/styles/style';
+.bzchStep1 {
+  position: relative;
+  height: 100%;
+  /deep/.el-drawer__container {
+    .prc-content-border {
+      border: none;
+      padding: 0 20px 0;
+    }
+  }
+  .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-center {
+    padding: 10px 0px 10px 10px;
+  }
+  .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;
+      }
+    }
+  }
+  .content_form {
+    padding-top: 15px;
+    padding-left: 30px;
+    .el-divider--horizontal {
+      margin-top: 0px;
+    }
+    /deep/.el-table__body-wrapper {
+      height: auto!important;
+    }
+    .el-select {
+      width: 100%;
+    }
+    .el-date-editor.el-input {
+      width: 100%;
+    }
+    .table_btn {
+      text-align: right;
+    }
+    .meeting_table {
+      /deep/.el-input__inner {
+        text-align: center;
+      }
+    }
+    /deep/.el-table th {
+      padding: 0px;
+    }
+  }
+}
 </style>
diff --git a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step2.vue b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step2.vue
index 29fa1080d..0ae0c1ae0 100644
--- a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step2.vue
+++ b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step2.vue
@@ -1,13 +1,372 @@
 <template>
-
+  <div class="bzchStep2">
+    <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 === '3' ? 'active' : ''" @click="handleTabs('3')">审批历史</div>
+    </div>
+    <div class="content" v-show="active === '1'">
+      <div style="flex: auto; overflow: auto;">
+        <ProcessTitle>
+          <template slot="title">基础信息</template>
+        </ProcessTitle>
+        <div class="content_form">
+          <el-form ref="ch_pageData" :model="ch_pageData" :rules="ch_rules" label-width="auto">
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议名称:">
+                  {{ ch_pageData.meetingName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="主办单位:">
+                  {{ ch_pageData.primaryUnit || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="协会名称:">
+                  {{ ch_pageData.associaName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="会议时间:">
+                  {{ ch_pageData.meetingTime || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议地点:">
+                  {{ ch_pageData.meetingPlace || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="费用标准:">
+                  {{ ch_pageData.feeStand || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="费用列支:">
+                  {{ ch_pageData.feeKind || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="上传附件:" prop="uploadFile">
+                  <el-upload></el-upload>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="类别:">
+                  {{ ch_pageData.sort || '-'}}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item>
+              <el-table
+                class="meeting_table"
+                :data="ch_pageData.meetingTable"
+                border
+                ref="entryTable"
+                height="49%"
+                style="width: 100%"
+                :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '20px'}">
+                <el-table-column type="index" width="50" align="center"/>
+                <el-table-column label="议题" align="center" prop="ch_pageData.meetingTable.meetingTheme"/>
+              </el-table>
+            </el-form-item>
+            <ProcessTitle>
+              <template slot="title">选择人员</template>
+            </ProcessTitle>
+            <el-form-item label="入会人员:">
+              <el-input
+                style="width: 30%"
+                clearable
+                placeholder="请选择入会人员"
+                v-model="ch_pageData.meetingInRole"
+                @click.native="inRoleChice">
+              </el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+    </div>
+    <div class="content" v-show="active === '3'">
+      <div class="flow-list">
+        <el-table
+          height="100%"
+          ref="selection"
+          :data="detailData"
+          tooltip-effect="dark"
+          style="width: 100%"
+          border
+          row-key="id"
+          :no-data-text="listNoDataText"
+          :header-cell-style="{background: '#f8f8f9', color: '#515a6e'}"
+        >
+          <el-table-column
+            type="selection"
+            width="55"
+            align="center">
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            label="任务步骤"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="assignee"
+            label="任务受理人"
+            align="center"
+          >
+          </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>
+        <loading :loading="loading">流程列表加载中</loading>
+      </div>
+    </div>
+    <ProcessFooter
+      show-save
+      show-submit
+      show-back
+      backBTNTexts="不涉及"
+      :submitLoading="isSubmit"
+      :saveLoading="saveLoading"
+      @back="handleSubmitNo"
+      @save="handleSave"
+      @submit="handleSubmit"
+    >
+    </ProcessFooter>
+    <Role-tree
+      is-title="选择人员信息"
+      :is-visible.sync="roleShowflag"
+      :nodeList="nodeList"
+      @checkedRole="drawerCheck"
+    />
+  </div>
 </template>
 
 <script>
+import ProcessHeader from "../../components/ProcessHeader";
+import ProcessFooter from "../../components/ProcessFooter";
+import ProcessTitle from "../../components/ProcessTitle";
+import { startProcess, saveTaskFirst,completeTask, inboundLiaisonDetail } from '@/api/process.js'
 export default {
-  name: "bzchStep2"
+  components: {
+    ProcessHeader,
+    ProcessFooter,
+    ProcessTitle
+  },
+  name: "bzchStep2",
+  data() {
+    return {
+      active: '1',
+
+      ch_pageData: {},
+      ch_rules: {},
+      nodeList: [],
+
+      isSubmit: false,
+      saveLoading: false,
+      roleShowflag: false,
+      detailData: [],
+      loading: false,
+
+      taskIds: this.$route.query.taskIds,
+      pId: this.$route.query.prcId,
+    }
+  },
+  computed: {
+    listNoDataText() {
+      return this.processType === 1 ? "暂无待办流程" : "暂无已办流程";
+    }
+  },
+  created() {
+    this.processTable()
+    this.getData()
+  },
+  methods: {
+    // 右上标签页面切换
+    handleTabs(name) {
+      this.active = name
+    },
+
+    processTable() {
+      this.$http.get("lawss/activiti/get_list_by_instance", {
+        prcNum: this.$route.query.prcNum,
+        sortWord: this.shunxu ? this.paixu : "",
+        shunxu: this.shunxu
+      }, {
+        loading: "loading",
+        _this: this
+      }, res => {
+        this.detailData = res
+      }, e => {
+      })
+    },
+
+    getData() {
+      const params = {
+        taskIds: this.taskIds,
+        pId: this.pId,
+      }
+      inboundLiaisonDetail(params).then(res => {
+        const processForm = JSON.parse(res.mesg)
+        this.getFormFieldList(processForm)
+      })
+    },
+    getFormFieldList (item) {
+      this.$nextTick(() => {
+        this.rh_pageData = JSON.parse(JSON.stringify(item)).ch_pageData
+        // this.rh_pageData.comityFileNum = this.fileTextList
+      })
+    },
+    // 流程阶段负责人选择
+    inRoleChice (type, title, id) {
+      this.nodeList = []
+      this.nodeList.push(id)
+      this.type = type
+      this.drawerTitle = title
+      this.roleShowflag = true
+    },
+    drawerCheck (data) {
+      var idList = ''
+      var nameList = ''
+      data.forEach(item => {
+        if (nameList.length > 0) {
+          nameList += ','
+          idList += ','
+        }
+        idList += item.id;
+        nameList += item.name;
+      });
+      this.ch_pageData.meetingInRole = nameList
+      this.ch_pageData.meetingInRoleId = idList
+      this.roleShowflag = false
+    },
+    // 退回按钮
+    handleSubmitNo() {},
+    // 保存按钮
+    handleSave() {
+    },
+    // 提交按钮
+    handleSubmit() {
+    }
+  }
 }
 </script>
 
-<style scoped>
-
+<style lang="less" scoped>
+@import '~@/assets/styles/style';
+.bzchStep2 {
+  position: relative;
+  height: 100%;
+  /deep/.el-drawer__container {
+    .prc-content-border {
+      border: none;
+      padding: 0 20px 0;
+    }
+  }
+  .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-center {
+    padding: 10px 0px 10px 10px;
+  }
+  .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;
+      }
+    }
+  }
+  .content_form {
+    padding-top: 15px;
+    padding-left: 30px;
+    .el-divider--horizontal {
+      margin-top: 0px;
+    }
+    /deep/.el-table__body-wrapper {
+      height: auto!important;
+    }
+    /deep/.el-textarea__inner {
+      font-family: inherit;
+    }
+    /deep/.el-table th {
+      padding: 0px;
+    }
+  }
+}
 </style>
diff --git a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step3.vue b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step3.vue
index 3c867fffa..949394dbc 100644
--- a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step3.vue
+++ b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step3.vue
@@ -1,13 +1,401 @@
 <template>
-
+  <div class="bzchStep3">
+    <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;">
+        <ProcessTitle>
+          <template slot="title">基础信息</template>
+        </ProcessTitle>
+        <div class="content_form">
+          <el-form ref="ch_pageData" :model="ch_pageData" :rules="ch_rules" label-width="auto">
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议名称:">
+                  {{ ch_pageData.meetingName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="主办单位:">
+                  {{ ch_pageData.primaryUnit || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="协会名称:">
+                  {{ ch_pageData.associaName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="会议时间:">
+                  {{ ch_pageData.meetingTime || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议地点:">
+                  {{ ch_pageData.meetingPlace || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="费用标准:">
+                  {{ ch_pageData.feeStand || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="费用列支:">
+                  {{ ch_pageData.feeKind || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="上传附件:" prop="uploadFile">
+                  <el-upload></el-upload>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="类别:">
+                  {{ ch_pageData.sort || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item>
+              <el-table
+                class="meeting_table"
+                :data="ch_pageData.meetingTable"
+                border
+                ref="entryTable"
+                height="49%"
+                style="width: 100%"
+                :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '20px'}">
+                <el-table-column type="index" width="50" align="center"/>
+                <el-table-column label="议题" align="center" prop="ch_pageData.meetingTable.meetingTheme"/>
+              </el-table>
+            </el-form-item>
+            <ProcessTitle>
+              <template slot="title">填写信息</template>
+            </ProcessTitle>
+            <el-row>
+              <el-col :span="8">
+                <el-form-item label="人员:">
+                  <el-input
+                    style="width: 100%"
+                    placeholder="请填写"
+                    v-model="ch_pageData.fillPeople"
+                  />
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="单位:">
+                  <el-input
+                    style="width: 100%"
+                    placeholder="请填写"
+                    v-model="ch_pageData.fillUnit"
+                  />
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="部门:">
+                  <el-input
+                    style="width: 100%"
+                    placeholder="请填写部门"
+                    v-model="ch_pageData.fillDept"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="8">
+                <el-form-item label="参与人部门领导:">
+                  <el-input
+                    style="width: 100%"
+                    placeholder="请填写"
+                    v-model="ch_pageData.fillLeader"
+                  />
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="电话:">
+                  <el-input
+                    style="width: 100%"
+                    placeholder="请填写电话"
+                    v-model="ch_pageData.fillTel"
+                  />
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="邮箱:">
+                  <el-input
+                    style="width: 100%"
+                    placeholder="请填写邮箱"
+                    v-model="ch_pageData.fillMail"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </div>
+    </div>
+    <div class="content" v-show="active === '3'">
+      <div class="flow-list">
+        <el-table
+          height="100%"
+          ref="selection"
+          :data="detailData"
+          tooltip-effect="dark"
+          style="width: 100%"
+          border
+          row-key="id"
+          :no-data-text="listNoDataText"
+          :header-cell-style="{background: '#f8f8f9', color: '#515a6e'}"
+        >
+          <el-table-column
+            type="selection"
+            width="55"
+            align="center">
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            label="任务步骤"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="assignee"
+            label="任务受理人"
+            align="center"
+          >
+          </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>
+        <loading :loading="loading">流程列表加载中</loading>
+      </div>
+    </div>
+    <ProcessFooter
+      show-save
+      show-submit
+      :submitLoading="isSubmit"
+      :saveLoading="saveLoading"
+      @save="handleSave"
+      @submit="handleSubmit"
+    >
+    </ProcessFooter>
+  </div>
 </template>
 
 <script>
+import ProcessHeader from "../../components/ProcessHeader";
+import ProcessFooter from "../../components/ProcessFooter";
+import ProcessTitle from "../../components/ProcessTitle";
+import {startProcess, saveTaskFirst, completeTask, inboundLiaisonDetail } from '@/api/process.js'
+
 export default {
-  name: "bzchStep3"
+  components: {
+    ProcessHeader,
+    ProcessFooter,
+    ProcessTitle
+  },
+  name: "bzchStep3",
+  data() {
+    return {
+      active: '1',
+
+      ch_pageData: {},
+      ch_rules: {},
+
+      detailData: [],
+      loading: false,
+
+
+      isSubmit: false,
+      saveLoading: false,
+
+      taskIds: this.$route.query.taskIds,
+      pId: this.$route.query.prcId,
+    }
+  },
+  computed: {
+    listNoDataText() {
+      return this.processType === 1 ? "暂无待办流程" : "暂无已办流程";
+    }
+  },
+  created() {
+    this.processTable()
+    this.getData()
+  },
+  methods: {
+    // 右上标签页面切换
+    handleTabs(name) {
+      this.active = name
+    },
+    processTable() {
+      this.$http.get("lawss/activiti/get_list_by_instance", {
+        prcNum: this.$route.query.prcNum,
+        sortWord: this.shunxu ? this.paixu : "",
+        shunxu: this.shunxu
+      }, {
+        loading: "loading",
+        _this: this
+      }, res => {
+        this.detailData = res
+      }, e => {
+      })
+    },
+
+    getData() {
+      const params = {
+        taskIds: this.taskIds,
+        pId: this.pId,
+      }
+      inboundLiaisonDetail(params).then(res => {
+        const processForm = JSON.parse(res.mesg)
+        this.getFormFieldList(processForm)
+      })
+    },
+    getFormFieldList (item) {
+      this.$nextTick(() => {
+        this.rh_pageData = JSON.parse(JSON.stringify(item)).rh_pageData
+        // this.rh_pageData.comityFileNum = this.fileTextList
+      })
+    },
+    // 保存按钮
+    handleSave() {
+    },
+    // 提交按钮
+    handleSubmit() {
+    }
+  }
 }
 </script>
 
-<style scoped>
+<style lang="less" scoped>
+@import '~@/assets/styles/style';
 
+.bzchStep3 {
+  position: relative;
+  height: 100%;
+
+  /deep/ .el-drawer__container {
+    .prc-content-border {
+      border: none;
+      padding: 0 20px 0;
+    }
+  }
+
+  .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-center {
+    padding: 10px 0px 10px 10px;
+  }
+
+  .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;
+      }
+    }
+  }
+
+  .content_form {
+    padding-left: 30px;
+    padding-top: 15px;
+
+    .el-divider--horizontal {
+      margin-top: 0px;
+    }
+
+    /deep/ .el-table__body-wrapper {
+      height: auto !important;
+    }
+
+    /deep/ .el-textarea__inner {
+      font-family: inherit;
+    }
+
+    /deep/ .el-table th {
+      padding: 0px;
+    }
+  }
+}
 </style>
diff --git a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step4.vue b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step4.vue
index 6103a6f03..074766923 100644
--- a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step4.vue
+++ b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step4.vue
@@ -1,13 +1,376 @@
 <template>
-
+  <div class="bzchStep4">
+    <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 === '3' ? 'active' : ''" @click="handleTabs('3')">审批历史</div>
+    </div>
+    <div class="content" v-show="active === '1'">
+      <div style="flex: auto; overflow: auto;">
+        <ProcessTitle>
+          <template slot="title">基础信息</template>
+        </ProcessTitle>
+        <div class="content_form">
+          <el-form ref="ch_pageData" :model="ch_pageData" :rules="ch_rules" label-width="auto">
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议名称:">
+                  {{ ch_pageData.meetingName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="主办单位:">
+                  {{ ch_pageData.primaryUnit || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="协会名称:">
+                  {{ ch_pageData.associaName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="会议时间:">
+                  {{ ch_pageData.meetingTime || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议地点:">
+                  {{ ch_pageData.meetingPlace || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="费用标准:">
+                  {{ ch_pageData.feeStand || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="费用列支:">
+                  {{ ch_pageData.feeKind || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="上传附件:" prop="uploadFile">
+                  <el-upload></el-upload>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="类别:">
+                  {{ ch_pageData.sort || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="议题:">
+              <el-table
+                class="meeting_table"
+                :data="ch_pageData.meetingTable"
+                border
+                ref="entryTable"
+                height="49%"
+                style="width: 100%"
+                :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '20px'}">
+                <el-table-column type="index" width="50" align="center"/>
+                <el-table-column label="议题" align="center" prop="ch_pageData.meetingTable.meetingTheme"/>
+              </el-table>
+            </el-form-item>
+            <el-form-item label="入会人员:">
+              <el-table
+                :data="ch_pageData.myPartRole"
+                border
+                ref="entryTable"
+                height="49%"
+                style="width: 100%"
+                :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '20px'}">
+                <el-table-column type="index" width="50" align="center"/>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillPeople"
+                  align="center"
+                  label="人员">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillUnit"
+                  align="center"
+                  label="单位">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillDept"
+                  align="center"
+                  label="部门">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillTel"
+                  align="center"
+                  label="电话">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillMail"
+                  align="center"
+                  label="邮箱">
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-form>
+        </div>
+        <el-collapse accordion>
+          <el-collapse-item title="回执说明">
+            <div style="margin: 10px 0;">
+              <el-input
+                type="textarea"
+                :rows="3"
+                resize="none"
+                placeholder="请输入意见"
+                v-model="textarea">
+              </el-input>
+            </div>
+          </el-collapse-item>
+        </el-collapse>
+      </div>
+    </div>
+    <div class="content" v-show="active === '3'">
+      <div class="flow-list">
+        <el-table
+          height="100%"
+          ref="selection"
+          :data="detailData"
+          tooltip-effect="dark"
+          style="width: 100%"
+          border
+          row-key="id"
+          :no-data-text="listNoDataText"
+          :header-cell-style="{background: '#f8f8f9', color: '#515a6e'}"
+        >
+          <el-table-column
+            type="selection"
+            width="55"
+            align="center">
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            label="任务步骤"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="assignee"
+            label="任务受理人"
+            align="center"
+          >
+          </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>
+        <loading :loading="loading">流程列表加载中</loading>
+      </div>
+    </div>
+    <ProcessFooter
+      show-save
+      show-submit
+      :submitLoading="isSubmit"
+      :saveLoading="saveLoading"
+      @save="handleSave"
+      @submit="handleSubmit"
+    >
+    </ProcessFooter>
+  </div>
 </template>
 
 <script>
+import ProcessHeader from "../../components/ProcessHeader";
+import ProcessFooter from "../../components/ProcessFooter";
+import ProcessTitle from "../../components/ProcessTitle";
+import { startProcess, saveTaskFirst,completeTask, inboundLiaisonDetail } from '@/api/process.js'
 export default {
-  name: "bzchStep4"
+  components: {
+    ProcessHeader,
+    ProcessFooter,
+    ProcessTitle
+  },
+  name: "bzchStep4",
+  data() {
+    return {
+      active: '1',
+
+      ch_pageData: {
+        myPartRole: [],
+      },
+      ch_rules: {},
+      textarea: '',
+
+      isSubmit: false,
+      saveLoading: false,
+
+      detailData: [],
+      loading: false,
+
+    }
+  },
+  computed: {
+    listNoDataText() {
+      return this.processType === 1 ? "暂无待办流程" : "暂无已办流程";
+    }
+  },
+  created() {
+    this.processTable()
+    this.getData()
+  },
+  methods: {
+    // 右上标签页面切换
+    handleTabs(name) {
+      this.active = name
+    },
+    processTable() {
+      this.$http.get("lawss/activiti/get_list_by_instance", {
+        prcNum: this.$route.query.prcNum,
+        sortWord: this.shunxu ? this.paixu : "",
+        shunxu: this.shunxu
+      }, {
+        loading: "loading",
+        _this: this
+      }, res => {
+        this.detailData = res
+      }, e => {
+      })
+    },
+
+    getData() {
+      const params = {
+        taskIds: this.taskIds,
+        pId: this.pId,
+      }
+      inboundLiaisonDetail(params).then(res => {
+        const processForm = JSON.parse(res.mesg)
+        this.getFormFieldList(processForm)
+      })
+    },
+    getFormFieldList (item) {
+      this.$nextTick(() => {
+        this.ch_pageData = JSON.parse(JSON.stringify(item)).ch_pageData
+        // this.ch_pageData.comityFileNum = this.fileTextList
+      })
+    },
+    // 保存按钮
+    handleSave() {
+    },
+    // 提交按钮
+    handleSubmit() {
+    }
+  }
 }
 </script>
 
-<style scoped>
-
+<style lang="less" scoped>
+@import '~@/assets/styles/style';
+.bzchStep4 {
+  position: relative;
+  height: 100%;
+  /deep/.el-drawer__container {
+    .prc-content-border {
+      border: none;
+      padding: 0 20px 0;
+    }
+  }
+  .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-center {
+    padding: 10px 0px 10px 10px;
+  }
+  .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;
+      }
+    }
+  }
+  .content_form {
+    padding-top: 15px;
+    padding-left: 30px;
+    .el-divider--horizontal {
+      margin-top: 0px;
+    }
+    /deep/.el-table__body-wrapper {
+      height: auto!important;
+    }
+    /deep/.el-textarea__inner {
+      font-family: inherit;
+    }
+    /deep/.el-table th {
+      padding: 0px;
+    }
+  }
+}
 </style>
+
diff --git a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step5.vue b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step5.vue
index 019dd51eb..0ddce9d3b 100644
--- a/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step5.vue
+++ b/src/pages/processCenter/pages/creatProcess/bzhHy-ch/step5.vue
@@ -1,13 +1,370 @@
 <template>
-
+  <div class="bzchStep5">
+    <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 === '3' ? 'active' : ''" @click="handleTabs('3')">审批历史</div>
+    </div>
+    <div class="content" v-show="active === '1'">
+      <div style="flex: auto; overflow: auto;">
+        <ProcessTitle>
+          <template slot="title">基础信息</template>
+        </ProcessTitle>
+        <div class="content_form">
+          <el-form ref="ch_pageData" :model="ch_pageData" :rules="ch_rules" label-width="auto">
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议名称:">
+                  {{ ch_pageData.meetingName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="主办单位:">
+                  {{ ch_pageData.primaryUnit || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="协会名称:">
+                  {{ ch_pageData.associaName || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="会议时间:">
+                  {{ ch_pageData.meetingTime || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="会议地点:">
+                  {{ ch_pageData.meetingPlace || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="费用标准:">
+                  {{ ch_pageData.feeStand || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="费用列支:">
+                  {{ ch_pageData.feeKind || '-' }}
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="上传附件:" prop="uploadFile">
+                  <el-upload></el-upload>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="24">
+              <el-col :span="8">
+                <el-form-item label="类别:">
+                  {{ ch_pageData.sort || '-' }}
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="议题:">
+              <el-table
+                class="meeting_table"
+                :data="ch_pageData.meetingTable"
+                border
+                ref="entryTable"
+                height="49%"
+                style="width: 100%"
+                :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '20px'}">
+                <el-table-column type="index" width="50" align="center"/>
+                <el-table-column
+                  label="议题"
+                  align="center"
+                  prop="ch_pageData.meetingTable.meetingTheme">
+                  <template slot-scope="scope">
+                    <el-input v-model="scope.row.meetingTheme"/>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+            <el-form-item label="入会人员:">
+              <el-table
+                :data="ch_pageData.myPartRole"
+                border
+                ref="entryTable"
+                height="49%"
+                style="width: 100%"
+                :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '20px'}">
+                <el-table-column type="index" width="50" align="center"/>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillPeople"
+                  align="center"
+                  label="人员">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillUnit"
+                  align="center"
+                  label="单位">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillDept"
+                  align="center"
+                  label="部门">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillTel"
+                  align="center"
+                  label="电话">
+                </el-table-column>
+                <el-table-column
+                  v-model="ch_pageData.myPartRole.fillMail"
+                  align="center"
+                  label="邮箱">
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+    </div>
+    <div class="content" v-show="active === '3'">
+      <div class="flow-list">
+        <el-table
+          height="100%"
+          ref="selection"
+          :data="detailData"
+          tooltip-effect="dark"
+          style="width: 100%"
+          border
+          row-key="id"
+          :no-data-text="listNoDataText"
+          :header-cell-style="{background: '#f8f8f9', color: '#515a6e'}"
+        >
+          <el-table-column
+            type="selection"
+            width="55"
+            align="center">
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            label="任务步骤"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="assignee"
+            label="任务受理人"
+            align="center"
+          >
+          </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>
+        <loading :loading="loading">流程列表加载中</loading>
+      </div>
+    </div>
+    <ProcessFooter
+      show-save
+      show-submit
+      :submitLoading="isSubmit"
+      :saveLoading="saveLoading"
+      @save="handleSave"
+      @submit="handleSubmit"
+    >
+    </ProcessFooter>
+  </div>
 </template>
 
 <script>
+import ProcessHeader from "../../components/ProcessHeader";
+import ProcessFooter from "../../components/ProcessFooter";
+import ProcessTitle from "../../components/ProcessTitle";
+import { startProcess, saveTaskFirst,completeTask, inboundLiaisonDetail } from '@/api/process.js'
 export default {
-  name: "bzchStep5"
+  components: {
+    ProcessHeader,
+    ProcessFooter,
+    ProcessTitle
+  },
+  name: "bzchStep5",
+  data() {
+    return {
+      active: '1',
+
+      ch_pageData: {
+        myPartRole: [],
+      },
+      ch_rules: {},
+      textarea: '',
+
+      isSubmit: false,
+      saveLoading: false,
+
+      detailData: [],
+      loading: false,
+
+    }
+  },
+  computed: {
+    listNoDataText() {
+      return this.processType === 1 ? "暂无待办流程" : "暂无已办流程";
+    }
+  },
+  created() {
+    this.processTable()
+    this.getData()
+  },
+  methods: {
+    // 右上标签页面切换
+    handleTabs(name) {
+      this.active = name
+    },
+    processTable() {
+      this.$http.get("lawss/activiti/get_list_by_instance", {
+        prcNum: this.$route.query.prcNum,
+        sortWord: this.shunxu ? this.paixu : "",
+        shunxu: this.shunxu
+      }, {
+        loading: "loading",
+        _this: this
+      }, res => {
+        this.detailData = res
+      }, e => {
+      })
+    },
+
+    getData() {
+      const params = {
+        taskIds: this.taskIds,
+        pId: this.pId,
+      }
+      inboundLiaisonDetail(params).then(res => {
+        const processForm = JSON.parse(res.mesg)
+        this.getFormFieldList(processForm)
+      })
+    },
+    getFormFieldList (item) {
+      this.$nextTick(() => {
+        this.ch_pageData = JSON.parse(JSON.stringify(item)).ch_pageData
+        // this.ch_pageData.comityFileNum = this.fileTextList
+      })
+    },
+    // 保存按钮
+    handleSave() {
+    },
+    // 提交按钮
+    handleSubmit() {
+    }
+  }
 }
 </script>
 
-<style scoped>
-
+<style lang="less" scoped>
+@import '~@/assets/styles/style';
+.bzchStep5 {
+  position: relative;
+  height: 100%;
+  /deep/.el-drawer__container {
+    .prc-content-border {
+      border: none;
+      padding: 0 20px 0;
+    }
+  }
+  .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-center {
+    padding: 10px 0px 10px 10px;
+  }
+  .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;
+      }
+    }
+  }
+  .content_form {
+    padding-top: 15px;
+    padding-left: 30px;
+    .el-divider--horizontal {
+      margin-top: 0px;
+    }
+    /deep/.el-table__body-wrapper {
+      height: auto!important;
+    }
+    /deep/.el-textarea__inner {
+      font-family: inherit;
+    }
+    /deep/.el-table th {
+      padding: 0px;
+    }
+  }
+}
 </style>
+