template storing

src/helpers/unlayerEditor.ts

@@ -1,3 +1,4 @@
+import type { EmailEditor } from "vue-email-editor";
 import type { EmailEditorProps } from "vue-email-editor/dist/components/types";
 
 export const options: EmailEditorProps["options"] = {
@@ -26,3 +27,74 @@ export const options: EmailEditorProps["options"] = {
   },
   customJS: [window.location.origin + "/unlayerTool.js"],
 };
+
+export function configureEditor(editor: typeof EmailEditor): void {
+  editor.editor.setBodyValues({
+    contentWidth: "100%",
+    backgroundColor: "#ffffff",
+    linkStyle: {
+      linkColor: "#990b00",
+      linkHoverColor: "#bb1e10",
+      linkUnderline: false,
+      linkHoverUnderline: false,
+    },
+  });
+}
+
+export function loadEditor(editor: typeof EmailEditor, design: object | undefined = undefined): void {
+  if (design === undefined) {
+    editor.editor.loadBlank();
+  } else {
+    editor.editor.loadDesign(design);
+  }
+}
+
+export function exportEditor(editor: typeof EmailEditor): {
+  design: object;
+  headerHTML: string;
+  bodyHTML: string;
+  footerHTML: string;
+} {
+  let savedDesign: any = undefined;
+  let savedHeader: string = "";
+  let savedBody: string = "";
+  let savedFooter: string = "";
+
+  editor.editor.saveDesign((design: any) => {
+    savedDesign = design;
+  });
+
+  editor.editor.exportHtml(
+    (data: any) => {
+      savedHeader = data;
+    },
+    {
+      minify: true,
+      onlyHeader: true,
+    }
+  );
+  editor.editor.exportHtml(
+    (data: any) => {
+      savedBody = data;
+    },
+    {
+      minify: true,
+    }
+  );
+  editor.editor.exportHtml(
+    (data: any) => {
+      savedFooter = data;
+    },
+    {
+      minify: true,
+      onlyFooter: true,
+    }
+  );
+
+  return {
+    design: savedDesign,
+    headerHTML: savedHeader,
+    bodyHTML: savedBody,
+    footerHTML: savedFooter,
+  };
+}