liyangzheng 2 роки тому
батько
коміт
b194169996
2 змінених файлів з 189 додано та 181 видалено
  1. 186 178
      src/views/myfile/MyFile.vue
  2. 3 3
      src/views/myfile/components/FileTree.vue

+ 186 - 178
src/views/myfile/MyFile.vue

@@ -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;
 }

+ 3 - 3
src/views/myfile/components/FileTree.vue

@@ -44,7 +44,7 @@ export default {
         let changeMes = props.copyOrMove - 0
         let dirIds = ref('')
         let treeOpen = ref(false)
-        let options = ref("复制")
+        let options = ref("复制")
         let treeData = ref([])
         let defaultProps = ref({
             label: "label",
@@ -96,9 +96,9 @@ export default {
         }
         function changes() {
             if (changeMes === 1) {
-                options.value = "移动"
+                options.value = "移动"
             } else if (changeMes === 0) {
-                options.value = '复制'
+                options.value = '复制'
             }
         }
         onMounted(() => {