全局搜索

front/src/api/home.js

@@ -2,7 +2,7 @@
  * @Author: hisense.wuhongjian
  * @Date: 2022-04-01 19:19:40
  * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-08-09 10:37:31
+ * @LastEditTime: 2022-08-13 14:54:04
  * @Description: 告诉大家这是什么
  */
 import request from '@/utils/request'
@@ -353,6 +353,14 @@ export function getIntegrationServicesList(params) {
     params,
   })
 }
+// 全局搜索
+export function getCountByFuzzyQuery(params) {
+  return request({
+    url: '/resource/getCountByFuzzyQuery?keyWorld=' + params,
+    method: 'get',
+    params,
+  })
+}
 
 // 融合服务--详情
 export function getIntegrationDetail(id) {

front/src/views/home/DetailsPageconetent.vue

@@ -9,6 +9,37 @@
       <detailsPageInfrastructureTree v-show="flag != '6'" />
     </div>
     <div class="top" v-if="Cardsname != '知识库' && Cardsname != '基础设施'">
+      <div class="resultListSearchInput-father">
+        <div class="resultListSearchInput-son">
+          模糊搜索
+          <a-input-search
+            v-model:value="searchValue"
+            placeholder="请输入关键词"
+            enter-button="搜索"
+            size="large"
+            @search="getAppResources2"
+            @change="onSearch"
+            class="resultListSearchInput"
+          />
+          <button class="button-reset" @click="chongzhi()">重置</button>
+          <button
+            class="button-reset"
+            style="margin-left: 0.1rem"
+            @click="globalSearch()"
+          >
+            全局搜索
+          </button>
+          <button
+            v-if="Cardsname == '应用资源'"
+            class="button-reset"
+            @click="applyAll()"
+            style="margin-left: 0.1rem"
+          >
+            全部申请
+          </button>
+          <div class="hengxian" style="background: transparent"></div>
+        </div>
+      </div>
       <div class="top-title">
         <div
           v-for="item in titleName"
@@ -23,31 +54,18 @@
               backgroundSize: 'cover',
             }"
           ></span>
-          <span>{{ item.name }}</span>
+          <span v-if="globalData.data.length > 0">
-        </div>
+            {{
-      </div>
+              item.name +
-      <div class="resultListSearchInput-father">
+              '(' +
-        <div class="resultListSearchInput-son">
+              (globalData.data.filter((val) => val.type === item.name)[0]
-          模糊搜索
+                .count || '0') +
-          <a-input-search
+              ')'
-            v-model:value="searchValue"
+            }}
-            placeholder="请输入关键词"
+          </span>
-            enter-button="搜索"
+          <span v-else>
-            size="large"
+            {{ item.name }}
-            @search="getAppResources"
+          </span>
-            @change="onSearch"
-            class="resultListSearchInput"
-          />
-          <button class="button-reset" @click="chongzhi()">重置</button>
-          <button
-            v-if="Cardsname == '应用资源'"
-            class="button-reset"
-            @click="applyAll()"
-            style="margin-left: 0.1rem"
-          >
-            全部申请
-          </button>
-          <div class="hengxian"></div>
         </div>
       </div>
       <div class="top-content-father" :key="listKey">
@@ -160,46 +178,7 @@
       </div>
     </div>
     <div class="top" v-else-if="Cardsname === '基础设施'">
-      <div class="top-title">
+      <div class="resultListSearchInput-father">
-        <div
-          v-for="item in titleName"
-          :key="item.name"
-          :class="item.name === Cardsname ? 'sel' : ''"
-          @click="changeCards(item.name)"
-        >
-          <span
-            class="photo"
-            :style="{
-              backgroundImage: `url(${item.photo}) `,
-              backgroundSize: 'cover',
-            }"
-          ></span>
-          <span>{{ item.name }}</span>
-        </div>
-      </div>
-      <div class="top-content-father">
-        <infrastructurePage @add="handleAdd" />
-      </div>
-    </div>
-    <div class="top" v-else>
-      <div class="top-title">
-        <div
-          v-for="item in titleName"
-          :key="item.name"
-          :class="item.name === Cardsname ? 'sel' : ''"
-          @click="changeCards(item.name)"
-        >
-          <span
-            class="photo"
-            :style="{
-              backgroundImage: `url(${item.photo}) `,
-              backgroundSize: 'cover',
-            }"
-          ></span>
-          <span>{{ item.name }}</span>
-        </div>
-      </div>
-      <div class="resultListSearchInput-father" style="background: unset">
         <div class="resultListSearchInput-son">
           模糊搜索
           <a-input-search
@@ -207,11 +186,107 @@
             placeholder="请输入关键词"
             enter-button="搜索"
             size="large"
-            @search="getAppResources"
+            @search="getAppResources2"
             @change="onSearch"
             class="resultListSearchInput"
           />
           <button class="button-reset" @click="chongzhi()">重置</button>
