merge

src/api/database/index.js

@@ -1,18 +1,18 @@
 import fetch from '../fetch.js'
 
 export default {
-    /**
+  /**
      * 资料库相关借口
      * @returns {Promise<unknown>}
      */
-    fileList(params) { //项目列表
-        return fetch('/blade-project-manage/bladefile/v1/getAllList', params)
-    },
-    fileInfo(params) {
-        return fetch('/blade-project-manage/bladefile/v1/detail', params)
-    },
-    fileRemove(params) { //删除项目
-        return fetch('/blade-project-manage/bladefile/v1/remove', params, 'post')
-    },
+  fileList (params) { // 项目资料列表
+    return fetch('/blade-project-manage/bladefile/v1/getAllList', params)
+  },
+  fileInfo (params) {
+    return fetch('/blade-project-manage/bladefile/v1/detail', params)
+  },
+  fileRemove (params) { // 删除项目
+    return fetch('/blade-project-manage/bladefile/v1/remove', params, 'post')
+  }
 
 }

src/api/project/index.js

@@ -101,5 +101,16 @@ export default {
   },
   folderType (params) {
     return fetch('/blade-project-manage-v2/dict/v2/getDictList', params)
+  },
+  /**
+     * 全站搜索
+     * @param params
+     * @returns {Promise<unknown>}
+     */
+  totalSearch (params) {
+    return fetch('/blade-project-manage-v2/searcher/v2/getListByKeyword', params, 'post', 'json')
+  },
+  total (params) {
+    return fetch('/blade-project-manage-v2/searcher/v2/getTotalByKeyword', params, 'post')
   }
 }

src/layout/top.vue

@@ -1,56 +1,152 @@
 <template>
-      <el-row class='flex flex-align-center flex-justify-between top '>
-        <el-col  :span='12'>
-          <div class='flex flex-justify-start flex-align-center padding'>
-           <img class="ml-10" src="../assets/svg/top.svg"/>
-            <el-breadcrumb class='ml-10' separator="/">
-              <el-breadcrumb-item v-for='item in nav.menus' :key='item.id'>
-                <a :href="item.fullPath">{{ item.name }}</a>
-              </el-breadcrumb-item>
-            </el-breadcrumb>
+  <div>
+    <el-row class='flex flex-align-center flex-justify-between top'>
+      <el-col :span='12'>
+        <div class='flex flex-justify-start flex-align-center padding'>
+          <img class="ml-10" src="../assets/svg/top.svg"/>
+          <el-breadcrumb class='ml-10' separator="/">
+            <el-breadcrumb-item v-for='item in nav.menus' :key='item.id'>
+              <a :href="item.fullPath">{{ item.name }}</a>
+            </el-breadcrumb-item>
+          </el-breadcrumb>
+        </div>
+      </el-col>
+      <el-col :span='12'>
+        <div class='flex-child-average flex-justify-end flex padding-right'>
+          <div class="padding flex flex-align-center pointer" @click="show = true">
+            <el-icon class="mr-5">
+              <Search/>
+            </el-icon>
+            <span>搜索</span>
           </div>
-        </el-col>
-        <el-col :span='12'>
-          <div class='flex-child-average flex-justify-end flex padding-right '>
-            <div class='padding flex flex-align-center'>
-              <el-avatar class='mr-10' :size="30" :src="user.info.avatarUrl && user.info.avatarUrl.length > 0 ?  user.info.avatarUrl : 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'" />
-              <el-dropdown @command='dropDown'>
+          <div class='padding flex flex-align-center pointer'>
+            <el-avatar class='mr-10' :size="30"
+                       :src="user.info.avatarUrl && user.info.avatarUrl.length > 0 ?  user.info.avatarUrl : 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'"/>
+            <el-dropdown @command='dropDown'>
                 <span class="flex flex-center">
-                  {{user.info.name}} / {{user.info.deptName}}
+                  {{ user.info.name }} / {{ user.info.deptName }}
                   <el-icon class="el-icon--right">
-                    <arrow-down />
+                    <arrow-down/>
                   </el-icon>
                 </span>
-                <template #dropdown>
-                  <el-dropdown-menu>
-                    <el-dropdown-item command='info'>个人中心</el-dropdown-item>
-                    <el-dropdown-item command='logout'>退出登录</el-dropdown-item>
-                  </el-dropdown-menu>
-                </template>
-              </el-dropdown>
-            </div>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item command='info'>个人中心</el-dropdown-item>
+                  <el-dropdown-item command='logout'>退出登录</el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown>
           </div>
