feat : "需求上报, 项目立项, 项目验收, 阶段变更, 专项资金" 上传文件旁边加上模板下载功能

2024-11-02 22:00:08 +08:00
parent a175a6456a
commit 08da2601d8
6 changed files with 110 additions and 41 deletions
--- a/src/components/AttachmentUpload.vue
+++ b/src/components/AttachmentUpload.vue
@@ -1,29 +1,32 @@
 <template>
  <el-form :model="formData" ref="applyForm" :rules="rules" :label-position="labelPosition" style="margin-left: 5px">
    <el-row>
-<!--      <el-col :span="24">-->
-<!--        <el-form-item :label="label" prop="attachment" >-->
-<!--          <template v-if="preview">-->
-<!--            <file-upload @getFile="getAttachment" :multiple="false"-->
-<!--                         :disabled="singleFileArray?.length>0?true:false" title="如需修改需求申请书附件，请先删除文件再上传！"/>-->
-<!--            <fvTable style="width: 100%;max-height: 80px;" height="80" v-if="singleFileArray?.length>0"-->
-<!--                     :tableConfig="editSingleTableConfig"-->
-<!--                     :data="singleFileArray" :isSettingCol="false" :pagination="false">-->
-<!--            </fvTable>-->
-<!--          </template>-->
-<!--          <template v-else-if="!preview">-->
-<!--            <file-upload @getFile="getAttachment" :multiple="false"-->
-<!--                         :disabled="isSingleFile"/>-->
-<!--            <fvTable style="width: 100%;max-height: 80px;" v-if="showSingleTable" height="80"-->
-<!--                     :tableConfig="singleTableConfig"-->
-<!--                     :data="_singleFileValue" :isSettingCol="false" :pagination="false">-->
-<!--            </fvTable>-->
-<!--          </template>-->
-<!--        </el-form-item>-->
-<!--      </el-col>-->
+      <!--      <el-col :span="24">-->
+      <!--        <el-form-item :label="label" prop="attachment" >-->
+      <!--          <template v-if="preview">-->
+      <!--            <file-upload @getFile="getAttachment" :multiple="false"-->
+      <!--                         :disabled="singleFileArray?.length>0?true:false" title="如需修改需求申请书附件，请先删除文件再上传！"/>-->
+      <!--            <fvTable style="width: 100%;max-height: 80px;" height="80" v-if="singleFileArray?.length>0"-->
+      <!--                     :tableConfig="editSingleTableConfig"-->
+      <!--                     :data="singleFileArray" :isSettingCol="false" :pagination="false">-->
+      <!--            </fvTable>-->
+      <!--          </template>-->
+      <!--          <template v-else-if="!preview">-->
+      <!--            <file-upload @getFile="getAttachment" :multiple="false"-->
+      <!--                         :disabled="isSingleFile"/>-->
+      <!--            <fvTable style="width: 100%;max-height: 80px;" v-if="showSingleTable" height="80"-->
+      <!--                     :tableConfig="singleTableConfig"-->
+      <!--                     :data="_singleFileValue" :isSettingCol="false" :pagination="false">-->
+      <!--            </fvTable>-->
+      <!--          </template>-->
+      <!--        </el-form-item>-->
+      <!--      </el-col>-->
      <el-col :span="24">
        <el-form-item :label="label" prop="" required>
          <file-upload @getFile="getOtherFile"/>
+          <el-button color="#DED0B2" v-if="templateDownloadBtnShow" @click="handleImportTemplateDownload"
+                     style="margin-left: 10px">模板下载
+          </el-button>
          <fvTable style="width: 100%;max-height: 160px;" v-if="showTable" height="160" :tableConfig="tableConfig"
                   :data="allFileList" :isSettingCol="false" :pagination="false">
            <template #empty>
@@ -34,13 +37,14 @@
      </el-col>
    </el-row>
  </el-form>
-  <file-preview ref="filePreviewRef" v-if="filePreviewShow" :fileName="filePreviewParam.fileName" :fileUrl="filePreviewParam.fileUrl"
+  <file-preview ref="filePreviewRef" v-if="filePreviewShow" :fileName="filePreviewParam.fileName"
+                :fileUrl="filePreviewParam.fileUrl"
                :fileType="filePreviewParam.fileType"/>
 </template>

 <script setup lang="jsx">
 import FileUpload from '@/components/FileUpload.vue'
-import {deleteFile, downloadFile} from "@/api/project-demand";
+import {deleteFile, downloadFile, downloadTemplate} from "@/api/project-demand";
 import {ElMessageBox, ElNotification} from "element-plus";


