feat: set utc

src/graphql/fragments/dashboard.ts

@@ -18,6 +18,7 @@ export const TypeOfMetrics = {
   variable: "$name: String!",
   query: `typeOfMetrics(name: $name)`,
 };
+
 export const listMetrics = {
   variable: "$regex: String",
   query: `
@@ -29,3 +30,12 @@ export const listMetrics = {
   }
   `,
 };
+
+export const getAllTemplates = {
+  query: `
+    getAllTemplates {
+      id,
+      configuration,
+    }
+  `,
+};

src/graphql/query/dashboard.ts

@@ -14,8 +14,14 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { TypeOfMetrics, listMetrics } from "../fragments/dashboard";
+import {
+  TypeOfMetrics,
+  listMetrics,
+  getAllTemplates,
+} from "../fragments/dashboard";
 
 export const queryTypeOfMetrics = `query typeOfMetrics(${TypeOfMetrics.variable}) {${TypeOfMetrics.query}}`;
 
 export const queryMetrics = `query queryData(${listMetrics.variable}) {${listMetrics.query}}`;
+
+export const getTemplates = `query queryOAPTimeInfo {${getAllTemplates.query}}`;

src/layout/components/NavBar.vue

@@ -46,11 +46,9 @@ const route = useRoute();
 const pageName = ref<string>("");
 const timeRange = ref<number>(0);
 const theme = ref<string>("light");
-let utc = localStorage.getItem("utc") || "";
+let utc = appStore.utc || "";
 if (!utc.includes(":")) {
-  utc =
-    (localStorage.getItem("utc") || -(new Date().getTimezoneOffset() / 60)) +
-    ":0";
+  utc = (appStore.utc || -(new Date().getTimezoneOffset() / 60)) + ":0";
 }
 const utcArr = (utc || "").split(":");
 const utcHour = isNaN(Number(utcArr[0])) ? 0 : Number(utcArr[0]);

src/store/modules/app.ts

@@ -16,9 +16,11 @@
  */
 import { defineStore } from "pinia";
 import { store } from "@/store";
+import graphql from "@/graphql";
 import { Duration, DurationTime } from "@/types/app";
 import getLocalTime from "@/utils/localtime";
 import getDurationRow from "@/utils/dateTime";
+import { AxiosResponse } from "axios";
 import dateFormatStep, { dateFormatTime } from "@/utils/dateFormat";
 /*global Nullable*/
 interface AppState {
@@ -116,7 +118,6 @@ export const appStore = defineStore({
       this.utcMin = utcMin;
       this.utcHour = utcHour;
       this.utc = `${utcHour}:${utcMin}`;
-      localStorage.setItem("utc", this.utc);
     },
     setEventStack(funcs: (() => void)[]): void {
       this.eventStack = funcs;
@@ -139,6 +140,21 @@ export const appStore = defineStore({
         500
       );
     },
+    async queryOAPTimeInfo() {
+      const res: AxiosResponse = await graphql
+        .query("queryOAPTimeInfo")
+        .params({});
+      if (
+        !res.data ||
+        !res.data.data ||
+        !res.data.data.getTimeInfo ||
+        !res.data.data.getTimeInfo.timezone
+      ) {
+        this.utc = -(new Date().getTimezoneOffset() / 60) + ":0";
+        return;
+      }
+      this.utc = res.data.data.getTimeInfo.timezone / 100 + ":0";
+    },
   },
 });
 export function useAppStoreWithOut(): any {

src/utils/localtime.ts

@@ -14,9 +14,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import graphql from "@/graphql";
-import { AxiosResponse } from "axios";
-
 const getLocalTime = (utc: string, time: Date): Date => {
   const utcArr = utc.split(":");
   const utcHour = isNaN(Number(utcArr[0])) ? 0 : Number(utcArr[0]);
@@ -28,31 +25,4 @@ const getLocalTime = (utc: string, time: Date): Date => {
   return new Date(utcTime + 3600000 * utcHour + utcMin * 60000);
 };
 
-const setTimezoneOffset = () => {
-  window.localStorage.setItem(
-    "utc",
-    -(new Date().getTimezoneOffset() / 60) + ":0"
-  );
-};
-
-export const queryOAPTimeInfo = async (): Promise<void> => {
-  let utc = window.localStorage.getItem("utc");
-  if (!utc) {
-    const res: AxiosResponse = await graphql
-      .query("queryOAPTimeInfo")
-      .params({});
-    if (
-      !res.data ||
-      !res.data.data ||
-      !res.data.data.getTimeInfo ||
-      !res.data.data.getTimeInfo.timezone
-    ) {
-      setTimezoneOffset();
-      return;
-    }
-    utc = res.data.data.getTimeInfo.timezone / 100 + ":0";
-    window.localStorage.setItem("utc", utc);
-  }
-};
-
 export default getLocalTime;

src/views/components/ConditionTags.vue

@@ -65,7 +65,6 @@ const tagsList = ref<string[]>([]);
 function removeTags(index: number) {
   tagsList.value.splice(index, 1);
   updateTags();
-  localStorage.setItem("traceTags", JSON.stringify(this.tagsList));
 }
 function addLabels() {
   if (!tags.value) {