feat : 项目管理表单缓存,文件回显,个人中心icon排版

src/components/AttachmentUpload.vue

@@ -5,7 +5,7 @@
         <el-form-item :label="label" prop="attachment" label-width="125">
           <template v-if="preview&&JSON.stringify(singleFile) !== '{}'&&JSON.stringify(singleFile)!=='null'">
             <el-button type="primary" link @click="handleDownload(singleFile)" style="font-size: 16px">
-              {{ singleFile ? singleFile?.originalFileName : formData.singleFile?.originalFileName }}
+              {{ singleFile ? singleFile?.originalFileName : formData.singleFile?.originalFileName?formData.singleFile?.originalFileName:_singleFileValue[0]?.originalFileName }}
             </el-button>
             <el-button type="danger" link @click="deleteSingleFile(singleFile?singleFile:formData.singleFile,1)">删除
             </el-button>
@@ -16,10 +16,7 @@
                          :disabled="isSingleFile" ref="fileUploadRef"/>
             <!--           :showFileList="showFileList" @delete="deleteAttachment"-->
             <fvTable style="width: 100%;max-height: 80px;" v-if="showSingleTable"  height="80"   :tableConfig="singleTableConfig"
-                     :data="singleFileList" :isSettingCol="false" :pagination="false">
-              <template #empty>
-                <el-empty :image-size="90" description="暂无数据" style="padding: 0"/>
-              </template>
+                     :data="_singleFileValue" :isSettingCol="false" :pagination="false">
             </fvTable>
           </template>
         </el-form-item>
@@ -27,14 +24,12 @@
       <el-col :span="24">
         <el-form-item label="其他文件" label-width="125">
           <file-upload @getFile="getOtherFile"/>
-          <!--          <el-card style="width: 100%;box-shadow: none">-->
           <fvTable style="width: 100%;max-height: 162px;" v-if="showTable" height="162"  :tableConfig="tableConfig"
                    :data="allFileList" :isSettingCol="false" :pagination="false">
             <template #empty>
               <el-empty :image-size="55" description="暂无数据" style="padding: 0"/>
             </template>
           </fvTable>
-          <!--          </el-card>-->
         </el-form-item>
       </el-col>
     </el-row>
@@ -46,6 +41,7 @@ import FileUpload from '@/components/FileUpload.vue'
 import {deleteFile, downloadFile} from "@/api/project-demand";
 import {ElMessageBox, ElNotification} from "element-plus";
 
+
 const props = defineProps({
   showFileList: {
     type: Boolean,
@@ -88,7 +84,7 @@ const props = defineProps({
     default: ''
   }
 })
-const emit = defineEmits(["getAttachment", "getOtherFile"])
+const emit = defineEmits(["getAttachment", "getOtherFile","update:singleList"])
 const tableConfig = reactive({
   columns: [
     {
@@ -223,14 +219,36 @@ const isSingleFile = ref(false)
 const allFileList = ref([])
 const deleteFileVal = ref({})
 const singleFileList = ref([])
-// if (props.formData.fileList !== null && props.formData.fileList?.length > 0) {
-//   allFileList.value = props.formData.fileList
-// }
+if(localStorage.getItem('singleFile')){
+  singleFile.value = JSON.parse(localStorage.getItem('singleFile'))
+}
+const _singleFileValue = computed({
+  get() {
+    return props.singleList;
+  },
+  set(value) {
+    emit('update:singleList', value)
+  }
+})
+
+console.log('_singleFileValue',_singleFileValue.value)
+const _otherFileListValue = computed({
+  get() {
+    return props.otherFileList;
+  },
+  set(value) {
+    emit('update:otherFileList', value)
+  }
+})
+if(_otherFileListValue.value&&_otherFileListValue.value.length>0){
+  _otherFileListValue.value.forEach(item=>{
+    allFileList.value.push(item)
+  })
+}
 watch(() => props.showSingleTable, (newVal) => {
   props.showSingleTable = newVal
 }, {deep: true})
 watch(() => props.formData.fileList, (newVal) => {
-  // console.log('newVal-fileList', newVal)
   if (props.preview) {
     newVal?.forEach(item => {
       allFileList.value.push(item)
@@ -256,18 +274,21 @@ watch(() => props.formData.fileList, (newVal) => {
 watch(() => props.showTable, (newVal) => {
   props.showTable = newVal
 }, {deep: true})
-watch(() => props.singleList, (newVal) => {
-  // console.log('singleFile', newVal)
-  singleFileList.value = newVal
-}, {deep: true})
+// watch(() => props.singleList, (newVal) => {
+//   console.log('singleFile', newVal)
+//   singleFileList.value = newVal
+// }, {deep: true})
 watch(() => props.formData.singleFile, (newVal) => {
-  // console.log('singleFile', newVal)
+  console.log('singleFile', newVal)
   singleFile.value = newVal
   props.formData.singleFile=newVal
 }, {deep: true})
 watch(() => isSingleFile.value, (newVal) => {
   isSingleFile.value = newVal
 }, {deep: true})
+watch(() => singleFile.value, (newVal) => {
+  singleFile.value = newVal
+}, {deep: true})
 const handleDelete = (row, type) => {
   deleteFile(row.fileId).then(res => {
     ElNotification({
@@ -277,7 +298,7 @@ const handleDelete = (row, type) => {
     })
     if (res.code === 1000) {
       if (type === 'single') {
-        singleFileList.value.splice(singleFileList.value.findIndex((item) => item.fileId === row.fileId), 1);
+        _singleFileValue.value.splice(_singleFileValue.value.findIndex((item) => item.fileId === row.fileId), 1);
         isSingleFile.value = false
       } else {
         allFileList.value.splice(allFileList.value.findIndex((item) => item.fileId === row.fileId), 1);
@@ -311,7 +332,7 @@ const getOtherFile = (val) => {
   if (props.preview) {
     allFileList.value.push(compositeParam(val))
   } else {
-    allFileList.value = props.otherFileList
+    allFileList.value = _otherFileListValue.value
   }
   emit('getOtherFile', val)
 }