复核评审上传材料限制一张，报错后不能显示文件列表，修改为a-upload原生形式

src/components/customComponent/ConfirmedModal.vue

 <template>
   <BasicModal v-bind="$attrs" @register="registerModal" :title="title" @ok="handleSubmit" width="50%">
-    <BasicForm @register="registerForm"> </BasicForm>
+    <BasicForm @register="registerForm"> 
+      <template #upload="{ model, field }">
+        <a-upload 
+          :beforeUpload="beforeUpload" 
+          :showDownloadBtn="true"
+          :headers="headers"
+          :multiple="multiple"
+          :action="uploadUrl"
+          :showUploadList="false"
+          fileName="相关材料"
+          :maxCount="1"
+          @change="onFileChange"
+          accept=".pdf,.zip,.doc,.docx">
+          <a-button>
+            <upload-outlined></upload-outlined>
+            上传
+          </a-button>
+        </a-upload>
+        <a-button size="small" type="primary" v-show="fileList" @click="down(fileList, '相关材料')" style="height:32px;padding:4px 15px;margin-left:10px;">
+          <DownloadOutlined></DownloadOutlined> 下载
+        </a-button>
+      </template>
+    </BasicForm>
     <a-table :dataSource="dataSource" :columns="columns" />
   </BasicModal>
 </template>
 
 <script lang="ts" setup>
-  import { ref, unref } from 'vue';
+  import { ref, unref, reactive } from 'vue';
   import { FormSchema } from '/@/components/Table';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { BasicForm, useForm } from '/@/components/Form/index';
   import { submiDqr, fhHis } from '@/api/common/api';
   import { useMessage } from '/@/hooks/web/useMessage';
-
+  import { uploadUrl, downloadFile} from '/@/api/common/api';
+  import { getToken } from '/@/utils/auth';
+  import { UploadOutlined, DownloadOutlined } from '@ant-design/icons-vue';
   const emit = defineEmits(['register', 'success']);
+  const fjcllj = ref('');
   const ishow = ref(false);
   const isUpdate = ref(true);
+  const uploadRef = ref();
   const { createMessage } = useMessage();
+  const fileList = ref('');
+  const headers = reactive({
+    'X-Access-Token': getToken(),
+  });
+  function down(url, name) {
+    let fileExtension = url.split('.').pop();
+    downloadFile('/sys/common/static' + url, `${name}.${fileExtension}`);
+  }
   const AdviceFormSchema: FormSchema[] = [
     { label: '污染地块ID', field: 'wrdkid', required: true, component: 'Input', show: false },
     { label: '所处阶段编码', field: 'scjdbm', component: 'Input', show: false },
@@ -59,23 +93,25 @@
               field: 'clyjfj',
               component: 'JUpload',
               show: true,
-              componentProps: {
-                showUploadList: false,
-                fileName: '相关材料',
-                accept: '.pdf,.zip,.rar,.doc,.docx',
-                beforeUpload: (file) => {
-                  let isshow = false;
-                  const isFile = file.name.split('.')[file.name.split('.').length - 1];
-                  console.log(file, 'file');
-                  if (isFile == 'pdf' || isFile == 'zip' || isFile == 'PDF' || isFile == 'rar' || isFile == 'doc' || isFile == 'docx') {
-                    isshow = true;
-                  } else {
-                    createMessage.error('只能上传.pdf/.zip/.rar/word格式的文件');
-                    isshow = false;
-                  }
-                  return isshow;
-                },
-              },
+              slot: 'upload',
+              // componentProps: {
+              //   showUploadList: false,
+              //   maxCount: 1,
+              //   fileName: '相关材料',
+              //   accept: '.pdf,.zip,.rar,.doc,.docx',
+              //   beforeUpload: (file) => {
+              //     let isshow = false;
+              //     const isFile = file.name.split('.')[file.name.split('.').length - 1];
+              //     console.log(file, 'file');
+              //     if (isFile == 'pdf' || isFile == 'zip' || isFile == 'PDF' || isFile == 'rar' || isFile == 'doc' || isFile == 'docx') {
+              //       isshow = true;
+              //     } else {
+              //       createMessage.error('只能上传.pdf/.zip/.rar/word格式的文件');
+              //       isshow = false;
+              //     }
+              //     return isshow;
+              //   },
+              // },
             });
           }
         },
@@ -106,23 +142,14 @@
       field: 'clyjfj',
       component: 'JUpload',
       show: true,
-      componentProps: {
-        showUploadList: false,
-        fileName: '相关材料',
-        accept: '.pdf,.zip,.doc,.docx',
-        beforeUpload: (file) => {
-          let isshow = false;
-          const isFile = file.name.split('.')[file.name.split('.').length - 1];
-          console.log(file, 'file');
-          if (isFile == 'pdf' || isFile == 'zip' || isFile == 'PDF' || isFile == 'doc' || isFile == 'docx') {
-            isshow = true;
-          } else {
-            createMessage.error('只能上传.pdf/.zip/word格式的文件');
-            isshow = false;
-          }
-          return isshow;
-        },
-      },
+      slot: 'upload',
+      // componentProps: {
+      //   showUploadList: false,
+      //   fileName: '相关材料',
+      //   maxCount: 1,
+      //   accept: '.pdf,.zip,.doc,.docx',
+        
+      // },
     },
   ];
   //表单配置
@@ -177,11 +204,40 @@
     console.log(v, 'v');
     dataSource.value = await fhHis(v);
   }
+  function beforeUpload(file) {
+    // console.log(file, 'file');
+    let isshow = false;
+    const isFile = file.name.split('.')[file.name.split('.').length - 1];
+    if (isFile == 'pdf' || isFile == 'zip' || isFile == 'PDF' || isFile == 'rar' || isFile == 'doc' || isFile == 'docx') {
+      isshow = true;
+    } else {
+      createMessage.error('只能上传.pdf/.zip/.rar/word格式的文件');
+      isshow = false;
+    }
+    return isshow;
+  }
+  // upload组件change事件
+  async function onFileChange(info) {
+    console.log(info, 'info');
+    if (info.file.status === 'done') {
+      if (info.file.response.success) {
+        fileList.value = info.file.response.message;
+      } else {
+        createMessage.error(`${info.file.response.message}`);
+      }
+    } else if (info.file.status === 'error') {
+      createMessage.error(`${info.file.response.message}`);
+    }
+    if (info.file.status === 'removed') {
+      fileList.value = '';
+    }
+  }
   //表单提交事件
   async function handleSubmit() {
     try {
       let values = await validate();
       setModalProps({ confirmLoading: true });
+      values.clyjfj = fileList.value;
       if (values.nodeType == 1) {
         values.clyj = '复核通过';
       }

src/components/customComponent/PointInfor.vue

@@ -193,14 +193,14 @@
   //   上传图片的限制
   function beforeUpload(file) {
     console.log(file, 'file');
-    if (file.type != 'image/jpg') {
-      createMessage.error('只能上传jpg,png格式的图片');
-      return false;
-    }
-    if (file.type != 'image/png') {
+    if (file.type != 'image/jpg' && file.type != 'image/png') {
       createMessage.error('只能上传jpg,png格式的图片');
       return false;
     }
+    // if (file.type != 'image/png') {
+    //   createMessage.error('只能上传jpg,png格式的图片');
+    //   return false;
+    // }
     return true;
   }
   //   上传图片