fix: update tab

This commit is contained in:
Qiuxia Fan 2022-03-04 13:08:46 +08:00
parent d71cd66fa1
commit a33fca1893
4 changed files with 11 additions and 6 deletions

View File

@ -190,7 +190,7 @@ export const dashboardStore = defineStore({
(d: LayoutConfig) => actived[0] === d.i (d: LayoutConfig) => actived[0] === d.i
); );
if (this.selectedGrid.i === item.i) { if (this.selectedGrid && this.selectedGrid.i === item.i) {
this.selectedGrid = null; this.selectedGrid = null;
} }
if (actived.length === 3) { if (actived.length === 3) {

View File

@ -50,7 +50,7 @@ limitations under the License. -->
</div> </div>
<div class="tab-layout"> <div class="tab-layout">
<grid-layout <grid-layout
v-if="dashboardStore.currentTabItems" v-if="dashboardStore.currentTabItems.length"
v-model:layout="dashboardStore.currentTabItems" v-model:layout="dashboardStore.currentTabItems"
:col-num="24" :col-num="24"
:row-height="10" :row-height="10"
@ -74,6 +74,7 @@ limitations under the License. -->
:is="item.type" :is="item.type"
:data="item" :data="item"
:activeIndex="`${data.i}-${activeTabIndex}-${item.i}`" :activeIndex="`${data.i}-${activeTabIndex}-${item.i}`"
:needQuery="needQuery"
/> />
</grid-item> </grid-item>
</grid-layout> </grid-layout>
@ -106,6 +107,7 @@ export default defineComponent({
const activeTabIndex = ref<number>(0); const activeTabIndex = ref<number>(0);
const activeTabWidget = ref<string>(""); const activeTabWidget = ref<string>("");
const editTabIndex = ref<number>(NaN); // edit tab item name const editTabIndex = ref<number>(NaN); // edit tab item name
const needQuery = ref<boolean>(false);
const l = dashboardStore.layout.findIndex( const l = dashboardStore.layout.findIndex(
(d: LayoutConfig) => d.i === props.data.i (d: LayoutConfig) => d.i === props.data.i
); );
@ -125,6 +127,7 @@ export default defineComponent({
dashboardStore.setCurrentTabItems( dashboardStore.setCurrentTabItems(
dashboardStore.layout[l].children[activeTabIndex.value].children dashboardStore.layout[l].children[activeTabIndex.value].children
); );
needQuery.value = true;
} }
function removeTab(e: Event) { function removeTab(e: Event) {
e.stopPropagation(); e.stopPropagation();
@ -191,6 +194,7 @@ export default defineComponent({
dashboardStore, dashboardStore,
activeTabIndex, activeTabIndex,
editTabIndex, editTabIndex,
needQuery,
}; };
}, },
}); });

View File

@ -77,6 +77,7 @@ const props = {
default: () => ({ widget: {} }), default: () => ({ widget: {} }),
}, },
activeIndex: { type: String, default: "" }, activeIndex: { type: String, default: "" },
needQuery: { type: Boolean, default: false },
}; };
export default defineComponent({ export default defineComponent({
name: "Widget", name: "Widget",
@ -93,7 +94,7 @@ export default defineComponent({
const dashboardStore = useDashboardStore(); const dashboardStore = useDashboardStore();
const selectorStore = useSelectorStore(); const selectorStore = useSelectorStore();
if (dashboardStore.entity === EntityType[1].value) { if (dashboardStore.entity === EntityType[1].value || props.needQuery) {
queryMetrics(); queryMetrics();
} }

View File

@ -65,8 +65,8 @@ function loadTrees(l: boolean) {
} }
.thread-stack { .thread-stack {
padding: 5px 12px; padding: 5px;
height: calc(50% - 50px); height: calc(50% - 20px);
overflow: auto; overflow: auto;
width: 100%; width: 100%;
} }
@ -75,6 +75,6 @@ function loadTrees(l: boolean) {
text-align: center; text-align: center;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
height: calc(50% - 50px); height: calc(50% - 20px);
} }
</style> </style>