diff --git a/src/components/DetailComponent/ApprovalDetail.vue b/src/components/DetailComponent/ApprovalDetail.vue
index 4748b36..be2fc96 100644
--- a/src/components/DetailComponent/ApprovalDetail.vue
+++ b/src/components/DetailComponent/ApprovalDetail.vue
@@ -2,7 +2,20 @@
   <div>
     <fvForm :schema="schema" @getInstance="(e)=>form = e"></fvForm>
     <!-- <AttachmentUpload></AttachmentUpload> -->
-
+    <el-form :model="formData" label-width="auto">
+      <el-form-item label="其他文件">
+        <el-table :data="formData.fileList" style="width: 100%">
+          <el-table-column label="序号" type="index" width="80"></el-table-column>
+          <el-table-column label="文件名称" prop="originalFileName"></el-table-column>
+          <el-table-column label="标签" prop="tag"></el-table-column>
+          <el-table-column label="文件大小" prop="size">
+            <template #default="{row}">
+              {{ parseInt(row.size / 1024) + 'KB' }}
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-form-item>
+    </el-form>
     <div class="approval-record">
         <baseTitle title="审批记录"></baseTitle>
         <div class="process">
@@ -22,6 +35,8 @@ 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'
+import { ElLoading } from 'element-plus';
+import {deleteFile, downloadFile} from "@/api/project-demand";
 
 const props = defineProps({
   formData: {
@@ -40,37 +55,99 @@ const props = defineProps({
     type: Array,
     default: []
   },
+
+  // approval 立项, execute 实施, 归档 archivist
+  type: {
+    type: String,
+    default: 'approval'
+  }
 })
 
 const form = ref()
 
 const localData = reactive({
-  fileList: props.formData.fileList
+  fileList: props.formData.fileList,
+  singleFile: props.formData.singleFile
 })
 
 const schema = computed(()=>{
-  return [
-    {
-      label: '前置流程',
-      prop: 'preProcess',
-      colProps: {
-        span: 24
-      }
-    },
-    {
-      label: '项目立项附件',
-      prop: 'singleFile',
-      colProps: {
-        span: 24
-      }
-    },
-    {
-      label: '其他文件',
-      prop: 'fileList',
-    }
-  ]
+  let arr
+
+  if(props.type == 'approval') {
+    arr = [
+      {
+        label: '前置流程',
+        prop: 'preProcess',
+        colProps: {
+          span: 24
+        }
+      },
+      {
+        label: '项目立项附件',
+        prop: 'singleFile',
+        colProps: {
+          span: 24
+        },
+        component: ()=>(
+          <div>
+            {
+              props.formData.singleFile?.originalFileName ? 
+              <span 
+                style={{color: '#409EFF', cursor: 'pointer'}}
+                onClick={()=>handleDownload(props.formData.singleFile)}
+              >
+                {props.formData.singleFile?.originalFileName}
+              </span> :
+              <span>{'--'}</span>
+            }
+          </div>
+          
+        )
+      },
+    ]
+  } else if(props.type == 'execute') {
+    arr = [
+      {
+        label: '前置流程',
+        prop: 'preProcess',
+        colProps: {
+          span: 24
+        }
+      },
+      {
+        label: '项目验收附件',
+        prop: 'singleFile',
+        colProps: {
+          span: 24
+        }
+      },
+    ]
+  } else {
+    arr = [
+      {
+        label: '项目归档附件',
+        prop: 'singleFile',
+        colProps: {
+          span: 24
+        }
+      },
+    ]
+  }
+  return arr
 })
 
+const handleDownload = (row) => {
+  const loading = ElLoading.service({fullscreen: true})
+  downloadFile(row.fileId).then(res => {
+    const blob = new Blob([res])
+    let a = document.createElement('a')
+    a.href = URL.createObjectURL(blob)
+    a.download = row.originalFileName
+    a.click()
+    loading.close()
+  })
+}
+
 watchEffect(()=>{
   Object.keys(props.formData).length && (form.value.setValues(props.formData))
 })
diff --git a/src/components/steps/index.vue b/src/components/steps/index.vue
index 22142ca..546904e 100644
--- a/src/components/steps/index.vue
+++ b/src/components/steps/index.vue
@@ -79,6 +79,10 @@ const localSteps = ref([
     title: '项目归档',
     key: 'archivist',
   },
+  // {
+  //   title: '项目结项',
+  //   key: 'end',
+  // },
 ])
 
 const baseForm = ref()
@@ -134,9 +138,11 @@ const formatProcedure = (data) => {
           break
         case '20': arr.push(2)
           break
-        case '30': arr.push(3)
+        // case '30': arr.push(3)
+        //   break
+        case '40': arr.push(3)
           break
-        case '40': arr.push(4)
+        case '50': arr.push(4)
           break
       }
     })
