Merge branch 'liuqiang' into v3

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="clickId == index ? 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>