From 4e022ff29a6c815264ab64a1e1f6c524b38e7e46 Mon Sep 17 00:00:00 2001
From: Fine0830 <fine0830@outlook.com>
Date: Tue, 19 Jul 2022 12:47:03 +0800
Subject: [PATCH 1/4] fix short time range (#121)

---
 src/components/Graph.vue                      | 23 +------------------
 src/views/dashboard/related/event/Content.vue |  8 ++++++-
 2 files changed, 8 insertions(+), 23 deletions(-)

diff --git a/src/components/Graph.vue b/src/components/Graph.vue
index 0222dca1..24b76650 100644
--- a/src/components/Graph.vue
+++ b/src/components/Graph.vue
@@ -77,7 +77,7 @@ onMounted(async () => {
     });
     document.addEventListener(
       "click",
-      (event: Event) => {
+      () => {
         if (instance.isDisposed()) {
           return;
         }
@@ -88,27 +88,6 @@ onMounted(async () => {
           type: "updateAxisPointer",
           currTrigger: "leave",
         });
-        if (
-          ["vis-item-overflow", "vis-item-content"].includes(
-            (event.target as HTMLDivElement).className
-          )
-        ) {
-          return;
-        }
-        const series = (window as any).structuredClone(props.option.series);
-        for (const temp of series) {
-          if (temp.markArea) {
-            delete temp.markArea;
-          }
-        }
-        const options = {
-          ...props.option,
-          series,
-        };
-        if (JSON.stringify(options) === JSON.stringify(props.option)) {
-          return;
-        }
-        setOptions(options);
       },
       true
     );
diff --git a/src/views/dashboard/related/event/Content.vue b/src/views/dashboard/related/event/Content.vue
index 4786e7be..dad8e99a 100644
--- a/src/views/dashboard/related/event/Content.vue
+++ b/src/views/dashboard/related/event/Content.vue
@@ -115,8 +115,14 @@ function visTimeline() {
     const i = events[index - 1 || 0];
 
     for (const widget of widgets) {
+      let end = i.end;
+      if (!isNaN(index)) {
+        if (!i.end || i.end.getTime() - i.start.getTime() < 60000) {
+          end = i.start.getTime() + 60000;
+        }
+      }
       const startTime = dateFormatTime(i.start, appStore.duration.step);
-      const endTime = dateFormatTime(i.end, appStore.duration.step);
+      const endTime = dateFormatTime(new Date(end), appStore.duration.step);
       widget.filters = {
         sourceId: dashboardStore.selectedGrid.id || "",
         isRange: true,

From ec7a8bbfa9a2698a4ecb26588413e704a3f76016 Mon Sep 17 00:00:00 2001
From: Fine0830 <fine0830@outlook.com>
Date: Tue, 19 Jul 2022 14:11:41 +0800
Subject: [PATCH 2/4] fix: update event associations with the duration step
 (#122)

---
 src/components/Graph.vue                      |  6 ++++++
 src/views/dashboard/related/event/Content.vue | 16 ++++++++++++++--
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/components/Graph.vue b/src/components/Graph.vue
index 24b76650..6b87334a 100644
--- a/src/components/Graph.vue
+++ b/src/components/Graph.vue
@@ -115,6 +115,12 @@ watch(
     }
     if (props.filters) {
       if (props.filters.isRange) {
+        const list = props.option.series[0].data.map(
+          (d: (number | string)[]) => d[0]
+        );
+        if (!list.includes(props.filters.duration.endTime)) {
+          return;
+        }
         const markArea = {
           silent: true,
           itemStyle: {
diff --git a/src/views/dashboard/related/event/Content.vue b/src/views/dashboard/related/event/Content.vue
index dad8e99a..14d2c3b4 100644
--- a/src/views/dashboard/related/event/Content.vue
+++ b/src/views/dashboard/related/event/Content.vue
@@ -117,8 +117,20 @@ function visTimeline() {
     for (const widget of widgets) {
       let end = i.end;
       if (!isNaN(index)) {
-        if (!i.end || i.end.getTime() - i.start.getTime() < 60000) {
-          end = i.start.getTime() + 60000;
+        let diff = 60000;
+        switch (appStore.duration.step) {
+          case "MINUTE":
+            diff = 60000;
+            break;
+          case "HOUR":
+            diff = 3600000;
+            break;
+          case "DAY":
+            diff = 3600000 * 24;
+            break;
+        }
+        if (!i.end || i.end.getTime() - i.start.getTime() < diff) {
+          end = i.start.getTime() + diff;
         }
       }
       const startTime = dateFormatTime(i.start, appStore.duration.step);

From bec86e80fd75c0742110db631f905146d4270148 Mon Sep 17 00:00:00 2001
From: Fine0830 <fine0830@outlook.com>
Date: Wed, 20 Jul 2022 16:53:01 +0800
Subject: [PATCH 3/4] fix: update dashboard list with using the search box
 (#123)

---
 src/views/dashboard/List.vue | 21 ++++++++++++++-------
 1 file changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/views/dashboard/List.vue b/src/views/dashboard/List.vue
index f8cb43ef..5dbe374f 100644
--- a/src/views/dashboard/List.vue
+++ b/src/views/dashboard/List.vue
@@ -20,7 +20,7 @@ limitations under the License. -->
         placeholder="Please input name"
         class="input-with-search ml-10"
         size="small"
-        @change="searchDashboards"
+        @change="searchDashboards(1)"
       >
         <template #append>
           <el-button size="small">
@@ -129,7 +129,8 @@ limitations under the License. -->
           small
           layout="prev, pager, next"
           :page-size="pageSize"
-          :total="dashboardStore.dashboards.length"
+          :total="total"
+          v-model="currentPage"
           @current-change="changePage"
           @prev-click="changePage"
           @next-click="changePage"
@@ -159,6 +160,8 @@ const pageSize = 18;
 const dashboards = ref<DashboardItem[]>([]);
 const searchText = ref<string>("");
 const loading = ref<boolean>(false);
+const currentPage = ref<number>(1);
+const total = ref<number>(0);
 const multipleTableRef = ref<InstanceType<typeof ElTable>>();
 const multipleSelection = ref<DashboardItem[]>([]);
 const dashboardFile = ref<Nullable<HTMLDivElement>>(null);
@@ -170,7 +173,7 @@ const handleSelectionChange = (val: DashboardItem[]) => {
 setList();
 async function setList() {
   await dashboardStore.setDashboards();
-  searchDashboards();
+  searchDashboards(1);
 }
 async function importTemplates(event: any) {
   const arr: any = await readFile(event);
@@ -374,7 +377,7 @@ async function setRoot(row: DashboardItem) {
     items.push(d);
   }
   dashboardStore.resetDashboards(items);
-  searchDashboards();
+  searchDashboards(1);
   loading.value = false;
 }
 function handleRename(row: DashboardItem) {
@@ -458,10 +461,13 @@ function searchDashboards(pageIndex?: any) {
   const arr = list.filter((d: { name: string }) =>
     d.name.includes(searchText.value)
   );
-  dashboards.value = arr.splice(
-    (pageIndex - 1 || 0) * pageSize,
-    pageSize * (pageIndex || 1)
+
+  total.value = arr.length;
+  dashboards.value = arr.filter(
+    (d: { name: string }, index: number) =>
+      index < pageIndex * pageSize && index >= (pageIndex - 1) * pageSize
   );
+  currentPage.value = pageIndex;
 }
 
 async function reloadTemplates() {
@@ -470,6 +476,7 @@ async function reloadTemplates() {
   loading.value = false;
 }
 function changePage(pageIndex: number) {
+  currentPage.value = pageIndex;
   searchDashboards(pageIndex);
 }
 </script>

From 017f5bf7094b29871d63f2a5b15761ca5520d253 Mon Sep 17 00:00:00 2001
From: Fine0830 <fine0830@outlook.com>
Date: Wed, 20 Jul 2022 19:42:41 +0800
Subject: [PATCH 4/4] fix errors (#124)

---
 src/views/dashboard/controls/Event.vue        |  2 +-
 src/views/dashboard/related/event/Content.vue | 11 +++++++++--
 src/views/dashboard/related/event/Header.vue  |  6 ++++++
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/views/dashboard/controls/Event.vue b/src/views/dashboard/controls/Event.vue
index c4cc16ac..8066969d 100644
--- a/src/views/dashboard/controls/Event.vue
+++ b/src/views/dashboard/controls/Event.vue
@@ -36,7 +36,7 @@ limitations under the License. -->
       <Header :needQuery="needQuery" />
     </div>
     <div class="event">
-      <Content />
+      <Content :data="data" />
     </div>
   </div>
 </template>
diff --git a/src/views/dashboard/related/event/Content.vue b/src/views/dashboard/related/event/Content.vue
index 14d2c3b4..36511eee 100644
--- a/src/views/dashboard/related/event/Content.vue
+++ b/src/views/dashboard/related/event/Content.vue
@@ -30,7 +30,13 @@ import { dateFormatTime } from "@/utils/dateFormat";
 import { useAppStoreWithOut } from "@/store/modules/app";
 
 const eventStore = useEventStore();
-/*global Nullable */
+/*global defineProps, Nullable */
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => ({}),
+  },
+});
 const timeline = ref<Nullable<HTMLDivElement>>(null);
 const visGraph = ref<Nullable<any>>(null);
 const oldVal = ref<{ width: number; height: number }>({ width: 0, height: 0 });
@@ -97,9 +103,10 @@ function visTimeline() {
   };
   visGraph.value = new Timeline(timeline.value, items, options);
   visGraph.value.on("select", (properties: { items: number[] }) => {
-    if (!dashboardStore.selectedGrid.eventAssociate) {
+    if (!props.data.eventAssociate) {
       return;
     }
+    dashboardStore.selectWidget(props.data);
     const all = getDashboard(dashboardStore.currentDashboard).widgets;
     const widgets = all.filter(
       (d: { value: string; label: string } & LayoutConfig) => {
diff --git a/src/views/dashboard/related/event/Header.vue b/src/views/dashboard/related/event/Header.vue
index 5ce838ff..81550438 100644
--- a/src/views/dashboard/related/event/Header.vue
+++ b/src/views/dashboard/related/event/Header.vue
@@ -125,6 +125,9 @@ function fetchSelectors() {
 
 async function getEndpoints(id?: string) {
   const resp = await eventStore.getEndpoints(id);
+  if (!resp) {
+    return;
+  }
   if (resp.errors) {
     ElMessage.error(resp.errors);
     return;
@@ -148,6 +151,9 @@ async function queryEvents() {
   if (dashboardStore.entity === EntityType[3].value) {
     instance = selectorStore.currentPod.id;
   }
+  if (!selectorStore.currentService) {
+    return;
+  }
   eventStore.setEventCondition({
     // layer: dashboardStore.layerId,
     paging: {