Merge branch 'v3' of ssh://94.191.59.107:10222/houwenfeng/cloudfile-ui into v3

src/api/collect/collect.js

@@ -0,0 +1,38 @@
+import request from '../../utils/request'
+// 添加收藏
+function addCollect(data) {
+    return request({
+        url: `/biz/favorite`,
+        method: "post",
+        data
+    })
+}
+//删除收藏
+function delCollect(data) {
+    return request({
+        url: `/biz/favorite/${data}`,
+        method: "delete",
+    })
+}
+// 查询收藏标签
+function getCollect(data) {
+    return request({
+        url: `/biz/label/list`,
+        method: "get",
+        params: data
+    })
+}
+// 新增文件标签收藏
+function addNewTag(data){
+    return request({
+        url:`/biz/label`,
+        method:"post",
+        data
+    })
+}
+export default {
+    addCollect,
+    delCollect,
+    getCollect,
+    addNewTag,
+}

src/api/fileShare/fileShare.js

@@ -9,7 +9,7 @@ function getSharePeople(data) {
 // 新增分享人员
 function addSharePeople(data) {
     return request({
-        url: `/biz/info/share/`,
+        url: `/biz/info/share`,
         method: "post",
         data
     })

src/api/myfile/myfile.js

@@ -40,6 +40,17 @@ function uploadFile(data) {
         },
     })
 }
