|
@@ -45,6 +45,7 @@
|
|
|
style="width: 100%"
|
|
|
height="40vh"
|
|
|
:scrollbar-always-on="true"
|
|
|
+ @row-contextmenu="handleRowClick"
|
|
|
>
|
|
|
<el-table-column fixed prop="date" label="名称" width="500">
|
|
|
<template #default="scope">
|
|
@@ -70,6 +71,40 @@
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-collapse-item>
|
|
|
+ <div
|
|
|
+ class="setCli"
|
|
|
+ v-if="cliCC"
|
|
|
+ :style="{ left: xz + 'px', top: yz - 260 + 'px' }"
|
|
|
+ >
|
|
|
+ <template v-for="(item, index) in filterMouseCli()" :key="index">
|
|
|
+ <p @click="chooseSet(item, index, 1)" class="chooseSet">
|
|
|
+ <img :src="item.img" alt="" />
|
|
|
+ {{ item.name }}
|
|
|
+ <span
|
|
|
+ v-if="
|
|
|
+ item.name == '在线编辑' || item.name == '协作' ? true : false
|
|
|
+ "
|
|
|
+ style="color: #7084b4; float: right; position: relative"
|
|
|
+ class="arrow"
|
|
|
+ >></span
|
|
|
+ >
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="setCli1"
|
|
|
+ v-if="anyP"
|
|
|
+ :style="{ left: xz + 155 + 'px', top: yz + 'px' }"
|
|
|
+ >
|
|
|
+ <p @click="chooseSet1(0)" class="chooseSet">
|
|
|
+ <img src="../../assets/images/user.png" alt="" />
|
|
|
+ 选择人员
|
|
|
+ </p>
|
|
|
+ <p class="chooseSet" @click="goLock">
|
|
|
+ <img src="../../assets/images/archiveTray.png" alt="" />
|
|
|
+ 归档
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div v-else>
|
|
|
<el-collapse-item name="folder">
|
|
@@ -114,12 +149,13 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { onMounted, ref, toRaw } from "vue";
|
|
|
+import { onMounted, ref, toRaw ,inject} from "vue";
|
|
|
// import TopTabs from "@/components/TopTabs/index.vue"
|
|
|
import { listRecent, getRecent } from "@/api/biz/recent";
|
|
|
import { getInfo } from "@/api/biz/info";
|
|
|
import { getDir } from "@/api/biz/dir";
|
|
|
import documents from "@/api/document/document";
|
|
|
+import ImgFile from "@/views/myfile/jsComponents/ImgFile";
|
|
|
import myfile from "@/api/myfile/myfile";
|
|
|
const activeNames = ref(["folder", "file"]);
|
|
|
const isList = ref(true); //控制显示方式
|
|
@@ -128,6 +164,67 @@ const tableFileData = ref([]);
|
|
|
const thisFolder = ref(); //当前文件夹
|
|
|
const newDirId = ref();
|
|
|
const newSpaceId = ref();
|
|
|
+const copyFileType = ref();
|
|
|
+const cliCC = ref(false); //文件右键菜单
|
|
|
+const clickRow = ref(); //当前右键的文件
|
|
|
+let xz = ref(0);
|
|
|
+let yz = ref(0);
|
|
|
+let anyP = ref(false);
|
|
|
+const thisFolderRole = ref() //文件夹权限
|
|
|
+let mouseCli = ref([
|
|
|
+ {
|
|
|
+ img: ImgFile.previewIcon,
|
|
|
+ name: "预览",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.addolder,
|
|
|
+ name: "移动到...",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.copy,
|
|
|
+ name: "复制到...",
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // img: ImgFile.clipboard,
|
|
|
+ // name: "粘贴"
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ img: ImgFile.collect,
|
|
|
+ name: "收藏",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.downLoad,
|
|
|
+ name: "下载",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.textbox,
|
|
|
+ name: "重命名",
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // img: ImgFile.goon,
|
|
|
+ // name: "发送"
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ img: ImgFile.share,
|
|
|
+ name: "分享",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.notePencil,
|
|
|
+ name: "在线编辑",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.togger,
|
|
|
+ name: "协作",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.icc,
|
|
|
+ name: "文字识别",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ img: ImgFile.history,
|
|
|
+ name: "历史版本",
|
|
|
+ },
|
|
|
+]);
|
|
|
|
|
|
//----引入图片----
|
|
|
import file_DOC from "../../../assets/images/fileType/file_DOC.png";
|
|
@@ -143,6 +240,7 @@ import file_zip from "../../../assets/images/fileType/file_zip.png";
|
|
|
|
|
|
onMounted(() => {
|
|
|
getList();
|
|
|
+ window.addEventListener("click", closeRMenu, true);
|
|
|
});
|
|
|
const getList = async () => {
|
|
|
const resY = await listRecent({ isFolder: "Y" });
|
|
@@ -161,7 +259,7 @@ const getList = async () => {
|
|
|
var arr = [];
|
|
|
resN.rows.map(async (item) => {
|
|
|
const detail = await getInfo(item.relaId);
|
|
|
- tableFileData.value.push(detail);
|
|
|
+ tableFileData.value.push(detail.data);
|
|
|
});
|
|
|
console.log("resNarr", arr);
|
|
|
// tableFileData.value = resN.rows;
|
|
@@ -178,6 +276,7 @@ function changeFile(row, num) {
|
|
|
console.log("changeFilerow2", row);
|
|
|
newDirId.value = row.dirId;
|
|
|
newSpaceId.value = row.spaceId;
|
|
|
+ copyFileType.value = row.fileType;
|
|
|
documents
|
|
|
.getALLdocument({ parentId: row.dirId - 0, spaceId: row.spaceId - 0 })
|
|
|
.then((res) => {
|
|
@@ -209,6 +308,161 @@ function changeFile(row, num) {
|
|
|
// }
|
|
|
});
|
|
|
}
|
|
|
+// 文件名表格每一行点击事件
|
|
|
+function handleRowClick(row, col, e) {
|
|
|
+ console.log("row", row);
|
|
|
+ // isFolder.value = "N";
|
|
|
+ clickRow.value = row;
|
|
|
+ e.preventDefault();
|
|
|
+ e.stopPropagation();
|
|
|
+ xz.value = e.pageX;
|
|
|
+ yz.value = e.pageY;
|
|
|
+ // copyRow.value = row;
|
|
|
+ // clickRowId.value = row.docId;
|
|
|
+ // copyDirId.value = row.dirId;
|
|
|
+ // copySpaceId.value = row.spaceId;
|
|
|
+ // copyFileId.value = row.fileId;
|
|
|
+ // copyFileSize.value = row.fileSize;
|
|
|
+ copyFileType.value = row.fileType;
|
|
|
+ // nameForm.value.name = row.fileName;
|
|
|
+ // copyFileName.value = row.fileName;
|
|
|
+ if (cliCC.value === true) {
|
|
|
+ cliCC.value = false;
|
|
|
+ } else {
|
|
|
+ cliCC.value = true;
|
|
|
+ }
|
|
|
+}
|
|
|
+//mouse弹框
|
|
|
+async function chooseSet(row, index, num) {
|
|
|
+ // 权限控制
|
|
|
+ if (thisFolderRole.value && thisFolderRole.value.roles) {
|
|
|
+ if (thisFolderRole.value.roles.l0600) {
|
|
|
+ const passArr = localStorage.getItem("passArr");
|
|
|
+ const passArrObj = JSON.parse(passArr);
|
|
|
+ if (
|
|
|
+ !passArrObj ||
|
|
|
+ !passArrObj.some((item) => item === clickRow.value.docId)
|
|
|
+ ) {
|
|
|
+ chooseRow.value = row;
|
|
|
+ chooseNum.value = num;
|
|
|
+ showInputPassword.value = true;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // console.log('needc');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ console.log("chooseSetrow", row);
|
|
|
+ console.log("chooseSetnum", num);
|
|
|
+ if (row.name == "在线编辑" || row.name == "协作") {
|
|
|
+ cliCC.value = true;
|
|
|
+ }
|
|
|
+ if (row.name == "分享") {
|
|
|
+ workOrEdit.value = num;
|
|
|
+ thanks.value = true;
|
|
|
+ } else {
|
|
|
+ thanks.value = false;
|
|
|
+ }
|
|
|
+ if (row.name == "协作") {
|
|
|
+ workOrEdit.value = num;
|
|
|
+ if (anyP.value) {
|
|
|
+ anyP.value = false;
|
|
|
+ } else {
|
|
|
+ anyP.value = true;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ anyP.value = false;
|
|
|
+ }
|
|
|
+ if (row.name == "删除") {
|
|
|
+ myfile.delMenu(clickRowId.value).then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ ElMessage({
|
|
|
+ type: "success",
|
|
|
+ message: "删除成功",
|
|
|
+ });
|
|
|
+ getAllTop();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (row.name === "复制到...") {
|
|
|
+ copyOrMove.value = 0;
|
|
|
+ fileTrees.value = true;
|
|
|
+ }
|
|
|
+ if (row.name === "移动到...") {
|
|
|
+ copyOrMove.value = 1;
|
|
|
+ fileTrees.value = true;
|
|
|
+ }
|
|
|
+ if (row.name === "重命名") {
|
|
|
+ fileNameChange.value = true;
|
|
|
+ }
|
|
|
+ if (row.name === "下载") {
|
|
|
+ // location.href = `${import.meta.env.VITE_APP_BASE_API}/biz/info/download/${copyFileId.value}`;
|
|
|
+ downLoadfile();
|
|
|
+ }
|
|
|
+ if (row.name === "收藏") {
|
|
|
+ collects.value = true;
|
|
|
+ }
|
|
|
+ if (row.name === "在线编辑") {
|
|
|
+ editOnline.value = false;
|
|
|
+ cliCC.value = false;
|
|
|
+ const newItem = {
|
|
|
+ name: copyFileName.value,
|
|
|
+ choose: copyFileId.value,
|
|
|
+ dirIds: copyDirId.value,
|
|
|
+ spaceIds: copySpaceId.value,
|
|
|
+ };
|
|
|
+ // 检查 newItem 是否已存在于 menuList 中
|
|
|
+ const isItemExist = menuList.value.some(
|
|
|
+ (item) => item.choose === newItem.choose
|
|
|
+ );
|
|
|
+ // 如果不存在,则添加它
|
|
|
+ if (!isItemExist) {
|
|
|
+ menuList.value.push(newItem);
|
|
|
+ }
|
|
|
+ selectedIndex.value = selectedIndex.value + 1;
|
|
|
+ }
|
|
|
+ if (row.name === "文字识别") {
|
|
|
+ router.push({
|
|
|
+ path: "/identifyFont",
|
|
|
+ query: {
|
|
|
+ fileId: copyFileId.value,
|
|
|
+ fileType: copyFileType.value,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (row.name === "预览") {
|
|
|
+ loadingPreview.value = true;
|
|
|
+ const filePreview = canPreviewFile(copyFileType.value);
|
|
|
+ if (filePreview) {
|
|
|
+ loadingPreview.value = false;
|
|
|
+ addTab(clickRow.value);
|
|
|
+ onlyView.value = true;
|
|
|
+ // editOnline.value = false
|
|
|
+ cliCC.value = false;
|
|
|
+ } else {
|
|
|
+ const res = await preview(copyFileId.value);
|
|
|
+ showPreview.value = true;
|
|
|
+ previewData.value = URL.createObjectURL(res);
|
|
|
+ }
|
|
|
+ loadingPreview.value = false;
|
|
|
+ console.log("filePreview", filePreview);
|
|
|
+
|
|
|
+ // // console.log('res',res);
|
|
|
+ // const res = await preview(copyFileId.value)
|
|
|
+ // showPreview.value = true
|
|
|
+ // previewData.value = URL.createObjectURL(res)
|
|
|
+ } else if (row.name === "历史版本") {
|
|
|
+ const resHistory = await listVersion({ docId: clickRowId.value });
|
|
|
+ console.log("resHistory", resHistory);
|
|
|
+ historyTotal.value = resHistory.total;
|
|
|
+ fileUserTreeData.data = resHistory.rows;
|
|
|
+ openForwardFile.value = true;
|
|
|
+ }
|
|
|
+}
|
|
|
+function chooseSet1(num) {
|
|
|
+ workOrEdit.value = num;
|
|
|
+ thanks.value = true;
|
|
|
+ anyP.value = false;
|
|
|
+}
|
|
|
function formatFileSize(fileSize) {
|
|
|
if (fileSize >= 1024 * 1024 * 1024) {
|
|
|
// 大于等于1GB,显示GB
|
|
@@ -261,6 +515,129 @@ const setIcon = (fileType) => {
|
|
|
break;
|
|
|
}
|
|
|
};
|
|
|
+//对mouseCli数组进行筛选,实现菜单的区分显示
|
|
|
+const filterMouseCli = () => {
|
|
|
+ const canPreviewArray = [
|
|
|
+ ".doc",
|
|
|
+ ".wps",
|
|
|
+ ".docm",
|
|
|
+ ".docx",
|
|
|
+ ".dot",
|
|
|
+ ".dotm",
|
|
|
+ ".dotx",
|
|
|
+ ".epub",
|
|
|
+ ".fodt",
|
|
|
+ ".htm",
|
|
|
+ ".html",
|
|
|
+ ".mht",
|
|
|
+ ".odt",
|
|
|
+ ".ott",
|
|
|
+ ".pdf",
|
|
|
+ ".rtf",
|
|
|
+ ".txt",
|
|
|
+ ".djvu",
|
|
|
+ ".xps",
|
|
|
+ ".csv",
|
|
|
+ ".fods",
|
|
|
+ ".ods",
|
|
|
+ ".ots",
|
|
|
+ ".xls",
|
|
|
+ ".xlsm",
|
|
|
+ ".xlsx",
|
|
|
+ ".xlt",
|
|
|
+ ".xltm",
|
|
|
+ ".xltx",
|
|
|
+ ".fodp",
|
|
|
+ ".odp",
|
|
|
+ ".otp",
|
|
|
+ ".pot",
|
|
|
+ ".potm",
|
|
|
+ ".potx",
|
|
|
+ ".pps",
|
|
|
+ ".ppsm",
|
|
|
+ ".ppsx",
|
|
|
+ ".ppt",
|
|
|
+ ".pptm",
|
|
|
+ ".pptx",
|
|
|
+ ];
|
|
|
+ const typeArr = [".png", ".jpg", ".jpeg", ".JPG", ".mp3", ".mp4"];
|
|
|
+ const imgTypeArr = [".png", ".jpg", ".jpeg", ".JPG"];
|
|
|
+ const canEditArr = [
|
|
|
+ ".doc",
|
|
|
+ ".docm",
|
|
|
+ ".docx",
|
|
|
+ ".dot",
|
|
|
+ ".dotm",
|
|
|
+ ".dotx",
|
|
|
+ ".txt",
|
|
|
+ ".djvu",
|
|
|
+ ".xps",
|
|
|
+ ".csv",
|
|
|
+ ".fods",
|
|
|
+ ".ods",
|
|
|
+ ".ots",
|
|
|
+ ".xls",
|
|
|
+ ".xlsm",
|
|
|
+ ".xlsx",
|
|
|
+ ".xlt",
|
|
|
+ ".xltm",
|
|
|
+ ".xltx",
|
|
|
+ ".fodp",
|
|
|
+ ".odp",
|
|
|
+ ".otp",
|
|
|
+ ".doc",
|
|
|
+ ".docm",
|
|
|
+ ".docx",
|
|
|
+ ".dot",
|
|
|
+ ".dotm",
|
|
|
+ ".dotx",
|
|
|
+ ".epub",
|
|
|
+ ".fodt",
|
|
|
+ ".htm",
|
|
|
+ ".html",
|
|
|
+ ".mht",
|
|
|
+ ".odt",
|
|
|
+ ".ott",
|
|
|
+ ".rtf",
|
|
|
+ ".txt",
|
|
|
+ ".djvu",
|
|
|
+ ".xps",
|
|
|
+ ".wps",
|
|
|
+ ".pptx",
|
|
|
+ ];
|
|
|
+ let arr = [];
|
|
|
+ if (
|
|
|
+ !(
|
|
|
+ typeArr.includes(copyFileType.value) ||
|
|
|
+ canPreviewArray.includes(copyFileType.value)
|
|
|
+ )
|
|
|
+ ) {
|
|
|
+ arr = mouseCli.value.filter((item) => item.name !== "预览");
|
|
|
+ } else {
|
|
|
+ arr = toRaw(mouseCli.value);
|
|
|
+ }
|
|
|
+ if (!canEditArr.includes(copyFileType.value)) {
|
|
|
+ arr = arr.filter(
|
|
|
+ (item) =>
|
|
|
+ item.name !== "在线编辑" &&
|
|
|
+ item.name !== "协作" &&
|
|
|
+ item.name !== "历史版本"
|
|
|
+ );
|
|
|
+ }
|
|
|
+ if (!imgTypeArr.includes(copyFileType.value)) {
|
|
|
+ arr = arr.filter((item) => item.name !== "文字识别");
|
|
|
+ }
|
|
|
+ // console.log('arr',arr);
|
|
|
+ // if (thisFolderRole.value) {
|
|
|
+ // arr = rightMenuRole(toRaw(thisFolderRole.value), arr);
|
|
|
+ // }
|
|
|
+ return arr;
|
|
|
+};
|
|
|
+// 关闭文件夹右键菜单
|
|
|
+const closeRMenu = () => {
|
|
|
+ // console.log("close");
|
|
|
+ cliCC.value = false;
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
@@ -277,6 +654,57 @@ const setIcon = (fileType) => {
|
|
|
.collapse_Item {
|
|
|
height: 50%;
|
|
|
}
|
|
|
+.setCli {
|
|
|
+ width: 156px;
|
|
|
+ max-height: auto;
|
|
|
+ position: absolute;
|
|
|
+ top: -70px;
|
|
|
+ left: 300px;
|
|
|
+ flex-wrap: 400;
|
|
|
+ background-color: white;
|
|
|
+ border: 1px solid gray;
|
|
|
+ border-radius: 4px;
|
|
|
+ z-index: 3;
|
|
|
+ overflow-y: auto;
|
|
|
+ // font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.setCli1 {
|
|
|
+ width: 156px;
|
|
|
+ height: auto;
|
|
|
+ position: absolute;
|
|
|
+ background-color: white;
|
|
|
+ border: 1px solid gray;
|
|
|
+ border-radius: 4px;
|
|
|
+ z-index: 100;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.chooseSet {
|
|
|
+ width: 140px;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ margin: 5px auto;
|
|
|
+ font-size: 13px;
|
|
|
+
|
|
|
+ // display: flex;
|
|
|
+ // align-items: center;
|
|
|
+ // position: relative;
|
|
|
+ img {
|
|
|
+ margin-right: 4px;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.chooseSet:hover {
|
|
|
+ width: 140px;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ margin: 5px auto;
|
|
|
+ font-size: 13px;
|
|
|
+ background-color: #f5f7f9;
|
|
|
+ /* color: white; */
|
|
|
+}
|
|
|
::v-deep .el-collapse-item__content {
|
|
|
padding-bottom: 0;
|
|
|
height: 50% !important;
|