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

dynamic tab type

Browse Source
This commit is contained in:
Peter Olu 2022-05-10 05:19:05 +01:00
parent edf2e0f307
commit 4127378f84
3 changed files with 16 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/store/modules/dashboard.ts
View File

@ -212,7 +212,7 @@ export const dashboardStore = defineStore({
setCurrentTabItems(items: LayoutConfig[]) { setCurrentTabItems(items: LayoutConfig[]) {
this.currentTabItems = items; this.currentTabItems = items;
}, },
setCurrentTabName(name: string) { setCurrentTabType(name: string) {
this.currentTabName = name this.currentTabName = name
}, },
removeTab(item: LayoutConfig) { removeTab(item: LayoutConfig) {

8
src/views/dashboard/controls/Tab.vue
View File

@ -19,7 +19,7 @@ limitations under the License. -->
v-for="(child, idx) in data.children || []" v-for="(child, idx) in data.children || []"
:key="idx" :key="idx"
:class="{ active: activeTabIndex === idx }" :class="{ active: activeTabIndex === idx }"
@click="clickTabs($event, idx, child.name, child)" @click="clickTabs($event, idx, child)"
> >
<input <input
@click="editTabName($event, idx)" @click="editTabName($event, idx)"
@ -266,9 +266,9 @@ export default defineComponent({
} }
); );
function clickTabs(e: Event, idx: number, currentTabName:string, extra:any) { function clickTabs(e: Event, idx: number, extra:any) {
e.stopPropagation(); e.stopPropagation();
console.log(currentTabName, extra) console.log(extra.children[0].type)
activeTabIndex.value = idx; activeTabIndex.value = idx;
dashboardStore.activeGridItem(props.data.i); dashboardStore.activeGridItem(props.data.i);
dashboardStore.selectWidget(props.data); dashboardStore.selectWidget(props.data);
@ -279,7 +279,7 @@ export default defineComponent({
dashboardStore.setCurrentTabItems( dashboardStore.setCurrentTabItems(
dashboardStore.layout[l].children[activeTabIndex.value].children dashboardStore.layout[l].children[activeTabIndex.value].children
); );
dashboardStore.setCurrentTabName(currentTabName) dashboardStore.setCurrentTabType(extra.children[0].type)
needQuery.value = true; needQuery.value = true;
} }
function removeTab(e: Event) { function removeTab(e: Event) {

21
src/views/dashboard/panel/Tool.vue
View File

@ -56,7 +56,10 @@ limitations under the License. -->
<Icon iconSize="sm" iconName="cancel" /> <Icon iconSize="sm" iconName="cancel" />
</el-button> </el-button>
</div> </div>
<div class="selectors-item" v-if="(key === 3 || key === 4 ) && currentTraceView === 'traceList' " > <div
class="selectors-item"
v-if="(key === 3 || key === 4) && currentTraceView === 'traceList'"
>
<el-tooltip <el-tooltip
v-if="!selectedSelector.length || selectedSelector === '$endpoint'" v-if="!selectedSelector.length || selectedSelector === '$endpoint'"
class="box-item" class="box-item"
@ -191,9 +194,9 @@ import { useRoute, useRouter } from "vue-router";
import { useDashboardStore } from "@/store/modules/dashboard"; import { useDashboardStore } from "@/store/modules/dashboard";
import { useAppStoreWithOut } from "@/store/modules/app"; import { useAppStoreWithOut } from "@/store/modules/app";
import { useTraceStore } from "@/store/modules/trace"; import { useTraceStore } from "@/store/modules/trace";
onMounted(() =>{ onMounted(() => {
console.log(dashboardStore.layout,dashboardStore.currentDashboard) console.log(dashboardStore.layout, dashboardStore.currentDashboard);
}) });
import { import {
EntityType, EntityType,
AllTools, AllTools,
@ -217,13 +220,9 @@ const appStore = useAppStoreWithOut();
const traceStore = useTraceStore(); const traceStore = useTraceStore();
const params = useRoute().params; const params = useRoute().params;
const selectedSelector = ref<string>(""); const selectedSelector = ref<string>("");
const showFilter = computed( const showFilter = computed(() => dashboardStore.currentTabName === "Trace");
() => dashboardStore.layout[0]?.activedTabIndex === 2 const showLogHeader = computed(() => dashboardStore.currentTabName === "Log");
); const currentTraceView = computed(() => traceStore.currentView);
const showLogHeader = computed(
() => dashboardStore.layout[0]?.activedTabIndex === 3
);
const currentTraceView = computed(() => traceStore.currentView)
const { query } = useRoute(); const { query } = useRoute();
dashboardStore.setViewMode(query["fullview"] === "true"); dashboardStore.setViewMode(query["fullview"] === "true");