@@ -156,9 +162,11 @@ const formatReProcedure = (data) => {
           break
         case 2: arr.push('20')
           break
-        case 3: arr.push('30')
+        // case 3: arr.push('30')
+        //   break
+        case 3: arr.push('40')
           break
-        case 4: arr.push('40')
+        case 4: arr.push('50')
           break
       }
     })
@@ -166,26 +174,13 @@ const formatReProcedure = (data) => {
 }
 
 const formatActive = (val) => {
-  console.log(val, 'val');
   let active = ''
-  // switch(val) {
-  //   case '0' : active = '00'
-  //     break
-  //   case '1' : active = '10'
-  //     break
-  //   case '2' : active = '20'
-  //     break
-  //   case '3' : active = '30'
-  //     break
-  //   case '4' : active = '40'
-  //     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--');
+  // val == 3 && (active = '30')
+  val == 3 && (active = '40')
+  val == 4 && (active = '50')
   return active
 }
 
@@ -207,9 +202,11 @@ const handleStep = (key, index) => {
         break
       case 2: active = '20'
         break
-      case 3: active = '30'
+      // case 3: active = '30'
+      //   break
+      case 3: active = '40'
         break
-      case 4: active = '40'
+      case 4: active = '50'
         break
     }
     emits('stepChange', { key, active })
diff --git a/src/views/project-management/filing/detail.vue b/src/views/project-management/filing/detail.vue
index 30c9220..f95826c 100644
--- a/src/views/project-management/filing/detail.vue
+++ b/src/views/project-management/filing/detail.vue
@@ -1,23 +1,33 @@
 <template>
-  <div class="detail-block">
-    <el-tabs
-        v-model="activeName"
-        type="card"
-        class="demo-tabs"
-        @tab-click="handleClick"
-    >
-      <el-tab-pane label="需求征集" name="first">
+  <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 type="approval" v-show="showActive == '20'" :formData="commonForm.formData" :data="commonForm" :processViewer="commonProvessViewer"></ApprovalDetail>
+      <ApprovalDetail type="execute" v-show="showActive == '40'" :formData="commonForm.formData" :data="commonForm" :processViewer="commonProvessViewer"></ApprovalDetail>
+      <ApprovalDetail type="archivist" v-show="showActive == '50'" :formData="commonForm.formData" :data="commonForm" :processViewer="commonProvessViewer"></ApprovalDetail>
 
-      </el-tab-pane>
-      <el-tab-pane label="需求上报" name="second"></el-tab-pane>
-      <el-tab-pane label="项目立项" name="third" ></el-tab-pane>
-      <el-tab-pane label="项目实施" name="third"></el-tab-pane>
-      <el-tab-pane label="项目归档" name="third" :disabled="true"></el-tab-pane>
-    </el-tabs>
-  </div>
+    </template>
+  </steps>
 </template>
 
 <script setup lang="jsx">
