feat: up detail

src/components/DetailComponent/ApprovalDetail.vue

@@ -0,0 +1,81 @@
+<template>
+  <div>
+    <fvForm :schema="schema" @getInstance="(e)=>form = e"></fvForm>
+    <!-- <AttachmentUpload></AttachmentUpload> -->
+
+    <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>
+    <Opinion: v-if="data.taskId" :formData="formData" :taskId="formData.taskId"></Opinion:>
+  </div>
+</template>
+
+<script setup lang="jsx">
+import { computed, markRaw, reactive, ref, watchEffect } from 'vue';
+import AttachmentUpload from '../AttachmentUpload.vue';
+import OperationRender from '@/views/workflow/common/OperationRender.vue'
+import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue';
+import Opinion from './Opinion.vue';
+import fvTable from '@/fvcomponents/fvTable/index.vue'
+
+const props = defineProps({
+  formData: {
+    type: Object,
+    default: {}
+  },
+  data: {
+    type: Array,
+    default: []
+  },
+  processViewer: {
+    type: Boolean,
+    default: false
+  },
+  companyOption: {
+    type: Array,
+    default: []
+  },
+})
+
+const form = ref()
+
+const localData = reactive({
+  fileList: props.formData.fileList
+})
+
+const schema = computed(()=>{
+  return [
+    {
+      label: '前置流程',
+      prop: 'preProcess',
+      colProps: {
+        span: 24
+      }
+    },
+    {
+      label: '项目立项附件',
+      prop: 'singleFile',
+      colProps: {
+        span: 24
+      }
+    },
+    {
+      label: '其他文件',
+      prop: 'fileList',
+    }
+  ]
+})
+
+watchEffect(()=>{
+  Object.keys(props.formData).length && (form.value.setValues(props.formData))
+})
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/components/DetailComponent/Opinion.vue

