搜索热词
This commit is contained in:
parent
4f7f4b658d
commit
d755f2a60e
|
|
@ -21,6 +21,7 @@
|
|||
"file-saver": "^2.0.5",
|
||||
"force": "^0.0.3",
|
||||
"js-base64": "^3.7.7",
|
||||
"lodash": "^4.17.21",
|
||||
"lodash-es": "^4.17.21",
|
||||
"mitt": "^3.0.1",
|
||||
"moment": "^2.29.4",
|
||||
|
|
@ -3390,9 +3391,8 @@
|
|||
},
|
||||
"node_modules/lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://repo.huaweicloud.com/repository/npm/lodash/-/lodash-4.17.21.tgz",
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
|
||||
"license": "MIT"
|
||||
"resolved": "https://registry.npmmirror.com/lodash/-/lodash-4.17.21.tgz",
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
|
||||
},
|
||||
"node_modules/lodash-es": {
|
||||
"version": "4.17.21",
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@
|
|||
"file-saver": "^2.0.5",
|
||||
"force": "^0.0.3",
|
||||
"js-base64": "^3.7.7",
|
||||
"lodash": "^4.17.21",
|
||||
"lodash-es": "^4.17.21",
|
||||
"mitt": "^3.0.1",
|
||||
"moment": "^2.29.4",
|
||||
|
|
|
|||
|
|
@ -37,3 +37,8 @@ export const apiGetCollect = (params = {}) => {
|
|||
export const loginNewApi = (data: any) => {
|
||||
return post('/auth/iwsLogin', data)
|
||||
}
|
||||
|
||||
// 热词查询
|
||||
export const getHotSearch = (data: any) => {
|
||||
return post('/material-mall/dev/list', data)
|
||||
}
|
||||
|
|
@ -1,10 +1,16 @@
|
|||
<script setup lang="ts">
|
||||
import { debounce } from 'lodash'
|
||||
import $bus from '@/utils/bus'
|
||||
import { mainStore } from 'store/main'
|
||||
import { useStore } from 'store/user'
|
||||
import { cartStore } from 'store/cart'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { getHotSearchListApi, getBookCarDetailsApi, getCompanyListApi } from 'http/api/home/index'
|
||||
import {
|
||||
getHotSearchListApi,
|
||||
getBookCarDetailsApi,
|
||||
getCompanyListApi,
|
||||
getHotSearch,
|
||||
} from 'http/api/home/index'
|
||||
import userClass from '../hooks/userClass'
|
||||
import {
|
||||
getUserInfo, //用户信息
|
||||
|
|
@ -387,6 +393,45 @@ const resetPhone = async () => {
|
|||
})
|
||||
}
|
||||
|
||||
const hotWordList = ref<any[]>([])
|
||||
// 输入框值改变
|
||||
const changeInputValue = debounce(async () => {
|
||||
// console.log('🚀 ~ changeInputValue ~ keywordIptValue.value:', keywordIptValue.value)
|
||||
if (!keywordIptValue.value) {
|
||||
hotWordList.value = []
|
||||
return
|
||||
}
|
||||
// 这里调用接口
|
||||
try {
|
||||
const params = {
|
||||
deviceName: keywordIptValue.value,
|
||||
maStatus: 2,
|
||||
}
|
||||
const res: any = await getHotSearch(params)
|
||||
// console.log('🚀 ~ changeInputValue ~ res:', res)
|
||||
// 取前5个
|
||||
const arr = res.data.rows.filter((item: any, index: number, self: any) => {
|
||||
return self.findIndex((e: any) => e.deviceName === item.deviceName) === index
|
||||
})
|
||||
if (res.data.rows && res.data.rows.length > 5) {
|
||||
// 过滤掉 deviceName 重复的数据
|
||||
hotWordList.value = arr.slice(0, 5)
|
||||
} else {
|
||||
hotWordList.value = arr
|
||||
}
|
||||
// console.log('🚀 ~ changeInputValue ~ hotWordList.value:', hotWordList.value)
|
||||
} catch (error) {
|
||||
console.log('🚀 ~ changeInputValue ~ error:', error)
|
||||
hotWordList.value = []
|
||||
}
|
||||
}, 500)
|
||||
|
||||
// 点击热词
|
||||
const onHotWord = (item: any) => {
|
||||
// console.log('🚀 ~ onHotWord ~ e:', item.deviceName)
|
||||
keywordIptValue.value = item.deviceName
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (tokenNew) {
|
||||
getUserListData()
|
||||
|
|
@ -427,7 +472,14 @@ onMounted(() => {
|
|||
|
||||
<div class="header-item" v-if="isShowLogout">
|
||||
<a @click="onJumpMessage" v-if="!form.msgNum || form.msgNum == 0">消息</a>
|
||||
<el-badge v-else :value="form.msgNum ? Number(form.msgNum) : ''" :max="99" @click="onJumpMessage" style="margin: 0 10px;">消息</el-badge>
|
||||
<el-badge
|
||||
v-else
|
||||
:value="form.msgNum ? Number(form.msgNum) : ''"
|
||||
:max="99"
|
||||
@click="onJumpMessage"
|
||||
style="margin: 0 10px"
|
||||
>消息</el-badge
|
||||
>
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<div class="header-item" v-if="isShowLogout">
|
||||
|
|
@ -467,6 +519,7 @@ onMounted(() => {
|
|||
placeholderText =
|
||||
searchTypeName === '装备' ? '搜索装备关键词' : '搜索需求关键词'
|
||||
"
|
||||
@input="changeInputValue"
|
||||
/>
|
||||
<button class="search-btn" @click="searchKeywordBtn">搜索</button>
|
||||
<div
|
||||
|
|
@ -505,6 +558,17 @@ onMounted(() => {
|
|||
需求
|
||||
</div>
|
||||
</div>
|
||||
<!-- 热词 -->
|
||||
<div class="hot-word">
|
||||
<span
|
||||
v-for="(item, index) in hotWordList"
|
||||
:key="index"
|
||||
@click="onHotWord(item)"
|
||||
style="margin-right: 10px; cursor: pointer"
|
||||
>
|
||||
{{ item.deviceName }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cart-container">
|
||||
<div class="cart-icon" @click="onCarts">
|
||||
|
|
@ -758,6 +822,13 @@ onMounted(() => {
|
|||
// width: 1000px;
|
||||
// margin-left: 40px;
|
||||
|
||||
.hot-word {
|
||||
margin: 15px 0 0 10%;
|
||||
max-width: 80%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.left-check-box {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
|
|
|
|||
Loading…
Reference in New Issue