6

src/layout/indexCommon.vue

@@ -44,14 +44,13 @@
                 ? 'acitve-img-style img-style'
                 : 'img-style'
                 ">
-								<img :src="$route.path == item.path ? item.beimgs : item.imgs" />
-								<div class="text-style" v-if="$route.path != item.path">
-									{{ item.label }}
-								</div>
-								<span class="yuandian" v-if="
-                    hasNewMessage &&
-                    item.path == '/index' &&
-                    ($route.path != item.path || isSwitchFileIframe)
+                <img :src="$route.path == item.path ? item.beimgs : item.imgs" />
+                <div class="text-style" v-if="$route.path != item.path">
+                  {{ item.label }}
+                </div>
+                <span class="yuandian" v-if="hasNewMessage &&
+                  item.path == '/index' &&
+                  ($route.path != item.path || isSwitchFileIframe)
                   "></span>
               </div>
             </router-link><br />
@@ -113,16 +112,8 @@
           <div v-show="!isAlive" style="width: 100%">
             <div v-for="item in iFrameData" :key="item.id">
               <div style="width: 100%" v-show="item.show">
-                <iframe
-                  :src="item.src"
-                  frameborder="0"
-                  :id="`iframe${item.id}`"
-                  :name="`iframe${item.id}`"
-                  width="100%"
-                  height="800px"
-                  class="iframeBox"
-                  v-show="item.show"
-                ></iframe>
+                <iframe :src="item.src" frameborder="0" :id="`iframe${item.id}`" :name="`iframe${item.id}`" width="100%"
+                  height="800px" class="iframeBox" v-show="item.show"></iframe>
               </div>
             </div>
           </div>
@@ -133,7 +124,7 @@
 </template>
 
 <script setup>
-import { nextTick, onMounted, provide, ref,watchEffect,watch } from "vue";
+import { nextTick, onMounted, provide, ref, watchEffect, watch } from "vue";
 import { ElMessageBox, ElMessage } from "element-plus";
 import useAppStore from "@/store/modules/app";
 import useUserStore from "@/store/modules/user";
@@ -177,7 +168,7 @@ const wangzhi = import.meta.env.VITE_APP_BASE_API;
 const isAlive = ref(true);
 const toFileData = ref();
 const uid = useUserStore().uid;
