文件搜索完成

src/api/search/search.js

@@ -6,4 +6,11 @@ export function search(query) {
       method: 'get',
       params: query
     })
+  }
+  export function flieSearch(query) {
+    return request({
+      url: '/biz/info/search',
+      method: 'get',
+      params: query
+    })
   }

src/layout/indexCommon.vue

@@ -1,11 +1,15 @@
 <template>
   <div class="common-layout">
     <el-container>
-      <el-header class="nav" style="position: sticky;top: 0;left: 0;width: 100%;z-index: 999">
+      <el-header
+        class="nav"
+        style="position: sticky; top: 0; left: 0; width: 100%; z-index: 999"
+      >
         <div class="nav-top">
           <div>
             <img src="@/assets/images/logos.png" /><span>DOMINO'S File</span>
           </div>
+          <!-- TODO 搜索触发事件优化，跳转页面优化 -->
           <div class="search">
             <el-input
               v-model="searchText"
@@ -15,6 +19,7 @@
               suffix-icon="Search"
               clearable
               @change="toSearch"
+              @@keyup.enter="toSearch"
             />
           </div>
           <div>
@@ -55,8 +60,10 @@
                     : 'img-style'
                 "
               >
-                <img :src="$route.path==item.path ? item.beimgs : item.imgs" />
-                <div class="text-style" v-if="$route.path!=item.path">
+                <img
+                  :src="$route.path == item.path ? item.beimgs : item.imgs"
+                />
+                <div class="text-style" v-if="$route.path != item.path">
                   {{ item.label }}
                 </div>
               </div> </router-link
@@ -64,7 +71,7 @@
           </div>
         </el-aside>
         <el-main class="main">
-          <router-view></router-view>
+          <router-view v-if="isAlive"></router-view>
         </el-main>
       </el-container>
     </el-container>
@@ -72,7 +79,7 @@
 </template>
 
 <script setup>
-import { onMounted, ref } from "vue";
+import { nextTick, onMounted, provide, ref } from "vue";
 import { ElMessageBox } from "element-plus";
 import useAppStore from "@/store/modules/app";
 import useUserStore from "@/store/modules/user";
@@ -92,16 +99,30 @@ import common from "@/assets/images/common.png";
 import becommon from "@/assets/images/becommon.png";
 import chuanshu from "@/assets/images/chuanshu.png";
 import bechuanshu from "@/assets/images/bechuanshu.png";
+import highsearch from "@/assets/images/highsearch.png";
+import behighsearch from "@/assets/images/behighsearch.png";
 import { AppMain, Navbar, Settings, TagsView } from "./components";
-import { search } from "@/api/search/search.js";
-import { useRouter } from "vue-router";
+import { flieSearch } from "@/api/search/search.js";
+import { useRouter, useRoute } from "vue-router";
 const router = useRouter(); //注册路由
+const route = useRoute();
 const appStore = useAppStore();
 const userStore = useUserStore();
 const settingsStore = useSettingsStore();
 const searchText = ref(""); //搜索ipt的值
 const selectValue = ref(1); //文档空间类型
 
