fix : 修复需求上报/详情下流程渲染

src/components/DetailComponent/CollectionDetail.vue

@@ -1,71 +1,69 @@
 <template>
-  <div v-loading="loading">
-    <el-form :model="formData" ref="form" label-width="auto">
-      <el-row>
-        <el-col :span="12">
-          <el-form-item label="名称">
-            <span>{{ formData.requirementName }}</span>
+  <el-form :model="formData" ref="form" label-width="auto">
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="名称">
+          <span>{{ formData.requirementName }}</span>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="所属公司">
+          <span>{{ formData.companyIds }}</span>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="征集类型">
+          <span>{{ formData.collectType }}</span>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="截止时间">
+          <span>{{ formData.deadline }}</span>
+        </el-form-item>
+      </el-col>
+      <baseTitle title="征集说明"></baseTitle>
+      <el-col :span="24">
+        <el-form-item>
+          <el-card style="width: 100%">
+            <div v-html="formData.collectExplain">
+            </div>
+          </el-card>
+        </el-form-item>
+      </el-col>
+      <baseTitle title="附件列表"></baseTitle>
+      <el-col :span="24">
+        <el-form-item>
+          <fvTable style="width: 100%;max-height: 200px" v-if="processViewer" :tableConfig="tableConfig"
+                   :data="formData.fileList" :isSettingCol="false" :pagination="false">
+            <template #empty>
+              <el-empty :image-size="90" description="暂无数据" style="padding: 0"/>
+            </template>
+          </fvTable>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <div v-if="formData.taskId">
+          <baseTitle title="审核意见"></baseTitle>
+          <el-form-item prop="auditOpinion">
+            <el-input
+                v-model="formData.auditOpinion"
+                :rows="3"
+                type="textarea"
+                placeholder="请输入审核意见"
+            />
           </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="所属公司">
-            <span>{{ formData.companyIds }}</span>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="征集类型">
-            <span>{{ formData.collectType }}</span>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="截止时间">
-            <span>{{ formData.deadline }}</span>
-          </el-form-item>
-        </el-col>
-        <baseTitle title="征集说明"></baseTitle>
-        <el-col :span="24">
-          <el-form-item>
-            <el-card style="width: 100%">
-              <div v-html="formData.collectExplain">
-              </div>
-            </el-card>
-          </el-form-item>
-        </el-col>
-        <baseTitle title="附件列表"></baseTitle>
-        <el-col :span="24">
-          <el-form-item>
-            <fvTable style="width: 100%;max-height: 200px" v-if="processViewer" :tableConfig="tableConfig"
-                     :data="formData.fileList" :isSettingCol="false" :pagination="false">
-              <template #empty>
-                <el-empty :image-size="90" description="暂无数据" style="padding: 0"/>
-              </template>
-            </fvTable>
-          </el-form-item>
-        </el-col>
-        <el-col :span="24">
-          <div v-if="formData.taskId">
-            <baseTitle title="审核意见"></baseTitle>
-            <el-form-item prop="auditOpinion">
-              <el-input
-                  v-model="formData.auditOpinion"
-                  :rows="3"
-                  type="textarea"
-                  placeholder="请输入审核意见"
-              />
-            </el-form-item>
-          </div>
-        </el-col>
-      </el-row>
-      <div class="approval-record">
-        <baseTitle title="审批记录"></baseTitle>
-        <div class="process">
-          <operation-render v-if="processViewer" :operation-list="data.operationList"
-                            :state="data.state"/>
-          <process-diagram-viewer v-if="processViewer"/>
         </div>
+      </el-col>
+    </el-row>
+    <div class="approval-record">
+      <baseTitle title="审批记录"></baseTitle>
+      <div class="process">
+        <operation-render v-if="processViewer" :operation-list="data.operationList"
+                          :state="data.state"/>
+        <process-diagram-viewer v-if="processViewer"/>
       </div>
-    </el-form>
-  </div>
+    </div>
+  </el-form>
 </template>
 
 <script setup lang="jsx">
@@ -137,9 +135,6 @@ const tableConfig = reactive({
   ]
 })
 