-let hasNewMessage=ref(false)
+let hasNewMessage = ref(false)
 let isSwitchFileIframe = ref(false); //是否切换到文件预览标签
 const iFrameData = ref(JSON.parse(sessionStorage.getItem('fileTabData')) || [
   {
@@ -290,7 +281,7 @@ function toggleSideBar() {
   appStore.toggleSideBar();
 }
 const logingName = ref("");
-let lisetenMessageTime=null;
+let lisetenMessageTime = null;
 onMounted(() => {
   logingName.value = Cookies.get("username");
   clearInterval(lisetenMessageTime)
@@ -298,25 +289,25 @@ onMounted(() => {
     //if(router.currentRoute.value.path=='/index') return;
     //console.log("===============window.noReadList：", localStorage.getItem("noreadlist"),'===========',isSwitchFileIframe.value)
     let tmplist = localStorage.getItem("noreadlist")
-    if(tmplist==null || tmplist==''){
+    if (tmplist == null || tmplist == '') {
       hasNewMessage.value = false
       return
     }
     tmplist = JSON.parse(tmplist);
-    if(tmplist!=null)hasNewMessage.value = true
+    if (tmplist != null) hasNewMessage.value = true
     else hasNewMessage.value = false
   }, 1000);
   // console.log('onMt',editableTabsValue.value);
   // console.log('type',typeof editableTabsValue.value);
 
-  nextTick(()=>{ // 要放在对响应式数据修改之后
-  if(typeof editableTabsValue.value == 'number'){
+  nextTick(() => { // 要放在对响应式数据修改之后
+    if (typeof editableTabsValue.value == 'number') {
       setTimeout(() => {
         iframeSize(editableTabsValue.value)
       }, 1000);
     }
   })
-  
+
 
   // console.log('router',router)
 });
@@ -373,7 +364,14 @@ const toSearch = async () => {
     // console.log("res", res);
     // console.log("router", route.path);
     if (route.path != "/search") {
-      router.push('/search' + '/' + JSON.stringify(res) + '/' + searchText.value);
+      let listArr = JSON.stringify(res);
+      router.push({
+        name: 'search',
+        params: {
+          listArr: listArr,
+          searchText: searchText.value
+        }
+      });
     } else {
       router.replace({
         path: "/allback",
@@ -482,11 +480,11 @@ if (hasRole) {
 
 const clickPath = (index, items) => {
   items = toRaw(items);
-  localStorage.setItem("inChat",items.path=="/index"?1:0)
+  localStorage.setItem("inChat", items.path == "/index" ? 1 : 0)
   // toFileData.value = null
   console.log("clickPathitems", items);
   // editableTabs.value = arr;
-  isSwitchFileIframe.value=false
+  isSwitchFileIframe.value = false
   const arr = toRaw(editableTabs.value);
   if (!arr.some((item) => item.label == items.label)) {
     editableTabs.value.push({
@@ -509,7 +507,7 @@ const clickTab = (item) => {
   setTimeout(() => {
     console.log("toFileData.value", toFileData.value);
     if (toFileData.value) {
-      localStorage.setItem("inChat",0)
+      localStorage.setItem("inChat", 0)
       console.log(
         "tofolder",
         JSON.stringify(toRaw(toFileData.value.clickRowId))
@@ -523,7 +521,7 @@ const clickTab = (item) => {
       });
       return;
     }
-    localStorage.setItem("inChat",url=="/index" ? 1: 0)
+    localStorage.setItem("inChat", url == "/index" ? 1 : 0)
     let regExp = new RegExp(/^\//);
     if (!regExp.test(url)) {
       const data = JSON.parse(url);
@@ -538,7 +536,7 @@ const clickTab = (item) => {
         },
       });
     } else {
-      editableTabsValue.value = url      
+      editableTabsValue.value = url
       router.push({
         path: item,
       });
@@ -561,7 +559,7 @@ const paneClick = (item) => {
 };
 // 点击文件标签
 const filePaneClick = (item) => {
-  localStorage.setItem("inChat",0)
+  localStorage.setItem("inChat", 0)
   console.log("filePaneClickitem", item);
   isSwitchFileIframe.value = true
   console.log(98588546543);
@@ -575,7 +573,7 @@ const filePaneClick = (item) => {
       const inIframe =
         outIframe.contentDocument.getElementsByTagName("iframe")[0];
       setTimeout(() => {
-        console.log('outIframe',outIframe.parentElement);
+        console.log('outIframe', outIframe.parentElement);
         console.error(outIframe.parentElement);
         inIframe.style.height = outIframe.style.height =
           outIframe.parentElement.offsetHeight + "px";
@@ -607,20 +605,20 @@ const addFileTab = (data) => {
     const thisPane = toRaw(hasThis)
     // console.log('hasThis',thisPane);
     const arr = oldIFrameData.map((par) => {
-    if (par.id == thisPane.id) {
-      par.show = true
-      editableTabsValue.value = par.id// 标签跳转
-      setTimeout(() => {
-        
-        iframeSize(par.id)
-      }, 1000);
-    }else{
-		par.show = false
-	}
-    return toRaw(par);
-  });
-  iFrameData.value = arr;
-  isAlive.value = false;
+      if (par.id == thisPane.id) {
+        par.show = true
+        editableTabsValue.value = par.id// 标签跳转
+        setTimeout(() => {
+
+          iframeSize(par.id)
+        }, 1000);
+      } else {
+        par.show = false
+      }
+      return toRaw(par);
+    });
+    iFrameData.value = arr;
+    isAlive.value = false;
     return
   }
   const arr = oldIFrameData.map((par) => {
@@ -634,7 +632,7 @@ const addFileTab = (data) => {
         thisData.docId = "";
         editableTabsValue.value = par.id// 新建时标签跳转
         setTimeout(() => {
-          
+
           iframeSize(par.id)
         }, 1000);
       }
@@ -757,27 +755,27 @@ const closeFileTab = (item, index, e) => {
   console.log("iFrameData", iFrameData.value);
 };
 // 控制iframe大小
-const iframeSize = (id)=>{
-   const outIframe = document.getElementById("iframe" + id);
+const iframeSize = (id) => {
+  const outIframe = document.getElementById("iframe" + id);
   const inIframe =
     outIframe.contentDocument.getElementsByTagName("iframe")[0];
-    console.log('outIframe',outIframe.parentElement);
-    console.error(outIframe.parentElement);
-    inIframe.style.height = outIframe.style.height =
-      outIframe.parentElement.offsetHeight + "px";
-    inIframe.style.width = outIframe.style.width =
-      outIframe.parentElement.offsetWidth + "px";
+  console.log('outIframe', outIframe.parentElement);
+  console.error(outIframe.parentElement);
+  inIframe.style.height = outIframe.style.height =
+    outIframe.parentElement.offsetHeight + "px";
+  inIframe.style.width = outIframe.style.width =
+    outIframe.parentElement.offsetWidth + "px";
 
-    // console.log('dom',outIframe.parentElement.offsetWidth);
-    // console.log('inIframe',inIframe);
+  // console.log('dom',outIframe.parentElement.offsetWidth);
+  // console.log('inIframe',inIframe);
 }
 // 监听和保存标签信息
-const setTabLocal = (data)=>{
+const setTabLocal = (data) => {
   // console.log('setTabLocal',data);
   sessionStorage.setItem('tabData', JSON.stringify(data))
 }
-const setFileTabLocal = (data)=>{
-  console.log('setFileTabLocal',data);
+const setFileTabLocal = (data) => {
+  console.log('setFileTabLocal', data);
   isSwitchFileIframe.value = true
   // console.log('setFileTabLocal',data);
   sessionStorage.setItem('fileTabData', JSON.stringify(data))

src/router/index.js

@@ -118,13 +118,14 @@ export const constantRoutes = [{
 		},
 	},
 	{
-		path: '/search/:searchData/:searchText',
+		path: '/search/:listArr/:searchText',
 		component: () => import('@/views/search/index.vue'),
 		name: 'search',
 		meta: {
 			title: '全文搜索',
 			icon: 'dashboard'
 		},
+		props: true
 	},
 	// {
 	// 	path: "/myfile",

src/views/search/index.vue

@@ -12,11 +12,7 @@
     <div class="searchType">
       <div class="searchFor">
         <div class="search_title">搜索范围：</div>
-        <el-tabs
-          v-model="searchFor"
-          class="demo-tabs"
-          @tab-change="changeSearchFor"
-        >
+        <el-tabs v-model="searchFor" class="demo-tabs" @tab-change="changeSearchFor">
           <el-tab-pane label="公共" name="1"></el-tab-pane>
           <el-tab-pane label="部门" name="2"></el-tab-pane>
           <el-tab-pane label="个人" name="3"></el-tab-pane>
@@ -25,11 +21,7 @@
       <div class="line"></div>
       <div class="searchFor">
         <div class="search_title">分类：</div>
-        <el-tabs
-          v-model="searchType"
-          class="demo-tabs"
-          @tab-change="changeSearchType"
-        >
+        <el-tabs v-model="searchType" class="demo-tabs" @tab-change="changeSearchType">
           <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>
@@ -44,30 +36,10 @@
         <div class="dataNum">共查询到{{ total }}个相关结果</div>
       </div>
       <div class="right_box">
-        <img
-          src="@/assets/images/sort.png"
-          @click="changeSort"
-          v-if="isAsc == 'asc'"
-          alt=""
-        />
-        <img
-          src="@/assets/images/Frame_188.png"
-          @click="changeSort"
-          v-else
-          alt=""
-        />
-        <img
-          v-if="isList"
-          src="@/assets/images/squre.png"
-          alt=""
-          @click="changeShow"
-        />
-        <img
-          v-else
-          src="@/assets/images/Frame_187.png"
-          alt=""
-          @click="changeShow"
-        />
+        <img src="@/assets/images/sort.png" @click="changeSort" v-if="isAsc == 'asc'" alt="" />
+        <img src="@/assets/images/Frame_188.png" @click="changeSort" v-else alt="" />
+        <img v-if="isList" src="@/assets/images/squre.png" alt="" @click="changeShow" />
+        <img v-else src="@/assets/images/Frame_187.png" alt="" @click="changeShow" />
       </div>
     </div>
     <!-- 文件列表 -->
@@ -75,34 +47,21 @@
       <div>
         <div v-if="isList">
           <!-- 表格 -->
-          <el-table
-            :data="tableData"
-            style="width: 100%"
-            :scrollbar-always-on="true"
-          >
-            <el-table-column fixed prop="fileName" label="名称" width="500">
+          <el-table :data="tableData" style="width: 100%" :scrollbar-always-on="true">
+            <el-table-column fixed label="名称" width="500">
               <template #default="scope">
                 <div class="flie_name">
-                  <img
-                    class="table_icon"
-                    :src="setIcon(scope.row.fileType)"
-                    alt=""
-                    style=""
-                  />
+                  <img class="table_icon" :src="setIcon(scope.row.fileType)" alt="" style="" />
                   {{ scope.row.fileName }}
                 </div>
               </template>
             </el-table-column>
-            <el-table-column
-              prop="space.spaceName"
-              label="所属空间"
-              width="180"
-            />
+            <el-table-column prop="space.spaceName" label="所属空间" width="180" />
             <el-table-column prop="createTime" label="时间" width="200" />
             <el-table-column prop="fileType" label="类型" width="80" />
             <el-table-column prop="fileSize" label="大小" width="160">
               <template #default="scope">
-                <div>{{formatFileSize(scope.row.fileSize)}}</div>
+                <div>{{ formatFileSize(scope.row.fileSize) }}</div>
               </template>
             </el-table-column>
             <el-table-column prop="dir.dirPath" label="文件夹" width="180">
@@ -113,12 +72,7 @@
               </template>
             </el-table-column>
           </el-table>
-          <Pagination
-            :total="total"
-            :page="page"
-            :limit="limit"
-            @pagination="pagination"
-          ></Pagination>
+          <Pagination :total="total" :page="page" :limit="limit" @pagination="pagination"></Pagination>
         </div>
         <div v-else>
           <!-- 平铺 -->
@@ -138,7 +92,7 @@
 import { onMounted, ref, toRaw, inject } from "vue";
 import { search } from "@/api/search/search.js";
 import { flieSearch } from "@/api/search/search.js";
-import { useRoute, useRouter,onBeforeRouteUpdate } from "vue-router";
+import { useRoute, useRouter, onBeforeRouteUpdate } from "vue-router";
 import Pagination from "@/components/Pagination/index.vue";
 //---------------导入图片--------------------------
 import file_DOC from "@/assets/images/fileType/file_DOC.png";
@@ -172,15 +126,15 @@ const limit = ref(2); //pagesize
 const reload = inject("reload");
 onMounted(() => {
   let route = useRoute();
-  console.log(route,'route');
+  console.log(route.params, 'route');
   searchText.value = route.params.searchText;
-  let searchData = route.params.searchData;
+  let searchData = route.params.listArr;
   // console.log("searchData", searchData);
   baseData.value = JSON.parse(searchData).rows;
   tableData.value = JSON.parse(searchData).rows;
   total.value = JSON.parse(searchData).total;
   changeSearchFor(searchFor.value);
-  // console.log("total", total.value );
+  console.log("total", baseData.value);
 });
 const tableData = ref([]);
 // 切换搜索范围
@@ -304,7 +258,7 @@ const setType = (fileType) => {
       return [".mp3"];
       break;
     case "video":
-      return [".mp4",'.qlv'];
+      return [".mp4", '.qlv'];
       break;
     case "zip":
       return [".zip", "rar", ".7z"];
@@ -329,10 +283,10 @@ function formatFileSize(fileSize) {
     return fileSize + "B";
   }
 }
-onBeforeRouteUpdate((to,from)=>{
-      console.log('to',to);
-      console.log('from',from);
-    })
+onBeforeRouteUpdate((to, from) => {
+  console.log('to', to);
+  console.log('from', from);
+})
 </script>
 
 <style lang="scss" scoped>
@@ -341,17 +295,20 @@ onBeforeRouteUpdate((to,from)=>{
   background-color: #fff;
   border-radius: 4px;
 }
+
 .searchTitle {
   width: 100%;
   height: 40px;
   padding-left: 8px;
   display: flex;
   align-items: center;
+
   .colLine {
     margin-left: 5px;
     height: 100%;
     border-right: 1px solid #c1cce3;
   }
+
   .searchTitle_text {
     font-size: 16px;
     font-weight: 400;
@@ -359,6 +316,7 @@ onBeforeRouteUpdate((to,from)=>{
     margin-left: 16px;
   }
 }
+
 .searchType {
   width: 100%;
   height: 40px;
@@ -369,9 +327,11 @@ onBeforeRouteUpdate((to,from)=>{
   padding-left: 16px;
   display: flex;
   align-items: center;
+
   .searchFor {
     height: 100%;
     display: flex;
+
     // align-items: center;
     .search_title {
       height: 100%;
@@ -381,6 +341,7 @@ onBeforeRouteUpdate((to,from)=>{
       font-family: Inter-Medium;
     }
   }
+
   .line {
     width: 1px;
     height: 24px;
@@ -388,6 +349,7 @@ onBeforeRouteUpdate((to,from)=>{
     margin: 0 16px;
   }
 }
+
 .statistics {
   width: 100%;
   height: 40px;
@@ -396,47 +358,57 @@ onBeforeRouteUpdate((to,from)=>{
   display: flex;
   justify-content: space-between;
   align-items: center;
+
   .left_box {
     display: flex;
     align-items: center;
+
     .dataNum {
       margin-left: 4px;
       font-size: 14px;
       font-weight: 400;
     }
   }
+
   .right_box {
     width: 50px;
     display: flex;
     justify-content: space-between;
     margin-right: 30px;
+
     img {
       cursor: pointer;
     }
   }
 }
+
 .fileList {
   height: 100%;
+
   .content_box {
     width: 100%;
     height: 100%;
     padding: 16px;
+
     .oneBox {
       width: 100%;
       height: 120px;
       border-bottom: 1px dashed #c1cce3;
+
       .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;
@@ -448,6 +420,7 @@ onBeforeRouteUpdate((to,from)=>{
         text-overflow: ellipsis;
         -webkit-line-clamp: 3; //例如超过3行显示省略号
         overflow: hidden;
+
         em {
           color: #dd2025;
         }
@@ -455,6 +428,7 @@ onBeforeRouteUpdate((to,from)=>{
     }
   }
 }
+
 //表格文本超出隐藏
 ::v-deep .flie_name,
 .folder {
@@ -465,24 +439,29 @@ onBeforeRouteUpdate((to,from)=>{
   /* 第三步：用省略号来代表未显示完的文本 */
   text-overflow: ellipsis;
 }
+
 // tag间距
 ::v-deep .el-tabs__item {
   padding: 0 16px !important;
   color: #505870 !important;
   font-weight: 400 !important;
 }
+
 ::v-deep .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
   padding-left: 0 !important;
 }
+
 ::v-deep .el-tabs--top .el-tabs__item.is-top:last-child {
   padding-right: 0 !important;
 }
+
 // tag选中颜色
 ::v-deep .el-tabs__item.is-active {
   color: #2e6bc8 !important;
   font-weight: normal;
   font-family: Inter-SemiBold;
 }
+
 ::v-deep .el-tabs__active-bar {
   background-color: #2e6bc8;
 }
@@ -495,33 +474,40 @@ onBeforeRouteUpdate((to,from)=>{
 .el-collapse-item__wrap {
   border: none;
 }
+
 .table_icon {
   height: 27px;
   width: 27px;
   vertical-align: middle;
 }
+
 ::v-deep .el-collapse-item__content {
   padding-bottom: 0;
 }
+
 ::v-deep .el-collapse-item__header {
   background-color: #ebeff6 !important;
   width: 100% !important;
   height: 24px !important;
 }
+
 ::v-deep .el-collapse-item__arrow {
   position: relative;
   color: #2e6bc8;
   right: 97%;
 }
+
 ::v-deep .el-table td.el-table__cell {
   border: none;
   font-size: 14px !important;
   font-weight: 400 !important;
   color: #000 !important;
 }
+
 ::v-deep .el-table__row {
   height: 35px !important;
 }
+
 ::v-deep .el-table .el-table__header-wrapper th {
   border-bottom: none;
   border-right: 1px solid #c1cce3;
@@ -529,6 +515,7 @@ onBeforeRouteUpdate((to,from)=>{
   color: #505870;
   font-size: 14px;
 }
+
 .collapseItem_title {
   position: relative;
   left: 40px;
@@ -536,16 +523,19 @@ onBeforeRouteUpdate((to,from)=>{
   font-family: Inter-Medium;
   font-size: 12px;
 }
+
 // 表格右边3个靠右对齐
 ::v-deep .el-table__header thead tr th {
   font-family: Inter-Medium;
   font-size: 14px;
   color: #505870;
   text-align: right;
+
   &:nth-child(1) {
     text-align: left;
   }
 }
+
 // ::v-deep .el-table__body tbody [class*="column_2"] {
 //   text-align: right;
 // }
@@ -563,16 +553,19 @@ onBeforeRouteUpdate((to,from)=>{
 // }
 ::v-deep .el-table__body tbody [class*="column_"] {
   text-align: right;
+
   &:nth-child(4n + 1) {
     text-align: left;
   }
 }
+
 //平铺
 .tile_box {
   width: 100%;
   height: 300px;
   display: flex;
   flex-wrap: wrap;
+
   .file_box {
     width: 116px;
     min-height: 138px;
@@ -580,10 +573,12 @@ onBeforeRouteUpdate((to,from)=>{
     display: flex;
     flex-direction: column;
     align-items: center;
+
     .big_file_img {
       width: 100px;
       height: 100px;
     }
+
     span {
       font-size: 14px;
       font-weight: 400;