ceda_ei/source-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Handle >100 search results

Browse Source
This commit is contained in:
Ceda EI 2025-05-03 09:22:06 +05:30
parent 98a5cf7c50
commit 68f1c516b8
1 changed files with 23 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
frontend/src/views/LogView.vue
View File

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