github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-14 09:00:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

fixies to showall/hideall functionality and divider

Browse Source
This commit is contained in:
Peter Olu 2022-06-08 13:00:02 +01:00
parent c7bf58ff56
commit e889fbda5c
2 changed files with 7 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/types/components.d.ts vendored
View File

@ -11,6 +11,7 @@ declare module '@vue/runtime-core' {
ElCollapse: typeof import('element-plus/es')['ElCollapse'] ElCollapse: typeof import('element-plus/es')['ElCollapse']
ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem'] ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem']
ElDialog: typeof import('element-plus/es')['ElDialog'] ElDialog: typeof import('element-plus/es')['ElDialog']
ElDivider: typeof import('element-plus/es')['ElDivider']
ElDropdown: typeof import('element-plus/es')['ElDropdown'] ElDropdown: typeof import('element-plus/es')['ElDropdown']
ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem'] ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu'] ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']

25
src/views/dashboard/related/log/Header.vue
View File

@ -15,7 +15,6 @@ limitations under the License. -->
<template> <template>
<div class="flex-h log-wrapper"> <div class="flex-h log-wrapper">
<div v-if="currentSearchTerm === 'column'" class="flex-h items-center mr-5"> <div v-if="currentSearchTerm === 'column'" class="flex-h items-center mr-5">
<!-- <p style="margin-right: 10px">Select visible columns</p> -->
<el-dropdown class="dark" :hide-on-click="false"> <el-dropdown class="dark" :hide-on-click="false">
<span class="cursor-pointer"> <span class="cursor-pointer">
Select visible columns<el-icon class="el-icon--right" Select visible columns<el-icon class="el-icon--right"
@ -28,7 +27,7 @@ limitations under the License. -->
<div <div
style="width: 100%" style="width: 100%"
class="flex-h items-center justify-between" class="flex-h items-center justify-between"
@click="showAllColumns = true" @click="logStore.toggleAllColumns(true)"
> >
<el-icon><View /></el-icon> <el-icon><View /></el-icon>
<span style="margin-right: 10px">Show All</span> <span style="margin-right: 10px">Show All</span>
@ -38,13 +37,13 @@ limitations under the License. -->
<div <div
style="width: 100%" style="width: 100%"
class="flex-h items-center justify-between" class="flex-h items-center justify-between"
@click="showAllColumns = false" @click="logStore.toggleAllColumns(false)"
> >
<el-icon><Hide /></el-icon> <el-icon><Hide /></el-icon>
<span style="margin-right: 10px">Hide All</span> <span style="margin-right: 10px">Hide All</span>
</div> </div>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item divided></el-dropdown-item> <el-divider />
<el-dropdown-item <el-dropdown-item
v-for="item in logStore.serviceLogColumn" v-for="item in logStore.serviceLogColumn"
:key="item.value" :key="item.value"
@ -52,13 +51,6 @@ limitations under the License. -->
<el-checkbox class="custom-checkbox" v-model="item.isVisible"> <el-checkbox class="custom-checkbox" v-model="item.isVisible">
<span>{{ item.value }}</span> <span>{{ item.value }}</span>
</el-checkbox> </el-checkbox>
<!-- <div
style="width: 100%"
class="flex-h items-center justify-between"
>
<span style="margin-right: 10px">{{ t(item.value) }}</span>
<el-checkbox v-model="item.isVisible" size="large" />
</div> -->
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
@ -289,9 +281,7 @@ const selectorStore = useSelectorStore();
const dashboardStore = useDashboardStore(); const dashboardStore = useDashboardStore();
const { portal } = useRoute().query; const { portal } = useRoute().query;
const logStore = useLogStore(); const logStore = useLogStore();
const selectedColumns = ref<any[]>([]);
const showColumList = ref<boolean>(false); const showColumList = ref<boolean>(false);
const showAllColumns = ref<boolean | null>(null);
const traceId = ref<string>(""); const traceId = ref<string>("");
const keywordsOfContent = ref<string[]>([]); const keywordsOfContent = ref<string[]>([]);
const excludingKeywordsOfContent = ref<string[]>([]); const excludingKeywordsOfContent = ref<string[]>([]);
@ -628,12 +618,6 @@ watch(
} }
} }
); );
watch(
() => showAllColumns.value,
(newVal, oldVal) => {
logStore.toggleAllColumns(newVal);
}
);
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.dropdownSelector { .dropdownSelector {
@ -645,6 +629,9 @@ watch(
display: flex; display: flex;
align-items: center; align-items: center;
} }
.el-divider--horizontal{
margin: 10px 0 0 0 !important;
}
.cursor-pointer { .cursor-pointer {
cursor: pointer; cursor: pointer;
} }