+// 上传多文件
+function uploadFileMany(data) {
+    return request({
+        url: `/biz/info/uploadFiles`,
+        method: "post",
+        data,
+        headers: {
+            'Content-Type': 'multipart/form-data'
+        },
+    })
+}
 // 复制
 function fileCopy(data) {
     return request({
@@ -64,6 +75,13 @@ function fileChangeName(data) {
         params: data
     })
 }
+// 文件下载
+function fileDown(data){
+    return request({
+        url:`/biz/info/download/${data}`,
+        method:"get"
+    })
+}
 export default {
     getAllFileMenu,
     addNewMenu,
@@ -72,5 +90,7 @@ export default {
     fileCopy,
     fileMove,
     fileChangeName,
-    editNewMenu
+    editNewMenu,
+    fileDown,
+    uploadFileMany
 }

src/api/search/search.js

@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+export function search(query) {
+    return request({
+      url: '/es/query',
+      method: 'get',
+      params: query
+    })
+  }

src/assets/fonts/font.css

@@ -21,4 +21,10 @@
     src: url('Inter-Medium-8.otf');
     font-weight: normal;
     font-style: normal;
+  }
+  @font-face {
+    font-family: "Inter-ExtraBold";
+    src: url('Inter-ExtraBold-5.otf');
+    font-weight: normal;
+    font-style: normal;
   }

src/layout/indexCommon.vue

@@ -13,8 +13,8 @@
               size="small"
               placeholder="搜索文件"
               suffix-icon="Search"
+              clearable
               @change="toSearch"
-
             />
           </div>
           <div>
@@ -24,9 +24,10 @@
               trigger="click"
             >
               <div class="avatar-wrapper">
-                <img src="@/assets/images/profile.jpg" class="head-img" /><span
-                  >{{ logingName }}</span
-                >
+                <img
+                  src="@/assets/images/profile.jpg"
+                  class="head-img"
+                /><span>{{ logingName }}</span>
               </div>
               <template #dropdown>
                 <el-dropdown-menu>
@@ -48,7 +49,10 @@
               :key="index"
               @click="clickPath(index)"
               ><div
-                :class="$route.path==item.path ? 'acitve-img-style img-style' : 'img-style'
+                :class="
+                  $route.path == item.path
+                    ? 'acitve-img-style img-style'
+                    : 'img-style'
                 "
               >
                 <img :src="$route.path==item.path ? item.beimgs : item.imgs" />
@@ -68,11 +72,11 @@
 </template>
 
 <script setup>
-import { onMounted, ref } from 'vue'
-import { ElMessageBox } from 'element-plus'
-import useAppStore from '@/store/modules/app'
-import useUserStore from '@/store/modules/user'
-import useSettingsStore from '@/store/modules/settings'
+import { onMounted, ref } from "vue";
+import { ElMessageBox } from "element-plus";
+import useAppStore from "@/store/modules/app";
+import useUserStore from "@/store/modules/user";
+import useSettingsStore from "@/store/modules/settings";
 import Cookies from "js-cookie";
 import chat from "@/assets/images/chat.png";
 import bechat from "@/assets/images/bechat.png";
@@ -89,21 +93,24 @@ import becommon from "@/assets/images/becommon.png";
 import chuanshu from "@/assets/images/chuanshu.png";
 import bechuanshu from "@/assets/images/bechuanshu.png";
 import { AppMain, Navbar, Settings, TagsView } from "./components";
-import { useRouter } from 'vue-router';
+import { search } from "@/api/search/search.js";
+import { useRouter } from "vue-router";
 const router = useRouter(); //注册路由
-const appStore = useAppStore()
-const userStore = useUserStore()
-const settingsStore = useSettingsStore()
-const searchText = ref('') //搜索ipt的值
+const appStore = useAppStore();
+const userStore = useUserStore();
+const settingsStore = useSettingsStore();
+const searchText = ref(""); //搜索ipt的值
+const selectValue = ref(1); //文档空间类型
+
 
 function toggleSideBar() {
-  appStore.toggleSideBar()
+  appStore.toggleSideBar();
 }
-const logingName=ref('')
+const logingName = ref("");
 onMounted(() => {
-  logingName.value=Cookies.get('username')
+  logingName.value = Cookies.get("username");
   // console.log('router',router)
-})
+});
 function handleCommand(command) {
   switch (command) {
     case "setLayout":
@@ -118,28 +125,42 @@ function handleCommand(command) {
 }
 
 function logout() {
-  ElMessageBox.confirm('确定注销并退出系统吗？', '提示', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning'
-  }).then(() => {
-    userStore.logOut().then(() => {
-      location.href = '/index';
+  ElMessageBox.confirm("确定注销并退出系统吗？", "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(() => {
+      userStore.logOut().then(() => {
+        location.href = "/index";
+      });
     })
-  }).catch(() => { });
+    .catch(() => {});
 }
 
 // 跳转到全文搜索
-const toSearch = ()=>{
+const toSearch = async () => {
   // console.log('searchText = ',searchText.value);
-  router.push('/search');
-  
-}
-const emits = defineEmits(['setLayout'])
+  const query = {
+    keyword: searchText.value,
+    page: 1,
+    size: 10,
+    type: selectValue.value,
+  };
+  const res = await search(query);
+  console.log("res", res);
+  if (res) {
+    router.push({
+      path: "/search",
+      query: { searchData: JSON.stringify(res) },
+    });
+  }
+};
+const emits = defineEmits(["setLayout"]);
 function setLayout() {
-  emits('setLayout');
+  emits("setLayout");
 }
-const clickId = ref('');
+const clickId = ref("");
 const menuList = reactive({
   data: [
     {
@@ -184,6 +205,12 @@ const menuList = reactive({
       imgs: common,
       beimgs: becommon,
     },
+     {
+      label: "高级搜索",
+      path: "/highsearch",
+      imgs: common,
+      beimgs: becommon,
+    },
     {
       label: "传输列表",
       path: "/ws",
@@ -206,8 +233,8 @@ const clickPath = (index) => {
 .el-container {
   height: 100vh;
 }
-:deep .el-main{
-  --el-main-padding:8px !important;
+:deep .el-main {
+  --el-main-padding: 8px !important;
 }
 .nav {
   background: #06286c;
@@ -216,8 +243,8 @@ const clickPath = (index) => {
     width: 98%;
     display: flex;
     justify-content: space-between;
-    &>div:first-child{
-      font-family:"Inter-SemiBold";
+    & > div:first-child {
+      font-family: "Inter-SemiBold";
     }
     & > div:first-child,
     & > div:last-child {
@@ -234,7 +261,7 @@ const clickPath = (index) => {
     border-radius: 12px;
     width: 24px;
     height: 24px;
-    margin-right:10px;
+    margin-right: 10px;
   }
   .avatar-wrapper {
     color: #fff;
@@ -249,7 +276,10 @@ const clickPath = (index) => {
       border-radius: 4px;
       margin-top: 8px;
       background: #6f85b5 !important;
-      --el-input-border-color:#6F85B5
+      --el-input-border-color: #6f85b5;
+    }
+    ::v-deep .el-input__inner {
+      color: #fff !important;
     }
   }
   :deep .el-input__wrapper {
@@ -288,4 +318,32 @@ const clickPath = (index) => {
   text-align: center;
   color: #000;
 }
+</style>
+<style lang="scss">
+.el-popper.is-light.type_popper {
+  background-color: #1f3f7e !important;
+  border-radius: 4px 4px 4px 4px !important;
+  border: none !important;
+  // padding: 0 16px !important;
+  // box-sizing: border-box !important;
+}
+.el-popper__arrow::before{
+  content: none;
+}
+ //鼠标移动上去的选中色
+.type_popper {
+    .el-select-dropdown__item.hover,
+    .el-select-dropdown__item:hover {
+        background: #6F85B5  !important;
+    }
+ //下拉框的文本颜色
+    .el-select-dropdown__item {
+        color: #A4B0D8  !important;
+    }
+ //选中之后的颜色
+    .el-select-dropdown__item.selected {
+        background: #6F85B5  !important;
+        color: #fff !important;
+    }
+}
 </style>

src/router/index.js

@@ -111,6 +111,12 @@ export const constantRoutes = [
         component: () => import("@/views/biz/test/index.vue"),
         name: "ws",
         meta: { title: "聊天", icon: "department" }
+      },
+      {
+        path: "/highsearch",
+        component: () => import("@/views/highSearch/HighSearch.vue"),
+        name: "highsearch",
+        meta: { title: "高级搜索", icon: "department" }
       }
     ]
   },

src/views/collect/index.vue

@@ -391,7 +391,6 @@ const rowDrop = () => {
       console.log("evt", evt);
     },
     //结束拖拽事件
-    // TODO 从后往前移动会出问题，+1的做法需要优化
     async onEnd({ newIndex, oldIndex, to }) {
       //拿到交换前后对应的index
       const ni = newIndex - 3;
@@ -407,7 +406,7 @@ const rowDrop = () => {
           // 从后往前，需要将oi和ni之间的+1
           if (index === oi) {
             item.orderNum = _this[ni].orderNum;
-            console.log("oiitem", item);
+            // console.log("oiitem", item);
           } else if(ni<index<oi) {
             item.orderNum += 1;
           }
@@ -415,7 +414,7 @@ const rowDrop = () => {
           // 从前往后，需要将oi和ni之间的-1
            if (index === oi) {
             item.orderNum = _this[ni].orderNum;
-            console.log("oiitem", item);
+            // console.log("oiitem", item);
           } else if(oi<index<ni) {
             item.orderNum -= 1;
           }

src/views/highSearch/HighSearch.vue

@@ -0,0 +1,276 @@
+<template>
+  <div class="container">
+    <div class="logo">
+      <img src="@/assets/images/Frame 427319127.png" alt="" />
+      <div class="font">Domino’s File</div>
+    </div>
+    <!-- TODO 选中的选项后面打勾 -->
+    <div class="search_box">
+      <el-select
+        v-model="selectValue"
+        class="m-2"
+        popper-class="typeSelect"
+        placeholder="Select"
+        size="large"
+      >
+        <el-option
+          v-for="item in selectOptions"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        />
+      </el-select>
+      <div class="line">|</div>
+      <el-input
+        class="search_ipt"
+        v-model="searchText"
+        placeholder="请输入要查询的内容"
+      />
+      <div class="search_btn" @click="doSearch">搜索</div>
+    </div>
+    <div class="result_box">
+      <div class="left_box" v-if="listData.length">
+        <el-checkbox v-model="checkState" size="large" />
+        <div class="dataNum">共{{ total }}项</div>
+      </div>
+      <div class="content_box" v-if="listData.length">
+        <el-scrollbar  @scroll="scrollFn" ref="scrollRef">
+          <div class="oneBox" v-for="item in listData" :key="item.id">
+            <span class="fileName">{{ item.content.docInfo.fileName }}</span>
+            <div class="flieTime">
+              <span>{{ item.content.docInfo.createTime }}</span>
+            </div>
+            <div
+              class="flieContent"
+              v-for="par in item.highlightFields.content"
+              :key="par"
+              v-html="par"
+            ></div>
+          </div>
+          <div class="showAll" v-if="beEnd">已经到达底部~</div>
+        </el-scrollbar>
+      </div>
+      <div class="error" v-if="noData">未搜索到数据~</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, ref } from "vue";
+import { search } from "@/api/search/search.js";
+const searchText = ref(""); //搜索ipt的值
+const selectValue = ref(1); //文档空间类型
+const page = ref(1); //页数
+const size = ref(10); //每页大小
+const total = ref(0); //数据总条数
+const noData = ref(false); //没有搜索出数据
+const beEnd = ref(false); //拉到最底部了
+const listData = ref([]);
+const scrollRef = ref();
+const selectOptions = [
+  { label: "公共文档", value: 1 },
+  { label: "部门文档", value: 2 },
+  { label: "个人文档", value: 3 },
+];
+onMounted(async () => {});
+
+const doSearch = async () => {
+  if (!searchText.value) {
+    return;
+  }
+  // console.log("searchText", searchText.value);
+  // console.log("selectValue", selectValue.value);
+  const query = {
+    keyword: searchText.value,
+    page: page.value,
+    size: size.value,
+    type: selectValue.value,
+  };
+  const res = await search(query);
+  if (Array.isArray(res)) {
+    listData.value = res;
+    total.value = res.length;
+    noData.value = false;
+    // setScroll()
+  } else {
+    listData.value = [];
+    noData.value = true;
+  }
+};
+const scrollFn = (num) => {
+  console.log("num", num);
+};
+const setScroll = () => {
+  scrollRef.value.addEventListener("scroll", async () => {
+    const { scrollTop, offsetHeight, scrollHeight } = scrollRef.value;
+    if (scrollTop + offsetHeight >= scrollHeight) {
+      //滚动条到达底部
+      console.log("chudi");
+    }
+  });
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  height: 100%;
+  background-color: #fff;
+  overflow: hidden;
+}
+.logo {
+  margin: 8px auto;
+  width: 290px;
+  height: 80px;
+  //   border: 1px solid #000;
+  display: flex;
+  align-items: center;
+  img {
+    width: 80px;
+    height: 80px;
+  }
+  .font {
+    font-size: 32px;
+    font-weight: normal;
+    color: #06286c;
+    line-height: 30px;
+    font-family: Inter-ExtraBold;
+    -webkit-transform: skew(-10deg);
+  }
+}
+.search_box {
+  box-sizing: border-box;
+  margin: 8px auto;
+  width: 560px;
+  height: 40px;
+  border-radius: 4px 4px 4px 4px;
+  border: 2px solid #2e6bc8;
+  display: flex;
+  align-items: center;
+  .line {
+    color: #2e6bc8;
+  }
+  .search_btn {
+    width: 88px;
+    height: 100%;
+    background: #2e6bc8;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 16px;
+    font-weight: 400;
+    color: #ffffff;
+    line-height: 22px;
+  }
+}
+.result_box {
+  margin-top: 8px;
+  padding-left: 16px;
+  .left_box {
+    display: flex;
+    align-items: center;
+    .dataNum {
+      margin-left: 4px;
+      font-size: 14px;
+      font-weight: 400;
+    }
+  }
+  .content_box {
+    width: 100%;
+    .oneBox {
+      width: 100%;
+      // height: 120px;
+      border-bottom: 1px dashed #c1cce3;
+      padding-bottom: 16px;
+      .fileName {
+        font-size: 16px;
+        color: #2e6bc8;
+        text-decoration: underline;
+        font-family: Inter-SemiBold;
+      }
+      .flieTime {
+        font-size: 12px;
+        font-weight: 400;
+        color: #06286c;
+        line-height: 20px;
+      }
+      .flieContent {
+        width: 100%;
+        font-size: 14px;
+        color: #000000;
+        font-weight: 400;
+        line-height: 22px;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        text-overflow: ellipsis;
+        -webkit-line-clamp: 3; //例如超过3行显示省略号
+        overflow: hidden;
+      }
+    }
+    .showAll {
+      margin-top: 8px;
+      font-size: 14px;
+      font-weight: 400;
+      color: #6f85b5;
+      line-height: 22px;
+      display: flex;
+      justify-content: center;
+    }
+  }
+  .error {
+    margin-top: 16px;
+    display: flex;
+    justify-content: center;
+    width: 100%;
+    height: 30px;
+    color: #6f85b5;
+    font-size: 14px;
+    font-weight: 400;
+  }
+}
+::v-deep em {
+  color: #dd2025;
+}
+
+//选择框样式
+::v-deep .el-select .el-input {
+  width: 112px;
+  height: 38px;
+  color: #06286c !important;
+  font-size: 14px !important;
+}
+::v-deep .el-select .el-input__wrapper {
+  background-color: rgba(0, 0, 0, 0) !important;
+  box-shadow: none !important;
+}
+::v-deep .el-select .el-input.is-focus .el-input__wrapper {
+  box-shadow: none !important;
+}
+::v-deep .el-select .el-input__wrapper .el-input__inner {
+  color: #06286c !important;
+}
+// 搜索框样式
+::v-deep .search_ipt .el-input__wrapper {
+  box-shadow: none !important;
+}
+::v-deep .search_ipt .el-input__inner::placeholder {
+  color: #a4b0d8;
+}
+</style>
+<style lang="scss">
+//鼠标移动上去的选中色
+.typeSelect {
+  .el-select-dropdown__item.hover,
+  .el-select-dropdown__item:hover {
+    background: #f5f7f9 !important;
+  }
+  //下拉框的文本颜色
+  .el-select-dropdown__item {
+    color: #06286c !important;
+  }
+  //选中之后的颜色
+  .el-select-dropdown__item.selected {
+    background: #f5f7f9 !important;
+    color: #000 !important;
+  }
+}
+</style>

src/views/myfile/MyFile.vue

@@ -181,11 +181,15 @@
                                 <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="180">
+                                    <el-table-column label="名称" width="200">
                                         <template #default="scope">
-                                            <span>
-                                                <img :src="getImage(scope.row.fileType)" alt="">
+                                            <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="">
                                                 {{ scope.row.fileName }}
+                                                <img :src="getImage(scope.row.fileType)" alt="">
                                             </span>
                                         </template>
                                     </el-table-column>
@@ -242,7 +246,10 @@
                                     <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>
                             </div>
@@ -387,6 +394,35 @@
                     </template>
                 </el-dialog>
             </div>
+            <!-- 文件收藏 -->
+            <div>
+                <el-dialog v-model="fileCollect" title="重命名" width="30%">
+                    <el-form :model="collectForm" label-width="120px">
+                        <el-form-item label="名称">
+                            <el-input v-model="collectForm.name" />
+                        </el-form-item>
+                        <el-form-item label="收藏标签">
+                            <div class="newTag" v-if="tagCollect">
+                                <el-input v-model="newTag" placeholder="请输入新标签" @blur="tagBlur"></el-input>
+                            </div>
+                            <el-select v-model="collectForm.folders" class="m-2" placeholder="请选择" size="large"
+                                @change="collectChange">
+                                <el-option v-for="(item, index) in collectList" :key="item.labelId" :label="item.label"
+                                    :value="item.labelId" />
+                            </el-select>
+                        </el-form-item>
+                    </el-form>
+                    <el-button @click="createTag">新建标签</el-button>
+                    <template #footer>
+                        <span class="dialog-footer">
+                            <el-button @click="fileCollect = false">取消</el-button>
+                            <el-button type="primary" @click="sureCollect">
+                                确认
+                            </el-button>
+                        </span>
+                    </template>
+                </el-dialog>
+            </div>
         </div>
     </div>
 </template>
@@ -399,6 +435,7 @@ import documents from '../../api/document/document'
 import fileSpace from '../../api/filespace/fileSpace'
 import userTree from '../../api/user/userTree'
 import fileShare from '../../api/fileShare/fileShare'
+import collect from '../../api/collect/collect'
 import BreadMenu from './components/BreadMenu.vue'
 import ImgFile from "./jsComponents/ImgFile"
 import { Search } from '@element-plus/icons-vue'
@@ -422,12 +459,16 @@ export default {
         let askTo = ref(false)
         let askNum = ref(1)
         let askTalk = ref('')
+        let newTag = ref('')
         let cliCC = ref(false)
         let transferModal = ref(false)
         let addBoser = ref(false)
         let addFile = ref(false)
         let anyP = ref(false)
         let uploadModal = ref(false)
+        let collectImg = ref(true)
+        let fileCollect = ref(false)
+        let tagCollect = ref(false)//添加收藏标签时显示
         let selectedBox = ref(-1)
         let newName = ref('')
         let clickRowId = ref("")
@@ -446,6 +487,7 @@ export default {
         let copyFileType = ref('')//需要操作的文件类型
         let copyFileName = ref("")//需要操作的文件名
         let directoryId = ref('')
+        let sortNum = ref(0)
         let boserForm = ref({
             spaceId: "",//空间id
             dirName: "",
@@ -520,6 +562,14 @@ export default {
                 name: "粘贴"
             },
             {
+                img: ImgFile.collect,
+                name: "收藏"
+            },
+            {
+                img: ImgFile.downLoad,
+                name: "下载"
+            },
+            {
                 img: ImgFile.textbox,
                 name: "重命名"
             },
@@ -561,11 +611,17 @@ export default {
             disabled: false,
             id: "id"
         }
+        let collectForm = ref({
+            name: "",
+            folders: "",
+        })
         let allTreeData = ref([])
         let needTagData = ref([])
+        let chooseTagData = ref([])
         let openTree = ref([])
         let fileNameChange = ref(false)
         let fileMenu = ref([])
+        let collectList = ref([])
         // 获取所有文件夹
         function getAll() {
             myfile.getAllFileMenu({ dirId: folderId.value }).then(res => {
@@ -600,6 +656,19 @@ export default {
                 });
             })
         }
+        function getAllCollect() {
+            collect.getCollect({}).then(res => {
+                const maxAge = res.rows.reduce((max, obj) => (obj.orderNum > max ? obj.orderNum : max), res.rows[0].orderNum)
+                sortNum.value = maxAge
+                collectList.value = res.rows.map(item => {
+                    return {
+                        label: item.labelName,
+                        labelId: item.labelId,
+                        order: item.orderNum
+                    }
+                })
+            })
+        }
         function changeFile(row, num) {
             directoryId.value = row.spaceId
             getAllText()
@@ -699,6 +768,20 @@ export default {
             if (row.name === '重命名') {
                 fileNameChange.value = true
             }
+            if (row.name === "下载") {
+                myfile.fileDown(copyFileId.value).then(res => {
+                    if (res) {
+                        ElMessage({
+                            message: "正在下载",
+                            type: "info"
+                        })
+                    }
+                })
+            }
+            if (row.name === '收藏') {
+                collectForm.value.name = nameForm.value.name
+                fileCollect.value = true
+            }
         }
         function chooseSet1() {
             transferModal.value = true
@@ -936,15 +1019,59 @@ export default {
                 console.log(`数据已存在: ${existingData.userName}`);
             } else {
                 // 选择操作，将数据添加到 needTagData 中
-                needTagData.value.push({ userId: id, userName: label });
+                needTagData.value.push({ userId: id, userName: label, docId: copyDocId.value });
             }
+            chooseTagData.value = needTagData.value
         }
 
         // 确认分享
         function sureShare() {
+
             fileShare.addSharePeople({ docId: needTagData.value }).then(res => {
                 console.log(res, 'sss');
             })
+
+        }
+        function handleClose(tag) {
+            chooseTagData.value.splice(chooseTagData.value.indexOf(tag), 1)
+        }
+        // 确认收藏
+        function sureCollect() {
+            collect.addCollect({
+                "docInfo": {
+                    "fileId": copyFileId.value - 0,
+                    "labelId": collectForm.value.folders - 0,
+                },
+            }).then(res => {
+                if (res.code === 200) {
+                    ElMessage({
+                        message: "收藏成功",
+                        type: "success"
+                    })
+                }
+            })
+            fileCollect.value = false
+        }
+        function collectChange(e) {
+            console.log(e, 'eee');
+            collectForm.value.folders = e
+        }
+        // 新建收藏标签
+        function createTag() {
+            newTag.value = ''
+            tagCollect.value = true
+        }
+        function tagBlur() {
+            collect.addNewTag({ labelName: newTag.value, orderNum: sortNum.value+1 }).then(res => {
+                if (res.code === 200) {
+                    ElMessage({
+                        message: "新建标签成功",
+                        type: "success"
+                    })
+                    getAllCollect()
+                }
+            })
+            tagCollect.value = false
         }
         return {
             folderList,//文件夹的数据
@@ -1035,13 +1162,23 @@ export default {
             allTreeChange,
             sureShare,
             openTree,
+            chooseTagData,
+            handleClose,
+            collectImg,//收藏小星星
+            fileCollect,
+            collectForm,
+            sureCollect,
+            getAllCollect,//获取所有收藏文件夹
+            collectList,//文件收藏表
+            createTag,
+            tagCollect,
+            tagBlur,
+            newTag,
+            collectChange,
+            sortNum,
         }
     },
     created() {
-        this.getAll();
-        this.getSpace()
-        this.getAllText()
-        this.getAllMiddle()
         if (this.directoryId === '') {
             this.directoryId = 0
             this.getAllText()
@@ -1050,7 +1187,12 @@ export default {
             this.folderId = 0
             this.getAll()
         }
+        this.getAll();
+        this.getSpace()
+        this.getAllText()
+        this.getAllMiddle()
         this.getAllUser()
+        this.getAllCollect()
     },
     watch: {
     },
@@ -1257,7 +1399,7 @@ p {
 }
 
 :deep(.el-collapse-item__content) {
-    height: 260px;
+    height: 235px;
     overflow-y: auto;
 }
 
@@ -1304,5 +1446,23 @@ p {
     margin: 5px auto;
     border: 1px solid red;
     overflow-y: auto;
+    text-align: center;
+}
+
+.tagtag {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    text-align: start;
+    width: 230px;
+    margin: 0 auto;
+}
+
+:deep(.el-tag__content) {
+    display: block;
+}
+
+:deep(.el-icon el-tag__close) {
+    display: block;
 }
 </style>

src/views/myfile/jsComponents/ImgFile.js

@@ -26,6 +26,9 @@ import pptx from '../../../assets/images/pptx.png'
 import word from '../../../assets/images/word.png'
 import pdf from '../../../assets/images/pdf.png'
 import xlxs from '../../../assets/images/xlxs.png'
+import collect from '../../../assets/images/collect.png'
+import downLoad from '../../../assets/images/download.png'
+import yellowStar from '../../../assets/images/yellowstar.png'
 export default {
     copy,
     clipboard,
@@ -55,4 +58,6 @@ export default {
     word,
     pdf,
     xlxs,
+    collect,
+    downLoad,
 }