update console/logs page opacity
This commit is contained in:
parent
0881fce2ab
commit
2fedc6d018
2 changed files with 19 additions and 1 deletions
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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' })
|
||||
|
|
|
|||
Loading…
Reference in a new issue