diff --git a/package-lock.json b/package-lock.json
index 06048b0..33b0fc3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,11 +1,11 @@
{
- "name": "fireportal-ui",
+ "name": "member-administration-ui",
"version": "0.0.11",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
- "name": "fireportal-ui",
+ "name": "member-administration-ui",
"version": "0.0.11",
"license": "GPL-3.0-only",
"dependencies": {
@@ -31,6 +31,7 @@
"socket.io-client": "^4.5.0",
"uuid": "^9.0.0",
"vue": "^3.4.29",
+ "vue-email-editor": "^2.1.4",
"vue-router": "^4.3.3"
},
"devDependencies": {
@@ -9410,6 +9411,12 @@
"node": ">= 10.0.0"
}
},
+ "node_modules/unlayer-types": {
+ "version": "1.188.0",
+ "resolved": "https://registry.npmjs.org/unlayer-types/-/unlayer-types-1.188.0.tgz",
+ "integrity": "sha512-tnn+FjUZv1qUOoRUYRFxSDz9kHfhy7dLxzMZgnU5+k6GDSBlpa8mA+r4+r0D83M+mUUd/XwuM+gvfRLGzrqZ+g==",
+ "license": "MIT"
+ },
"node_modules/upath": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/upath/-/upath-1.2.0.tgz",
@@ -9700,6 +9707,15 @@
}
}
},
+ "node_modules/vue-email-editor": {
+ "version": "2.1.4",
+ "resolved": "https://registry.npmjs.org/vue-email-editor/-/vue-email-editor-2.1.4.tgz",
+ "integrity": "sha512-9H6P2zgjOx4XJmKyMb4ZzCpsnKAqFk74daD86l/MhUvucF/qizTMUhOFnIMU6u9jtiB64NFvPTTzkRTTYTGkFw==",
+ "dependencies": {
+ "unlayer-types": "latest",
+ "vue": "^3.2.13"
+ }
+ },
"node_modules/vue-eslint-parser": {
"version": "9.4.3",
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.3.tgz",
diff --git a/package.json b/package.json
index 66fbfab..0373442 100644
--- a/package.json
+++ b/package.json
@@ -46,6 +46,7 @@
"socket.io-client": "^4.5.0",
"uuid": "^9.0.0",
"vue": "^3.4.29",
+ "vue-email-editor": "^2.1.4",
"vue-router": "^4.3.3"
},
"devDependencies": {
diff --git a/public/unlayerTool.js b/public/unlayerTool.js
new file mode 100644
index 0000000..8533f1a
--- /dev/null
+++ b/public/unlayerTool.js
@@ -0,0 +1,51 @@
+unlayer.registerTool({
+ name: "my_tool",
+ label: "My Tool",
+ icon: "fa-smile",
+ // supportedDisplayModes: ["web", "email", "document"],
+ options: {
+ colors: {
+ // Property Group
+ title: "Colors", // Title for Property Group
+ position: 1, // Position of Property Group
+ options: {
+ textColor: {
+ // Property: textColor
+ label: "Text Color", // Label for Property
+ defaultValue: "#FF0000",
+ widget: "color_picker", // Property Editor Widget: color_picker
+ },
+ backgroundColor: {
+ // Property: backgroundColor
+ label: "Background Color", // Label for Property
+ defaultValue: "#FF0000",
+ widget: "color_picker", // Property Editor Widget: color_picker
+ },
+ },
+ },
+ },
+ values: {},
+ renderer: {
+ Viewer: unlayer.createViewer({
+ render(values) {
+ return `
I am a custom tool.
`;
+ },
+ }),
+ exporters: {
+ web: function (values) {
+ return `I am a custom tool.
`;
+ },
+ email: function (values) {
+ return `I am a custom tool.
`;
+ },
+ },
+ head: {
+ css: function (values) {},
+ js: function (values) {},
+ },
+ },
+ validator(data) {
+ const { defaultErrors, values } = data;
+ return [];
+ },
+});
diff --git a/src/helpers/unlayerEditor.ts b/src/helpers/unlayerEditor.ts
new file mode 100644
index 0000000..1b5afb7
--- /dev/null
+++ b/src/helpers/unlayerEditor.ts
@@ -0,0 +1,28 @@
+import type { EmailEditorProps } from "vue-email-editor/dist/components/types";
+
+export const options: EmailEditorProps["options"] = {
+ tools: {
+ image: {
+ enabled: false,
+ },
+ menu: {
+ enabled: false,
+ },
+ button: {
+ enabled: false,
+ },
+ },
+ displayMode: "document",
+ appearance: {
+ theme: "light",
+ panels: {
+ tools: {
+ dock: "left",
+ },
+ },
+ },
+ features: {
+ preview: false,
+ },
+ customJS: [window.location.origin + "/unlayerTool.js"],
+};
diff --git a/src/router/index.ts b/src/router/index.ts
index 777aa7c..e0d4bd8 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -403,6 +403,28 @@ const router = createRouter({
meta: { type: "read", section: "settings", module: "query_store" },
beforeEnter: [abilityAndNavUpdate],
},
+ {
+ path: "template",
+ name: "admin-settings-template-route",
+ component: () => import("@/views/RouterView.vue"),
+ // meta: { type: "read", section: "settings", module: "template" },
+ beforeEnter: [abilityAndNavUpdate],
+ children: [
+ {
+ path: "",
+ name: "admin-settings-template",
+ component: () => import("@/views/admin/settings/template/Template.vue"),
+ },
+ {
+ path: ":id/edit",
+ name: "admin-settings-template-edit",
+ component: () => import("@/views/admin/settings/template/Template.vue"),
+ // meta: { type: "update", section: "settings", module: "template" },
+ // beforeEnter: [abilityAndNavUpdate],
+ props: true,
+ },
+ ],
+ },
],
},
{
diff --git a/src/stores/admin/navigation.ts b/src/stores/admin/navigation.ts
index f14502b..4385a8f 100644
--- a/src/stores/admin/navigation.ts
+++ b/src/stores/admin/navigation.ts
@@ -113,6 +113,7 @@ export const useNavigationStore = defineStore("navigation", {
? [{ key: "calendar_type", title: "Terminarten" }]
: []),
...(abilityStore.can("read", "settings", "query") ? [{ key: "query_store", title: "Query Store" }] : []),
+ ...(true ? [{ key: "template", title: "Templates" }] : []),
],
},
user: {
diff --git a/src/views/admin/settings/template/Template.vue b/src/views/admin/settings/template/Template.vue
new file mode 100644
index 0000000..44ff19f
--- /dev/null
+++ b/src/views/admin/settings/template/Template.vue
@@ -0,0 +1,87 @@
+
+
+
+
+
Templates
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+