+          <button
+            class="button-reset"
+            style="margin-left: 0.1rem"
+            @click="globalSearch()"
+          >
+            全局搜索
+          </button>
+          <div class="hengxian" style="background: transparent"></div>
+        </div>
+      </div>
+      <div class="top-title">
+        <div
+          v-for="item in titleName"
+          :key="item.name"
+          :class="item.name === Cardsname ? 'sel' : ''"
+          @click="changeCards(item.name)"
+        >
+          <span
+            class="photo"
+            :style="{
+              backgroundImage: `url(${item.photo}) `,
+              backgroundSize: 'cover',
+            }"
+          ></span>
+          <span v-if="globalData.data.length > 0">
+            {{
+              item.name +
+              '(' +
+              (globalData.data.filter((val) => val.type === item.name)[0]
+                .count || '0') +
+              ')'
+            }}
+          </span>
+          <span v-else>
+            {{ item.name }}
+          </span>
+        </div>
+      </div>
+      <div class="top-content-father">
+        <infrastructurePage
+          ref="camera"
+          @add="handleAdd"
+          :searchValue="searchValue"
+        />
+      </div>
+    </div>
+    <div class="top" v-else>
+      <div class="resultListSearchInput-father">
+        <div class="resultListSearchInput-son">
+          模糊搜索
+          <a-input-search
+            v-model:value="searchValue"
+            placeholder="请输入关键词"
+            enter-button="搜索"
+            size="large"
+            @search="getAppResources2"
+            @change="onSearch"
+            class="resultListSearchInput"
+          />
+          <button class="button-reset" @click="chongzhi()">重置</button>
+          <button
+            class="button-reset"
+            style="margin-left: 0.1rem"
+            @click="globalSearch()"
+          >
+            全局搜索
+          </button>
+          <div class="hengxian" style="background: transparent"></div>
+        </div>
+      </div>
+      <div class="top-title">
+        <div
+          v-for="item in titleName"
+          :key="item.name"
+          :class="item.name === Cardsname ? 'sel' : ''"
+          @click="changeCards(item.name)"
+        >
+          <span
+            class="photo"
+            :style="{
+              backgroundImage: `url(${item.photo}) `,
+              backgroundSize: 'cover',
+            }"
+          ></span>
+          <span v-if="globalData.data.length > 0">
+            {{
+              item.name +
+              '(' +
+              (globalData.data.filter((val) => val.type === item.name)[0]
+                .count || '0') +
+              ')'
+            }}
+          </span>
+          <span v-else>
+            {{ item.name }}
+          </span>
         </div>
       </div>
       <KnowledgeBase
@@ -421,7 +496,7 @@
         </div>
       </div>
       <div class="top-content-father">
-        <infrastructurePage />
+        <infrastructurePage ref="camera" :searchValue="searchValue" />
       </div>
     </div>
     <div class="top" v-else>
@@ -721,6 +796,7 @@
     pageWithAttrs,
     getDataResource,
     getIntegrationServicesList,
+    getCountByFuzzyQuery,
   } from '@/api/home.js'
   import { getSgcList } from '@/api/personalCenter'
   import { useRouter } from 'vue-router'
@@ -866,10 +942,14 @@
       }
 
       // 重置数据
-      const chongzhi = () => {
+      const chongzhi = (flag) => {
         loading.value = true
         // 重置模糊查字段
+        if (!flag) {
           searchValue.value = ''
+          globalFlag.value = false
+          globalData.data = []
+        }
         paramsGetResources.name = searchValue.value
         // 重置筛选条件
         ListContent.records.forEach((val) => {
@@ -1009,9 +1089,45 @@
       const resourceList = reactive({ data: [] })
       const videoList = reactive({ data: [] })
       const resourceTotal = ref('')
+      // 全局搜索
+      const camera = ref(null)
+      const globalData = reactive({ data: [] })
+      const globalFlag = ref(false)
+      const globalSearch = () => {
+        if (searchValue.value) {
+          globalFlag.value = true
+          getCountByFuzzyQuery(searchValue.value || '').then((res) => {
+            console.log('全局搜索==========》', res.data.data)
+            globalData.data = res.data.data
+            if (paramsGetResources.type == '基础设施') {
+              console.log('camera1', camera.value)
+              camera.value.getCamera(true, searchValue.value)
+            } else {
+              getAppResources()
+            }
+          })
+        } else {
+          message.warning('全局搜索必须输入关键词！')
+        }
+      }
       // 校验
       const re = /^[0-9\u4E00-\u9FA5]*$/
+      const getAppResources2 = () => {
+        globalFlag.value = false
+        if (
+          whoShow1.value.itShowQingDao &&
+          paramsGetResources.type == '基础设施'
+        ) {
+          console.log('camera2', camera)
+          camera.value.getCamera(true, searchValue.value)
+        } else {
+          getAppResources()
+        }
+      }
       const getAppResources = (switchIndex) => {
+        if (!globalFlag.value) {
+          globalData.data = []
+        }
         if (searchValue.value) {
           let str = ''
           let r = null
@@ -1308,7 +1424,11 @@
         getNewList()
 
         if (!tecHnosphere && !appLiCation) {
-          getAppResources()
+          if (searchValue.value) {
+            globalSearch()
+          } else {
+            getAppResources2()
+          }
         }
       })
       // 全部申请
@@ -1369,7 +1489,7 @@
             )
             // router.currentRoute.value.query.select
             tagFlag.value = false
-            chongzhi()
+            chongzhi(true)
             getNewList()
           })
       }
