feat: Implement templates for dashboards (#28)

src/utils/file.ts

@@ -14,31 +14,31 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { Duration } from "@/types/app";
-import { TimeType } from "@/constants/data";
 
-/**
- * init or generate durationRow Obj and save localStorage.
- */
-const getDurationRow = (): Duration => {
-  const durationRowString = localStorage.getItem("durationRow");
-  let durationRow: Duration;
-  if (durationRowString && durationRowString !== "") {
-    durationRow = JSON.parse(durationRowString);
-    durationRow = {
-      start: new Date(durationRow.start),
-      end: new Date(durationRow.end),
-      step: durationRow.step,
+export const readFile = (event: any) => {
+  return new Promise((resolve) => {
+    const { files } = event.target;
+    if (files.length < 1) {
+      return;
+    }
+    const file = files[0];
+    const reader: FileReader = new FileReader();
+    reader.readAsText(file);
+    reader.onload = function () {
+      if (typeof this.result === "string") {
+        resolve(JSON.parse(this.result));
+      }
     };
-  } else {
-    durationRow = {
-      start: new Date(new Date().getTime() - 900000),
-      end: new Date(),
-      step: TimeType.MINUTE_TIME,
-    };
-    localStorage.setItem("durationRow", JSON.stringify(durationRow, null, 0));
-  }
-  return durationRow;
+  });
+};
+export const saveFile = (data: any, name: string) => {
+  const newData = JSON.stringify(data);
+  const tagA = document.createElement("a");
+  tagA.download = name;
+  tagA.style.display = "none";
+  const blob = new Blob([newData]);
+  tagA.href = URL.createObjectURL(blob);
+  document.body.appendChild(tagA);
+  tagA.click();
+  document.body.removeChild(tagA);
 };
-
-export default getDurationRow;

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;