+const isAlive = ref(true);
+
+function reload() {
+  isAlive.value = false;
+  console.log(11);
+  nextTick(() => {
+    isAlive.value = true;
+  });
+}
+
+provide("reload", reload);
 
 function toggleSideBar() {
   appStore.toggleSideBar();
@@ -140,20 +161,30 @@ function logout() {
 
 // 跳转到全文搜索
 const toSearch = async () => {
+  if (!searchText.value) return;
   // console.log('searchText = ',searchText.value);
   const query = {
     keyword: searchText.value,
-    page: 1,
-    size: 10,
-    type: selectValue.value,
+    isAsc: "asc",
+    orderByColumn: "createTime",
   };
-  const res = await search(query);
-  console.log("res", res);
+  const res = await flieSearch(query);
+  // console.log("res", res);
   if (res) {
-    router.push({
+    // console.log("res", res);
+    // console.log("router", route.path);
+    // if (route.path != "/search") {
+    router.replace({
       path: "/search",
-      query: { searchData: JSON.stringify(res) },
+      query: {
+        searchData: JSON.stringify(res),
+        searchText: searchText.value,
+      },
     });
+    reload();
+    // } else {
+    //   reload();
+    // }
   }
 };
 const emits = defineEmits(["setLayout"]);
@@ -205,11 +236,11 @@ const menuList = reactive({
       imgs: common,
       beimgs: becommon,
     },
-     {
+    {
       label: "高级搜索",
       path: "/highsearch",
-      imgs: common,
-      beimgs: becommon,
+      imgs: highsearch,
+      beimgs: behighsearch,
     },
     {
       label: "传输列表",
@@ -327,23 +358,23 @@ const clickPath = (index) => {
   // padding: 0 16px !important;
   // box-sizing: border-box !important;
 }
-.el-popper__arrow::before{
+.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;
-    }
+  .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/views/highSearch/HighSearch.vue

@@ -23,7 +23,7 @@
             v-if="item.value === selectValue"
             style="
               position: relative;
-              right:-13px;
+              right: -13px;
               color: #000;
               font-weight: 700;
               font-size: 13px;
@@ -39,14 +39,14 @@
       <el-input
         class="search_ipt"
         v-model="searchText"
+        maxlength="32"
         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 class="dataNum">共查询到{{ total }}个相关结果</div>
       </div>
       <div
         class="content_box"
@@ -73,7 +73,7 @@
       </div>
       <div class="error" v-if="noData">
         <img src="@/assets/images/空白页 1.png" alt="" />
-        <span>没有关于“{{ searchText }}”的结果 </span>
+        <span>没有关于“{{ noFound }}”的结果 </span>
       </div>
     </div>
   </div>
@@ -90,7 +90,7 @@ const total = ref(0); //数据总条数
 const noData = ref(false); //没有搜索出数据
 const beEnd = ref(false); //拉到最底部了
 const listData = ref([]);
-const scrollRef = ref();
+const noFound = ref(); //没有结果的text
 const selectOptions = [
   { label: "公共文档", value: 1 },
   { label: "部门文档", value: 2 },
@@ -111,18 +111,30 @@ const doSearch = async () => {
     type: selectValue.value,
   };
   const res = await search(query);
-  if (Array.isArray(res)) {
-    listData.value = res;
-    total.value = res.length;
+  // console.log('res',res);
+  if (res.data) {
+    if (res.data.length < 1) {
+      // 没找到数据
+      listData.value = [];
+      noData.value = true;
+      noFound.value = searchText.value;
+      return;
+    }
+    listData.value = res.data;
+    total.value = res.data.length;
     noData.value = false;
-    // setScroll()
+    if (res.data.length < size.value) {
+      beEnd.value = true;
+    }
   } else {
+    // console.log(1);
     listData.value = [];
     noData.value = true;
+    noFound.value = searchText.value;
   }
 };
 const setScroll = async () => {
-  console.log("到底啦");
+  // console.log("到底啦");
   if (beEnd.value) return;
   page.value += 1;
   const query = {
@@ -132,13 +144,13 @@ const setScroll = async () => {
     type: selectValue.value,
   };
   const res = await search(query);
-  console.log(res);
-  if (res.length > 0) {
+  // console.log(res);
+  if (res.data.length > 0) {
     // 如果返回的有数据
-    total.value += res.length;
+    total.value += res.data.length;
     noData.value = false;
-    res.forEach((item) => listData.value.push(item));
-    if (res.length < size.value) {
+    res.data.forEach((item) => listData.value.push(item));
+    if (res.data.length < size.value) {
       //如果返回的数组长度小于size说明查完了
       beEnd.value = true;
     }
@@ -249,7 +261,7 @@ const setScroll = async () => {
         display: -webkit-box;
         -webkit-box-orient: vertical;
         text-overflow: ellipsis;
-        -webkit-line-clamp: 3; //例如超过3行显示省略号
+        -webkit-line-clamp: 3; //超过3行显示省略号
         overflow: hidden;
       }
     }

src/views/login.vue

@@ -232,7 +232,7 @@ getCookie();
 .img_box {
   height: 100%;
   width: 50%;
-  background-image: url("../assets/images/login_big.png");
+  background-image: url("../assets/images/bigLogin.png");
   // background-image: url("../assets/images/Rectangle 229.png");
   background-repeat: no-repeat;
   background-size:100% 100%;