update console/logs page opacity

This commit is contained in:
arabcoders 2025-04-06 01:21:34 +03:00
parent 0881fce2ab
commit 2fedc6d018
2 changed files with 19 additions and 1 deletions

View file

@ -58,6 +58,7 @@
import "@xterm/xterm/css/xterm.css"
import { Terminal } from "@xterm/xterm"
import { FitAddon } from "@xterm/addon-fit"
import { useStorage } from '@vueuse/core'
const terminal = ref()
const terminalFit = ref()
@ -67,6 +68,8 @@ const command_input = ref()
const isLoading = ref(false)
const config = useConfigStore()
const socket = useSocketStore()
const bg_enable = useStorage('random_bg', true)
const bg_opacity = useStorage('random_bg_opacity', 0.85)
watch(() => isLoading.value, async value => {
if (value) {
@ -185,11 +188,17 @@ onMounted(async () => {
socket.off('cli_output', writer)
socket.on('cli_close', loader)
socket.on('cli_output', writer)
if (bg_enable.value) {
document.querySelector('body').setAttribute("style", `opacity: 1.0`)
}
})
onUnmounted(() => {
socket.off('cli_close', loader)
socket.off('cli_output', writer)
window.removeEventListener('resize', reSizeTerminal)
if (bg_enable.value) {
document.querySelector('body').setAttribute("style", `opacity: ${bg_opacity.value}`)
}
});
</script>

View file

@ -97,6 +97,7 @@ div.logbox pre {
import moment from 'moment'
import { request } from '~/utils/index'
import { ref, onMounted, nextTick } from 'vue'
import { useStorage } from '@vueuse/core'
let scrollTimeout = null
@ -113,6 +114,8 @@ const logContainer = ref(null)
const bottomMarker = ref(null)
const autoScroll = ref(true)
const textWrap = ref(true)
const bg_enable = useStorage('random_bg', true)
const bg_opacity = useStorage('random_bg_opacity', 0.85)
const query = ref(useRoute().query.filter ?? '')
const toggleFilter = ref(false)
@ -254,19 +257,25 @@ onMounted(async () => {
bottomMarker.value.scrollIntoView({ behavior: 'smooth' })
}
})
})
if (bg_enable.value) {
document.querySelector('body').setAttribute("style", `opacity: 1.0`)
}
})
onUnmounted(() => {
socket.emit('unsubscribe', 'log_lines')
socket.off('log_lines')
if (bg_enable.value) {
document.querySelector('body').setAttribute("style", `opacity: ${bg_opacity.value}`)
}
})
onBeforeUnmount(() => {
socket.emit('unsubscribe', 'log_lines')
socket.off('log_lines')
if (scrollTimeout) clearTimeout(scrollTimeout)
})
useHead({ title: 'Logs' })