全局搜索

src/layout/indexCommon.vue

@@ -7,8 +7,11 @@
             <img class="logoImg" src="@/assets/images/logos.png" /><span>聚合智慧文档管理系统</span>
           </div>
           <div class="search">
-            <el-input v-model="searchText" maxlength="32" class="w-50 m-2" size="small" placeholder="搜索文件"
-              suffix-icon="Search" clearable @keyup.enter="toSearch" />
+            <el-input style="position: relative;" v-model="searchText" maxlength="32" class="w-50 m-2" size="small" placeholder="搜索文件" clearable
+              @keyup.enter="toSearch" />
+            <el-icon style="position: absolute;top: 15px;left: 1000px;z-index: 1;" @click="toSearch">
+              <Search />
+            </el-icon>
           </div>
           <div>
             <el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click">
@@ -362,12 +365,12 @@ const toSearch = async () => {
   console.log("res", res);
   if (res) {
     const itemData = {
-      name:'全局搜索',
-      path:'search',
-      clickRowId:{
-          searchData: res,
-          searchText: searchText.value,
-        }
+      name: '全局搜索',
+      path: 'search',
+      clickRowId: {
+        searchData: res,
+        searchText: searchText.value,
+      }
     }
     addFolderAdd(itemData)
     // console.log("res", res);
@@ -516,23 +519,23 @@ const clickTab = (item) => {
   setTimeout(() => {
     console.log("toFileData.value", toFileData.value);
     if (toFileData.value) {
-      localStorage.setItem("inChat",0)
+      localStorage.setItem("inChat", 0)
       // 去全文搜索单独判断
-      if(toFileData.value.name == "全局搜索" || toFileData.value.label == "全局搜索"){
+      if (toFileData.value.name == "全局搜索" || toFileData.value.label == "全局搜索") {
         // console.log("clickRowId.value", JSON.stringify(toRaw(toFileData.value).clickRowId));
         editableTabsValue.value = toFileData.value.path
         isAlive.value = true
-        console.log('route',route.path);
+        console.log('route', route.path);
         // 如果当前已经在search就跳到中转页面
-        if(route.path == "/search"){
+        if (route.path == "/search") {
           router.push({
             path: '/allback',
             query: {
               // row: JSON.stringify(toRaw(toFileData.value.clickRowId)),
               clickRowId: JSON.stringify(toRaw(toFileData.value).clickRowId),
             },
-         });
-        }else{
+          });
+        } else {
           // 否则去search
           router.push({
             name: toFileData.value.path,
@@ -540,7 +543,7 @@ const clickTab = (item) => {
               // row: JSON.stringify(toRaw(toFileData.value.clickRowId)),
               clickRowId: JSON.stringify(toRaw(toFileData.value).clickRowId),
             },
-         });
+          });
         }
         return
       }
@@ -571,7 +574,7 @@ const clickTab = (item) => {
     } else {
       editableTabsValue.value = url
       router.push({
-        path: item+'?dirId='+item,
+        path: item + '?dirId=' + item,
       });
     }
   }, 0);
@@ -626,7 +629,7 @@ const filePaneClick = (item) => {
   //   console.log("editableTabsValue", editableTabsValue.value);
 };
 // 创建文件的标签
-const addFileTab = (data,bool) => {
+const addFileTab = (data, bool) => {
   // console.log("fileTabdata", data);
   console.log();
   const thisData = JSON.parse(JSON.stringify(toRaw(data)));
@@ -699,7 +702,7 @@ const addTab = (data) => {
 const addFolderAdd = (data) => {
   console.log("data", data);
   const arr = toRaw(editableTabs.value);
-  if (!arr.some((item) => item.label == data.clickRowId.dirName ||item.label == data.name )) {
+  if (!arr.some((item) => item.label == data.clickRowId.dirName || item.label == data.name)) {
     editableTabs.value.push({
       label: data.name,
       path: data.path,
@@ -1050,7 +1053,8 @@ watch(() => editableTabsValue.value, (newValue, oldValue) => {
     height: 1000px !important;
   }
 }
-:deep(.el-tabs--card>.el-tabs__header){
-  border-bottom:none !important ;
+
+:deep(.el-tabs--card>.el-tabs__header) {
+  border-bottom: none !important;
 }
 </style>

src/views/search/index.vue

@@ -22,9 +22,10 @@
       <div class="searchFor">
         <div class="search_title">分类：</div>
         <el-tabs v-model="searchType" class="demo-tabs" @tab-change="changeSearchType">
+          <el-tab-pane label="全部" name="all"></el-tab-pane>
           <el-tab-pane label="文档" name="doc"></el-tab-pane>
           <el-tab-pane label="图片" name="img"></el-tab-pane>
-          <el-tab-pane label="音频" name="audio "></el-tab-pane>
+          <el-tab-pane label="音频" name="audio"></el-tab-pane>
           <el-tab-pane label="视频" name="video"></el-tab-pane>
           <el-tab-pane label="压缩包" name="zip"></el-tab-pane>
         </el-tabs>
@@ -43,7 +44,7 @@
       </div>
     </div>
     <!-- 文件列表 -->
-    <div class="fileList">
+    <div class="fileList" @scroll="mouseScroll">
       <div>
         <div v-if="isList">
           <!-- 表格 -->
@@ -72,16 +73,17 @@
               </template>
             </el-table-column>
           </el-table>
-          <div class="pageBox">
+          <!-- <div class="pageBox">
             <Pagination :total="total" :page="page" :limit="limit" @pagination="pagination"></Pagination>
-          </div>
+          </div> -->
         </div>
         <div v-else>
           <!-- 平铺 -->
           <div class="tile_box">
             <div class="file_box" v-for="item in tableData" :key="item">
               <img class="big_file_img" :src="setIcon(item.fileType)" alt="" />
-              <span>{{ item.fileName }}</span>
+              <span style="width: 90px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis">{{ item.fileName
+              }}</span>
             </div>
           </div>
         </div>
@@ -91,7 +93,7 @@
 </template>
 
 <script setup>
-import { onMounted, ref, toRaw, inject ,watch} from "vue";
+import { onMounted, ref, toRaw, inject, watch } from "vue";
 import { search } from "@/api/search/search.js";
 import { flieSearch } from "@/api/search/search.js";
 import { useRoute, useRouter, onBeforeRouteUpdate } from "vue-router";
@@ -126,8 +128,8 @@ const page = ref(1);
 const limit = ref(2); //pagesize
 //---------------------------
 
-const historyParams  = history.state.params
-console.log('historyParams',historyParams);
+const historyParams = history.state.params
+console.log('historyParams', historyParams);
 
 const reload = inject("reload");
 onMounted(() => {
@@ -141,7 +143,7 @@ onMounted(() => {
   // console.log("searchData", searchData);
   baseData.value = searchData.rows;
   tableData.value = searchData.rows;
-  console.log(baseData.value,tableData.value,'value');
+  console.log(baseData.value, tableData.value, 'value');
   total.value = searchData.total;
   changeSearchFor(searchFor.value);
   // console.log("total", baseData.value);
@@ -161,14 +163,17 @@ const changeSearchFor = (name) => {
 // 切换搜索分类
 const changeSearchType = (name) => {
   let baseDataObj = toRaw(baseData.value);
-  // console.log("baseDataObj", baseDataObj);
-  // 获取分类具体数据
-  const typeArr = setType(name);
-  tableData.value = toRaw(baseDataObj).filter(
-    (item) =>
-      typeArr.includes(item.fileType) && item.space.spaceType == searchFor.value
-  );
-  // console.log('tableData',tableData.value);
+  if (name == 'all') {
+    tableData.value = baseDataObj
+  } else {
+    // 获取分类具体数据
+    console.log(name,'name');
+    const typeArr = setType(name);
+    console.log(typeArr,'类型');
+    tableData.value = toRaw(baseDataObj).filter((item) => {
+      return typeArr.includes(item.fileType) && item.space.spaceType === searchFor.value;
+    });
+  }
 };
 const changeShow = () => {
   isList.value = !isList.value;
@@ -203,7 +208,7 @@ const handleCurrentChange = (val) => {
   page.value = val;
 };
 const pagination = async (obj) => {
-  console.log(obj,'page');
+  console.log(obj, 'page');
   isAsc.value == "asc" ? (isAsc.value = "desc") : (isAsc.value = "asc");
   const query = {
     keyword: searchText.value,
@@ -260,7 +265,7 @@ const setIcon = (fileType) => {
 const setType = (fileType) => {
   switch (fileType) {
     case "doc":
-      return [".txt", ".ppt", ".pdf", ".docx", ".csv", ".wps", ".xls", '.pptxs','.dll'];
+      return [".txt", ".ppt", ".pdf", ".docx", ".csv", ".wps", ".xls", '.pptxs', '.dll', 'pptx', '.doc'];
       break;
     case "img":
       return [".png", ".jpg", ".jpeg"];
@@ -294,6 +299,9 @@ function formatFileSize(fileSize) {
     return fileSize + "B";
   }
 }
+function mouseScroll() {
+  console.log('鼠标滚动了！');
+}
 onBeforeRouteUpdate((to, from) => {
   console.log('to', to);
   console.log('from', from);