build : 流程演示

src/api/project-demand/index.js

@@ -26,6 +26,13 @@ export const agreeTask = (data) => {
     data: data
   });
 };
+export const rejectTask = (data) => {
+  return request({
+    url: `/workflow/mosr/process/task/reject`,
+    method: "post",
+    data: data
+  });
+};
 
 export const addRequirement = (data) => {
   return request({

src/views/projectdemand/demandcollection/add.vue

@@ -44,7 +44,7 @@
     <file-upload @getFile="getFile"/>
     <div class="approval-record">
       <baseTitle title="流程"></baseTitle>
-      <process-diagram-viewer v-if="processDiagramViewer"/>
+      <process-diagram-viewer mode="view" v-if="processDiagramViewer" />
       <!--      <div class="process" id="approvalRecord">-->
       <!--        <process-tree ref="processTree" mode="view" id-name="approvalRecord"/>-->
       <!--      </div>-->

src/views/projectdemand/demandcollection/detail.vue

@@ -60,16 +60,16 @@
       <div class="approval-record">
         <baseTitle title="审批记录"></baseTitle>
         <div class="process">
-          <operation-render :operation-list="processInstanceData.operationList"
+          <operation-render v-if="processDiagramViewer" :operation-list="processInstanceData.operationList"
                             :state="'4'"/>
-<!--          <process-diagram-viewer v-if="processDiagramViewer"/>-->
+          <process-diagram-viewer v-if="processDiagramViewer"/>
         </div>
       </div>
       <!--        </el-col>-->
       <!--      </el-row>-->
     </el-form>
     <div class="oper-page-btn" v-if="processInstanceData.taskId">
-      <el-button @click="handleBack">驳回</el-button>
+      <el-button @click="handleReject">驳回</el-button>
       <el-button color="#DED0B2" @click="handleSubmit">同意</el-button>
     </div>
   </div>
@@ -79,7 +79,7 @@
 import OperationRender from '@/views/workflow/common/OperationRender.vue'
 import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
 import {useProcessStore} from '@/stores/processStore.js';
-import {getInfo, agreeTask} from "@/api/project-demand/index.js";
+import {getInfo, agreeTask, rejectTask} from "@/api/project-demand/index.js";
 
 const route = useRoute()
 const form = ref();
@@ -130,6 +130,15 @@ const handleSubmit = () => {
     console.log(res)
   })
 }
+const handleReject = () => {
+  let approve = {
+    taskId: processInstanceData.value.taskId,
+    auditOpinion : auditOpinion.value,
+  }
+  rejectTask(approve).then(res => {
+    console.log(res)
+  })
+}
 
 const init = async () => {
   getInfo(route.query.id).then(res => {

src/views/workflow/common/ProcessDiagramViewer.vue

@@ -9,7 +9,7 @@
   <div style="margin-top: 40px">
     <div :style="'transform: scale('+ scale / 100 +');'">
       <div id="previewProcess">
-        <process-tree mode="preview" ref="processTreePreview" id-name="previewProcess"/>
+        <process-tree :mode="mode" ref="processTreePreview" id-name="previewProcess"/>
       </div>
     </div>
   </div>
@@ -20,6 +20,12 @@ import ProcessTree from '@/views/workflow/process/ProcessTree.vue'
 
 const processTreePreview = ref()
 const scale = ref(100)
+const props = defineProps({
+  mode: {
+    type: String,
+    default: 'preview'
+  }
+})
 
 nextTick(()=>{
   processTreePreview.value.init()

src/views/workflow/process/common/AvatarEllipsis.vue

@@ -38,6 +38,10 @@ const props = defineProps({
   userInfo: {
     type: Array,
     default: []
+  },
+  mode: {
+    type: String,
+    default: 'design'
   }
 })
 

src/views/workflow/process/nodes/Node.vue

@@ -17,24 +17,28 @@
         </el-icon>
         <template v-if="selectUser.show && mode === 'view'">
           <div class="avatar_button">
-            <avatar-ellipsis :row="3" v-if="userInfo.length > 0" :user-info="userInfo"/>
+            <avatar-ellipsis :row="3" v-if="userInfo.length > 0" :mode="mode" :user-info="userInfo"/>
             <el-button type="primary" :icon="Plus" circle/>
           </div>
         </template>
         <template v-else-if="showAvatar">
           <span class="placeholder" v-if="userInfo.length === 0">{{ placeholder }}</span>
-          <div v-else v-for="item in userInfo" class="circle-user">
+
-            <span>{{ item.name }}</span>
+          <avatar-ellipsis :row="3" v-if="userInfo.length > 0" :mode="mode" :user-info="userInfo"/>
-            <el-button v-if="item.state==='RUNNING'" type="warning" loading circle class="circle-icon"></el-button>
+
-            <el-button v-else-if="item.state==='UNACTIVATED'" type="info" :icon="More" circle
+
-                       class="circle-icon"></el-button>
+<!--          <div v-else v-for="item in userInfo" class="circle-user">-->
-            <el-button v-else type="success" :icon="Check" circle class="circle-icon"></el-button>
+<!--            <span>{{ item.name }}</span>-->
-          </div>
+<!--            <el-button v-if="item.state==='RUNNING'" type="warning" loading circle class="circle-icon"></el-button>-->
+<!--            <el-button v-else-if="item.state==='UNACTIVATED'" type="info" :icon="More" circle-->
+<!--                       class="circle-icon"></el-button>-->
+<!--            <el-button v-else type="success" :icon="Check" circle class="circle-icon"></el-button>-->
+<!--          </div>-->
           <!--          <avatar-ellipsis :row="3" :user-info="userInfo"/>-->
         </template>
         <template v-else>
           <span class="placeholder" v-if="(content || '').trim() === ''">{{ placeholder }}</span>
-          <ellipsis :row="3" :content="content" v-else/>
+          <ellipsis :row="3" :content="content"  :mode="mode" v-else/>
         </template>
       </div>
       <div class="node-error" v-if="showError">