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

fix: correct services and instances when changing page numbers (#409)

Browse Source
This commit is contained in:
Fine0830 2024-08-16 10:52:52 +08:00 committed by GitHub
parent 3c8b316b76
commit d9f819d143
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 24 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/views/dashboard/graphs/InstanceList.vue
View File

@ -67,8 +67,9 @@ limitations under the License. -->
<el-pagination <el-pagination
class="pagination flex-h" class="pagination flex-h"
layout="prev, pager, next" layout="prev, pager, next"
:current-page="currentPage"
:page-size="pageSize" :page-size="pageSize"
:total="pods.length" :total="searchText ? pods.filter((d: any) => d.label.includes(searchText)).length : pods.length"
@current-change="changePage" @current-change="changePage"
@prev-click="changePage" @prev-click="changePage"
@next-click="changePage" @next-click="changePage"
@ -122,6 +123,7 @@ limitations under the License. -->
const dashboardStore = useDashboardStore(); const dashboardStore = useDashboardStore();
const chartLoading = ref<boolean>(false); const chartLoading = ref<boolean>(false);
const instances = ref<Instance[]>([]); // current instances const instances = ref<Instance[]>([]); // current instances
const currentPage = ref<number>(1);
const pageSize = 10; const pageSize = 10;
const searchText = ref<string>(""); const searchText = ref<string>("");
const colMetrics = ref<string[]>([]); const colMetrics = ref<string[]>([]);
@ -213,18 +215,22 @@ limitations under the License. -->
} }
function changePage(pageIndex: number) { function changePage(pageIndex: number) {
instances.value = pods.value.filter((d: unknown, index: number) => { let podList = pods.value;
if (index >= (pageIndex - 1) * pageSize && index < pageIndex * pageSize) { if (searchText.value) {
return d; podList = pods.value.filter((d: { label: string }) => d.label.includes(searchText.value));
} }
}); instances.value = podList.filter(
(_, index: number) => index >= (pageIndex - 1) * pageSize && index < pageIndex * pageSize,
);
queryInstanceMetrics(instances.value); queryInstanceMetrics(instances.value);
currentPage.value = pageIndex;
} }
function searchList() { function searchList() {
const searchInstances = pods.value.filter((d: { label: string }) => d.label.includes(searchText.value)); const searchInstances = pods.value.filter((d: { label: string }) => d.label.includes(searchText.value));
instances.value = searchInstances.filter((d: unknown, index: number) => index < pageSize); instances.value = searchInstances.filter((_, index: number) => index < pageSize);
queryInstanceMetrics(instances.value); queryInstanceMetrics(instances.value);
currentPage.value = 1;
} }
watch( watch(

14
src/views/dashboard/graphs/ServiceList.vue
View File

@ -60,8 +60,9 @@ limitations under the License. -->
<el-pagination <el-pagination
class="pagination flex-h" class="pagination flex-h"
layout="prev, pager, next" layout="prev, pager, next"
:current-page="currentPage"
:page-size="pageSize" :page-size="pageSize"
:total="selectorStore.services.length" :total="searchText ? sortServices.filter((d: any) => d.label.includes(searchText)).length : sortServices.length"
@current-change="changePage" @current-change="changePage"
@prev-click="changePage" @prev-click="changePage"
@next-click="changePage" @next-click="changePage"
@ -112,6 +113,7 @@ limitations under the License. -->
const dashboardStore = useDashboardStore(); const dashboardStore = useDashboardStore();
const appStore = useAppStoreWithOut(); const appStore = useAppStoreWithOut();
const chartLoading = ref<boolean>(false); const chartLoading = ref<boolean>(false);
const currentPage = ref<number>(1);
const pageSize = 10; const pageSize = 10;
const services = ref<Service[]>([]); const services = ref<Service[]>([]);
const colMetrics = ref<string[]>([]); const colMetrics = ref<string[]>([]);
@ -248,18 +250,24 @@ limitations under the License. -->
return { rowspan: groups.value[param.row.group], colspan: 1 }; return { rowspan: groups.value[param.row.group], colspan: 1 };
} }
function changePage(pageIndex: number) { function changePage(pageIndex: number) {
const arr = sortServices.value.filter((d: Service, index: number) => { let services = sortServices.value;
if (searchText.value) {
services = sortServices.value.filter((d: { label: string }) => d.label.includes(searchText.value));
}
const arr = services.filter((d: Service, index: number) => {
if (index >= (pageIndex - 1) * pageSize && index < pageSize * pageIndex) { if (index >= (pageIndex - 1) * pageSize && index < pageSize * pageIndex) {
return d; return d;
} }
}); });
setServices(arr); setServices(arr);
currentPage.value = pageIndex;
} }
function searchList() { function searchList() {
const searchServices = sortServices.value.filter((d: { label: string }) => d.label.includes(searchText.value)); const searchServices = sortServices.value.filter((d: { label: string }) => d.label.includes(searchText.value));
const services = searchServices.filter((d: unknown, index: number) => index < pageSize); const services = searchServices.filter((_, index: number) => index < pageSize);
setServices(services); setServices(services);
currentPage.value = 1;
} }
watch( watch(