fix: optimize widgets (#111)

This commit is contained in:
Fine0830 2022-06-16 15:19:17 +08:00 committed by GitHub
parent 4c762a2458
commit 2be0a84d48
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 9 deletions

View File

@ -53,6 +53,12 @@ export const logStore = defineStore({
setLogCondition(data: any) { setLogCondition(data: any) {
this.conditions = { ...this.conditions, ...data }; this.conditions = { ...this.conditions, ...data };
}, },
resetCondition() {
this.conditions = {
queryDuration: useAppStoreWithOut().durationTime,
paging: { pageNum: 1, pageSize: 15 },
};
},
async getServices(layer: string) { async getServices(layer: string) {
const res: AxiosResponse = await graphql.query("queryServices").params({ const res: AxiosResponse = await graphql.query("queryServices").params({
layer, layer,

View File

@ -17,7 +17,9 @@ limitations under the License. -->
<div class="log"> <div class="log">
<div <div
class="log-header" class="log-header"
:class="[type === 'browser' ? 'browser-header' : 'service-header']" :class="
type === 'browser' ? ['browser-header', 'flex-h'] : 'service-header'
"
> >
<template v-for="(item, index) in columns" :key="`col${index}`"> <template v-for="(item, index) in columns" :key="`col${index}`">
<div <div
@ -118,7 +120,7 @@ function setCurrentLog(log: any) {
.log-header div { .log-header div {
display: inline-block; display: inline-block;
padding: 0 4px; padding: 0 5px;
border: 1px solid transparent; border: 1px solid transparent;
border-right: 1px dotted silver; border-right: 1px dotted silver;
line-height: 30px; line-height: 30px;
@ -128,13 +130,15 @@ function setCurrentLog(log: any) {
white-space: nowrap; white-space: nowrap;
} }
.browser-header div { .browser-header {
min-width: 140px; div {
width: 10%; min-width: 140px;
} width: 10%;
}
div.max-item { .max-item {
width: 20%; width: 20%;
}
} }
.service-header div { .service-header div {

View File

@ -130,7 +130,7 @@ limitations under the License. -->
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, reactive, watch } from "vue"; import { ref, reactive, watch, onUnmounted } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { Option } from "@/types/app"; import { Option } from "@/types/app";
import { useLogStore } from "@/store/modules/log"; import { useLogStore } from "@/store/modules/log";
@ -323,6 +323,9 @@ function removeExcludeContent(index: number) {
}); });
excludingContentStr.value = ""; excludingContentStr.value = "";
} }
onUnmounted(() => {
logStore.resetCondition();
});
watch( watch(
() => selectorStore.currentService, () => selectorStore.currentService,
() => { () => {