@@ -0,0 +1,80 @@
+<template>
+  <fvForm :schema="schema" @getInstance="(e)=>form = e"></fvForm>
+  <div class="oper">
+    <el-button type="danger" @click="handleReject">驳回</el-button>
+    <el-button type="primary" @click="handleAgree">同意</el-button>
+  </div>
+</template>
+
+<script setup lang="jsx">
+import { ElLoading, ElNotification } from 'element-plus';
+import { agreeTask, rejectTask} from "@/api/project-demand/index.js";
+
+const props = defineProps({
+  taskId: {
+    type: String,
+    default: ''
+  },
+  formData: {
+    type: Object,
+    default: {}
+  }
+})
+
+const form = ref()
+const schema = computed(()=>{
+  return [
+    {
+      label: '审核意见',
+      prop: 'auditOpinion',
+      component: 'el-input',
+      colProps: {
+        span: 24
+      },
+      props: {
+        placeholder: '请输入审核意见',
+        type: 'textarea',
+        maxlength: 140
+      }
+    }
+  ]
+})
+
+// {
+//   "auditOpinion": "统一",
+//   "formData": {"formData":""},
+//   "taskId": "156e69b7-15eb-11ef-a152-f268fc747b04"
+// }
+// 驳回
+const handleReject = async () => {
+  const values = form.value.getValues()
+  if(!values.auditOpinion) {
+    ElNotification({
+      title: '提示',
+      message: '请填写审核意见',
+      type: 'warning'
+    })
+    return
+  }
+  const params = {
+    // taskId: props.taskId,
+    // formData: props.formData,
+    // ...values
+  }
+  const res = await rejectTask(params)
+}
+
+const handleAgree = async () => {
+  const values = form.value.getValues()
+  const params = {
+    taskId: props.taskId,
+    formData: props.formData,
+    ...values
+  }
+  const res = await agreeTask(params)
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/components/steps/index.vue

@@ -39,7 +39,7 @@ const props = defineProps({
   // 当前显示步骤
   active: {
     type: Number,
-    default: 0
+    default: '0'
   },
   // 已完成的工作流步骤
   stepSuccess: {
@@ -168,18 +168,23 @@ const formatReProcedure = (data) => {
 const formatActive = (val) => {
   console.log(val, 'val');
   let active = ''
-  switch(val) {
+  // switch(val) {
-    case '0' || 0 : active = '00'
+  //   case '0' : active = '00'
-      break
+  //     break
-    case '1' || 1 : active = '10'
+  //   case '1' : active = '10'
-      break
+  //     break
-    case '2' || 2 : active = '20'
+  //   case '2' : active = '20'
-      break
+  //     break
-    case '3' || 3 : active = '30'
+  //   case '3' : active = '30'
-      break
+  //     break
-    case '4' || 4 : active = '40'
+  //   case '4' : active = '40'
-      break
+  //     break
-  }
+  // }
+  val == 0 && (active = '00')
+  val == 1 && (active = '10')
+  val == 2 && (active = '20')
+  val == 3 && (active = '30')
+  val == 4 && (active = '40')
   console.log(active, 'active--');
   return active
 }

src/views/project-management/initiation/detail.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="detail-block">
+  <!-- <div class="detail-block">
     <el-tabs
         v-model="activeName"
         type="card"
@@ -16,7 +16,22 @@
       </el-tab-pane>
       <el-tab-pane label="项目立项" name="third" :disabled="true"></el-tab-pane>
     </el-tabs>
-  </div>
+  </div> -->
+
+  <steps :active="'0'" @setDetail="setDetail" @stepChange="stepChange">
+    <template #content>
+      <collection-detail 
+        :formData="collectionData.formData" 
+        :data="collectionData"
+        :processViewer="commonProvessViewer"
+        :companyOption="companyOption"
+        @getInfo="getDemandCollectionInfo"
+        v-show="showActive == '00'"
+      />
+      <summary-detail v-show="showActive == '10'" :formData="summaryData.formData" :data="summaryData" :processViewer="commonProvessViewer"/>
+      <ApprovalDetail v-show="showActive == '20'" :formData="commonForm.formData" :data="commonForm" :processViewer="commonProvessViewer"></ApprovalDetail>
+    </template>
+  </steps>
 </template>
 
 <script setup lang="jsx">
@@ -26,6 +41,9 @@ import {useProcessStore} from '@/stores/processStore.js';
 import CollectionDetail from "@/components/DetailComponent/CollectionDetail.vue";
 import {downloadFile} from "@/api/project-demand";
 import SummaryDetail from "@/components/DetailComponent/SummaryDetail.vue";
+import ApprovalDetail from "@/components/DetailComponent/ApprovalDetail.vue";
+import { getMapProjectStateInfo } from '@/components/steps/api';
+import { ElLoading } from "element-plus";
 
 const route = useRoute()
 const activeName = ref('first')
@@ -88,7 +106,51 @@ const handleClick = (tab, event) => {
     getDemandSummaryInfo()
   }
 }
-getDemandCollectionInfo()
+// getDemandCollectionInfo()
+
+const commonForm = ref({})
+const commonProvessViewer = ref(true)
+
+const getAllInfo = async (state) => {
+  const loading = ElLoading.service({fullscreen: true})
+  try {
+    state == '00' && ( await getCompanyOption() )
+    commonProvessViewer.value = false
+    const { data, code } = await getMapProjectStateInfo(route.query.projectId, state)
+    if(state == '00') {
+      collectionData.value = data;
+    } else if(state == '10') {
+      summaryData.value = data;
+    }
+    commonForm.value = data
+    processStore.setDesign(data)
+    processStore.runningList.value = data.runningList;
+    processStore.endList.value = data.endList;
+    processStore.noTakeList.value = data.noTakeList;
+    processStore.refuseList.value = data.refuseList;
+    processStore.passList.value = data.passList;
+    nextTick(() => {
+      // summaryProcessViewer.value = true
+      commonProvessViewer.value = true
+    })
+    loading.close()
+  } catch {
+    loading.close()
+  }
+  
+}
+
+const showActive = ref()
+
+const setDetail = (active) => {
+  showActive.value = active
+  getAllInfo(active)
+}
+
+const stepChange = (data) => {
+  showActive.value = data.active
+  getAllInfo(data.active)
+}
 </script>
 
 <style scoped lang="scss">

src/views/project-management/initiation/index.vue

@@ -179,7 +179,8 @@ const handleDetail = (row) => {
   router.push({
     name:'Initiation/detail',
     query: {
-      id: row.requirementId
+      id: row.requirementId,
+      projectId: row.projectId
     }
   })
 }