diff --git a/src/components/advancedSearch/Index.vue b/src/components/advancedSearch/Index.vue
index f9e8c647..81a65291 100644
--- a/src/components/advancedSearch/Index.vue
+++ b/src/components/advancedSearch/Index.vue
@@ -129,7 +129,13 @@ export default {
enterListener (event) {
if (event.keyCode === 13) {
this.$refs.tagMode && this.$refs.tagMode.enterSearch()
- this.$refs.textMode && this.$refs.textMode.search()
+ const timer = setTimeout(() => {
+ // 如果回车是选择hint面板的值,则不进行搜索
+ if (this.$refs.textMode && !this.$refs.textMode.isHintEnter) {
+ this.$refs.textMode.search()
+ }
+ clearTimeout(timer)
+ }, 100)
}
}
},
diff --git a/src/components/advancedSearch/TextMode.vue b/src/components/advancedSearch/TextMode.vue
index 7c56bea6..5aed6786 100644
--- a/src/components/advancedSearch/TextMode.vue
+++ b/src/components/advancedSearch/TextMode.vue
@@ -44,6 +44,7 @@
@@ -86,7 +87,8 @@ export default {
hintVisible: false,
dataset: null,
CodeMirror,
- myUnitTestStr: this.unitTestStr
+ myUnitTestStr: this.unitTestStr,
+ isHintEnter: null
}
},
emits: ['changeMode', 'search'],
@@ -467,6 +469,9 @@ export default {
this.emitter.on('advanced-search', function () {
vm.search()
})
+ },
+ handleEnter (e) {
+ this.isHintEnter = e
}
},
watch: {
diff --git a/src/components/advancedSearch/showhint/Hint/Hint.vue b/src/components/advancedSearch/showhint/Hint/Hint.vue
index 262e492f..2d331b8d 100644
--- a/src/components/advancedSearch/showhint/Hint/Hint.vue
+++ b/src/components/advancedSearch/showhint/Hint/Hint.vue
@@ -3,7 +3,7 @@
-
+
@@ -29,6 +29,9 @@ export default {
methods: {
onSelect (item, index, hintList) {
this.$emit('select', item, index, hintList)
+ },
+ onKeydownEnter (e) {
+ this.$emit('keydownEnter', e)
}
}
}
diff --git a/src/components/advancedSearch/showhint/Hint/HintInfo.vue b/src/components/advancedSearch/showhint/Hint/HintInfo.vue
index c5154706..f3cf5ba3 100644
--- a/src/components/advancedSearch/showhint/Hint/HintInfo.vue
+++ b/src/components/advancedSearch/showhint/Hint/HintInfo.vue
@@ -1,10 +1,11 @@
-
+
- {{ item.displayText }}
@@ -26,7 +27,8 @@ export default {
data () {
return {
active: true,
- activeIndex: null
+ activeIndex: null,
+ currentIndex: -1
}
},
mounted () {
@@ -36,8 +38,94 @@ export default {
label: this.name,
vm: this
})
+ document.addEventListener('keydown', this.initKeyDown)
},
methods: {
+ initKeyDown (event) {
+ const dom = document.getElementById('myHint')
+ const vm = this
+ if (dom) {
+ // 检测方向键
+ switch (event.key) {
+ case 'Enter':
+ // eslint-disable-next-line no-case-declarations
+ const item = vm.hintList[vm.currentIndex]
+ if (item) {
+ this.$emit('keydownEnter', 'Enter')
+ vm.handleSelect(item, vm.currentIndex, vm.hintList)
+ vm.currentIndex = -1
+ } else {
+ this.$emit('keydownEnter', null)
+ }
+ break
+ case 'ArrowUp': // 上方向键
+ // 上方向键被按下时的操作
+ if ((vm.currentIndex <= vm.hintList.length - 1) && vm.currentIndex > 0) {
+ vm.currentIndex -= 1
+ } else {
+ vm.currentIndex = vm.hintList.length - 1
+ }
+ vm.hintList.forEach((e, index) => {
+ if (index === vm.currentIndex) {
+ let realIndex = index
+ if (e.type === 'abstract') {
+ realIndex -= 1
+ vm.currentIndex -= 1
+ }
+ const itemDom = document.getElementById('filterItem' + realIndex)
+ if (itemDom) {
+ itemDom.style.backgroundColor = 'var(--el-fill-color-dark)'
+ if (realIndex >= 10) {
+ dom.scrollTop = (realIndex - 10) * 26 + 16
+ } else {
+ dom.scrollTop = 0
+ }
+ }
+ } else {
+ const itemDom = document.getElementById('filterItem' + index)
+ if (itemDom) {
+ itemDom.style.backgroundColor = ''
+ }
+ }
+ })
+ break
+ case 'ArrowDown': // 下方向键
+ if (vm.currentIndex < vm.hintList.length - 1) {
+ vm.currentIndex += 1
+ } else {
+ vm.currentIndex = 0
+ }
+ vm.hintList.forEach((e, index) => {
+ if (index === vm.currentIndex) {
+ let realIndex = index
+ if (e.type === 'abstract') {
+ realIndex += 1
+ vm.currentIndex += 1
+ }
+ const itemDom = document.getElementById('filterItem' + realIndex)
+ if (itemDom) {
+ itemDom.style.backgroundColor = 'var(--el-fill-color-dark)'
+ if (realIndex >= 10) {
+ // 26是24的行高+2px的margin,16是两个标题总的margin
+ dom.scrollTop = (realIndex - 10) * 26 + 16
+ } else {
+ dom.scrollTop = 0
+ }
+ }
+ } else {
+ const itemDom = document.getElementById('filterItem' + index)
+ if (itemDom) {
+ itemDom.style.backgroundColor = ''
+ }
+ }
+ })
+ break
+ default:
+ // 其他按键的操作
+ break
+ }
+ }
+ },
scrollToView (index = 0) {
// 移动到可视区域
const li = this.$refs['hint_' + index][0]
@@ -96,7 +184,17 @@ export default {
const index = this.activeIndex || 0
const item = this.hintList[index]
this.$emit('select', item, index, this.hintList)
+ },
+ onMouseenter () {
+ const itemDom = document.getElementById('filterItem' + this.currentIndex)
+ if (itemDom) {
+ itemDom.style.backgroundColor = ''
+ this.currentIndex = -1
+ }
}
+ },
+ unmounted () {
+ document.removeEventListener('keydown', this.initKeyDown)
}
}