PATCH: fix: make everything works without file in dms-tree

src/components/specific/files/document-viewer/DocumentViewer.vue

@@ -25,7 +25,7 @@
         <BIMDataTextbox :text="currentDocument?.name" />
       </div>
 
-      <div class="btn-box" v-if="selectedFileTab.id !== 'visas'">
+      <div class="btn-box" v-if="documentList.length > 1">
         <BIMDataButton
           width="40px"
           height="40px"
@@ -53,7 +53,7 @@
 
         <template v-else-if="[...OFFICE_FILES, PDF, '.pdf'].includes(fileType)">
           <div class="pdf-container">
-            <BIMDataPDFViewer :pdf="file" />
+            <BIMDataPDFViewer :pdf="{ file }" />
           </div>
         </template>
 
@@ -71,14 +71,14 @@
         </div>
       </template>
 
-      <div class="btn-box" v-if="selectedFileTab.id !== 'visas'">
+      <div class="btn-box" v-if="documentList.length > 1">
         <BIMDataButton
           width="40px"
           height="40px"
           fill
           rounded
           icon
-          :disabled="index === documents.length - 1"
+          :disabled="index === documentList.length - 1"
           @click="index++"
         >
           <BIMDataIconChevron size="xs" />
@@ -89,17 +89,17 @@
 </template>
 
 <script setup>
-import { computed, ref, watch, onMounted, onUnmounted, watchEffect } from "vue";
+import { computed, onBeforeUnmount, onMounted, ref, watch, watchEffect } from "vue";
 import { useRouter } from "vue-router";
 import { useAppModal } from "../../app/app-modal/app-modal.js";
 import { MODEL_CONFIG, MODEL_TYPE } from "../../../../config/models.js";
-import { OFFICE_FILES, IMAGE_PREVIEW_FILES } from "../../../../config/files.js";
+import { OFFICE_FILES, IMAGE_FILES } from "../../../../config/files.js";
+import FileService from "../../../../services/FileService.js";
+import ModelService from "../../../../services/ModelService.js";
 import { useFiles } from "../../../../state/files.js";
 import { useModels } from "../../../../state/models.js";
-import { isFolder } from "../../../../utils/file-structure.js";
 import { fileExtension } from "../../../../utils/files.js";
 import { openInViewer } from "../../../../utils/models.js";
-import FileService from "../../../../services/FileService.js";
 
 // Components
 import NoDocPreviewImage from "../../../images/NoDocPreviewImage.vue";
@@ -111,42 +111,26 @@ const props = defineProps({
     type: Object,
     required: true,
   },
-  folder: {
-    type: Object,
+  documentList: {
+    type: Array,
     required: true,
   },
   document: {
     type: Object,
     default: null,
   },
-  currentView: {
-    type: Array,
-    required: true,
-  },
-  selectedFileTab: {
-    type: Object,
-    required: true,
-  },
 });
 
 const router = useRouter();
 const { closeModal } = useAppModal();
 const { projectModels } = useModels();
 
