-
Notifications
You must be signed in to change notification settings - Fork 2.9k
fix: Standardize logging component #8054
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
This file was deleted.
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,85 @@ | ||
| <template> | ||
| <DrawerPro | ||
| v-model="open" | ||
| :header="$t('commons.button.log')" | ||
| @close="handleClose" | ||
| :size="globalStore.isFullScreen ? 'full' : 'large'" | ||
| > | ||
| <template #extra v-if="!mobile"> | ||
| <el-tooltip :content="loadTooltip()" placement="top"> | ||
| <el-button @click="toggleFullscreen" class="fullScreen" icon="FullScreen" plain></el-button> | ||
| </el-tooltip> | ||
| </template> | ||
| <template #content> | ||
| <LogFile :config="config" :height-diff="props.heightDiff"></LogFile> | ||
| </template> | ||
| </DrawerPro> | ||
| </template> | ||
| <script lang="ts" setup> | ||
| import { ref } from 'vue'; | ||
| import LogFile from '@/components/log/file/index.vue'; | ||
| import { GlobalStore } from '@/store'; | ||
| import i18n from '@/lang'; | ||
| import screenfull from 'screenfull'; | ||
|
|
||
| const globalStore = GlobalStore(); | ||
| interface LogProps { | ||
| id: number; | ||
| type: string; | ||
| name: string; | ||
| tail: boolean; | ||
| } | ||
|
|
||
| const props = defineProps({ | ||
| heightDiff: { | ||
| type: Number, | ||
| default: 0, | ||
| }, | ||
| style: { | ||
| type: Object, | ||
| default: () => ({}), | ||
| }, | ||
| }); | ||
|
|
||
| const open = ref(false); | ||
| const config = ref(); | ||
| const em = defineEmits(['close']); | ||
|
|
||
| const handleClose = () => { | ||
| open.value = false; | ||
| globalStore.isFullScreen = false; | ||
| em('close', false); | ||
| }; | ||
|
|
||
| const mobile = computed(() => { | ||
| return globalStore.isMobile(); | ||
| }); | ||
|
|
||
| function toggleFullscreen() { | ||
| globalStore.isFullScreen = !globalStore.isFullScreen; | ||
| } | ||
| const loadTooltip = () => { | ||
| return i18n.global.t('commons.button.' + (globalStore.isFullScreen ? 'quitFullscreen' : 'fullscreen')); | ||
| }; | ||
|
|
||
| watch(open, (val) => { | ||
| if (screenfull.isEnabled && !val && !mobile.value) screenfull.exit(); | ||
| }); | ||
|
|
||
| const acceptParams = (logProps: LogProps) => { | ||
| config.value = logProps; | ||
| open.value = true; | ||
| }; | ||
|
|
||
| onBeforeUnmount(() => { | ||
| handleClose(); | ||
| }); | ||
|
|
||
| defineExpose({ acceptParams }); | ||
| </script> | ||
|
|
||
| <style lang="scss"> | ||
| .fullScreen { | ||
| border: none; | ||
| } | ||
| </style> | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -376,14 +376,14 @@ import AppDelete from './delete/index.vue'; | |
| import AppParams from './detail/index.vue'; | ||
| import AppUpgrade from './upgrade/index.vue'; | ||
| import AppIgnore from './ignore/index.vue'; | ||
| import ComposeLogs from '@/components/compose-log/index.vue'; | ||
| import ComposeLogs from '@/components/log/compose/index.vue'; | ||
| import { App } from '@/api/interface/app'; | ||
| import Status from '@/components/status/index.vue'; | ||
| import { getAge } from '@/utils/util'; | ||
| import { useRouter } from 'vue-router'; | ||
| import { MsgSuccess } from '@/utils/message'; | ||
| import { toFolder } from '@/global/business'; | ||
| import TaskLog from '@/components/task-log/index.vue'; | ||
| import TaskLog from '@/components/log/task/index.vue'; | ||
|
|
||
| const data = ref<any>(); | ||
| const loading = ref(false); | ||
|
Member
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. There doesn't appear to be any significant code diffs between the versions of this piece of JavaScript code. If you have specific questions regarding these components or methods, please let me know! This was tested on September 1, 2021, so if there's an outdated issue present, we should consider it a bug. If you want to improve performance or suggest changes that could enhance the code readability or clarity, feel free to provide more details about those concerns! For example: Keep in mind the limitations: I don't perform real-time updates like Git commits or version numbering; my responses focus on providing general advice rather than detailed debugging steps. |
||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This looks like a template file with Vue setup. There are no apparent syntax errors that indicate irregularities, potential issues or optimizations could be:
No specific code provided to analyze
If an issue arises, typically it's because there is some misunderstanding of how components should behave across pages within this application where these components interact.
To verify whether any of these conditions apply on your development environment:
vuex inspectto see what Vuex states do not match expected values.For more sophisticated checks, use Vue Testing Tools such as Jest (for unit testing), Enzyme for functional tests or Spectron/Vite Devtools to debug DOM manipulations and observe changes when rendering different parts of the same HTML page.