-const getInfo = () => {
-  emit('getInfo')
-}
 const handleDownload = (row) => {
   downloadFile(row.fileId).then(res => {
     const blob = new Blob([res])
@@ -152,28 +147,23 @@ const handleDownload = (row) => {
 const getDataSourceOptionItem = (val) => {
   if (val instanceof Array) {
     val.forEach(item => {
-      matterTree(companyNameArray.value,props.companyOption, item)
+      matterTree(companyNameArray.value, props.companyOption, item)
     })
   }
   return companyNameArray.value.join('，');
 }
 watch(() => props.companyOption, (newVal) => {
-  props.companyOption=newVal
+  props.companyOption = newVal
 }, {deep: true})
 watch(() => props.formData, (newVal) => {
   if (newVal) {
     newVal.companyIds = getDataSourceOptionItem(newVal.companyIds)
-    props.formData=newVal
+    props.formData = newVal
   }
 }, {deep: true})
 watch(() => props.processViewer, (newVal) => {
   props.processViewer = newVal
 }, {deep: true})
-onMounted(() => {
-  loading.value = true
-  getInfo()
-  loading.value = false
-})
 </script>
 
 <style scoped>

src/components/DetailComponent/SummaryDetail.vue

@@ -1,9 +1,10 @@
 <template>
-  <el-form :model="localFormData" ref="summaryForm">
+  <div class="detail-block">
+  <el-form :model="localFormData" ref="summaryForm" :rules="rules">
     <el-row gutter="50">
       <el-col :span="12">
-        <el-form-item label="名称" prop="requirementName">
-          <span>{{ localFormData.requirementId }}</span>
+        <el-form-item label="名称" prop="projectName">
+          <span>{{ localFormData.projectName }}</span>
         </el-form-item>
       </el-col>
       <el-col :span="12">
@@ -32,8 +33,8 @@
         </el-form-item>
       </el-col>
       <el-col :span="12">
-        <el-form-item label="结束时间" prop="endTime">
-          <span>{{ localFormData.endTime }}</span>
+        <el-form-item label="研发主体" prop="rdSubject">
+          <span>{{ localFormData.rdSubject }}</span>
         </el-form-item>
       </el-col>
       <el-col :span="12">
@@ -136,23 +137,44 @@
           </fvTable>
         </el-form-item>
       </el-col>
+      <el-col :span="24">
+        <div v-if="data.taskId">
+          <baseTitle title="审核意见"></baseTitle>
+          <el-form-item prop="auditOpinion">
+            <el-input
+                v-model="localFormData.auditOpinion"
+                :rows="3"
+                type="textarea"
+                placeholder="请输入审核意见"
+            />
+          </el-form-item>
+        </div>
+      </el-col>
     </el-row>
     <div class="approval-record">
       <baseTitle title="审批记录"></baseTitle>
       <div class="process">
         <operation-render v-if="processViewer" :operation-list="data.operationList"
                           :state="data.state"/>
-        <process-diagram-viewer v-if="processViewer"/>
       </div>
     </div>
-  </el-form>
 
+    <div class="oper-page-btn" v-if="data.state === '1' && data.taskId">
+      <el-button @click="handleReject(summaryForm)" >驳回</el-button>
+      <el-button color="#DED0B2" @click="handleAgree">同意</el-button>
+    </div>
+  </el-form>
+  </div>
 </template>
 
 <script setup lang="jsx">
 import {downloadFile} from "@/api/project-demand";
 import OperationRender from '@/views/workflow/common/OperationRender.vue'
 import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
+import {ElMessage, ElNotification} from "element-plus";
+import {agreeTask, rejectTask} from "@/api/project-demand";
+import {useTagsView} from '@/stores/tagsview.js'
+const tagsViewStore = useTagsView()
 const props = defineProps({
   formData: {
     type: Object,
@@ -205,7 +227,54 @@ const tableConfig = reactive({
     }
   ]
 })
-
+const router = useRouter()
+const summaryForm=ref()
+const rules = reactive({
+  auditOpinion: [{required: true, message: '请输入审核意见', trigger: 'blur'}],
+})
+const handleReject = (instance) => {
+  if (!instance) return
+  instance.validate(async (valid) => {
+    if (!valid) return
+    let approve = {
+      taskId: props.data.taskId,
+      auditOpinion: localFormData.value.auditOpinion,
+    }
+    rejectTask(approve).then(res => {
+      ElNotification({
+        title: '提示',
+        message: res.msg,
+        type: res.code === 1000 ? 'success' : 'error'
+      })
+      if (res.code === 1000) {
+        tagsViewStore.delVisitedViews(router.currentRoute.value.path)
+        router.push({
+          name: 'Summary'
+        })
+      }
+    })
+  })
+}
+const handleAgree = () => {
+  let approve = {
+    taskId: props.data.taskId,
+    auditOpinion: localFormData.value.auditOpinion,
+    formData: localFormData.value
+  }
+  agreeTask(approve).then(res => {
+    ElNotification({
+      title: '提示',
+      message: res.msg,
+      type: res.code === 1000 ? 'success' : 'error'
+    })
+    if (res.code === 1000) {
+      tagsViewStore.delVisitedViews(router.currentRoute.value.path)
+      router.push({
+        name: 'Summary'
+      })
+    }
+  })
+}
 const handleDownload = (row) => {
   downloadFile(row.fileId).then(res => {
     const blob = new Blob([res])
@@ -222,6 +291,9 @@ watch(
     console.log(val, 'ssss');
   }
 )
+watch(() => props.processViewer, (newVal) => {
+  props.processViewer = newVal
+}, {deep: true})
 
 watchEffect(()=>{
   Object.keys(props.formData).length && (localFormData.value = props.formData)
@@ -232,5 +304,10 @@ watchEffect(()=>{
 :deep(.el-table--fit) {
   height: auto !important;
 }
+.detail-block{
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding-bottom: 20px;
+}
 
 </style>