@@ -1428,6 +1548,7 @@
         Cardsname,
         getNewList,
         getAppResources,
+        getAppResources2,
         chongzhi,
         onSearch,
         onShowSizeChange,
@@ -1460,6 +1581,9 @@
         abilitySquareFunction,
         abilitySquareFunctionData,
         showAbilitySquareNum,
+        globalData,
+        globalSearch,
+        camera,
       }
     },
     components: {
@@ -1761,13 +1885,13 @@
 
       .top-title {
         display: flex;
-        justify-content: space-between;
+        justify-content: space-around;
         align-items: center;
         font-size: 0.2rem;
         font-family: 'Alibaba PuHuiTi';
         color: #000000;
         line-height: 0.34rem;
-
+        margin-bottom: 0.2rem;
         .photo {
           display: inline-block;
           height: 0.44rem;
@@ -1776,7 +1900,7 @@
         }
 
         div {
-          margin: 0 0.2rem;
+          // margin: 0 0.2rem;
           padding: 0 0.1rem;
           cursor: pointer;
           display: flex;

front/src/views/home/infrastructurePage.vue

@@ -408,7 +408,7 @@
         <!-- 右侧 -->
         <div class="contentRight">
           <!-- 搜索@search="onSearch" -->
-          <div class="searchInput">
+          <div class="searchInput" v-if="isXiHaiAn">
             <a-input-search
               v-model:value="mapSearchParam.cameraName"
               placeholder="请输入关键词"
@@ -619,9 +619,11 @@
     ref,
     reactive,
     onMounted,
+    defineProps,
     watch,
     defineComponent,
     nextTick,
+    defineExpose,
   } from 'vue'
   import {
     getCameraByParentId,
@@ -639,6 +641,10 @@
   import mybus from '@/myplugins/mybus'
   import dayjs from 'dayjs'
   import { Form } from 'ant-design-vue'
+  const props = defineProps({
+    // 模糊查
+    searchValue: { type: String, default: '' },
+  })
   const current = ref(1)
   const videoTotal = ref(0)
   const router = useRouter()
@@ -789,6 +795,13 @@
   const roomModalCreateTime = ref('')
   const roomModalEndTime = ref('')
   const lookData = ref({})
+
+  // console.log('模糊查传递', props.searchValue)
+  if (props.searchValue) {
+    // console.log('模糊查传递')
+    // eslint-disable-next-line vue/no-setup-props-destructure
+    mapSearchParam.value.cameraName = props.searchValue
+  }
   //===========================
   onMounted(() => {
     if (jcssType.value) {
@@ -1369,7 +1382,11 @@
   //   console.log('添加至购物车')
   // }
   const wrjFlag = ref(false)
-  const getCamera = () => {
+  const getCamera = (flag, str) => {
+    if (flag) {
+      mapSearchParam.value.cameraName = str
+      console.log('赋值===============》', str, mapSearchParam.value)
+    }
     console.log('初始化调用')
     console.log('不选左侧树的时候不调用接口', mapSearchParam.value)
     if (!whoShow1.value.itShowXiHaiAn) {
@@ -1419,6 +1436,9 @@
       })
     }
   }
+  defineExpose({
+    getCamera,
+  })
   //加入申购车
   const addShoppingCart = () => {
     if (selectedList.value.length > 0) {

front/src/views/newHome/components/Navigation.vue

@@ -2,14 +2,14 @@
   <div class="navigation">
     <div class="main" v-if="qeihuan">
       <div class="top">
-        <span
+        <!-- <span
           v-for="name in topList"
           :key="name"
           :class="name == select ? 'select' : ''"
           @click="changeCard(name)"
         >
           {{ name }}
-        </span>
+        </span> -->
       </div>
       <div class="bottom">
         <a-input-search
@@ -154,6 +154,7 @@
   import { ref } from 'vue'
   import { useRouter } from 'vue-router'
   import { useStore } from 'vuex'
+  import { message } from 'ant-design-vue'
   const store = useStore()
   const router = useRouter()
   const topList = ref([
@@ -279,6 +280,7 @@
   }
   const mohuchaxun = ref('组件服务')
   function onSearch() {
+    if (text.value) {
       snum.value.str = text.value
       console.log('===================>', text.value)
       store.commit('home/selectCardsData', snum.value)
@@ -286,6 +288,9 @@
         path: '/DetailsPageconetent',
         query: snum.value,
       })
+    } else {
+      message.warning('请输入查询内容！')
+    }
     // router.push({ path: '/DetailsPageconetent' })
   }
 </script>
@@ -303,7 +308,7 @@
     .main {
       width: 8.8rem;
       height: 1.48rem;
-      background: rgba(255, 255, 255, 0.18);
+      // background: rgba(255, 255, 255, 0.18);
       padding: 0.2rem 0.4rem;
       border-radius: 0.02rem;
       .top {