@@ -65,6 +69,16 @@ const props = defineProps({
    type: Boolean,
    default: false
  },
+  //是否显示模板下载按钮
+  templateDownloadBtnShow: {
+    type: Boolean,
+    default: false
+  },
+  //模板下载时的文件名
+  templateName: {
+    type: String,
+    default: ''
+  },
  singleList: {
    type: Array,
    default: []
@@ -103,7 +117,8 @@ const baseTableConf = reactive(
        align: 'center',
        width: 400,
        currentRender: ({row, index}) => (
-            <div style="color: #2a99ff;cursor: pointer;" onClick={() => clickToPreview(row)}>{row.originalFileName}</div>)
+            <div style="color: #2a99ff;cursor: pointer;"
+                 onClick={() => clickToPreview(row)}>{row.originalFileName}</div>)
      },
      {
        prop: 'tag',
@@ -249,7 +264,7 @@ const isHaveOneFile = ref(false)
 const allFileList = ref([])
 if (localStorage.getItem('singleFile')) {
  singleFileArray.value.push(JSON.parse(localStorage.getItem('singleFile')))
-  singleFile.value =JSON.parse(localStorage.getItem('singleFile'))
+  singleFile.value = JSON.parse(localStorage.getItem('singleFile'))
 }

 const filePreviewParam = ref({
@@ -277,7 +292,7 @@ const _otherFileListValue = computed({
  }
 })
 if (_otherFileListValue.value && _otherFileListValue.value.length > 0) {
-  isHaveOneFile.value=true
+  isHaveOneFile.value = true
  _otherFileListValue.value.forEach(item => {
    allFileList.value.push(item)
  })
@@ -288,7 +303,7 @@ if (_otherFileListValue.value && _otherFileListValue.value.length > 0) {
 watch(() => props.formData.fileList, (newVal) => {
  if (props.preview) {
    newVal?.forEach(item => {
-      isHaveOneFile.value=true
+      isHaveOneFile.value = true
      allFileList.value.push(item)
    })
  }
@@ -340,6 +355,26 @@ watch(() => isHaveOneFile.value, (newVal) => {
 // }, {deep: true})


+const handleImportTemplateDownload = () => {
+  console.info("🚀 ~method:handleImportTemplateDownload -----", props.tag)
+  let templateType = ''
+  if (props.tag === '需求上报') {
+    templateType = '2'
+  } else if (props.tag === '项目立项') {
+    templateType = '5'
+  } else if (props.tag === '项目验收') {
+    templateType = '7'
+  }else if (props.tag === '阶段变更') {
+    templateType = '8'
+  }
+  downloadTemplate(templateType).then(res => {
+      const blob = new Blob([res])
+      let a = document.createElement('a')
+      a.href = URL.createObjectURL(blob)
+      a.download = props.templateName + ".docx"
+      a.click()
+  })
+}


 const clickToPreview = (row) => {
@@ -350,14 +385,13 @@ const clickToPreview = (row) => {
    fileName: row.originalFileName,
    fileType: row.fileType
  }
-  nextTick(()=>{
+  nextTick(() => {
    filePreviewShow.value = true
  })
  // filePreviewRef.value.show()
 }


-
 const handleDelete = (row, type) => {
  deleteFile(row.fileId).then(res => {
    ElNotification({
@@ -371,14 +405,14 @@ const handleDelete = (row, type) => {
        isSingleFile.value = false
      } else {
        allFileList.value.splice(allFileList.value.findIndex((item) => item.fileId === row.fileId), 1);
-        if(allFileList.value&&allFileList.value?.length==0){
-          isHaveOneFile.value=false
-        }else{
-          isHaveOneFile.value=true
+        if (allFileList.value && allFileList.value?.length == 0) {
+          isHaveOneFile.value = false
+        } else {
+          isHaveOneFile.value = true
        }
-        if(localStorage.getItem('collectData')){
-          let collectData=JSON.parse(localStorage.getItem('collectData'))
-          collectData.fileList=allFileList.value
+        if (localStorage.getItem('collectData')) {
+          let collectData = JSON.parse(localStorage.getItem('collectData'))
+          collectData.fileList = allFileList.value
          localStorage.setItem('collectData', JSON.stringify(collectData))
        }
      }
@@ -409,7 +443,7 @@ const getOtherFile = (val) => {
  } else {
    allFileList.value = _otherFileListValue.value
  }
-  isHaveOneFile.value=true
+  isHaveOneFile.value = true
  emit('getOtherFile', val)
 }
 const deleteAttachment = (val) => {
--- a/src/components/DetailComponent/ProjectApply.vue
+++ b/src/components/DetailComponent/ProjectApply.vue
@@ -62,7 +62,7 @@
    </el-form>
    <!--    v-if="showAttachment"-->
    <AttachmentUpload ref="attachment" :label="getTitleName(title)+'附件'" :showTable="showTable"
-                      v-model:otherFileList="otherFileList" :tag="getTitleName(props.title)"
+                      v-model:otherFileList="otherFileList" :tag="getTitleName(props.title)"  :templateName="getTemplateName(props.title)" :templateDownloadBtnShow="props.title==='apply'?true:props.title==='check'"
                      @getAttachment="getAttachment" v-model:singleList="singleList" :showSingleTable="showSingleTable"
                      @getOtherFile="getOtherFile" :showFileList="true" :formData="localFormData"
                      :preview="mode == 'resubmit'"/>
@@ -250,6 +250,16 @@ const filePreviewParam = ref({
  fileType: 'pdf'
 })
 const filePreviewShow = ref(false)
+
+const getTemplateName=(type)=>{
+  switch (type) {
+    case 'apply':
+      return '科技创新项目立项申请表'
+    case 'check':
+      return '科技创新项目验收申请表'
+  }
+}
+
 const handleShowOptionalChargeLeadershipPicker = () => {
  optionalChargeLeadershipPickerRef.value.showUserPicker()
 }