Handle >100 search results
This commit is contained in:
parent
98a5cf7c50
commit
68f1c516b8
@ -54,7 +54,7 @@ async function getSection(start: number) {
|
||||
}
|
||||
|
||||
function getNextSection() {
|
||||
query.value = ""
|
||||
query.value = ''
|
||||
resetSearch()
|
||||
getSection(end.value).then((data) => {
|
||||
content.value = content.value + data.content
|
||||
@ -69,7 +69,7 @@ function getNextSection() {
|
||||
}
|
||||
|
||||
function getPreviousSection() {
|
||||
query.value = ""
|
||||
query.value = ''
|
||||
resetSearch()
|
||||
if (start.value) {
|
||||
getSection(start.value - size).then((data) => {
|
||||
@ -97,18 +97,20 @@ async function getNthByte(n) {
|
||||
totalSize.value = data.total
|
||||
}
|
||||
|
||||
async function search() {
|
||||
async function search(startOffset) {
|
||||
const params = new URLSearchParams()
|
||||
params.append('query', query.value)
|
||||
params.append('start', startOffset)
|
||||
const response = await fetch(`/api/log/${route.params.name}/search/?${params}`)
|
||||
return await response.json()
|
||||
}
|
||||
|
||||
function searchAndHighlight() {
|
||||
search().then((data) => {
|
||||
function searchAndHighlight(startOffset = 0) {
|
||||
search(startOffset).then((data) => {
|
||||
searched.value = true
|
||||
searchResults.matches = data.matches
|
||||
searchResults.count = data.matches.length > 99 ? '99+' : data.matches.length.toString()
|
||||
searchResults.current = -1
|
||||
moveSearchResult(1)
|
||||
})
|
||||
}
|
||||
@ -140,23 +142,22 @@ function findError() {
|
||||
getNextSection()
|
||||
|
||||
function convertBytes(bytes) {
|
||||
const suffixes = ["bytes", "KiB", "MiB", "GiB"];
|
||||
const suffixes = ['bytes', 'KiB', 'MiB', 'GiB']
|
||||
for (let suffix of suffixes) {
|
||||
if (bytes < 1024)
|
||||
return `${bytes.toFixed(2).replace(/\.?0*$/,'')} ${suffix}`
|
||||
bytes /= 1024;
|
||||
if (bytes < 1024) return `${bytes.toFixed(2).replace(/\.?0*$/, '')} ${suffix}`
|
||||
bytes /= 1024
|
||||
}
|
||||
return `${bytes.toFixed(2).replace(/\.?0*$/,'')} TiB`
|
||||
return `${bytes.toFixed(2).replace(/\.?0*$/, '')} TiB`
|
||||
}
|
||||
|
||||
const dataSkipped = computed(() => convertBytes(start.value))
|
||||
const dataLeft = computed(() => convertBytes(totalSize.value - end.value))
|
||||
|
||||
const highlighter = await createHighlighterCore({
|
||||
langs: [bash],
|
||||
themes: [catppuccinLatte],
|
||||
engine: createJavaScriptRegexEngine(),
|
||||
});
|
||||
langs: [bash],
|
||||
themes: [catppuccinLatte],
|
||||
engine: createJavaScriptRegexEngine(),
|
||||
})
|
||||
|
||||
// Add ellipsis to start or end if there is more content available
|
||||
const displayedContent = computed(() => {
|
||||
@ -182,9 +183,8 @@ const displayedContent = computed(() => {
|
||||
lang: 'bash',
|
||||
theme: 'catppuccin-latte',
|
||||
decorations,
|
||||
})
|
||||
})
|
||||
}, '')
|
||||
|
||||
</script>
|
||||
|
||||
<script></script>
|
||||
@ -202,6 +202,13 @@ const displayedContent = computed(() => {
|
||||
Previous
|
||||
</button>
|
||||
<button
|
||||
v-if="searchResults.current === 98 && searchResults.matches.length === 100"
|
||||
@click="searchAndHighlight(searchResults.matches[99])"
|
||||
>
|
||||
Search More
|
||||
</button>
|
||||
<button
|
||||
v-else
|
||||
:disabled="searchResults.current >= searchResults.matches.length - 1"
|
||||
@click="moveSearchResult(1)"
|
||||
type="button"
|
||||
|
Loading…
x
Reference in New Issue
Block a user