From 264860b7092e5fdc03cc1ac3b4efdacebc0bc8d7 Mon Sep 17 00:00:00 2001
From: Qiuxia Fan <fine0830@outlook.com>
Date: Tue, 29 Mar 2022 18:56:59 +0800
Subject: [PATCH] fix service list

---
 src/views/dashboard/graphs/EndpointList.vue |  9 +++--
 src/views/dashboard/graphs/InstanceList.vue |  9 +++--
 src/views/dashboard/graphs/ServiceList.vue  | 43 ++++++++++++++-------
 3 files changed, 39 insertions(+), 22 deletions(-)

diff --git a/src/views/dashboard/graphs/EndpointList.vue b/src/views/dashboard/graphs/EndpointList.vue
index b26e06ed..fe08b8e0 100644
--- a/src/views/dashboard/graphs/EndpointList.vue
+++ b/src/views/dashboard/graphs/EndpointList.vue
@@ -181,10 +181,11 @@ function clickEndpoint(scope: any) {
   );
 }
 function changePage(pageIndex: number) {
-  endpoints.value = selectorStore.pods.filter(
-    (d: unknown, index: number) =>
-      index >= (pageIndex - 1) * pageSize && index < pageIndex * pageSize
-  );
+  endpoints.value = selectorStore.pods.filter((d: unknown, index: number) => {
+    if (index >= (pageIndex - 1) * pageSize && index < pageIndex * pageSize) {
+      return d;
+    }
+  });
   queryEndpointMetrics(endpoints.value);
 }
 async function searchList() {
diff --git a/src/views/dashboard/graphs/InstanceList.vue b/src/views/dashboard/graphs/InstanceList.vue
index 4ef3d024..ff608a63 100644
--- a/src/views/dashboard/graphs/InstanceList.vue
+++ b/src/views/dashboard/graphs/InstanceList.vue
@@ -208,10 +208,11 @@ function clickInstance(scope: any) {
 }
 
 function changePage(pageIndex: number) {
-  instances.value = selectorStore.pods.filter(
-    (d: unknown, index: number) =>
-      index >= (pageIndex - 1) * pageSize && index < pageIndex * pageSize
-  );
+  instances.value = selectorStore.pods.filter((d: unknown, index: number) => {
+    if (index >= (pageIndex - 1) * pageSize && index < pageIndex * pageSize) {
+      return d;
+    }
+  });
   queryInstanceMetrics(instances.value);
 }
 
diff --git a/src/views/dashboard/graphs/ServiceList.vue b/src/views/dashboard/graphs/ServiceList.vue
index 9958d9bb..eae2ffe3 100644
--- a/src/views/dashboard/graphs/ServiceList.vue
+++ b/src/views/dashboard/graphs/ServiceList.vue
@@ -144,8 +144,21 @@ async function queryServices() {
   if (resp.errors) {
     ElMessage.error(resp.errors);
   }
-  setServices(selectorStore.services);
-  queryServiceMetrics(services.value);
+  sortServices.value = selectorStore.services.sort((a: any, b: any) => {
+    const nameA = a.group.toUpperCase();
+    const nameB = b.group.toUpperCase();
+    if (nameA < nameB) {
+      return -1;
+    }
+    if (nameA > nameB) {
+      return 1;
+    }
+    return 0;
+  });
+  const s = sortServices.value.filter(
+    (d: Service, index: number) => index < pageSize
+  );
+  setServices(s);
 }
 
 function setServices(arr: (Service & { merge: boolean })[]) {
@@ -164,23 +177,19 @@ function setServices(arr: (Service & { merge: boolean })[]) {
     },
     {}
   );
-  sortServices.value = Object.values(map).flat(1);
+  const list = Object.values(map).flat(1);
   const obj = {} as any;
-  for (const s of sortServices.value) {
+  for (const s of list) {
     s.group = s.group || "";
     if (!obj[s.group]) {
       obj[s.group] = 1;
     } else {
-      if (obj[s.group] % 5 === 0) {
-        s.merge = false;
-      }
       obj[s.group]++;
     }
     groups.value[s.group] = obj[s.group];
   }
-  services.value = sortServices.value.filter(
-    (d: Service, index: number) => index < pageSize
-  );
+  services.value = list;
+  queryServiceMetrics(services.value);
 }
 
 function clickService(scope: any) {
@@ -240,16 +249,22 @@ function objectSpanMethod(param: any): any {
   return { rowspan: groups.value[param.row.group], colspan: 1 };
 }
 function changePage(pageIndex: number) {
-  services.value = sortServices.value.filter((d: Service, index: number) => {
-    index >= (pageIndex - 1 || 0) * pageSize &&
-      index < pageSize * (pageIndex || 1);
+  const arr = sortServices.value.filter((d: Service, index: number) => {
+    if (index >= (pageIndex - 1) * pageSize && index < pageSize * pageIndex) {
+      return d;
+    }
   });
+
+  setServices(arr);
 }
 function searchList() {
   const searchServices = sortServices.value.filter((d: { label: string }) =>
     d.label.includes(searchText.value)
   );
-  services.value = searchServices.splice(0, pageSize);
+  const services = searchServices.filter(
+    (d: unknown, index: number) => index < pageSize
+  );
+  setServices(services);
 }
 function getUnit(index: number) {
   const u =