项目关联流程开发

src/api/bpm/components/project-manage/index.js

@@ -33,7 +33,17 @@ export async function projectsToTreeAPI() {
   }
   return Promise.reject(new Error(res.data.message));
 }
-
+/**
+ * 逐级查询项目各层级列表数据
+ * @id id
+ */
+export async function projectsSelectTreeDataAPI(params){
+  const res = await request.get(`/pro/projects/selectTreeDatas`,{params});
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
 
 /**
  * 提交
@@ -45,3 +55,13 @@ export async function submit(data) {
   }
   return Promise.reject(new Error(res.data.message));
 }
+/**
+ * 流程作废
+ */
+export async function cancel(data) {
+  const res = await request.put(`/bpm/pro/project/notPass`, data);
+  if (res.data.code == 0) {
+    return Promise.resolve(res.data);
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/api/bpm/components/project-manage/plan.js

@@ -45,25 +45,16 @@ export async function projectsPlanGetByIdAPI(id) {
   }
   return Promise.reject(new Error(res.data.message));
 }
-/**
- * 计划删除
- * @id id
- */
-export async function projectsPlanDeleteAPI(data) {
-  const res = await request.delete(`/pro/targetplan/delete`,{data});
-  if (res.data.code == 0) {
-    return res.data.data;
-  }
-  return Promise.reject(new Error(res.data.message));
-}
+
+
 
 /**
- * 提交
+ * 流程作废
  */
-export async function submit(data) {
-  const res = await request.post(`/bpm/pro/targetplan/submit`, data);
+export async function cancel(data) {
+  const res = await request.put(`/bpm/pro/targetplan/notPass`, data);
   if (res.data.code == 0) {
-    return res.data.data;
+    return Promise.resolve(res.data);
   }
   return Promise.reject(new Error(res.data.message));
 }

src/api/bpm/components/project-manage/task.js

@@ -0,0 +1,25 @@
+import request from '@/utils/request';
+/**
+ * 交付物详情
+ * @id id
+ */
+export async function taskFilesGetByIdAPI(id) {
+  const res = await request.get(`/pro/projectstaskfiles/getById/${id}`);
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+
+
+/**
+ * 流程作废
+ */
+export async function cancel(data) {
+  const res = await request.put(`/bpm/pro/taskfiles/notPass`, data);
+  if (res.data.code == 0) {
+    return Promise.resolve(res.data);
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/enum/dict.js

@@ -65,7 +65,13 @@ export default {
   计划紧急程度: 'logistic_urgency_level_type',
   计划工单费用类型: 'logistic_list_cost_type',
   驾照类型: 'driver_license_type',
-  单据类型: 'receipt_type'
+  单据类型: 'receipt_type',
+  项目类型: 'pro_projects_type',
+  项目优先级别: 'pro_projects_level',
+  项目状态: 'pro_projects_status',
+  项目任务类型: 'task_type',
+  交付物类型: 'deliverables_type',
+  交付物流程类型:'pro_files_approve_type'
 };
 
 export const numberList = [

src/views/bpm/handleTask/components/project-manage/plan-manage/detailDialog.vue

@@ -1,9 +1,11 @@
 <template>
   <div>
     <headerTitle title="计划信息"></headerTitle>
-    <plan-form ref="planForm" :dialog-type="dialogType" :dialogForm="dialogForm"></plan-form>
+    <plan-form ref="planForm" :dialog-type="dialogType" :dialogForm="dialogForm" :deptList="deptList"
+               :deptTreeList="deptTreeList"></plan-form>
     <headerTitle title="计划节点"></headerTitle>
-    <plan-info-table ref="planInfoTable" :dialog-type="dialogType" :dialogForm="dialogForm"></plan-info-table>
+    <plan-info-table ref="planInfoTable" :dialog-type="dialogType" :dialogForm="dialogForm" :deptList="deptList"
+                     :deptTreeList="deptTreeList"></plan-info-table>
   </div>
 </template>
 
@@ -13,6 +15,7 @@ import PlanForm from "@/views/bpm/handleTask/components/project-manage/plan-mana
 import planInfoTable from "@/views/bpm/handleTask/components/project-manage/plan-manage/planInfoTable.vue";
 import {projectsPlanGetByIdAPI} from "@/api/bpm/components/project-manage/plan";
 import {deepClone} from "ele-admin/lib/utils/core";
+import {listOrganizations} from "@/api/system/organization";
 
 export default {
   name: "project-form",
@@ -35,14 +38,13 @@ export default {
   data() {
     return {
       dialogForm: {},
-
-
+      deptList: [],
+      deptTreeList: [],
     }
   },
   async created() {
-
-
     await this.getProjectPlanInfo(this.businessId)
+    await this.getDeptList()
   },
 
   methods: {
@@ -51,11 +53,21 @@ export default {
       let res = await projectsPlanGetByIdAPI(id)
       this.dialogForm = deepClone(res)
     },
-
+    // 获取部门数据
+    getDeptList() {
+      listOrganizations().then((list) => {
+        this.deptList = list;
+        this.deptTreeList = this.$util.toTreeData({
+          data: list,
+          idField: 'id',
+          parentIdField: 'parentId'
+        });
+      });
+    },
 
     getTableValue() {
       return new Promise((resolve, reject) => {
-        this.$refs.form.validate(valid => {
+        this.$refs.planForm.validate(valid => {
           if (!valid) {
             this.$message.warning('有必填项未填，请检查')
             reject('有必填项未填，请检查')

src/views/bpm/handleTask/components/project-manage/plan-manage/plan-form.vue

@@ -7,40 +7,48 @@
           <el-form-item
             prop="projectId"
             label="关联项目">
-            <el-row :gutter="8">
-              <el-col :span="22">
+            <el-row>
+              <el-col :span="24">
                 <ele-tree-select
                   :disabled="dialogType=='view'"
                   clearable
+                  ref="projectRef"
                   filterable
                   :data="projectList"
                   v-model="form.projectId"
-                  childrenKey="projectList"
+                  childrenKey="sonTreeList"
                   valueKey="id"
                   labelKey="name"
                   placeholder="请选择"
                   default-expand-all
+                  @change="changeProjectInfo"
                 />
               </el-col>
-              <el-col :span="1">
+              <!--              <el-col :span="1">-->
 
-                <el-popover
-                  placement="right"
-                  v-model="popoverFlag"
-                  width="1000"
-                  trigger="click">
-                  <headerTitle title="项目信息"></headerTitle>
-                  <project-form ref="projectForm" dialog-type="view"></project-form>
-                  <el-button :disabled="!form.projectId" type="text" slot="reference"
-                             @click="getProjectInfo(form.projectId)">详情
-                  </el-button>
-                </el-popover>
+              <!--                <el-popover-->
+              <!--                  placement="right"-->
+              <!--                  v-model="popoverFlag"-->
+              <!--                  width="1000"-->
+              <!--                  trigger="click">-->
+              <!--                  <headerTitle title="项目信息"></headerTitle>-->
+              <!--                  <project-form ref="projectForm" dialog-type="view"></project-form>-->
+              <!--                  <el-button :disabled="!form.projectId" type="text" slot="reference"-->
+              <!--                             @click="getProjectInfo(form.projectId)">详情-->
+              <!--                  </el-button>-->
+              <!--                </el-popover>-->
 
-              </el-col>
+              <!--              </el-col>-->
             </el-row>
 
           </el-form-item>
         </el-col>
+        <el-col :span="8">
+          <el-form-item
+            label="计划编码">
+            <el-input v-model="form.code" disabled></el-input>
+          </el-form-item>
+        </el-col>
         <el-col :span="8">
           <el-form-item
             prop="name"
@@ -48,14 +56,19 @@
             <el-input v-model="form.name" :disabled="dialogType=='view'"></el-input>
           </el-form-item>
         </el-col>
+
+      </el-row>
+      <el-row>
         <el-col :span="8">
           <el-form-item
-            label="计划编码">
-            <el-input v-model="form.code" disabled></el-input>
+            label="关联项目阶段"
+            prop="projectStageId">
+            <el-select v-model="form.projectStageId" :disabled="dialogType=='view'" style="width: 100%">
+              <el-option v-for="item in projectStageList" :label="item.name" :value="item.id"
+                         :key="item.id"></el-option>
+            </el-select>
           </el-form-item>
         </el-col>
-      </el-row>
-      <el-row>
         <el-col :span="8">
           <el-form-item
             prop="planStartDate"
@@ -84,13 +97,35 @@
             </el-date-picker>
           </el-form-item>
         </el-col>
+
+      </el-row>
+      <el-row>
+        <el-col :span="8">
+          <el-form-item
+            label="申请部门"
+            prop="responsibleDeptId">
+            <ele-tree-select
+              :disabled="dialogType=='view'"
+              clearable
+              ref="deptRef"
+              :data="deptTreeList"
+              v-model="form.responsibleDeptId"
+              valueKey="id"
+              labelKey="name"
+              placeholder="请选择"
+              @change="changeDeptInfo"
+              default-expand-all
+            />
+          </el-form-item>
+        </el-col>
         <el-col :span="8">
           <el-form-item
             prop="responsibleUserId"
             label="负责人">
             <personSelect
               :disabled="dialogType=='view'"
-              ref="directorRef"
+              ref="userRef"
+              :init="false"
               v-model="form.responsibleUserId"
               @selfChange="personChange"/>
           </el-form-item>
@@ -108,10 +143,11 @@
 </template>
 
 <script>
-import {projectsGetByIdAPI, projectsToTreeAPI} from "@/api/bpm/components/project-manage";
+import { projectsSelectTreeDataAPI} from "@/api/bpm/components/project-manage";
 import PersonSelect from "@/components/CommomSelect/person-select.vue";
 import {getByCode} from "@/api/system/dictionary-data";
 import ProjectForm from "./project-form.vue";
+import {listOrganizations} from "@/api/system/organization";
 
 export default {
   name: "plan-form",
@@ -129,12 +165,29 @@ export default {
           ...this.form
         }
       }
-    }
+    },
+    deptList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
+    deptTreeList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
   },
   watch: {
     dialogForm: {
       handler(val) {
         this.form = {...this.dialogForm}
+        this.$nextTick(async () => {
+          await this.getUserList(this.dialogForm.responsibleDeptId);
+          await this.changeProjectInfo(this.form.projectId);
+        })
+
       },
       deep: true,
     },
@@ -144,8 +197,11 @@ export default {
       form: {
         id: '',
         projectId: '',
+        projectStageId: '',
         name: '',
         code: '',
+        responsibleDeptId: "",
+        responsibleDeptName: "",
         responsibleUserName: '',
         responsibleUserId: '',
         remark: '',
@@ -154,26 +210,51 @@ export default {
       },
       popoverFlag: false,
       projectList: [],
+      projectStageList: [],
       rules: {
         projectId: {required: true, message: '请选择项目', trigger: 'change'},
         name: {required: true, message: '请输入项目名称', trigger: 'blur'},
         planStartDate: {required: true, message: '请选择计划开始日期', trigger: 'change'},
         planEndDate: {required: true, message: '请选择计划完成日期', trigger: 'change'},
         responsibleUserId: {required: true, message: '请选择负责人', trigger: 'change'},
+        responsibleDeptId: {required: true, message: '请选择部门', trigger: 'change'},
       }
     }
   },
   async created() {
-    this.projectList = await projectsToTreeAPI({processStatus: '2'})
-
+    this.projectList = await projectsSelectTreeDataAPI({treeType: 0, isTask: 0, isPlan: 0})
   },
   methods: {
+    async changeProjectInfo(val) {
+      if (!val) {
+        this.projectStageList = []
+        this.form.projectStageId = null
+        return
+      }
+      this.projectStageList = await projectsSelectTreeDataAPI({treeType: 0, id: val, isTask: 0, isPlan: 0})
+    },
+
+
     getProjectInfo(id) {
       this.popoverFlag = true;
       this.$nextTick(() => {
         this.$refs.projectForm.getInfo(id);
       })
     },
+    // 选择负责人部门
+    changeDeptInfo(id) {
+      const info = this.deptList.find((e) => e.id == id) || {};
+      this.form.responsibleDeptName = info.name;
+      this.form.responsibleUserId = '';
+      this.form.responsibleUserName = '';
+      this.getUserList(id);
+    },
+    // 获取人员数据
+    getUserList(groupId) {
+      if (groupId) {
+        this.$refs.userRef.getList({groupId});
+      }
+    },
     personChange(val, info) {
       this.form.responsibleUserName = info.name;
     },

src/views/bpm/handleTask/components/project-manage/plan-manage/planInfoTable.vue

@@ -83,26 +83,43 @@
             </el-date-picker>
           </el-form-item>
         </template>
+        <template v-slot:responsibleDeptId="{row,$index}">
+          <el-form-item :prop="'datasource.'+$index+'.responsibleDeptId'">
+            <ele-tree-select
+              :disabled="dialogType=='view'"
+              clearable
+              :data="deptTreeList"
+              :ref="'deptTreeRef'+$index"
+              v-model="row.responsibleDeptId"
+              valueKey="id"
+              labelKey="name"
+              placeholder="请选择"
+              @change="(id)=>changeDeptInfo(id,$index)"
+              default-expand-all
+            />
+          </el-form-item>
+        </template>
         <template v-slot:responsibleUserId="{row,$index}">
           <el-form-item :prop="'datasource.'+$index+'.responsibleUserId'">
             <personSelect
               :disabled="dialogType=='view'"
               :ref="'directorRef'+$index"
               v-model="row.responsibleUserId"
+              :init="false"
               @selfChange="personChange"/>
           </el-form-item>
         </template>
         <template v-slot:isMilepost="{row,$index}" v-if="dialogType!=='view'">
           <el-form-item>
             <el-select v-model="row.isMilepost">
-              <el-option label="否" :value="0" />
-              <el-option label="是" :value="1" />
+              <el-option label="否" :value="0"/>
+              <el-option label="是" :value="1"/>
             </el-select>
           </el-form-item>
         </template>
         <template v-slot:milepost="{row,$index}" v-if="dialogType!=='view'">
           <el-form-item>
-            <el-input  v-model="row.milepost" clearable></el-input>
+            <el-input v-model="row.milepost" clearable></el-input>
           </el-form-item>
         </template>
         <template v-slot:deliverContent="{row,$index}" v-if="dialogType!=='view'">
@@ -156,11 +173,29 @@ export default {
       type: String,
       default: ''
     },
+    deptList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
+    deptTreeList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
   },
   watch: {
     dialogForm: {
       handler(val) {
-        this.form.datasource = this.dialogForm.planStageList
+        console.log(this.dialogForm.planStageList, '======');
+        this.form.datasource = this.dialogForm.planStageList || []
+        this.$nextTick(async () => {
+          this.form.datasource.forEach((item, index) => {
+            this.getUserList(item.responsibleDeptId, index);
+          })
+        })
       },
       deep: true,
     },
@@ -222,9 +257,18 @@ export default {
           slot: 'planEndDate',
           headerSlot: 'headerRequired',
         },
+        {
+          prop: 'responsibleDeptId',
+          label: '负责部门',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 130,
+          slot: 'responsibleDeptId',
+          headerSlot: 'headerRequired',
+        },
         {
           prop: 'responsibleUserId',
-          label: '责任人',
+          label: '负责人',
           align: 'center',
           showOverflowTooltip: true,
           minWidth: 130,
@@ -237,6 +281,9 @@ export default {
           align: 'center',
           showOverflowTooltip: true,
           minWidth: 120,
+          formatter: (_row, _column, cellValue) => {
+            return cellValue? '是' : '否';
+          },
           slot: 'isMilepost',
         },
         {
@@ -281,13 +328,7 @@ export default {
       return list
     },
   },
-  async mounted() {
-    this.form.datasource = this.link
-  },
   methods: {
-    personChange(val, info) {
-      this.form.responsibleUserName = info.name;
-    },
     downloadFile(file) {
       getFile({objectName: file.storePath}, file.name);
     },
@@ -309,6 +350,23 @@ export default {
         }
       )
     },
+    // 选择负责人部门
+    changeDeptInfo(id, index) {
+      const info = this.deptList.find((e) => e.id == id) || {};
+      this.$set(this.form.datasource[index], 'responsibleDeptName', info.name);
+      this.$set(this.form.datasource[index], 'responsibleUserId', '');
+      this.$set(this.form.datasource[index], 'responsibleUserName', '');
+      this.getUserList(id, index);
+    },
+    // 获取人员数据
+    getUserList(groupId, index) {
+      if (groupId) {
+        this.$refs['directorRef' + index].getList({groupId});
+      }
+    },
+    personChange(val, info, index) {
+      this.$set(this.form.datasource[index], 'responsibleUserName', info.name);
+    },
     //
     clearData() {
       this.form.datasource.forEach((item, index) => {

src/views/bpm/handleTask/components/project-manage/plan-manage/submit.vue

@@ -49,9 +49,9 @@
 </template>
 
 <script>
-  import { UpdateInformation, cancel } from '@/api/bpm/components/purchasingManage/purchaseNeedManage';
+
   import { approveTaskWithVariables } from '@/api/bpm/task';
-  import {projectsUpdateAPI} from "@/api/bpm/components/project-manage";
+  import {projectsPlanUpdateAPI,cancel} from "@/api/bpm/components/project-manage/plan";
 
   // 流程实例的详情页，可用于审批
   export default {
@@ -98,7 +98,7 @@
           if (!arr) {
             return;
           }
-          let data = await projectsUpdateAPI(arr);
+          let data = await projectsPlanUpdateAPI(arr);
           if (data.code != '0') {
             return;
           }

src/views/bpm/handleTask/components/project-manage/project-initiation/detailDialog.vue

@@ -1,163 +1,25 @@
 <template>
   <div>
-    <el-form ref="form" :model="form" :rules="rules"  label-width="120px">
-      <headerTitle title="基础信息"></headerTitle>
-      <el-row>
-        <el-col :span="8">
-          <el-form-item
-            prop="type"
-            label="项目类型">
-            <dict-selection dict-name="项目类型" v-model="form.type" :disabled="dialogType=='view'"></dict-selection>
-          </el-form-item>
-
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="code"
-            label="项目编码">
-            <el-input disabled v-model="form.code" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="name"
-            label="项目名称">
-            <el-input v-model="form.name" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="8">
-          <el-form-item label="从属项目">
-            <ele-tree-select
-              :disabled="dialogType=='view'"
-              clearable
-              filterable
-              :data="projectList"
-              v-model="form.parentId"
-              childrenKey="projectList"
-              valueKey="id"
-              labelKey="name"
-              placeholder="请选择"
-              default-expand-all
-            />
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="responsibleUserId"
-            label="项目经理">
-            <personSelect
-              :disabled="dialogType=='view'"
-              ref="directorRef"
-              v-model="form.responsibleUserId"
-              @selfChange="personChange"/>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="cycle"
-            label="项目周期">
-            <el-input v-model="form.cycle" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="8">
-          <el-form-item label="项目预算">
-            <el-input type="number" :min="0" v-model="form.budget" :disabled="dialogType=='view'">
-              <template slot="append">
-                元
-              </template>
-            </el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="planStartDate"
-            label="计划开始日期">
-            <el-date-picker
-              style="width: 100%"
-              :disabled="dialogType=='view'"
-              v-model="form.planStartDate"
-              :picker-options="{disabledDate:(time)=>{return form.planEndDate&&time.getTime()>new Date(form.planEndDate)}}"
-              type="date"
-              placeholder="选择日期">
-            </el-date-picker>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="planEndDate"
-            label="计划完成日期">
-            <el-date-picker
-              style="width: 100%"
-              :disabled="dialogType=='view'"
-              :picker-options="{disabledDate:(time)=>{return form.planStartDate&&time.getTime()<new Date(form.planStartDate)}}"
-              v-model="form.planEndDate"
-              type="date"
-              placeholder="选择日期">
-            </el-date-picker>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="8">
-          <el-form-item label="客户名称">
-            <el-input v-model="form.contactName" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="contactRelationPhone"
-            label="客户联系电话">
-            <el-input v-model="form.contactRelationPhone" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item
-            prop="stage"
-            label="项目阶段">
-            <el-input v-model="form.stage" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="8">
-          <el-form-item label="项目优先级">
-            <dict-selection dict-name="项目优先级别" v-model="form.level"
-                            :disabled="dialogType=='view'"></dict-selection>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="24">
-          <el-form-item label="项目说明">
-            <el-input type="textarea" :rows="2" v-model="form.content" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="24">
-          <el-form-item label="备注">
-            <el-input type="textarea" :rows="2" v-model="form.remark" :disabled="dialogType=='view'"></el-input>
-          </el-form-item>
-        </el-col>
-      </el-row>
-
-    </el-form>
+    <headerTitle title="项目信息"></headerTitle>
+    <project-form ref="projectForm" dialog-type="view" :dialogForm="dialogForm" :deptList="deptList"
+                  :deptTreeList="deptTreeList"></project-form>
+    <headerTitle title="项目阶段"></headerTitle>
+    <project-info-table ref="planInfoTable" dialog-type="view" :dialogForm="dialogForm" :deptList="deptList"
+                        :deptTreeList="deptTreeList"></project-info-table>
   </div>
 </template>
 
 <script>
 
-import PersonSelect from "@/components/CommomSelect/person-select.vue";
-import {getByCode} from "@/api/system/dictionary-data";
-import {projectsGetByIdAPI, projectsToTreeAPI} from "@/api/bpm/components/project-manage";
+
+import {projectsGetByIdAPI} from "@/api/bpm/components/project-manage";
+import projectInfoTable from "./projectInfoTable.vue";
+import projectForm from "./project-form.vue";
+import {listOrganizations} from "@/api/system/organization";
 
 export default {
-  name: "project-form",
-  components: {PersonSelect},
+  name: "project-initiation-detailDialog",
+  components: {projectInfoTable, projectForm},
   props: {
     dialogType: {
       type: String,
@@ -175,65 +37,39 @@ export default {
   },
   data() {
     return {
-      form: {
-        budget: '',
-        code: "",
-        contactId: '',
-        contactName: "",
-        contactRelationPhone: "",
-        contactRelationUserId: '',
-        contactRelationUserName: "",
-        content: "",
-        cycle: "",
-        deptUserId: '',
-        deptUserName: "",
-        level: "",
-        monitorUserId: '',
-        monitorUserName: "",
-        planStartDate: "",
-        planEndDate: "",
-        name: "",
-        parentId: '',
-        remark: "",
-        responsibleUserId: '',
-        responsibleUserName: "",
-        stage: "",
-        type: '',
-      },
-      projectList: [],
-      rules: {
-        type: {required: true, message: '请选择项目类型', trigger: 'change'},
-        name: {required: true, message: '请输入项目名称', trigger: 'blur'},
-        planStartDate: {required: true, message: '请选择计划开始日期', trigger: 'blur'},
-        planEndDate: {required: true, message: '请选择计划完成日期', trigger: 'blur'},
-      }
+      dialogForm: {},
+      deptList: [],
+      deptTreeList: [],
     }
   },
   async created() {
-    this.projectList = await projectsToTreeAPI()
-    this.setD(this.form.id, this.form.parentId, () => {
-    })
-    await this.getInfo(this.businessId)
+    await this.getDeptList()
+    await this.getInfo()
+    console.log(this.businessId,'====');
   },
 
   methods: {
-    setD(val, parentId, callback) {
-
-    },
-    async getInfo(id) {
-      this.form = await projectsGetByIdAPI(id)
-      this.form.type = this.form.type + ''
-      this.form.level = this.form.level + ''
-      this.form.parentId = this.form.parentId == 0 ? '' : this.form.parentId
-      return this.form
+    // 获取部门数据
+    getDeptList() {
+      listOrganizations().then((list) => {
+        this.deptList = list;
+        this.deptTreeList = this.$util.toTreeData({
+          data: list,
+          idField: 'id',
+          parentIdField: 'parentId'
+        });
+      });
     },
+    async getInfo() {
+      this.dialogForm = await projectsGetByIdAPI(this.businessId)
+      this.dialogForm.type = this.dialogForm.type + ''
+      this.dialogForm.level = this.dialogForm.level + ''
+      this.dialogForm.parentId = this.dialogForm.parentId == 0 ? '' : this.dialogForm.parentId
 
-    personChange(val, info) {
-      this.form.responsibleUserName = info.name;
     },
     getTableValue() {
       return new Promise((resolve, reject) => {
-        this.$refs.form.validate(valid => {
+        this.$refs.projectForm.validate(valid => {
           if (!valid) {
             this.$message.warning('有必填项未填，请检查')
             reject('有必填项未填，请检查')

src/views/bpm/handleTask/components/project-manage/project-initiation/project-form.vue

@@ -0,0 +1,298 @@
+<template>
+  <div>
+    <el-form ref="form" :model="form" :rules="rules" class="el-form-box" label-width="120px">
+
+      <el-row>
+        <el-col :span="8">
+          <el-form-item
+            prop="code"
+            label="项目编码">
+            <el-input disabled v-model="form.code"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item
+            prop="type"
+            label="项目类型">
+            <dict-selection dict-name="项目类型" v-model="form.type" :disabled="dialogType=='view'"></dict-selection>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item
+            prop="name"
+            label="项目名称">
+            <el-input v-model="form.name" :disabled="dialogType=='view'"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="从属项目">
+            <ele-tree-select
+              :disabled="dialogType=='view'"
+              clearable
+              filterable
+              :data="projectList"
+              v-model="form.parentId"
+              childrenKey="projectList"
+              valueKey="id"
+              labelKey="name"
+              placeholder="请选择"
+              default-expand-all
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item
+            label="申请部门"
+            prop="applyDeptId">
+            <ele-tree-select
+              :disabled="dialogType=='view'"
+              clearable
+              :data="deptTreeList"
+              v-model="form.responsibleDeptId"
+              valueKey="id"
+              labelKey="name"
+              placeholder="请选择"
+              @change="changeDeptInfo"
+              default-expand-all
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item
+            prop="responsibleUserId"
+            label="负责人">
+            <personSelect
+              :disabled="dialogType=='view'"
+              ref="directorRef"
+              :init="false"
+              v-model="form.responsibleUserId"
+              @selfChange="personChange"/>
+          </el-form-item>
+        </el-col>
+
+      </el-row>
+      <el-row>
+        <el-col :span="8">
+          <el-form-item
+            prop="cycle"
+            label="项目周期">
+            <el-input v-model="form.cycle" :disabled="dialogType=='view'"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="项目预算">
+            <el-input type="number" :min="0" v-model="form.budget" :disabled="dialogType=='view'">
+              <template slot="append">
+                元
+              </template>
+            </el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="项目优先级">
+            <dict-selection dict-name="项目优先级别" v-model="form.level"
+                            :disabled="dialogType=='view'"></dict-selection>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+
+        <el-col :span="8">
+          <el-form-item
+            prop="planStartDate"
+            label="计划开始日期">
+            <el-date-picker
+              style="width: 100%"
+              :disabled="dialogType=='view'"
+              v-model="form.planStartDate"
+              :picker-options="{disabledDate:(time)=>{return form.planEndDate&&time.getTime()>new Date(form.planEndDate)}}"
+              type="date"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item
+            prop="planEndDate"
+            label="计划完成日期">
+            <el-date-picker
+              style="width: 100%"
+              :disabled="dialogType=='view'"
+              :picker-options="{disabledDate:(time)=>{return form.planStartDate&&time.getTime()<new Date(form.planStartDate)}}"
+              v-model="form.planEndDate"
+              type="date"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="客户名称">
+            <el-input v-model="form.contactName" :disabled="dialogType=='view'"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item
+            prop="contactRelationPhone"
+            label="客户联系电话">
+            <el-input v-model="form.contactRelationPhone" :disabled="dialogType=='view'"></el-input>
+          </el-form-item>
+        </el-col>
+        <!--        <el-col :span="8">-->
+        <!--          <el-form-item-->
+        <!--            prop="stage"-->
+        <!--            label="项目阶段">-->
+        <!--            <el-input v-model="form.stage" :disabled="dialogType=='view'"></el-input>-->
+        <!--          </el-form-item>-->
+        <!--        </el-col>-->
+
+      </el-row>
+      <el-row>
+
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="项目说明">
+            <el-input type="textarea" :rows="2" v-model="form.content" :disabled="dialogType=='view'"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="备注">
+            <el-input type="textarea" :rows="2" v-model="form.remark" :disabled="dialogType=='view'"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+    </el-form>
+  </div>
+</template>
+
+<script>
+import {projectsToTreeAPI} from "@/api/bpm/components/project-manage";
+import PersonSelect from "@/components/CommomSelect/person-select.vue";
+
+export default {
+  name: "project-form",
+  components: {PersonSelect},
+  props: {
+    dialogType: {
+      type: String,
+      default: '',
+    },
+    dialogForm: {
+      type: Object,
+      default: () => {
+        return {
+          ...this.form
+        }
+      }
+    },
+    deptList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
+    deptTreeList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
+  },
+  watch: {
+    dialogForm: {
+      handler(val) {
+        this.form = {...this.dialogForm}
+        this.$nextTick(async () => {
+          await this.getUserList(this.dialogForm.responsibleDeptId);
+        })
+      },
+      deep: true,
+    },
+  },
+  data() {
+    return {
+      form: {
+        budget: '',
+        code: "",
+        contactId: '',
+        contactName: "",
+        contactRelationPhone: "",
+        contactRelationUserId: '',
+        contactRelationUserName: "",
+        content: "",
+        cycle: "",
+        deptUserId: '',
+        deptUserName: "",
+        level: "",
+        monitorUserId: '',
+        monitorUserName: "",
+        planStartDate: "",
+        planEndDate: "",
+        name: "",
+        parentId: '',
+        remark: "",
+        responsibleUserId: '',
+        responsibleUserName: "",
+        responsibleDeptId: "",
+        responsibleDeptName: "",
+        stage: "",
+        type: '',
+      },
+      projectList: [],
+      rules: {
+        type: {required: true, message: '请选择项目类型', trigger: 'change'},
+        name: {required: true, message: '请输入项目名称', trigger: 'blur'},
+        planStartDate: {required: true, message: '请选择计划开始日期', trigger: 'blur'},
+        planEndDate: {required: true, message: '请选择计划完成日期', trigger: 'blur'},
+      }
+    }
+  },
+  async created() {
+    this.projectList = await projectsToTreeAPI({processStatus: '2', treeType: '0'})
+  },
+
+  methods: {
+    // 选择负责人部门
+    changeDeptInfo(id) {
+      const info = this.deptList.find((e) => e.id == id) || {};
+      this.form.responsibleDeptName = info.name;
+      this.form.responsibleUserId = '';
+      this.form.responsibleUserName = '';
+      this.getUserList(id);
+    },
+    // 获取人员数据
+    getUserList(groupId) {
+      if (groupId) {
+        this.$refs.directorRef.getList({groupId});
+      }
+    },
+    personChange(val, info) {
+      this.form.responsibleUserName = info.name;
+    },
+    validForm() {
+      return new Promise((resolve, reject) => {
+        this.$refs.form.validate(valid => {
+          if (!valid) {
+            this.$message.warning('有必填项未填，请检查')
+            reject('有必填项未填，请检查')
+          } else {
+            resolve(this.form)
+          }
+        })
+      })
+    }
+  }
+}
+</script>
+
+
+<style scoped lang="scss">
+
+</style>

src/views/bpm/handleTask/components/project-manage/project-initiation/projectInfoTable.vue

@@ -0,0 +1,441 @@
+<template>
+  <div>
+    <el-form ref="form" :model="form">
+
+      <!-- 数据表格 -->
+      <ele-pro-table
+        ref="table"
+        :columns="columns"
+        :datasource="form.datasource"
+        :needPage="false"
+        :toolkit="[]"
+        :minHeight="100"
+        :maxHeight="300"
+        tool-class="ele-toolbar-form"
+        cache-key="eomContactPageTable"
+      >
+        <!-- 表头工具栏 -->
+        <template v-slot:toolbar>
+          <el-button
+            v-if="dialogType!=='view'"
+            size="small"
+            type="primary"
+            icon="el-icon-plus"
+            class="ele-btn-icon"
+            @click="handleAddInfo">
+            新增项目阶段
+          </el-button>
+        </template>
+
+        <template v-slot:action="{row,$index}">
+          <el-popconfirm
+            class="ele-action"
+            title="确定要删除此信息吗？"
+            :disabled="form.datasource.length==1"
+            @confirm="handleDelInfo($index)"
+          >
+            <template v-slot:reference>
+              <el-link
+                :disabled="form.datasource.length==1"
+                type="danger"
+                :underline="false"
+                icon="el-icon-delete"
+              >
+                删除
+              </el-link>
+            </template>
+          </el-popconfirm>
+        </template>
+        <template v-slot:name="{row,$index}" v-if="dialogType!=='view'">
+          <el-form-item :prop="'datasource.'+$index+'.name'"
+                        :rules="{required:true,message:'请选择',trigger:['blur','change']}">
+            <el-input v-model="row.name" clearable></el-input>
+          </el-form-item>
+        </template>
+        <template v-slot:content="{row,$index}" v-if="dialogType!=='view'">
+          <el-form-item :prop="'datasource.'+$index+'.content'">
+            <el-input v-model="row.content" clearable></el-input>
+          </el-form-item>
+        </template>
+        <template v-slot:planStartDate="{row,$index}" v-if="dialogType!=='view'">
+          <el-form-item :prop="'datasource.'+$index+'.planStartDate'"
+                        :rules="{required:true,message:'请选择',trigger:['blur','change']}">
+            <el-date-picker
+              style="width: 100%"
+              :disabled="dialogType=='view'"
+              v-model="row.planStartDate"
+              :picker-options="{disabledDate:(time)=>{return row.planEndDate&&time.getTime()>new Date(row.planEndDate)}}"
+              type="date"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </template>
+        <template v-slot:planEndDate="{row,$index}" v-if="dialogType!=='view'">
+          <el-form-item :prop="'datasource.'+$index+'.planEndDate'"
+                        :rules="{required:true,message:'请选择',trigger:['blur','change']}">
+            <el-date-picker
+              style="width: 100%"
+              :disabled="dialogType=='view'"
+              :picker-options="{disabledDate:(time)=>{return row.planStartDate&&time.getTime()<new Date(row.planStartDate)}}"
+              v-model="row.planEndDate"
+              type="date"
+              placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+        </template>
+        <template v-slot:responsibleUserId="{row,$index}">
+          <el-form-item :prop="'datasource.'+$index+'.responsibleUserId'">
+            <personSelect
+              :disabled="dialogType=='view'"
+              :ref="'directorRef'+$index"
+              v-model="row.responsibleUserId"
+              :init="false"
+              @selfChange="(val, info)=>personChange(val,info,$index)"/>
+          </el-form-item>
+        </template>
+        <template v-slot:responsibleDeptId="{row,$index}">
+          <el-form-item :prop="'datasource.'+$index+'.responsibleDeptId'">
+            <ele-tree-select
+              :disabled="dialogType=='view'"
+              clearable
+              :data="deptTreeList"
+              :ref="'deptTreeRef'+$index"
+              v-model="row.responsibleDeptId"
+              valueKey="id"
+              labelKey="name"
+              placeholder="请选择"
+              @change="(id)=>changeDeptInfo(id,$index)"
+              default-expand-all
+            />
+          </el-form-item>
+        </template>
+        <template v-slot:isMilepost="{row,$index}" v-if="dialogType!=='view'">
+          <el-form-item>
+            <el-select v-model="row.isMilepost">
+              <el-option label="否" :value="0"/>
+              <el-option label="是" :value="1"/>
+            </el-select>
+          </el-form-item>
+        </template>
+        <template v-slot:milepost="{row,$index}" v-if="dialogType!=='view'">
+          <el-form-item>
+            <el-input v-model="row.milepost" clearable></el-input>
+          </el-form-item>
+        </template>
+        <template v-slot:isOverTime="{ row }">
+          <el-tag v-if="row.isOverTime==0" type="success">正常</el-tag>
+          <el-tag v-else type="danger">超时</el-tag>
+        </template>
+        <template v-slot:speedPercent="{ row }">
+          <el-progress :stroke-width="20" text-color="#606266" :text-inside="true" :percentage="row.speedPercent||0"
+                       :color="customColorMethod"></el-progress>
+        </template>
+        <template v-slot:remark="{row,$index}" v-if="dialogType!=='view'">
+          <el-form-item>
+            <el-input type="textarea" v-model="row.remark" clearable></el-input>
+          </el-form-item>
+        </template>
+        <template v-slot:headerRequired="{column}">
+          <span class="is-required">{{ column.label }}</span>
+        </template>
+      </ele-pro-table>
+    </el-form>
+
+
+  </div>
+</template>
+
+
+<script>
+
+
+
+import fileUpload from "@/components/upload/fileUpload.vue";
+import {getFile} from "@/api/system/file";
+import PersonSelect from "@/components/CommomSelect/person-select.vue";
+import {proStatusEnum} from "@/enum/dict";
+
+
+export default {
+  name: "projectInfoTable",
+  components: {
+    PersonSelect,
+    fileUpload,
+
+  },
+  props: {
+    dialogForm: {
+      type: Object,
+      default: () => {
+        return {
+          ...this.form
+        }
+      }
+    },
+    dialogType: {
+      type: String,
+      default: ''
+    },
+    deptList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
+    deptTreeList: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
+  },
+  watch: {
+    dialogForm: {
+      handler(val) {
+        this.form.datasource = this.dialogForm.stageList
+        this.$nextTick(async () => {
+          this.form.datasource.forEach((item, index) => {
+            this.getUserList(item.responsibleDeptId,index);
+          })
+        })
+      },
+      deep: true,
+    },
+  },
+  data() {
+    return {
+      editIndex: undefined,//当前修改数据的下标
+      form: {
+        datasource: []
+      },
+
+    }
+  },
+  computed: {
+    columns() {
+      let list = [
+        {
+          columnKey: 'index',
+          label: '序号',
+          type: 'index',
+          width: 55,
+          align: 'center',
+          showOverflowTooltip: true,
+          fixed: 'left'
+        },
+        {
+          prop: 'name',
+          label: '阶段名称',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 120,
+          slot: 'name',
+          headerSlot: 'headerRequired',
+        },
+        {
+          prop: 'content',
+          label: '阶段说明',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 120,
+          slot: 'content',
+          headerSlot: 'headerRequired',
+        },
+        {
+          prop: 'planStartDate',
+          label: '开始时间',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 170,
+          slot: 'planStartDate',
+          headerSlot: 'headerRequired',
+        },
+        {
+          prop: 'planEndDate',
+          label: '结束时间',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 170,
+          slot: 'planEndDate',
+          headerSlot: 'headerRequired',
+        },
+        {
+          prop: 'realStartTime',
+          label: '实际开始时间',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 170,
+        },
+        {
+          prop: 'realEndTime',
+          label: '实际结束时间',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 170,
+        },
+        {
+          prop: 'responsibleDeptId',
+          label: '负责部门',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 130,
+          slot: 'responsibleDeptId',
+          headerSlot: 'headerRequired',
+        },
+        {
+          prop: 'responsibleUserId',
+          label: '负责人',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 130,
+          slot: 'responsibleUserId',
+          headerSlot: 'headerRequired',
+        },
+        {
+          prop: 'remark',
+          label: '备注',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 160,
+          slot: 'remark',
+        },
+        {
+          prop: 'isOverTime',
+          label: '是否超时',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 100,
+          slot: 'isOverTime'
+        },
+        {
+          prop: 'speedPercent',
+          label: '进度',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 150,
+          slot: 'speedPercent'
+        },
+        {
+          prop: 'status',
+          label: '状态',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 130,
+          formatter: (_row, _column, cellValue) => {
+            return proStatusEnum[_row.status].label;
+          }
+        },
+
+      ]
+      let action = [{
+        columnKey: 'action',
+        slot: 'action',
+        label: '操作',
+        resizable: false,
+        width: 80,
+        align: 'center',
+        showOverflowTooltip: true,
+        fixed: 'right'
+      },]
+      this.dialogType === 'view' ? list = [...list] : list = [...list, ...action]
+      return list
+    },
+  },
+  methods: {
+
+    // 选择负责人部门
+    changeDeptInfo(id, index) {
+      const info = this.deptList.find((e) => e.id == id) || {};
+
+      this.$set(this.form.datasource[index], 'responsibleDeptName', info.name);
+      this.$set(this.form.datasource[index], 'responsibleUserId', '');
+      this.$set(this.form.datasource[index], 'responsibleUserName', '');
+      this.getUserList(id, index);
+    },
+    // 获取人员数据
+    getUserList(groupId, index) {
+      if (groupId) {
+        this.$refs['directorRef' + index].getList({groupId});
+      }
+    },
+    personChange(val, info, index) {
+      this.$set(this.form.datasource[index], 'responsibleUserName', info.name);
+    },
+    downloadFile(file) {
+      getFile({objectName: file.storePath}, file.name);
+    },
+    //新增计划数据
+    handleAddInfo() {
+      this.form.datasource.push(
+        {
+          milepost: '',
+          isMilepost: 0,
+          responsibleUserId: '',
+          responsibleUserName: '',
+          responsibleDeptId: '',
+          responsibleDeptName: '',
+          planStartDate: '',
+          planEndDate: '',
+          name: '',
+          content: '',
+          status: 0,
+          isOverTime: 0,
+          speedPercent: 0,
+          remark: '',
+        }
+      )
+    },
+    //
+    clearData() {
+      this.form.datasource.forEach((item, index) => {
+        this.$set(this.form.datasource[index], 'milepost', '')
+        this.$set(this.form.datasource[index], 'isMilepost', 0)
+        this.$set(this.form.datasource[index], 'isOverTime', 0)
+        this.$set(this.form.datasource[index], 'speedPercent', 0)
+        this.$set(this.form.datasource[index], 'responsibleUserId', '')
+        this.$set(this.form.datasource[index], 'responsibleUserName', '')
+        this.$set(this.form.datasource[index], 'responsibleDeptId', '')
+        this.$set(this.form.datasource[index], 'responsibleDeptName', '')
+        this.$set(this.form.datasource[index], 'planStartDate', '')
+        this.$set(this.form.datasource[index], 'planEndDate', '')
+        this.$set(this.form.datasource[index], 'name', '')
+        this.$set(this.form.datasource[index], 'content', '')
+      })
+    },
+
+    //删除关联信息数据
+    handleDelInfo(index) {
+      this.form.datasource.splice(index, 1)
+    },
+    customColorMethod(percentage) {
+      if (percentage < 30) {
+        return '#909399';
+      } else if (percentage < 70) {
+        return '#e6a23c';
+      } else {
+        return '#67c23a';
+      }
+    },
+    getTableValidate() {
+      return new Promise((resolve, reject) => {
+        if (this.form.datasource.length == 0) return this.$message.warning('请填写计划节点')
+        this.$refs.form.validate((valid) => {
+          if (!valid) {
+            this.$message.warning('有必填项未填，请检查')
+            reject('有必填项未填，请检查')
+          } else {
+            resolve(this.form.datasource)
+          }
+        })
+      })
+    },
+  }
+}
+</script>
+
+
+<style scoped lang="scss">
+:deep(.el-form-item) {
+  margin-bottom: 0;
+}
+</style>

src/views/bpm/handleTask/components/project-manage/project-initiation/submit.vue

@@ -49,9 +49,8 @@
 </template>
 
 <script>
-  import { UpdateInformation, cancel } from '@/api/bpm/components/purchasingManage/purchaseNeedManage';
   import { approveTaskWithVariables } from '@/api/bpm/task';
-  import {projectsUpdateAPI} from "@/api/bpm/components/project-manage";
+  import {projectsUpdateAPI,cancel} from "@/api/bpm/components/project-manage";
 
   // 流程实例的详情页，可用于审批
   export default {

src/views/bpm/handleTask/components/project-manage/task-manage/detailDialog.vue

@@ -0,0 +1,118 @@
+<template>
+  <div>
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <headerTitle title="基础信息"></headerTitle>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item
+            prop="code"
+            label="任务编码">
+            <el-input disabled v-model="form.taskCode"></el-input>
+          </el-form-item>
+
+        </el-col>
+        <el-col :span="12">
+          <el-form-item
+            prop="name"
+            label="任务名称">
+            <el-input disabled v-model="form.taskName" :disabled="dialogType=='view'"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item
+            prop="type"
+            label="交付物类型">
+            <dict-selection dict-name="交付物类型" v-model="form.type" :disabled="dialogType=='view'"></dict-selection>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item
+            prop="content"
+            label="交付物说明">
+            <el-input type="textarea" v-model="form.content" :disabled="dialogType=='view'" clearable></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="8">
+          <el-form-item
+            prop="cycle"
+            label="交付物附件">
+            <el-link
+              v-if="form.files.length"
+              v-for="item in form.files"
+              type="primary"
+              :underline="false"
+              @click="downloadFile(item)">
+              {{ item.name }}
+            </el-link>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+
+
+import {taskFilesGetByIdAPI} from "@/api/bpm/components/project-manage/task";
+import {getFile} from "@/api/system/file";
+
+export default {
+  name: "task-deliverables-form",
+  props: {
+    dialogType: {
+      type: String,
+      default: 'view',
+    },
+    businessId: {
+      default: ''
+    },
+    taskId: {
+      default: ''
+    },
+    taskDefinitionKey: {
+      default: ''
+    }
+  },
+  data() {
+    return {
+      form: {},
+      rules: {}
+    }
+  },
+  async created() {
+    await this.getInfo(this.businessId)
+  },
+  methods: {
+    downloadFile(file) {
+      getFile({objectName: file.storePath}, file.type);
+    },
+    async getInfo(id) {
+      this.form = await taskFilesGetByIdAPI(id)
+      this.form.type = this.form.type + ''
+      return this.form
+    },
+    getTableValue() {
+      return new Promise((resolve, reject) => {
+        this.$refs.form.validate(valid => {
+          if (!valid) {
+            this.$message.warning('有必填项未填，请检查')
+            reject('有必填项未填，请检查')
+          } else {
+            resolve(this.form)
+          }
+        })
+      })
+    }
+  }
+}
+</script>
+
+
+<style scoped lang="scss">
+
+</style>

src/views/bpm/handleTask/components/project-manage/task-manage/submit.vue

@@ -0,0 +1,150 @@
+<template>
+  <el-col :span="16" :offset="6">
+    <el-form label-width="100px" ref="formRef" :model="form">
+      <el-form-item
+        label="审批建议"
+        prop="reason"
+        style="margin-bottom: 20px"
+        :rules="{
+          required: true,
+          message: '请选择',
+          trigger: 'change'
+        }"
+      >
+        <el-input
+          type="textarea"
+          v-model="form.reason"
+          placeholder="请输入审批建议"
+        />
+      </el-form-item>
+    </el-form>
+    <div style="margin-left: 10%; margin-bottom: 20px; font-size: 14px">
+      <el-button
+        icon="el-icon-edit-outline"
+        type="success"
+        size="mini"
+        @click="handleAudit(1)"
+      >通过
+      </el-button>
+
+      <el-button
+        icon="el-icon-circle-close"
+        type="danger"
+        size="mini"
+        @click="handleAudit(0)"
+        v-if="!['starter'].includes(taskDefinitionKey)"
+      >驳回
+      </el-button>
+
+      <el-dropdown @command="(command) => handleCommand(command)" style="margin-left: 30px;">
+        <span class="el-dropdown-link">
+          更多<i class="el-icon-arrow-down el-icon--right"></i>
+        </span>
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item command="cancel">作废</el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+    </div>
+  </el-col>
+</template>
+
+<script>
+import {approveTaskWithVariables} from '@/api/bpm/task';
+import {cancel} from "@/api/bpm/components/project-manage/task";
+
+// 流程实例的详情页，可用于审批
+export default {
+  name: '',
+  components: {
+    //   Parser
+  },
+  props: {
+    businessId: {
+      default: ''
+    },
+    taskId: {
+      default: ''
+    },
+    id: {
+      default: ''
+    },
+    taskDefinitionKey: {
+      default: ''
+    }
+  },
+  data() {
+    return {
+      form: {
+        reason: ''
+      }
+    };
+  },
+  created() {
+  },
+  methods: {
+    /** 处理转办审批人 */
+    handleUpdateAssignee() {
+      this.$emit('handleUpdateAssignee');
+    },
+    /** 退回 */
+    handleBackList() {
+      this.$emit('handleBackList');
+    },
+
+    async handleAudit(status) {
+      await this._approveTaskWithVariables(status);
+    },
+    async _approveTaskWithVariables(status) {
+      let variables = {
+        pass: !!status
+      };
+
+      approveTaskWithVariables({
+        id: this.taskId,
+        reason: this.form.reason,
+        variables
+      }).then((res) => {
+        if (res.data.code != '-1') {
+          this.$emit('handleAudit', {
+            status,
+            title: status === 0 ? '驳回' : ''
+          });
+        }
+      });
+    },
+
+    getTableValue() {
+      return new Promise((resolve, reject) => {
+        this.$emit('getTableValue', async (data) => {
+          resolve(await data);
+        });
+      });
+    },
+
+    //更多
+    handleCommand(command) {
+      if (command === 'cancel') {
+        this.$confirm("是否确认作废？", {
+          type: 'warning',
+          cancelButtonText: '取消',
+          confirmButtonText: '确定'
+        }).then(() => {
+          cancel({
+            id: this.taskId,
+            reason: this.form.reason,
+            businessId: this.businessId,
+          }).then(() => {
+            this.$emit('handleClose');
+          }).catch(() => {
+            this.$message.error("流程作废失败");
+          });
+        }).catch(() => {
+        });
+      }
+    },
+
+  }
+};
+</script>
+
+<style lang="scss"></style>

src/views/bpm/handleTask/components/purchasePlanManage/submit.vue

@@ -2,6 +2,7 @@
   <el-col :span="16" :offset="6">
     <el-form label-width="100px" ref="formRef" :model="form">
       <el-form-item
+        v-if="taskDefinitionKey === 'deptLeaderAssign'"
         label="负责人"
         prop="userId"
         style="margin-bottom: 20px"
@@ -173,6 +174,18 @@
             status,
             title: status === 0 ? '驳回' : ''
           });
+        }else {
+          approveTaskWithVariables({
+            id: this.taskId,
+            reason: this.form.reason,
+            variables:{
+              pass:!!status
+            }
+          });
+          this.$emit('handleAudit', {
+            status,
+            title: status === 0 ? '驳回' : ''
+          });
         }
       },