feat: 主流程详情组件基本完成

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))
 })

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 })