项目合规评估流程-项目手机端页面

src/pages/processCenter/pages/phone/xmpg2/step3.vue

@@ -0,0 +1,463 @@
+<template>
+  <div class="xmpg2-step3 phoneBox">
+    <ProcessHeaderPhone toggle>
+      <template slot="proName">项目合规评估流程-项目</template>
+      <template slot="proNode">工程经理进行转办</template>
+    </ProcessHeaderPhone>
+    <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">
+        <process-title>
+          <template slot="title">基础信息</template>
+        </process-title>
+        <el-form
+          :model="listForm"
+          class="label-input-form prc-content-border"
+          label-width="150px"
+        >
+          <el-row :gutter="24">
+            <el-col :span="24">
+              <el-form-item label="项目编号" prop="projectNumber" class="add-form-item form-item-disabled">
+                <el-input
+                  v-model="listForm.projectNumber"
+                  placeholder="请输入项目编号"
+                  disabled
+                  clearable
+                ></el-input>
+              </el-form-item>
+              <el-form-item label="项目名称" prop="projectName" class="add-form-item form-item-disabled">
+                <el-input
+                  v-model="listForm.projectName"
+                  disabled
+                  placeholder="请输入项目名称"
+                  clearable
+                ></el-input>
+              </el-form-item>
+              <el-form-item label="架构经理" prop="jgUser" class="add-form-item form-item-disabled">
+                <el-input
+                  v-model="listForm.jgUserId"
+                  style="display: none"
+                />
+                <el-input
+                  v-model="listForm.jgUser"
+                  placeholder="请选择架构经理"
+                  clearable
+                  @click.native="choiceZRR"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+        <process-title>
+          <template slot="title">填写信息</template>
+        </process-title>
+        <el-table
+          :data="dataList"
+          border
+          ref="selection"
+          height="70%"
+          style="width: 100%; border:1px solid #ccc"
+          @selection-change="selectStandChange"
+          :header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
+              fontWeight: 'bold', height: '48px'}">
+          <el-table-column
+            type="selection"
+            width="55"
+            align="center">
+          </el-table-column>
+          <el-table-column
+            prop="standId"
+            align="center"
+            label="标准号"
+          >
+            <template slot-scope="scope">
+              <a v-if="scope.row.standYear" class="table-jump"
+                 @click="handlePreview(scope.row)">{{ scope.row.standSort }} {{ scope.row.standNumber
+                }}-{{ scope.row.standYear }}</a>
+              <a v-else @click="handlePreview(scope.row)" class="table-jump">{{ scope.row.standSort }}
+                {{ scope.row.standNumber }}</a>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="standName"
+            align="center"
+            label="中文名称"
+          >
+            <template slot-scope="scope">
+              <a @click="handlePreview(scope.row)" class="table-jump">{{ scope.row.standName }}</a>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="standEnName"
+            label="英文名称"
+            align="center"
+          >
+            <template slot-scope="scope">
+              <a @click="handlePreview(scope.row)" class="table-jump">{{ scope.row.standEnName }}</a>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="ssrq"
+            align="center"
+            label="标准实施日期">
+          </el-table-column>
+          <el-table-column
+            prop="xcxssrq"
+            width="190px"
+            align="center"
+            label="新车型实施日期">
+          </el-table-column>
+          <el-table-column
+            prop="zccssrq"
+            align="center"
+            width="190px"
+            label="在产车实施日期">
+          </el-table-column>
+          <el-table-column
+            prop="zrbm"
+            label="责任部门"
+            align="center"
+          >
+          </el-table-column>
+        </el-table>
+      </div>
+      <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 === '3'">
+      <div class="flow-list" style="height: 100%">
+        <Phone-histort-table :prc-num="$route.query.prcNum"></Phone-histort-table>
+      </div>
+    </div>
+    <ProcessFooter
+      show-save
+      show-transfer
+      show-submit
+      :submitLoading="isSubmit"
+      :transfer-loading="isTransfer"
+      :saveLoading="saveLoading"
+      @save="handleSave"
+      @transfer="handleTransfer"
+      @submit="handleSubmit"
+    >
+    </ProcessFooter>
+    <phone-role
+      :role-title="drawerTitle"
+      :result-list="phoneRoleList"
+      :is-show-phone.sync="modalshowflag"
+      @checkedRole="drawerCheck"
+    />
+  </div>
+</template>
+
+<script>
+import ProcessHeaderPhone from '../../components/ProcessHeaderPhone'
+import ProcessHeader from "../../components/ProcessHeader";
+import ProcessFooter from "../../components/ProcessFooter";
+import ProcessTitle from "../../components/ProcessTitle";
+import { inboundLiaisonDetail, saveTaskForPub ,changeAssigneeNew} from "api/process";
+
+export default {
+  name: "phoneXmpg2Step3",
+  components: {
+    ProcessHeaderPhone,
+    ProcessTitle,
+    ProcessFooter
+  },
+  data() {
+    return {
+      isTransfer: false,
+      // 调整处理人抽屉状态
+      drawerModal: false,
+      active: "1",
+      loading: false,
+      // 当前流程类型(1待办/2已办)
+      processType: 1,
+      isSubmit: false,
+      saveLoading: false,
+      showColumn: true,
+      drawerTitle: "", //drawer标题
+      modalshowflag: false, // drawer开关
+      selectList: [],
+      treeData: [], // 人员数据
+      roleForm: {
+        jgUser: ""
+      },
+      nodeList: [],
+      defaultProps: {
+        children: "children",
+        label: "name"
+      },
+      //表单的数据
+      listForm: {
+        jgUserId: '',
+        projectNumber: "",  //项目编号
+        projectName: "",  //项目名称
+        jgUser: "", //架构经理
+        dataList: [], //项目下的标准数据
+        breakdownList: [] //标准下的分解单数据
+
+      },
+      dataList: [], //展示的标准数据
+      commentText: "", //审批意见
+      detailData: [], //流程历史数据
+      userId: this.$store.getters.userInfo.userId,
+      taskIds: this.$route.query.taskIds,
+      pId: this.$route.query.prcId,
+      phoneRoleList: [],
+    };
+  },
+  methods: {
+    // 请求转换流程图
+    processNum (row) {
+      axios.request({
+        url: '/api/lawss/activiti/getImg?_t=' + new Date().getTime(),
+        responseType: 'blob',
+        method: 'get',
+        params: {
+          prcNum: this.$route.query.prcNum
+        }
+      }).then(res => {
+        // let blob = new Blob([res.data], {type: 'image/jpg'})
+        // let url = window.URL.createObjectURL(res.data)
+        this.processStep = window.URL.createObjectURL(res.data)
+      })
+    },
+    //转办事件
+    handleTransfer(){
+      this.phoneRoleList = [],
+      this.modalshowflag = true
+      this.drawerTitle = '转办处理人'
+    },
+    // 点击查看
+    //查询项目下的标准
+    getStandData() {
+      this.$http.get("sarStandardsInfo/sar-standards-info/getSarStandardsInfoPage", {
+        standType: this.standardSearch.standType,
+        standNumber: this.standardSearch.standNumber,
+        page: this.pageNo,
+        pageSize: this.pageSizeNo
+      }, {
+        _this: this
+      }, res => {
+        this.standardData = res.data.list;
+        this.standardData.forEach(item => {
+          if (item.attrInfoMap === null) {
+            this.$set(item, "ZCCSSRQ", "");
+            this.$set(item, "XCXSSRQ", "");
+          } else {
+            this.$set(item, "ZCCSSRQ", item.attrInfoMap.ZCCSSRQ);
+            this.$set(item, "XCXSSRQ", item.attrInfoMap.XCXSSRQ);
+          }
+        });
+        this.totalNo = res.data.count;
+      }, e => {
+      });
+    },
+    //tab改变
+    handleTabs(type) {
+      this.active = type;
+    },
+    //获取数据
+    getData() {
+      return new Promise((resolve, reject) => {
+        inboundLiaisonDetail({
+          taskIds: this.taskIds,
+          pId: this.pId
+        }).then(res => {
+          if (res) {
+            const processForm = JSON.parse(res.mesg);
+            this.getFormFieldList(processForm);
+          }
+        }).catch(e => {
+        });
+      });
+    },
+    //动态表单读取
+    getFormFieldList(item) {
+      this.$nextTick(() => {
+        this.listForm = JSON.parse(JSON.stringify(item));
+        if (item.form === undefined) {
+          this.listForm.prcNum = this.prcNum;
+          this.listForm.prcName = this.prcName;
+          this.listForm["id"] = item.id;
+          this.listForm.dataList = item.dataList;
+          this.dataList = item.dataList;
+          this.dataList.forEach(item => {
+            if(item.zrbm === "[]"){
+              item.zrbm = ''
+            }
+          })
+          this.dataList.distributePerson = item.dataList[0].distributePerson;
+          this.listForm.breakdownList = item.breakdownList;
+        } else {
+          this.listForm = item.form
+          this.dataList = item.form.dataList
+        }
+
+      });
+    },
+    //保存事件
+    handleSave() {
+      this.saveLoading = true;
+      let _formData = new FormData();
+      _formData.append("id", this.bpnId || "");
+      _formData.append("prcType", "6");
+      _formData.append("taskIds", this.taskIds);
+      _formData.append("json", JSON.stringify({
+        form: this.listForm,
+        commentText: this.commentText
+      }));
+      saveTaskForPub(_formData).then(res => {
+        this.saveLoading = false;
+        this.$message.success("保存成功");
+        this.bpnId = res.result;
+      }).catch(e => {
+        this.saveLoading = false;
+      });
+    },
+    //提交事件
+    handleSubmit() {
+      if (!this.listForm.jgUser) {
+        this.$message.warning("请选择架构经理");
+      } else {
+        this.isSubmit = true;
+        this.listForm.commentText = this.commentText;
+        const json = JSON.stringify(this.listForm);
+        this.$http.post("lawss/activiti/completeTask", {
+          taskIds: this.taskIds,
+          userId: this.userId,
+          json: json
+        }, {
+          _this: this
+        }, res => {
+          if (res.success) {
+            this.$message.success(res.message);
+            this.$router.push("/processCenter");
+          }
+          this.isSubmit = false;
+        }, e => {
+        });
+      }
+    },
+    choiceZRR() {
+      this.drawerTitle = '选择架构经理'
+      if (this.listForm.jgUserId.length > 0 ) {
+        this.phoneRoleList = this.listForm.jgUserId.split(',')
+      }
+      this.modalshowflag = true;
+    },
+    //标准表格选择框改变
+    selectStandChange(data) {
+      this.selectList = data;
+    },
+
+    drawerCheck(data) {
+     if (this.drawerTitle = '选择架构经理') {
+       if (data.length > 0) {
+         this.listForm.jgUserId = data[0].id
+         this.listForm.jgUser = data[0].name
+       }
+     } else {
+       changeAssigneeNew({
+         taskId: this.$route.query.taskIds, // 任务id
+         assignee: data[0].id, // 被委托人
+         userId: this.$store.getters.userInfo.userId, // 委托人
+         pId: this.$route.query.prcId // 流程实例
+       }).then(res => {
+         this.isTransfer = false
+         if (res.success) {
+           this.$message.success('调整成功')
+           this.$router.push("/processCenter");
+           this.processNum()
+         } else {
+           this.$message.warning(res.message)
+         }
+       })
+     }
+    },
+  },
+  mounted() {
+    this.getData();
+    this.getTree();
+  }
+};
+</script>
+
+<style lang="less" scoped>
+@import '~@/assets/styles/phone';
+
+.xmpg2-step3 {
+  /deep/ .el-drawer__container {
+    .prc-content-border {
+      border: none;
+      padding: 0 20px 0;
+    }
+  }
+
+  /deep/.van-dialog__content {
+    min-height: 300px;
+    padding: 10px;
+  }
+  .prc-content-border {
+    overflow: auto;
+  }
+  /deep/.prc-content-border .el-form-item__content {
+    width: 270px;
+  }
+  .choiceBtn {
+    .el-button--primary {
+      width: 150px;
+    }
+  }
+
+  position: relative;
+  height: 100%;
+
+  .content {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    overflow: auto;
+
+    .tableTitle {
+      margin-bottom: 10px;
+      height: 30px;
+      line-height: 30px;
+      position: relative;
+      font-size: 13px;
+      font-weight: bold;
+
+      .tableButton {
+        position: absolute;
+        right: 0;
+        top: 0;
+      }
+
+      .accessStandardsAndRegulations {
+        height: 100%;
+      }
+    }
+  }
+
+  .demo-drawer-content {
+    margin-top: 10px;
+  }
+}
+</style>

src/router/index.js

@@ -2211,7 +2211,7 @@ const routes = [
       },
       {
         path: '/phoneXmpg2Step2',
-        name: 'phoneXmpg2Step22',
+        name: 'phoneXmpg2Step2',
         component: () => import('@/pages/processCenter/pages/phone/xmpg2/step2.vue'),
         meta: {
           isBoolean: true,
@@ -2219,6 +2219,16 @@ const routes = [
           title: '项目合规评估流程'
         }
       },
+      {
+        path: '/phoneXmpg2Step3',
+        name: 'phoneXmpg2Step3',
+        component: () => import('@/pages/processCenter/pages/phone/xmpg2/step3.vue'),
+        meta: {
+          isBoolean: true,
+          requireAuth: true,
+          title: '项目合规评估流程'
+        }
+      },
       {
         path: '/phoneXmpg2Step7',
         name: 'phoneXmpg2Step7',