fix : 完善需求新增/详情页面

src/views/projectdemand/demandcollection/add.vue

@@ -48,7 +48,7 @@
     <file-upload @getFile="getFile"/>
     <div class="approval-record">
       <baseTitle title="流程"></baseTitle>
-      <process-diagram-viewer/>
+      <process-diagram-viewer v-if="processDiagramViewer"/>
       <!--      <div class="process" id="approvalRecord">-->
       <!--        <process-tree ref="processTree" mode="view" id-name="approvalRecord"/>-->
       <!--      </div>-->
@@ -71,6 +71,7 @@ import FileUpload from "../../../components/FileUpload.vue";
 import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
 import ProcessTree from '@/views/workflow/process/ProcessTree.vue';
 import {useProcessStore} from '@/stores/processStore.js';
+
 const dateValue = ref()
 const queryParams = reactive({
   name: '',
@@ -78,6 +79,7 @@ const queryParams = reactive({
   type: '',
 })
 const processTree = ref()
+const processDiagramViewer = ref(false)
 const tagsViewStore = useTagsView()
 const authStore = useAuthStore()
 const route = useRoute()
@@ -176,11 +178,11 @@ const getFile = (val) => {
   console.log('fileList', val)
   fileList.value = val
 }
-const init = () => {
+const init = async () => {
   console.log("asdasdasd")
   getWorkflowInfo().then(res => {
     let data = res.data
-    console.log('res', res)
+    console.log('res2', res)
     processInstanceData.value = data
     processStore.setDesign(data)
     processStore.runningList.value = data.runningList;
@@ -188,6 +190,10 @@ const init = () => {
     processStore.noTakeList.value = data.noTakeList;
     processStore.refuseList.value = data.refuseList;
     processStore.passList.value = data.passList;
+    nextTick(()=>{
+      console.log('processDiagramViewer')
+      processDiagramViewer.value=true
+    })
   })
 }
 // const getTree = async () => {
@@ -233,7 +239,7 @@ watch(localData, (val) => {
 
 // onMounted(async () => {
 //   loading.value = true
-init()
+  init()
 //   if (route.query.id) {
 //     await getInfo()
 //   }

src/views/projectdemand/demandcollection/detail.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="detail-block">
     <el-form :model="form" label-width="auto">
-      <el-row gutter="20">
-        <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="14">
+<!--      <el-row gutter="20">-->
+<!--        <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="14">-->
           <baseTitle title="需求征集详情"></baseTitle>
           <div class="left-info">
             <el-row>
@@ -40,8 +40,8 @@
               </el-col>
             </el-row>
           </div>
-        </el-col>
-        <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="10">
+<!--        </el-col>-->
+<!--        <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="10">-->
           <div class="approval-record">
             <baseTitle title="审批记录"></baseTitle>
             <div class="process" id="approvalRecord">
@@ -49,8 +49,8 @@
 <!--              <process-tree ref="processTree" mode="view" id-name="approvalRecord"/>-->
             </div>
           </div>
-        </el-col>
-      </el-row>
+<!--        </el-col>-->
+<!--      </el-row>-->
     </el-form>
     <div class="oper-page-btn">
       <el-button @click="handleSubmit">驳回</el-button>

src/views/workflow/process/ProcessTree.vue

@@ -36,8 +36,7 @@ const valid = ref(true)
 let vNode = {}
 
 const init = () => {
-
-  console.log("sdsdsdsdsdsdsd",processStore.getProcess())
+  // console.log("sdsdsdsdsdsdsd",processStore.getProcess())
   processStore.init()
   initMapping(processStore.getProcess())
   // 定义类名(可忽略)
@@ -50,7 +49,7 @@ const init = () => {
 
 // 初始化map集合,以便数据整理
 const initMapping = (node) => {
-  node.forEach(nodeItem => {
+  node?.forEach(nodeItem => {
     processStore.nodeMap.set(nodeItem.id, nodeItem)
     processStore.parentMap.set(nodeItem.parentId, nodeItem)
   })
@@ -59,15 +58,15 @@ const initMapping = (node) => {
 const initHeaderBgc = (node) => {
   if (node.props && props.mode === 'preview') {
     let headerBgc = '#ff943e'
-    if (processStore.runningList.value.includes(node.id)) {
+    if (processStore.runningList.value?.includes(node.id)) {
       headerBgc = '#1e90ff'
-    } else if (processStore.endList.value.includes(node.id)) {
+    } else if (processStore.endList.value?.includes(node.id)) {
       headerBgc = '#20b2aa'
-    } else if (processStore.noTakeList.value.includes(node.id)) {
+    } else if (processStore.noTakeList.value?.includes(node.id)) {
       headerBgc = '#909399'
-    } else if (processStore.refuseList.value.includes(node.id)) {
+    } else if (processStore.refuseList.value?.includes(node.id)) {
       headerBgc = '#f56c6c'
-    } else if (processStore.passList.value.includes(node.id)) {
+    } else if (processStore.passList.value?.includes(node.id)) {
       headerBgc = '#ff943e'
     }
     node.props.headerBgc = headerBgc