|
@@ -1,11 +1,12 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
<div class="bigBox">
|
|
|
- <div class="settingBox">
|
|
|
+ <div class="settingBox" style="height: calc(100% - 60px);">
|
|
|
<!-- 设置盒子顶部搜索 -->
|
|
|
<div class="topSearch">
|
|
|
<div style="position: relative;">
|
|
|
- <el-input v-model="searchFire" class="searchFire" size="large" placeholder="搜索文件" />
|
|
|
+ <el-input v-model="searchFire" class="searchFire" size="large" placeholder="搜索文件"
|
|
|
+ style="width: 15rem;" />
|
|
|
<el-icon style="color: gray;display: inline-block;position: absolute;top: 8px;right: 5px;">
|
|
|
<Search />
|
|
|
</el-icon>
|
|
@@ -51,7 +52,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 右侧大盒子 -->
|
|
|
- <div class="mesBox" v-if="editOnline">
|
|
|
+ <div class="mesBox" style="height: calc(100% - 60px);" v-if="editOnline">
|
|
|
<!-- 功能盒子 -->
|
|
|
<div class="useBox">
|
|
|
<!-- table切换 -->
|
|
@@ -125,131 +126,133 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <!-- 展示文件夹盒子 -->
|
|
|
- <div>
|
|
|
- <!-- 文件夹 -->
|
|
|
- <div class="detailBox">
|
|
|
- <el-collapse v-model="folder" accordion class="collapseSell">
|
|
|
- <el-collapse-item title="文件夹" name="1" class="custom-collapse-item">
|
|
|
- <el-table :data="folderList" style="width: 100%" @selection-change="handleSelectionChange1"
|
|
|
- :single-select="true" @row-click="folderClick">
|
|
|
- <el-table-column type="selection" width="55" />
|
|
|
- <el-table-column label="名称" width="180">
|
|
|
- <template #default="scope">
|
|
|
- <span>
|
|
|
- <img src="../../assets/images/fileBox.png" style="width: 20px;height: 24px;"
|
|
|
- alt="">
|
|
|
- {{ scope.row.dirName }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="createTime" label="时间" width="180" />
|
|
|
- <el-table-column prop="dirType" label="类型">
|
|
|
- <template #default="scope">
|
|
|
- <span>{{ scope.row.dirType === "1" ? "文件夹" : "未知类型" }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="大小">
|
|
|
- <template #default="scope">
|
|
|
- <span>
|
|
|
- 10KB
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
-
|
|
|
- </el-table>
|
|
|
- </el-collapse-item>
|
|
|
- </el-collapse>
|
|
|
- </div>
|
|
|
- <!-- 文件 -->
|
|
|
- <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-click="handleRowClick"
|
|
|
- @selection-change="handleSelectionChange">
|
|
|
- <el-table-column type="selection" width="55" />
|
|
|
- <el-table-column label="名称" width="200">
|
|
|
- <template #default="scope">
|
|
|
- <span style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
|
|
|
- <el-icon v-if="collectImg">
|
|
|
- <Star />
|
|
|
- </el-icon>
|
|
|
- <img v-else src="../../assets/images/yellowstar.png" alt="">
|
|
|
- <img :src="getImage(scope.row.fileType)" alt="">
|
|
|
- {{ scope.row.fileName }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="createTime" label="时间" width="180" />
|
|
|
- <el-table-column prop="fileType" label="类型" />
|
|
|
- <el-table-column label="大小">
|
|
|
- <template #default="scope">
|
|
|
- <span>
|
|
|
- {{ scope.row.fileSize }}KB
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
+ <!-- 展示文件盒子 -->
|
|
|
+ <!-- 文件夹 -->
|
|
|
+ <div class="detailBox">
|
|
|
+ <el-collapse v-model="folder" accordion class="collapseSell">
|
|
|
+ <el-collapse-item title="文件夹" name="1" class="custom-collapse-item">
|
|
|
+ <el-table :data="folderList" style="width: 100%" @selection-change="handleSelectionChange1"
|
|
|
+ :single-select="true" @row-click="folderClick">
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
+ <el-table-column label="名称" width="180">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>
|
|
|
+ <img src="../../assets/images/fileBox.png" style="width: 20px;height: 24px;"
|
|
|
+ alt="">
|
|
|
+ {{ scope.row.dirName }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="createTime" label="时间" width="180" />
|
|
|
+ <el-table-column prop="dirType" label="类型">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>{{ scope.row.dirType === "1" ? "文件夹" : "未知类型" }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="大小">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>
|
|
|
+ 10KB
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
|
|
|
- </el-table>
|
|
|
- <div class="setCli" v-if="cliCC">
|
|
|
- <template v-for="(item, index) in mouseCli">
|
|
|
- <p @click="chooseSet(item, index)" 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;">></span>
|
|
|
- </p>
|
|
|
+ </el-table>
|
|
|
+ </el-collapse-item>
|
|
|
+ </el-collapse>
|
|
|
+ </div>
|
|
|
+ <!-- 文件 -->
|
|
|
+ <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-click="handleRowClick"
|
|
|
+ @selection-change="handleSelectionChange">
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
+ <el-table-column label="名称" width="200">
|
|
|
+ <template #default="scope">
|
|
|
+ <span style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
|
|
|
+ <el-icon v-if="collectImg">
|
|
|
+ <Star />
|
|
|
+ </el-icon>
|
|
|
+ <img v-else src="../../assets/images/yellowstar.png" alt="">
|
|
|
+ <img :src="getImage(scope.row.fileType)" alt="">
|
|
|
+ {{ scope.row.fileName }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="createTime" label="时间" width="180" />
|
|
|
+ <el-table-column prop="fileType" label="类型" />
|
|
|
+ <el-table-column label="大小">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>
|
|
|
+ {{ scope.row.fileSize }}KB
|
|
|
+ </span>
|
|
|
</template>
|
|
|
- <div class="setCli1" v-if="anyP">
|
|
|
- <p @click="chooseSet1()" class="chooseSet">
|
|
|
- <img src="../../assets/images/user.png" alt="">
|
|
|
- 选择人员
|
|
|
- </p>
|
|
|
- <p class="chooseSet">
|
|
|
- <img src="../../assets/images/archiveTray.png" alt="">
|
|
|
- 归档
|
|
|
- </p>
|
|
|
- </div>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ </el-table>
|
|
|
+ <div class="setCli" v-if="cliCC">
|
|
|
+ <template v-for="(item, index) in mouseCli">
|
|
|
+ <p @click="chooseSet(item, index)" 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;">></span>
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ <div class="setCli1" v-if="anyP">
|
|
|
+ <p @click="chooseSet1()" class="chooseSet">
|
|
|
+ <img src="../../assets/images/user.png" alt="">
|
|
|
+ 选择人员
|
|
|
+ </p>
|
|
|
+ <p class="chooseSet">
|
|
|
+ <img src="../../assets/images/archiveTray.png" alt="">
|
|
|
+ 归档
|
|
|
+ </p>
|
|
|
</div>
|
|
|
- </el-collapse-item>
|
|
|
- </el-collapse>
|
|
|
- </div>
|
|
|
- <!-- 穿梭框 -->
|
|
|
- <div>
|
|
|
- <el-dialog v-model="transferModal" title="分享" width="40%">
|
|
|
- <!-- 穿梭大盒子 -->
|
|
|
- <div class="transBox">
|
|
|
- <!-- 总数据包 -->
|
|
|
- <div class="allBag">
|
|
|
- <el-input style="width: 220px;margin-left: 18px;margin-top:5px" v-model="allBag"
|
|
|
- placeholder="搜索"></el-input>
|
|
|
- <div class="allLog">
|
|
|
- <el-tree :data="allTreeData" :props="allTreeProps" show-checkbox node-key="id"
|
|
|
- :default-expanded-keys="openTree" @check-change="allTreeChange" />
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ </el-collapse-item>
|
|
|
+ </el-collapse>
|
|
|
+ </div>
|
|
|
+ <!-- 穿梭框 -->
|
|
|
+ <div>
|
|
|
+ <el-dialog v-model="transferModal" title="分享" width="40%">
|
|
|
+ <!-- 穿梭大盒子 -->
|
|
|
+ <div class="transBox">
|
|
|
+ <!-- 总数据包 -->
|
|
|
+ <div class="allBag">
|
|
|
+ <el-input style="width: 220px;margin-left: 18px;margin-top:5px" v-model="allBag"
|
|
|
+ placeholder="搜索"></el-input>
|
|
|
+ <div class="allLog">
|
|
|
+ <el-tree :data="allTreeData" :props="allTreeProps" show-checkbox node-key="id"
|
|
|
+ :default-expanded-keys="openTree" @check-change="allTreeChange" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 需要的数据包 -->
|
|
|
+ <div class="needBag">
|
|
|
+ <!-- <el-input style="width: 220px;margin-left: 18px;margin-top:5px" v-model="needBag"
|
|
|
+ placeholder="搜索"></el-input> -->
|
|
|
+ <div style="border-bottom: 1px solid gray;">
|
|
|
+ <span>已选择{{ chooseTagData.length }}人</span>
|
|
|
+ <span style="color: red;font-size: 14px;float: right;">清空</span>
|
|
|
</div>
|
|
|
- <!-- 需要的数据包 -->
|
|
|
- <div class="needBag">
|
|
|
- <el-input style="width: 220px;margin-left: 18px;margin-top:5px" v-model="needBag"
|
|
|
- placeholder="搜索"></el-input>
|
|
|
- <div class="needLog">
|
|
|
- <el-tag v-for="(item, index) in chooseTagData" :key="index" class="tagtag" closable
|
|
|
- @close="handleClose(item)">
|
|
|
- {{ item.userName }}
|
|
|
- </el-tag>
|
|
|
- </div>
|
|
|
+ <div class="needLog">
|
|
|
+ <el-tag v-for="(item, index) in chooseTagData" :key="index" class="tagtag" closable
|
|
|
+ @close="handleClose(item)">
|
|
|
+ {{ item.userName }}
|
|
|
+ </el-tag>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <template #footer>
|
|
|
- <span class="dialog-footer">
|
|
|
- <el-button @click="transferModal = false">取消</el-button>
|
|
|
- <el-button type="primary" @click="sureShare">
|
|
|
- 确定
|
|
|
- </el-button>
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="transferModal = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="sureShare">
|
|
|
+ 确定
|
|
|
+ </el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-else>
|
|
@@ -284,24 +287,9 @@
|
|
|
<div>
|
|
|
<el-dialog v-model="addBoser" title="新建文件夹" width="30%">
|
|
|
<el-form :model="boserForm" label-width="120px">
|
|
|
- <!-- <el-form-item label="空间id">
|
|
|
- <el-input v-model="boserForm.spaceId" />
|
|
|
- </el-form-item> -->
|
|
|
- <!-- <el-form-item label="目录类型">
|
|
|
- <el-input v-model="boserForm.dirType" />
|
|
|
- </el-form-item> -->
|
|
|
- <!-- <el-form-item label="目录权限">
|
|
|
- <el-input v-model="boserForm.dirPower" />
|
|
|
- </el-form-item> -->
|
|
|
<el-form-item label="目录名称">
|
|
|
<el-input v-model="boserForm.dirName" />
|
|
|
</el-form-item>
|
|
|
- <!-- <el-form-item label="父目录id">
|
|
|
- <el-input v-model="boserForm.parentId" />
|
|
|
- </el-form-item> -->
|
|
|
- <!-- <el-form-item label="备注">
|
|
|
- <el-input v-model="boserForm.remark" />
|
|
|
- </el-form-item> -->
|
|
|
</el-form>
|
|
|
<template #footer>
|
|
|
<span class="dialog-footer">
|
|
@@ -570,10 +558,10 @@ export default {
|
|
|
img: ImgFile.copy,
|
|
|
name: "复制",
|
|
|
},
|
|
|
- {
|
|
|
- img: ImgFile.clipboard,
|
|
|
- name: "粘贴"
|
|
|
- },
|
|
|
+ // {
|
|
|
+ // img: ImgFile.clipboard,
|
|
|
+ // name: "粘贴"
|
|
|
+ // },
|
|
|
{
|
|
|
img: ImgFile.collect,
|
|
|
name: "收藏"
|
|
@@ -663,14 +651,6 @@ export default {
|
|
|
const showPreview = ref(false)//控制图片预览组件显示
|
|
|
const previewData = ref()//需要预览的文件的数据
|
|
|
const router = useRouter(); //注册路由
|
|
|
- // 获取所有文件
|
|
|
- function getAll() {
|
|
|
- myfile.getAllFileMenu({ dirId: folderId.value }).then(res => {
|
|
|
- if (res.code === 200) {
|
|
|
- fileList.value = res.rows
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
// 获取用户树
|
|
|
function getAllUser() {
|
|
|
userTree.getUserTree({}).then(res => {
|
|
@@ -716,7 +696,7 @@ export default {
|
|
|
fileMenu.value = res.data
|
|
|
folderList.value = res.data
|
|
|
})
|
|
|
- myfile.getAllFileMenu({ parentId: userMe[0].dirId - 0 }).then(res => {
|
|
|
+ myfile.getById(userMe[0].dirId - 0).then(res => {
|
|
|
if (res.code === 200) {
|
|
|
fileList.value = res.rows
|
|
|
}
|
|
@@ -730,17 +710,27 @@ export default {
|
|
|
documents.getALLdocument({ parentId: row.dirId - 0, spaceId: row.spaceId - 0 }).then(res => {
|
|
|
folderList.value = res.data
|
|
|
// if (res.code === 200) {
|
|
|
- console.log("准备调用 myfile.getAllFileMenu");
|
|
|
- myfile.getAllFileMenu({ parentId: res.data[0].dirId - 0 })
|
|
|
- .then(res => {
|
|
|
- console.log("myfile.getAllFileMenu 调用成功");
|
|
|
- if (res.code === 200) {
|
|
|
- fileList.value = res.rows;
|
|
|
- }
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- console.error("myfile.getAllFileMenu 调用失败:", error);
|
|
|
- });
|
|
|
+ if (res.data.length === 0) {
|
|
|
+ myfile.getById(newDirId.value)
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ fileList.value = res.rows;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ console.error("myfile.getAllFileMenu 调用失败:", error);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ myfile.getById(res.data[0].dirId - 0)
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ fileList.value = res.rows;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ console.error("myfile.getAllFileMenu 调用失败:", error);
|
|
|
+ });
|
|
|
+ }
|
|
|
// }
|
|
|
})
|
|
|
this.selectedIndex = num
|
|
@@ -803,6 +793,12 @@ export default {
|
|
|
}
|
|
|
if (row.name == '分享') {
|
|
|
transferModal.value = true
|
|
|
+ fileShare.getSharePeople(clickRowId.value).then(res => {
|
|
|
+ // 去除数组内部的重复元素
|
|
|
+ const uniqueRes = Array.from(new Set(res.map(item => item.userName))).map(id => res.find(item => item.userName === id));
|
|
|
+ // 现在的 uniqueRes 数组不包含重复元素
|
|
|
+ chooseTagData.value = uniqueRes;
|
|
|
+ })
|
|
|
} else {
|
|
|
transferModal.value = false
|
|
|
}
|
|
@@ -1059,11 +1055,19 @@ export default {
|
|
|
newSpaceId.value = row.spaceId
|
|
|
documents.getALLdocument({ parentId: row.dirId - 0, spaceId: row.spaceId - 0 }).then(res => {
|
|
|
folderList.value = res.data
|
|
|
- myfile.getById(res.data[0].dirId - 0).then(res => {
|
|
|
- if (res.code === 200) {
|
|
|
- fileList.value = res.rows
|
|
|
- }
|
|
|
- })
|
|
|
+ if (res.data.length === 0) {
|
|
|
+ myfile.getById(newDirId.value).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ fileList.value = res.rows
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ myfile.getById(res.data[0].dirId - 0).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ fileList.value = res.rows
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
})
|
|
|
}
|
|
|
// 确认文件重命名
|
|
@@ -1105,7 +1109,7 @@ export default {
|
|
|
}
|
|
|
// 确认分享
|
|
|
function sureShare() {
|
|
|
- fileShare.addSharePeople(clickRowId.value, needTagData.value).then(res => {
|
|
|
+ fileShare.addSharePeople(clickRowId.value, chooseTagData.value).then(res => {
|
|
|
if (res.code === 200) {
|
|
|
ElMessage({
|
|
|
message: "分享成功",
|
|
@@ -1118,6 +1122,7 @@ export default {
|
|
|
}
|
|
|
function handleClose(tag) {
|
|
|
chooseTagData.value.splice(chooseTagData.value.indexOf(tag), 1)
|
|
|
+ console.log(chooseTagData.value, 'move');
|
|
|
}
|
|
|
// 确认收藏
|
|
|
function sureCollect() {
|
|
@@ -1195,6 +1200,7 @@ export default {
|
|
|
onMounted(() => {
|
|
|
getAllTop()
|
|
|
getAllUser()
|
|
|
+ getAllCollect()
|
|
|
})
|
|
|
return {
|
|
|
allBag,
|
|
@@ -1335,18 +1341,20 @@ p {
|
|
|
}
|
|
|
|
|
|
.bigBox {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
display: flex;
|
|
|
justify-content: flex-start;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.settingBox {
|
|
|
- width: 22vw;
|
|
|
- height: 100%;
|
|
|
- border: 2px solid black;
|
|
|
+ width: 20vw;
|
|
|
+ /* height: 100%; */
|
|
|
+ border: 1px solid black;
|
|
|
border-radius: 4px;
|
|
|
/* margin: 5px 5px; */
|
|
|
- margin-right: 15px;
|
|
|
+ margin-right: 5px;
|
|
|
background-color: white;
|
|
|
}
|
|
|
|
|
@@ -1395,8 +1403,8 @@ p {
|
|
|
}
|
|
|
|
|
|
.mesBox {
|
|
|
- width: 70vw;
|
|
|
- height: calc(100% + 200px);
|
|
|
+ width: 72vw;
|
|
|
+ /* height: calc(100% - 200px); */
|
|
|
border-radius: 4px;
|
|
|
background-color: white;
|
|
|
}
|
|
@@ -1484,7 +1492,7 @@ p {
|
|
|
|
|
|
.setCli {
|
|
|
width: 156px;
|
|
|
- height: 380px;
|
|
|
+ height: 350px;
|
|
|
position: absolute;
|
|
|
top: -70px;
|
|
|
left: 300px;
|
|
@@ -1497,7 +1505,7 @@ p {
|
|
|
|
|
|
.setCli1 {
|
|
|
width: 156px;
|
|
|
- height: 380px;
|
|
|
+ height: 350px;
|
|
|
position: absolute;
|
|
|
top: 185px;
|
|
|
left: 155px;
|
|
@@ -1547,7 +1555,7 @@ p {
|
|
|
display: flex;
|
|
|
justify-content: space-around;
|
|
|
align-items: center;
|
|
|
- border: 1px solid black;
|
|
|
+ /* border: 1px solid black; */
|
|
|
}
|
|
|
|
|
|
.allBag {
|
|
@@ -1566,7 +1574,7 @@ p {
|
|
|
width: 245px;
|
|
|
height: 330px;
|
|
|
margin: 5px auto;
|
|
|
- border: 1px solid red;
|
|
|
+ /* border: 1px solid red; */
|
|
|
overflow-y: auto;
|
|
|
}
|
|
|
|
|
@@ -1574,7 +1582,7 @@ p {
|
|
|
width: 245px;
|
|
|
height: 330px;
|
|
|
margin: 5px auto;
|
|
|
- border: 1px solid red;
|
|
|
+ /* border: 1px solid red; */
|
|
|
overflow-y: auto;
|
|
|
text-align: center;
|
|
|
}
|