+import {getInfo} from "@/api/project-demand/index.js";
+import {getSubCompOpt} from '@/api/user/user.js'
+import {useProcessStore} from '@/stores/processStore.js';
+import CollectionDetail from "@/components/DetailComponent/CollectionDetail.vue";
+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 activeName = ref('first')
 const handleClick = (tab, event) => {
   console.log(tab, event)
@@ -25,6 +35,58 @@ const handleClick = (tab, event) => {
 
   }
 }
+
+
+
+const getCompanyOption = async () => {
+  const res = await getSubCompOpt()
+  companyOption.value = res.data
+}
+
+
+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">
diff --git a/src/views/project-management/implementation/detail.vue b/src/views/project-management/implementation/detail.vue
index 386dc31..0057b63 100644
--- a/src/views/project-management/implementation/detail.vue
+++ b/src/views/project-management/implementation/detail.vue
@@ -1,29 +1,101 @@
 <template>
-<div class="detail-block">
-  <el-tabs
-      v-model="activeName"
-      type="card"
-      class="demo-tabs"
-      @tab-click="handleClick"
-  >
-    <el-tab-pane label="需求征集" name="first">
+  <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 type="approval" v-show="showActive == '20'" :formData="commonForm.formData" :data="commonForm" :processViewer="commonProvessViewer"></ApprovalDetail>
+      <ApprovalDetail type="execute" v-show="showActive == '40'" :formData="commonForm.formData" :data="commonForm" :processViewer="commonProvessViewer"></ApprovalDetail>
 
-    </el-tab-pane>
-    <el-tab-pane label="需求上报" name="second"></el-tab-pane>
-    <el-tab-pane label="项目立项" name="third" ></el-tab-pane>
-    <el-tab-pane label="项目实施" name="third" :disabled="true"></el-tab-pane>
-  </el-tabs>
-</div>
+    </template>
+  </steps>
 </template>
 
 <script setup lang="jsx">
-const activeName = ref('first')
+import {getInfo} from "@/api/project-demand/index.js";
+import {getSubCompOpt} from '@/api/user/user.js'
+import {useProcessStore} from '@/stores/processStore.js';
+import CollectionDetail from "@/components/DetailComponent/CollectionDetail.vue";
+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 activeName = ref('first')
 const handleClick = (tab, event) => {
   console.log(tab, event)
   if(tab.index.value === 0){
 
   }
 }
+
+
+const route = useRoute()
+const activeName = ref('first')
+const collectionData = ref({})
+const summaryData = ref({})
+const collectionProcessViewer = ref(true)
+const summaryProcessViewer = ref(true)
+const processStore = useProcessStore()
+const companyOption = ref([])
+const rules = reactive({
+  auditOpinion: [{required: true, message: '请输入审核意见', trigger: 'blur'}],
+})
+const getCompanyOption = async () => {
+  const res = await getSubCompOpt()
+  companyOption.value = res.data
+}
+
+
+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">
diff --git a/src/views/project-management/implementation/index.vue b/src/views/project-management/implementation/index.vue
index 12e05ee..5e3eae9 100644
--- a/src/views/project-management/implementation/index.vue
+++ b/src/views/project-management/implementation/index.vue
@@ -195,7 +195,8 @@ const handleDetail = (row) => {
   router.push({
     name: 'Implementation/detail',
     query: {
-      id: row.requirementId
+      id: row.requirementId,
+      projectId: row.projectId
     }
   })
 }
diff --git a/src/views/project-management/initiation/detail.vue b/src/views/project-management/initiation/detail.vue
index 19bc487..7de1bf3 100644
--- a/src/views/project-management/initiation/detail.vue
+++ b/src/views/project-management/initiation/detail.vue
@@ -122,6 +122,7 @@ const getAllInfo = async (state) => {
     } else if(state == '10') {
       summaryData.value = data;
     }
+    console.log(data, 'data--22');
     commonForm.value = data
     processStore.setDesign(data)
     processStore.runningList.value = data.runningList;