-        </el-col>
-      </el-row>
+        </div>
+      </el-col>
+    </el-row>
+    <el-dialog v-model='show' append-to-body width='40%'>
+      <div class="flex flex-col">
+        <div class="flex flex-center">
+          <div class="mr-5">
+            <el-dropdown @command='dropDown'>
+              <div class="flex flex-center">
+                <el-icon size="25px">
+                  <Search/>
+                </el-icon>
+                <el-icon size="20px">
+                  <CaretBottom/>
+                </el-icon>
+              </div>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item command='switch'>全部</el-dropdown-item>
+                  <el-dropdown-item command='switch1'>项目</el-dropdown-item>
+                  <el-dropdown-item command='switch2'>文档</el-dropdown-item>
+                  <el-dropdown-item command='switch3'>图片</el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown>
+          </div>
+          <div class="full-width flex flex-center flex-col">
+            <el-input
+                clearable
+                v-model='params.keyword'
+                class='append'
+                placeholder="输入关键字搜索"
+                size='large'
+                @keydown="searchTotal"
+            >
+            </el-input>
+          </div>
+        </div>
+        <div class="flex flex-center mt-15">
+          <div v-if="isAll === 1" v-for="(item,index) in type" :key='item.key' class="flex flex-center tab">
+            <el-badge :value='item.count' :hidden='item.count === 0'>
+              <div :class="active === index ? 'tab-active' : ''" class="pointer"
+                   @click="change(index,item.key)">{{ item.value }}
+              </div>
+            </el-badge>
+          </div>
+        </div>
+        <el-empty v-if="data && data.length === 0" description='暂无数据'/>
+        <div v-else class="mt-10" v-for="sub in data" style="margin-left: 34px;">
+          <span>{{ sub.title }}</span>
+        </div>
+        <div class="full-width mt-10 flex flex-justify-end">
+          <el-pagination small layout="prev, pager, next" :total="total"/>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
 import navStore from '../store/nav.js'
-import { useStore } from '../store/user.js'
+import {useStore} from '../store/user.js'
 import permissionStore from '@/store/permission.js'
 
 export default {
   name: 'top',
-  setup () {
+  setup() {
     const nav = navStore()
     const user = useStore()
     const permission = permissionStore()
-    return { nav, user, permission }
+    return {nav, user, permission}
   },
-  created () {
+  data() {
+    return {
+      show: false,
+      keywords: '',
+      active: 0,
+      type: [
+        {
+          key: 'project',
+          value: '项目',
+          count: 0
+        },
+        {
+          key: 'file',
+          value: '文档',
+          count: 0
+        },
+        {
+          key: 'picture',
+          value: '图片',
+          count: 0
+        }
+      ],
+      params: {
+        keyword: '',
+        searchType: 'all',
+        pages: 1,
+        size: 10
+
+      },
+      data: [],
+      total: '',
+      isAll: 0,
+    }
+  },
+  created() {
   },
   methods: {
-    dropDown (res) {
+    dropDown(res) {
       if (res === 'info') {
         this.$router.push('/user')
       } else if (res === 'logout') {
@@ -69,14 +165,72 @@ export default {
             this.$message.error(res.msg)
           }
         })
+      } else if (res === 'switch') {
+        this.params.searchType = 'all'
+        this.isAll = 1
+        this.searchTotal()
+      } else if (res === 'switch1') {
+        this.isAll = 0
+        this.params.searchType = 'project'
+        this.searchTotal()
+      } else if (res === 'switch2') {
+        this.isAll = 0
+        this.params.searchType = 'file'
+        this.searchTotal()
+      } else if (res === 'switch3') {
+        this.isAll = 0
+        this.params.searchType = 'picture'
+        this.searchTotal()
+      }
+    },
+    change(index, key) {
+      this.active = index
+      this.params.searchType = key
+      if (this.params.searchType === 'all') {
+        this.isAll = 1
+        this.getTotal()
+        this.$api.project.totalSearch(this.params).then(res => {
+          if (res.code === 200) {
+            this.data = res.data.result
+            this.total = res.data.total
+          }
+        })
+      } else {
+        this.getTotal()
+        this.$api.project.totalSearch(this.params).then(res => {
+          if (res.code === 200) {
+            this.data = res.data.result
+            this.total = res.data.total
+          }
+        })
+      }
+    },
+    searchTotal(res) {
+      if (res.key === 'Enter') {
+        this.getTotal()
+        this.$api.project.totalSearch(this.params).then(res => {
+          if (res.code === 200) {
+            this.data = res.data.result
+            this.total = res.data.total
+          }
+        })
       }
+    },
+    getTotal() {
+      this.$api.project.total({keyword: this.params.keyword}).then(res => {
+        if (res.code === 200) {
+          this.type[0].count = res.data.projectTotal
+          this.type[1].count = res.data.fileTotal
+          this.type[2].count = res.data.pictureTotal
+        }
+      })
     }
   }
 }
 </script>
 
 <style lang='scss' scoped>
-.top{
+.top {
   height: 60px;
   z-index: 1;
   background-color: white;
@@ -88,10 +242,31 @@ export default {
   box-shadow: 0 5px 10px -5px rgba(0, 0, 0, 0.1);
 }
 
-.avatar{
+.avatar {
   background-color: #c4c3c3;
   width: 30px;
   height: 30px;
   border-radius: 15px;
 }
+
+.tab {
+  width: 238px;
+  height: 38px;
+  background-color: #EDF0F3;
+  padding: 2px 10px;
+  color: #707070;
+  font-size: 13px;
+}
+
+.tab-active {
+  width: 160px;
+  flex-wrap: nowrap;
+  color: white;
+  font-size: 15px;
+  background-color: #AB7630;
+  font-weight: 500;
+  padding: 4px 10px;
+  border-radius: 20px;
+  text-align: center;
+}
 </style>