2

src/views/myfile/MyFile.vue

@@ -178,9 +178,9 @@
                 <div class="fileTable">
                     <el-collapse v-model="files" accordion class="collapse" style="height: 200px;">
                         <el-collapse-item title="文件" name="2" class="">
-                            <el-table :data="fileList" style="width: 100%" @row-contextmenu="handleRowClick"
-                                @selection-change="handleSelectionChange" @row-click="mouseClick"
-                                :default-sort="{ prop: 'createTime', order: 'descending' }">
+                            <el-table :data="fileList" style="width: 100%;position: relative;"
+                                @row-contextmenu="handleRowClick" @selection-change="handleSelectionChange"
+                                @row-click="mouseClick" :default-sort="{ prop: 'createTime', order: 'descending' }">
                                 <el-table-column type="selection" width="55" />
                                 <el-table-column label="名称" width="200">
                                     <template #default="scope">
@@ -199,14 +199,14 @@
                                 <el-table-column label="大小">
                                     <template #default="scope">
                                         <span>
-                                            {{ scope.row.fileSize }}KB
+                                            {{ formatFileSize(scope.row.fileSize) }}
                                         </span>
                                     </template>
                                 </el-table-column>
                             </el-table>
                         </el-collapse-item>
                     </el-collapse>
-                    <div class="setCli" v-if="cliCC">
+                    <div class="setCli" v-if="cliCC" :style="{ left: xz + 'px', top: yz - 260 + 'px' }">
                         <template v-for="(item, index) in filterMouseCli()">
                             <p @click="chooseSet(item, index)" class="chooseSet">
                                 <img :src="item.img" alt="">
@@ -231,10 +231,10 @@
             </div>
             <div v-else>
                 <div>
-                    <el-button @click="editOnline = true;historyPrew=false">返回</el-button>
+                    <el-button @click="editOnline = true; historyPrew = false">返回</el-button>
                 </div>
-                <FileEdit :docId="clickRowId" :copyRow="copyRow" :historyPrew="historyPrew"
-                    :historycopyRow="historycopyRow" :onlyView="onlyView" @cancleHistoryPrew="cancleHistoryPrew"></FileEdit>
+                <FileEdit :docId="clickRowId" :copyRow="copyRow" :historyPrew="historyPrew" :historycopyRow="historycopyRow"
+                    :onlyView="onlyView" @cancleHistoryPrew="cancleHistoryPrew"></FileEdit>
             </div>
             <!-- 扩容弹窗 -->
             <div>
@@ -415,6 +415,8 @@ export default {
         let fileTotal = ref(0)//文件total
         const openForwardFile = ref(false)   //历史版本展示
         const historyPrew = ref(false)
+        let xz = ref(0)
+        let yz = ref(0)
         const fileUserTreeData = reactive({ data: {} });
         let fileList = ref([
         ])
@@ -593,7 +595,7 @@ export default {
                             console.error("myfile.getAllFileMenu 调用失败:", error);
                         });
                 } else {
-                    myfile.getById(res.data[0].dirId - 0)
+                    myfile.getById(row.dirId - 0)
                         .then(res => {
                             if (res.code === 200) {
                                 fileList.value = res.rows;
@@ -633,6 +635,8 @@ export default {
             e.preventDefault();
             e.stopPropagation();
             console.log(e, 'xxyy');
+            xz.value = e.pageX
+            yz.value = e.pageY
             copyRow.value = row
             clickRowId.value = row.docId
             copyDirId.value = row.dirId
@@ -750,8 +754,8 @@ export default {
             oneOrTwo.value = num
             folderCase.value = true
         }
-        function cancleHistoryPrew(val){
-            historyPrew.value=false
+        function cancleHistoryPrew(val) {
+            historyPrew.value = false
         }
         function createNewFile() {
             addFile.value = true
@@ -804,7 +808,7 @@ export default {
         }
         // 表格多选框
         function handleSelectionChange(val) {
-            console.log('checkout val',val);
+            console.log('checkout val', val);
             if (val.length > 1) {
                 // 如果选择了多项，只保留最后一项
                 val.shift();
@@ -1055,6 +1059,21 @@ export default {
                 }
             })
         }
+        function formatFileSize(fileSize) {
+            if (fileSize >= 1024 * 1024 * 1024) {
+                // 大于等于1GB，显示GB
+                return (fileSize / (1024 * 1024 * 1024)).toFixed(2) + 'GB';
+            } else if (fileSize >= 1024 * 1024) {
+                // 大于等于1MB，显示MB
+                return (fileSize / (1024 * 1024)).toFixed(2) + 'MB';
+            } else if (fileSize >= 1024) {
+                // 大于等于1KB，显示KB
+                return (fileSize / 1024).toFixed(2) + 'KB';
+            } else {
+                // 小于1KB，显示字节
+                return fileSize + 'B';
+            }
+        }
         onMounted(() => {
             getAllTop()
             // 添加监听，点击其他地方关闭文件夹右键菜单
@@ -1185,6 +1204,9 @@ export default {
             getCollects,//收藏子传父
             folderTotal,
             fileTotal,
+            xz,
+            yz,
+            formatFileSize,
         }
     },
     watch: {
@@ -1354,14 +1376,13 @@ p {
 }
 
 .fileTable {
-    position: relative;
     height: 100%;
-    /* overflow-y: auto; */
+    overflow-y: hidden;
 }
 
 .setCli {
     width: 156px;
-    max-height: 380px;
+    max-height: auto;
     position: absolute;
     top: -70px;
     left: 300px;
@@ -1369,7 +1390,7 @@ p {
     background-color: white;
     border: 1px solid gray;
     border-radius: 4px;
-    z-index: 10;
+    z-index: 3;
     overflow-y: auto;
     // font-size: 16px;
 }
@@ -1475,4 +1496,5 @@ p {
 
 :deep(.el-collapse-item__wrap) {
     height: 300px;
-}</style>
+}
+</style>