-const isVisas = computed(() => {
-  return props.selectedFileTab.id === "visas";
-});
-
-const documents = computed(() => {
-  return isVisas.value ? props.currentView : props.currentView.filter((f) => !isFolder(f));
-});
-
 const index = ref(0);
 
 watch(
   () => props.document,
   (newDocument) => {
-    const docIndex = documents.value.findIndex((d) => d.id === newDocument.id);
+    const docIndex = props.documentList.findIndex((d) => d.id === newDocument.id);
     index.value = docIndex !== -1 ? docIndex : 0;
   },
   {
@@ -155,11 +139,8 @@ watch(
 );
 
 const currentDocument = computed(() => {
-  if (!documents.value || documents.value.length === 0) return null;
-  if(props.selectedFileTab.id === "visas") {
-    return props.document;
-  }
-  return isVisas.value ? documents.value[index.value].document : documents.value[index.value];
+  if (!props.documentList || props.documentList.length === 0) return null;
+  return props.documentList[index.value];
 });
 
 const fileType = computed(() => {
@@ -172,35 +153,23 @@ const file = ref(null);
 watchEffect(async () => {
   const doc = currentDocument.value;
   if (!doc) return;
-  const models = projectModels.value;
-  switch (fileType.value) {
-    case IFC:
-    case DWG:
-    case DXF:
-      file.value = models.find((m) => m.id === doc.model_id)?.preview_file;
-      break;
-    case PDF:
-    case ".pdf":
-      file.value = { file: doc.file };
-      break;
-    case JPEG:
-    case PNG:
-      file.value = doc.file;
-      break;
-    default:
-      if (OFFICE_FILES.includes(fileType.value)) {
-        if (doc.office_preview) {
-          file.value = { file: doc.office_preview };
-        } else {
-          const newDoc = await FileService.getDocument(props.project, { id: doc.id });
-          if (newDoc.office_preview) {
-            currentDocument.value.office_preview = newDoc.office_preview;
-            file.value = { file: newDoc.office_preview };
-          }
-        }
-      } else if (IMAGE_PREVIEW_FILES.includes(fileType.value)) {
-        file.value = doc.file;
-      }
+
+  if ([DWG, DXF, IFC].includes(fileType.value)) {
+    const model = projectModels.value.find(m => m.id === doc.model_id);
+    if (!model.preview_file) {
+      model.preview_file = (await ModelService.fetchModelByID(props.project, model.id)).preview_file;
+    }
+    file.value = model.preview_file;
+  } else if ([PDF, ".pdf", JPEG, PNG, ...IMAGE_FILES].includes(fileType.value)) {
+    if (!doc.file) {
+      doc.file = (await FileService.getDocument(props.project, { id: doc.id })).file;
+    }
+    file.value = doc.file;
+  } else if (OFFICE_FILES.includes(fileType.value)) {
+    if (!doc.office_preview) {
+      doc.office_preview = (await FileService.getDocument(props.project, { id: doc.id })).office_preview;
+    }
+    file.value = doc.office_preview;
   }
 });
 
@@ -210,7 +179,7 @@ const onKeyUp = ({ key }) => {
       if (index.value > 0) index.value--;
       break;
     case "ArrowRight":
-      if (index.value < documents.value.length - 1) index.value++;
+      if (index.value < props.documentList.length - 1) index.value++;
       break;
     case "Escape":
       closeModal();
@@ -219,7 +188,7 @@ const onKeyUp = ({ key }) => {
 };
 
 onMounted(() => document.addEventListener("keyup", onKeyUp));
-onUnmounted(() => document.removeEventListener("keyup", onKeyUp));
+onBeforeUnmount(() => document.removeEventListener("keyup", onKeyUp));
 
 const openViewer = () => {
   closeModal();

src/components/specific/files/files-manager/FilesManager.vue

@@ -291,34 +291,33 @@ export default {
     const sortByName = (a, b) => a.name.toLowerCase().localeCompare(b.name.toLowerCase());
 
     const filesTable = ref(null);
-    const documentViewerFilesList = computed(() => {
-      if (!filesTable.value) return [];
-
-      if (selectedFileTab.value.id === "folders") {
-        // WARNING displayedRows is name from DS, may change
-        return filesTable.value.filesTable.displayedRows.map((row) => row.data);
-      }
-      if (selectedFileTab.value.id === "files") {
-        return filesTable.value.displayedListFiles;
-      } else {
-        return filesTable.value.enhancedVisas;
-      }
-    });
 
     const onFileSelected = (file) => {
       if (isFolder(file)) {
         currentFolder.value = handler.deserialize(file);
       } else {
-        openModal({
-          component: DocumentViewer,
-          props: {
-            project: props.project,
-            folder: currentFolder.value,
-            document: file,
-            currentView: documentViewerFilesList.value,
-            selectedFileTab: selectedFileTab.value,
-          },
-        });
+        if (filesTable.value) {
+          let documentList = [];
+          if (selectedFileTab.value.id === "folders") {
+            // WARNING displayedRows is name from DS, may change
+            const folderFiles = filesTable.value.filesTable.displayedRows.map((row) => row.data);
+            documentList = folderFiles.filter(f => !isFolder(f));
+          }
+          if (selectedFileTab.value.id === "files") {
+            documentList = filesTable.value.displayedListFiles;
+          }
+          if (selectedFileTab.value.id === "visas") {
+            documentList = [file];
+          }
+          openModal({
+            component: DocumentViewer,
+            props: {
+              project: props.project,
+              documentList,
+              document: file,
+            },
+          });
+        }
       }
     };
 

src/components/specific/models/models-manager/models-action-bar/ModelsActionBar.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="models-action-bar">
     <BIMDataButton
-      :disabled="!hasAdminPerm(project, modelDocument)"
+      :disabled="!hasAdminPerm(project, modelDocuments)"
       width="120px"
       color="high"
       ghost
@@ -13,7 +13,7 @@
     </BIMDataButton>
 
     <BIMDataButton
-      :disabled="!hasAdminPerm(project, modelDocument)"
+      :disabled="!hasAdminPerm(project, modelDocuments)"
       width="120px"
       ghost
       squared
@@ -83,7 +83,9 @@ defineEmits([
   "unarchive",
 ]);
 
-const modelDocument = computed(() => handler.get({ nature: FILE_TYPE.DOCUMENT, id: props.model.document_id }));
+const modelDocuments = computed(() =>
+  props.models.map(m => handler.get({ nature: FILE_TYPE.DOCUMENT, id: m.document_id }))
+);
 
 const isArchived = computed(() => props.models.every(m => m.archived));
 

src/config/files.js

@@ -15,6 +15,6 @@ const STANDARD_IGNORED_FILES = Object.freeze([".DS_Store"]);
 
 const OFFICE_FILES = [".ppt", ".pptx", ".odp", ".xls", ".xlsx", ".ods", ".doc", ".docx", ".odt"];
 
-const IMAGE_PREVIEW_FILES = [".apng", ".avif", ".gif", ".jpeg", ".jpg", ".png", ".svg", ".webp"];
+const IMAGE_FILES = [".apng", ".avif", ".gif", ".jpeg", ".jpg", ".png", ".svg", ".webp"];
 
-export { FILE_PERMISSION, FILE_TYPE, STANDARD_IGNORED_FILES, OFFICE_FILES, IMAGE_PREVIEW_FILES };
+export { FILE_PERMISSION, FILE_TYPE, STANDARD_IGNORED_FILES, OFFICE_FILES, IMAGE_FILES };

src/services/FileService.js

@@ -158,8 +158,12 @@ class FileService {
         return;
       }
       if (files.length === 1 && files[0].nature !== FILE_TYPE.FOLDER) {
-        downloadName = files[0].file_name;
-        downloadUrl = files[0].file;
+        const document = files[0];
+        if (!document.file) {
+          document.file = (await this.getDocument(project, document)).file;
+        }
+        downloadName = document.file_name;
+        downloadUrl = document.file;
       } else {
         downloadName = project.name;
         downloadUrl = this.getArchiveUrl(project, files, accessToken);

src/utils/visas.js

@@ -46,7 +46,7 @@ export const enhanceVisa = async (visa, user, project, t, handler) => {
       id: visa.document.id,
       nature: "Document",
     });
-    if (!document) {
+    if (!document?.file) {
       document = await FileService.getDocument(project, { id: visa.document_id });
     }
   } catch (error) {

src/views/project-board/project-bcf/ProjectBcf.vue

@@ -746,10 +746,8 @@ export default {
         component: DocumentViewer,
         props: {
           project: currentProject.value,
-          folder: {},
+          documentList: files,
           document: file,
-          currentView: files,
-          selectedFileTab: {},
         },
       });
     };