fix: set duration time (#88)

src/layout/components/AppMain.vue

@@ -21,19 +21,6 @@ limitations under the License. -->
     </router-view>
   </section>
 </template>
-<script lang="ts" setup>
-import { ElMessage } from "element-plus";
-import { useAppStoreWithOut } from "@/store/modules/app";
-
-const appStore = useAppStoreWithOut();
-if (!appStore.utc) {
-  const res = appStore.queryOAPTimeInfo();
-
-  if (res.errors) {
-    ElMessage.error(res.errors);
-  }
-}
-</script>
 <style lang="scss" scoped>
 .app-main {
   height: calc(100% - 40px);

src/layout/components/NavBar.vue

@@ -94,9 +94,6 @@ watch(
   }
 );
 async function getVersion() {
-  if (appStore.version) {
-    return;
-  }
   const res = await appStore.fetchVersion();
   if (res.errors) {
     ElMessage.error(res.errors);

src/main.ts

@@ -20,11 +20,18 @@ import router from "./router";
 import { store } from "./store";
 import components from "@/components";
 import i18n from "./locales";
+import { useAppStoreWithOut } from "@/store/modules/app";
 import "./styles/index.ts";
 
 const app = createApp(App);
+const appStore = useAppStoreWithOut();
 
 app.use(components);
 app.use(i18n);
 app.use(store);
-app.use(router).mount("#app");
+mountApp();
+
+async function mountApp() {
+  await appStore.queryOAPTimeInfo();
+  app.use(router).mount("#app");
+}

src/store/modules/dashboard.ts

@@ -20,10 +20,8 @@ import { LayoutConfig } from "@/types/dashboard";
 import graphql from "@/graphql";
 import query from "@/graphql/fetch";
 import { DashboardItem } from "@/types/dashboard";
-import { useAppStoreWithOut } from "@/store/modules/app";
 import { useSelectorStore } from "@/store/modules/selectors";
 import { NewControl, TextConfig } from "../data";
-import { Duration } from "@/types/app";
 import { AxiosResponse } from "axios";
 import { ElMessage } from "element-plus";
 import { useI18n } from "vue-i18n";
@@ -35,7 +33,6 @@ interface DashboardState {
   entity: string;
   layerId: string;
   activedGridItem: string;
-  durationTime: Duration;
   selectorStore: any;
   showTopology: boolean;
   currentTabItems: LayoutConfig[];
@@ -53,7 +50,6 @@ export const dashboardStore = defineStore({
     entity: "",
     layerId: "",
     activedGridItem: "",
-    durationTime: useAppStoreWithOut().durationTime,
     selectorStore: useSelectorStore(),
     showTopology: false,
     currentTabItems: [],

src/store/modules/ebpf.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 import { defineStore } from "pinia";
-import { Duration, Option } from "@/types/app";
+import { Option } from "@/types/app";
 import {
   EBPFTaskCreationRequest,
   EBPFProfilingSchedule,
@@ -26,10 +26,8 @@ import { Trace, Span } from "@/types/trace";
 import { store } from "@/store";
 import graphql from "@/graphql";
 import { AxiosResponse } from "axios";
-import { useAppStoreWithOut } from "@/store/modules/app";
 
 interface EbpfStore {
-  durationTime: Duration;
   taskList: EBPFTaskList[];
   eBPFSchedules: EBPFProfilingSchedule[];
   currentSchedule: EBPFProfilingSchedule | Record<string, never>;
@@ -42,7 +40,6 @@ interface EbpfStore {
 export const ebpfStore = defineStore({
   id: "eBPF",
   state: (): EbpfStore => ({
-    durationTime: useAppStoreWithOut().durationTime,
     taskList: [],
     eBPFSchedules: [],
     currentSchedule: {},

src/store/modules/event.ts

@@ -42,7 +42,6 @@ export const eventStore = defineStore({
     instances: [{ value: "", label: "All" }],
     endpoints: [{ value: "", label: "All" }],
     condition: {
-      time: useAppStoreWithOut().durationTime,
       paging: { pageNum: 1, pageSize: 15, needTotal: true },
     },
   }),
@@ -94,9 +93,12 @@ export const eventStore = defineStore({
     },
     async getEvents() {
       this.loading = true;
-      const res: AxiosResponse = await graphql
-        .query("queryEvents")
-        .params({ condition: this.condition });
+      const res: AxiosResponse = await graphql.query("queryEvents").params({
+        condition: {
+          ...this.condition,
+          time: useAppStoreWithOut().durationTime,
+        },
+      });
       this.loading = false;
       if (res.data.errors) {
         return res.data;

src/store/modules/log.ts

@@ -15,7 +15,6 @@
  * limitations under the License.
  */
 import { defineStore } from "pinia";
-import { Duration } from "@/types/app";
 import { Instance, Endpoint, Service } from "@/types/selector";
 import { store } from "@/store";
 import graphql from "@/graphql";
@@ -29,7 +28,6 @@ interface LogState {
   instances: Instance[];
   endpoints: Endpoint[];
   conditions: any;
-  durationTime: Duration;
   selectorStore: any;
   supportQueryLogsByKeywords: boolean;
   logs: any[];
@@ -48,7 +46,6 @@ export const logStore = defineStore({
       paging: { pageNum: 1, pageSize: 15, needTotal: true },
     },
     supportQueryLogsByKeywords: true,
-    durationTime: useAppStoreWithOut().durationTime,
     selectorStore: useSelectorStore(),
     logs: [],
     logsTotal: 0,
@@ -74,7 +71,7 @@ export const logStore = defineStore({
         : id;
       const res: AxiosResponse = await graphql.query("queryInstances").params({
         serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
       });
 
       if (res.data.errors) {
@@ -92,7 +89,7 @@ export const logStore = defineStore({
         : id;
       const res: AxiosResponse = await graphql.query("queryEndpoints").params({
         serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
         keyword: keyword || "",
       });
       if (res.data.errors) {

src/store/modules/profile.ts

@@ -15,7 +15,6 @@
  * limitations under the License.
  */
 import { defineStore } from "pinia";
-import { Duration } from "@/types/app";
 import { Endpoint } from "@/types/selector";
 import {
   TaskListItem,
@@ -33,7 +32,6 @@ import { useAppStoreWithOut } from "@/store/modules/app";
 interface ProfileState {
   endpoints: Endpoint[];
   taskEndpoints: Endpoint[];
-  durationTime: Duration;
   condition: { serviceId: string; endpointName: string };
   taskList: TaskListItem[];
   segmentList: Trace[];
@@ -50,7 +48,6 @@ export const profileStore = defineStore({
   state: (): ProfileState => ({
     endpoints: [{ value: "", label: "All" }],
     taskEndpoints: [{ value: "", label: "All" }],
-    durationTime: useAppStoreWithOut().durationTime,
     condition: { serviceId: "", endpointName: "" },
     taskList: [],
     segmentList: [],
@@ -80,7 +77,7 @@ export const profileStore = defineStore({
     async getEndpoints(serviceId: string, keyword?: string) {
       const res: AxiosResponse = await graphql.query("queryEndpoints").params({
         serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
         keyword: keyword || "",
       });
       if (res.data.errors) {
@@ -92,7 +89,7 @@ export const profileStore = defineStore({
     async getTaskEndpoints(serviceId: string, keyword?: string) {
       const res: AxiosResponse = await graphql.query("queryEndpoints").params({
         serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
         keyword: keyword || "",
       });
       if (res.data.errors) {

src/store/modules/selectors.ts

@@ -15,13 +15,11 @@
  * limitations under the License.
  */
 import { defineStore } from "pinia";
-import { Duration } from "@/types/app";
 import { Service, Instance, Endpoint } from "@/types/selector";
 import { store } from "@/store";
 import graphql from "@/graphql";
 import { AxiosResponse } from "axios";
 import { useAppStoreWithOut } from "@/store/modules/app";
-
 interface SelectorState {
   services: Service[];
   destServices: Service[];
@@ -31,7 +29,6 @@ interface SelectorState {
   currentDestService: Nullable<Service>;
   currentDestPod: Nullable<Instance | Endpoint>;
   destPods: Array<Instance | Endpoint>;
-  durationTime: Duration;
 }
 
 export const selectorStore = defineStore({
@@ -45,7 +42,6 @@ export const selectorStore = defineStore({
     currentPod: null,
     currentDestService: null,
     currentDestPod: null,
-    durationTime: useAppStoreWithOut().durationTime,
   }),
   actions: {
     setCurrentService(service: Nullable<Service>) {
@@ -86,7 +82,7 @@ export const selectorStore = defineStore({
       }
       const res: AxiosResponse = await graphql.query("queryInstances").params({
         serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
       });
       if (!res.data.errors) {
         if (param && param.isRelation) {
@@ -112,7 +108,7 @@ export const selectorStore = defineStore({
       }
       const res: AxiosResponse = await graphql.query("queryEndpoints").params({
         serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
         keyword: params.keyword || "",
         limit: params.limit,
       });

src/store/modules/trace.ts

@@ -15,7 +15,6 @@
  * limitations under the License.
  */
 import { defineStore } from "pinia";
-import { Duration } from "@/types/app";
 import { Instance, Endpoint, Service } from "@/types/selector";
 import { Trace, Span } from "@/types/trace";
 import { store } from "@/store";
@@ -35,10 +34,6 @@ interface TraceState {
   conditions: any;
   traceSpanLogs: any[];
   traceSpanLogsTotal: number;
-  // traceListErrors: string;
-  // traceSpanErrors: string;
-  // traceSpanLogErrors: string;
-  durationTime: Duration;
   selectorStore: any;
 }
 
@@ -60,12 +55,11 @@ export const traceStore = defineStore({
     },
     traceSpanLogs: [],
     traceSpanLogsTotal: 0,
-    durationTime: useAppStoreWithOut().durationTime,
     selectorStore: useSelectorStore(),
   }),
   actions: {
     setTraceCondition(data: any) {
-      this.condition = { ...this.condition, ...data };
+      this.conditions = { ...this.conditions, ...data };
     },
     setCurrentTrace(trace: Trace) {
       this.currentTrace = trace;
@@ -89,7 +83,7 @@ export const traceStore = defineStore({
         : id;
       const res: AxiosResponse = await graphql.query("queryInstances").params({
         serviceId: serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
       });
 
       if (res.data.errors) {
@@ -104,7 +98,7 @@ export const traceStore = defineStore({
         : id;
       const res: AxiosResponse = await graphql.query("queryEndpoints").params({
         serviceId,
-        duration: this.durationTime,
+        duration: useAppStoreWithOut().durationTime,
         keyword: keyword || "",
       });
       if (res.data.errors) {
@@ -116,7 +110,7 @@ export const traceStore = defineStore({
     async getTraces() {
       const res: AxiosResponse = await graphql
         .query("queryTraces")
-        .params({ condition: this.condition });
+        .params({ condition: this.conditions });
       if (res.data.errors) {
         return res.data;
       }