feat(oa-project-flow) approve page

ruoyi-ui/src/views/flowable/oa-project-flow.vue

@@ -118,6 +118,7 @@ export default {
         solution: '',
       },
       oaProjectFlowId: '',
+      oaProjectFlowKey: 'process_l9kpb443',
       projectList: [],
       // 表单校验
       rules: {}
@@ -131,12 +132,12 @@ export default {
     },
     /** 启动流程 */
     startFlow(){
-      definitionStart(this.oaProjectFlowId).then(res =>{
+      definitionStart(this.oaProjectFlowId, JSON.stringify(this.form)).then(res => {
         this.msgSuccess(res.msg);
       })
     },    /** 获取最新流程id */
     getLatestIdByKey(){
-      getLatestIdByKey("oa_project_flow").then(res => {
+      getLatestIdByKey(this.oaProjectFlowKey).then(res => {
         this.oaProjectFlowId = res.data;
       });
     },
@@ -216,26 +217,6 @@ export default {
       // });
       this.$router.push({path: '/tool/build/index', query: {formId: row.formId}})
     },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          if (this.form.formId != null) {
-            updateForm(this.form).then(response => {
-              this.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addForm(this.form).then(response => {
-              this.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
-        }
-      });
-    },
     /** 删除按钮操作 */
     handleDelete(row) {
       const formIds = row.formId || this.ids;

ruoyi-ui/src/views/flowable/task/record/index.vue

@@ -9,7 +9,54 @@
       <!--流程处理表单模块-->
       <el-col :span="16" :offset="6" v-if="variableOpen">
           <div>
-            <parser :key="new Date().getTime()" :form-conf="variablesData" />
+            <el-form ref="form" :model="form" :rules="rules" label-width="100px" :disabled="true">
+              <el-form-item label="所属项目">
+                <el-select v-model="form.projectId"
+                           clearable
+                           filterable
+                           placeholder="请选择">
+                  <el-option
+                    v-for="(item,index) in projectList"
+                    :key="index"
+                    :label="item.label"
+                    :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="项目问题">
+                <el-input type="textarea" v-model="form.issue"/>
+              </el-form-item>
+              <el-form-item label="解决方案">
+                <el-input type="textarea" v-model="form.solution"/>
+              </el-form-item>
+              <el-form-item label="工作记录">
+                <el-input type="textarea" v-model="form.workRecord"/>
+              </el-form-item>
+              <el-form-item label="图片上传" prop="remark">
+                <el-upload
+                  class="upload-demo"
+                  action="https://jsonplaceholder.typicode.com/posts/"
+                  :on-preview="handlePreview"
+                  :on-remove="handleRemove"
+                  :file-list="fileList">
+                  <el-button size="small" type="primary">点击上传</el-button>
+                  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+                </el-upload>
+              </el-form-item>
+              <el-form-item label="文件上传" prop="remark">
+                <el-upload
+                  class="upload-demo"
+                  action="https://jsonplaceholder.typicode.com/posts/"
+                  :on-preview="handlePreview"
+                  :on-remove="handleRemove"
+                  multiple
+                  :limit="3"
+                  :file-list="fileList">
+                  <el-button size="small" type="primary">点击上传</el-button>
+                  <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+                </el-upload>
+              </el-form-item>
+            </el-form>
           </div>
           <div style="margin-left:10%;margin-bottom: 20px;font-size: 14px;" v-if="finished === 'true'">
             <el-button  icon="el-icon-edit-outline" type="success" size="mini" @click="handleComplete">审批</el-button>
@@ -22,9 +69,56 @@
      </el-col>
 
       <!--初始化流程加载表单信息-->
-      <el-col :span="16" :offset="4" v-if="formConfOpen">
+      <el-col :span="16" :offset="4" v-if="formConfOpen" >
         <div class="test-form">
-          <parser :key="new Date().getTime()"  :form-conf="formConf" @submit="submitForm" ref="parser" @getData="getData" />
+          <el-form ref="form" :model="form" :rules="rules" label-width="100px"  :disabled="true">
+            <el-form-item label="所属项目">
+              <el-select v-model="form.projectId"
+                         clearable
+                         filterable
+                         placeholder="请选择">
+                <el-option
+                  v-for="(item,index) in projectList"
+                  :key="index"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="项目问题">
+              <el-input type="textarea" v-model="form.issue"/>
+            </el-form-item>
+            <el-form-item label="解决方案">
+              <el-input type="textarea" v-model="form.solution"/>
+            </el-form-item>
+            <el-form-item label="工作记录">
+              <el-input type="textarea" v-model="form.workRecord"/>
+            </el-form-item>
+            <el-form-item label="图片上传" prop="remark">
+              <el-upload
+                class="upload-demo"
+                action="https://jsonplaceholder.typicode.com/posts/"
+                :on-preview="handlePreview"
+                :on-remove="handleRemove"
+                :file-list="fileList">
+                <el-button size="small" type="primary">点击上传</el-button>
+                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+              </el-upload>
+            </el-form-item>
+            <el-form-item label="文件上传" prop="remark">
+              <el-upload
+                class="upload-demo"
+                action="https://jsonplaceholder.typicode.com/posts/"
+                :on-preview="handlePreview"
+                :on-remove="handleRemove"
+                multiple
+                :limit="3"
+                :file-list="fileList">
+                <el-button size="small" type="primary">点击上传</el-button>
+                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+              </el-upload>
+            </el-form-item>
+          </el-form>
         </div>
       </el-col>
     </el-card>
@@ -84,12 +178,12 @@
             </div>
           </el-col>
       </el-card>
-    <el-card class="box-card">
+<!--    <el-card class="box-card">-->
-        <div slot="header" class="clearfix">
+<!--        <div slot="header" class="clearfix">-->
-          <span class="el-icon-picture-outline">流程图</span>
+<!--          <span class="el-icon-picture-outline">流程图</span>-->
-        </div>
+<!--        </div>-->
-        <flow :xmlData="xmlData" :taskData="taskList"></flow>
+<!--        <flow :xmlData="xmlData" :taskData="taskList"></flow>-->
-    </el-card>
+<!--    </el-card>-->
 
     <!--审批正常流程-->
     <el-dialog :title="completeTitle" :visible.sync="completeOpen" :width="checkSendUser? '60%':'40%'" append-to-body>
@@ -203,6 +297,7 @@ import {treeselect} from "@/api/system/dept";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import Treeselect from "@riophae/vue-treeselect";
 import {listUser} from "@/api/system/user";
+import {optionProject} from "@/api/system/project";
 
 export default {
   name: "Record",
@@ -260,6 +355,14 @@ export default {
       variables: [], // 流程变量数据
       variablesData: {}, // 流程变量数据
       variableOpen: false, // 是否加载流程变量数据
+      // 表单参数
+      form: {
+        projectId: 0,
+        workRecord: '',
+        issue: '',
+        solution: '',
+      },
+      projectList: [],
       returnTaskList: [],  // 回退列表数据
       finished: 'false',
       completeTitle: null,
@@ -289,6 +392,7 @@ export default {
       this.getNextFlowNode(this.taskForm.taskId)
       this.taskForm.deployId = null
     }
+    this.optionList();
     this.getFlowRecordList( this.taskForm.procInsId, this.taskForm.deployId);
     this.finished =  this.$route.query && this.$route.query.finished
   },
@@ -382,10 +486,14 @@ export default {
       flowRecord(params).then(res => {
         this.flowRecordList = res.data.flowList;
         // 流程过程中不存在初始化表单 直接读取的流程变量中存储的表单值
-        if (res.data.formData) {
+        // if (res.data.formData) {
-          this.formConf = res.data.formData;
+          this.form = res.data.form;
+        console.log("res.data.form;", res.data.form)
+        console.log("this.form ", this.form)
+        if (this.taskForm.executionId === undefined) {
           this.formConfOpen = true
         }
+        // }
       }).catch(res => {
         this.goBack();
       })
@@ -404,11 +512,19 @@ export default {
         // 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
         getProcessVariables(taskId).then(res => {
           // this.variables = res.data.variables;
-          this.variablesData = res.data.variables;
+          this.form = res.data;
           this.variableOpen = true
         });
       }
     },
+    /** 查询项目列表 */
+    optionList() {
+      this.loading = true;
+      optionProject().then(response => {
+        this.projectList = response.data;
+        this.loading = false;
+      });
+    },
     /** 根据当前任务或者流程设计配置的下一步节点 */
     getNextFlowNode(taskId) {
       // 根据当前任务或者流程设计配置的下一步节点 todo 暂时未涉及到考虑网关、表达式和多节点情况