From b59c962f60d8d55dc3f006c3493660dc51bc1c9b Mon Sep 17 00:00:00 2001
From: Ivymaster <ivan.ivusic.983@gmail.com>
Date: Thu, 6 Aug 2026 12:46:41 +0200
Subject: [PATCH] WIP: Work on news create/edit page

---
 .../views/CisRouterView/CisRouterView.php     |   1 +
 public/js/apps/Cis/Cis.js                     |   7 ++
 .../components/Cis/Cms/NewsItemContentForm.js |  85 +++++++++++++
 public/js/components/Cis/Cms/NewsItemForm.js  | 116 ++++++++++++++++++
 public/js/components/Cis/Cms/test.js          |  36 ++++++
 5 files changed, 245 insertions(+)
 create mode 100644 public/js/components/Cis/Cms/NewsItemContentForm.js
 create mode 100644 public/js/components/Cis/Cms/NewsItemForm.js
 create mode 100644 public/js/components/Cis/Cms/test.js

diff --git a/application/views/CisRouterView/CisRouterView.php b/application/views/CisRouterView/CisRouterView.php
index c51ca40c3..fdf31ed31 100644
--- a/application/views/CisRouterView/CisRouterView.php
+++ b/application/views/CisRouterView/CisRouterView.php
@@ -10,6 +10,7 @@ $includesArray = array(
 	'primevue3' => true,
 	'skipID' => '#fhccontent',
 	'vuedatepicker11' => true,
+	'tinymce5' => true,
 	'customCSSs' => array(
 		'public/css/components/verticalsplit.css',
 		'public/css/components/searchbar/searchbar.css',
diff --git a/public/js/apps/Cis/Cis.js b/public/js/apps/Cis/Cis.js
index d4f846f25..43be92e9a 100644
--- a/public/js/apps/Cis/Cis.js
+++ b/public/js/apps/Cis/Cis.js
@@ -9,6 +9,7 @@ import MylvStudent from "../../components/Cis/Mylv/Student.js";
 import Profil from "../../components/Cis/Profil/Profil.js";
 import Raumsuche from "../../components/Cis/Raumsuche/Raumsuche.js";
 import CmsNews from "../../components/Cis/Cms/News.js";
+import NewsItemForm from "../../components/Cis/Cms/NewsItemForm.js";
 import CmsContent from "../../components/Cis/Cms/Content.js";
 import Info from "../../components/Cis/Mylv/Semester/Studiengang/Lv/Info.js";
 import RoomInformation, {DEFAULT_MODE_RAUMINFO_DESKTOP, DEFAULT_MODE_RAUMINFO_MOBILE} from "../../components/Cis/Mylv/RoomInformation.js";
@@ -148,6 +149,12 @@ const router = VueRouter.createRouter({
 			component: CmsNews,
 			props: true
 		},
+		{
+			path: `/CisVue/Cms/News/Create`,
+			name: 'NewsItemCreate',
+			component: NewsItemForm,
+			props: true
+		},
 		{
 			path: `/Cis/MyLv/:studiensemester?`,
 			name: 'MyLv',
diff --git a/public/js/components/Cis/Cms/NewsItemContentForm.js b/public/js/components/Cis/Cms/NewsItemContentForm.js
new file mode 100644
index 000000000..7f9eb9d83
--- /dev/null
+++ b/public/js/components/Cis/Cms/NewsItemContentForm.js
@@ -0,0 +1,85 @@
+
+import FormInput from "../../Form/Input.js";
+
+export default {
+  name: "NewsItemContentForm",
+  components: {
+    FormInput,
+  },
+  	props: {
+		config: {
+			type: Object,
+			default: () => ({})
+		}
+	},
+  methods: {
+    initTinyMCE() {
+			const vm = this;
+			tinymce.init({
+				target: this.$refs.editor.$refs.input, //Important: not selector: to enable multiple import of component
+				//height: 800,
+				//plugins: ['lists'],
+				//toolbar: " blocks | bold italic underline | alignleft aligncenter alignright alignjustify",
+				toolbar: 'styleselect | bold italic underline | alignleft aligncenter alignright alignjustify',
+				style_formats: [
+					{title: 'Blocks', block: 'div'},
+					{title: 'Paragraph', block: 'p'},
+					{title: 'Heading 1', block: 'h1'},
+					{title: 'Heading 2', block: 'h2'},
+					{title: 'Heading 3', block: 'h3'},
+					{title: 'Heading 4', block: 'h4'},
+					{title: 'Heading 5', block: 'h5'},
+					{title: 'Heading 6', block: 'h6'},
+				],
+				autoresize_bottom_margin: 16,
+
+				setup: (editor) => {
+					vm.editor = editor;
+
+					editor.on('input', () => {
+						const newContent = editor.getContent();
+						vm.notizData.text = newContent;
+					});
+				},
+			});
+		},
+  },
+  mounted() {
+    this.initTinyMCE();
+  },
+  template: /*html*/ `
+	<div :class="{'pb-3': isMobile}" class="overflow-x-hidden">
+    <div class="d-flex flex-column flex-md-row align-items-md-end gap-3">
+      <form-input
+        type="text"
+        :label="$p.t('wawi/nummer')"
+        name="nummer"
+        >
+      </form-input>
+      <form-input
+        type="text"
+        :label="$p.t('wawi/nummer')"
+        name="nummer"
+        >
+      </form-input>
+       <form-input
+        type="checkbox"
+        :label="$p.t('wawi/nummer')"
+        name="nummer"
+        >
+      </form-input>
+    </div>
+    <form-input
+       ref="editor"
+          :label="$p.t('global','text')  + ' *'"
+          type="textarea" 
+          name="text"
+          rows="5"
+          cols="75"
+        >
+      >
+    </form-input>
+
+</div>
+    `,
+};
diff --git a/public/js/components/Cis/Cms/NewsItemForm.js b/public/js/components/Cis/Cms/NewsItemForm.js
new file mode 100644
index 000000000..3ee1cd4de
--- /dev/null
+++ b/public/js/components/Cis/Cms/NewsItemForm.js
@@ -0,0 +1,116 @@
+import CoreForm from "../../Form/Form.js";
+import FormInput from "../../Form/Input.js";
+import FhcTabs from "../../Tabs.js";
+
+const BASE_COMPONENT_URL =
+  "https://c3p0.dev.technikum-wien.at/ma1433/core/FHC-Core/public/js/components/Cis/Cms/";
+
+export default {
+  name: "NewsItemForm",
+  components: {
+    CoreForm,
+    FormInput,
+    FhcTabs,
+  },
+  data() {
+    return {
+      contentFormItems: {
+        germanContentForm: {
+          title: "German Content Form",
+          component: BASE_COMPONENT_URL + "NewsItemContentForm.js?123",
+          config: {
+            language: "de",
+            type: "news",
+          },
+          key: "germanContentForm",
+        },
+        englishContentForm: {
+          title: "English Content Form",
+          component: BASE_COMPONENT_URL + "NewsItemContentForm.js?1233",
+          config: {
+            language: "en",
+            type: "news",
+          },
+          key: "englishContentForm",
+        },
+      },
+    };
+  },
+  watch: {
+    "$p.user_language.value": function (sprache) {
+      this.fetchNews();
+    },
+  },
+  computed: {
+    sprache: function () {
+      return this.$p.user_language.value;
+    },
+  },
+  methods: {},
+  created() {},
+  template: /*html*/ `
+	<div :class="{'pb-3': isMobile}" class="overflow-x-hidden">
+  		<h2 ref="newsPageHeading" class="fhc-primary-color">News Form</h2>
+		<div>
+			<core-form>
+				<div class="d-flex flex-row flex-md-row align-items-md-end gap-3">
+					<div class="d-flex flex-row flex-md-row align-items-md-end gap-3">
+						<form-input
+						:label="$p.t('ui', 'validityPeriod') + ' ' + $p.t('global', 'bis')"
+						:teleport="true"
+						:enable-time-picker="false"
+						type="datePicker"
+						name="validityPeriodTo"  
+						format="dd.MM.yyyy"
+						auto-apply
+						/>
+						<form-input
+						:label="$p.t('ui', 'validityPeriod') + ' ' + $p.t('global', 'bis')"
+						:teleport="true"
+						:enable-time-picker="false"
+						type="datePicker"
+						name="validityPeriodTo"  
+						format="dd.MM.yyyy"
+						auto-apply
+						/>
+					</div>
+					<div class="d-flex flex-row flex-md-row align-items-md-end gap-3">
+						<form-input
+							:label="$capitalize($p.t('lehre/studiensemester'))"
+							:suggestions="filteredSemesters"
+							:optionValue="(option) => option.value"
+							:optionLabel="(option) => option.label"
+							@complete="filterSemesters($event)"
+							type="autocomplete"
+							name="selectedSemester"
+							dropdown 
+							forceSelection
+							>
+						</form-input>
+						<form-input
+							:label="$capitalize($p.t('lehre/studiensemester'))"
+							:suggestions="filteredSemesters"
+							:optionValue="(option) => option.value"
+							:optionLabel="(option) => option.label"
+							@complete="filterSemesters($event)"
+							type="autocomplete"
+							name="selectedSemester"
+							dropdown 
+							forceSelection
+							>
+						</form-input>
+					</div>
+  				</div>
+				<fhc-tabs
+					ref="tabs" 
+					:useprimevue="true"
+					:config="contentFormItems"
+					style="flex: 1 1 0%; height: 0%"
+					class="mt-3"
+					>
+				</fhc-tabs>
+			</core-form>
+		</div>
+	</div>
+    `,
+};
diff --git a/public/js/components/Cis/Cms/test.js b/public/js/components/Cis/Cms/test.js
new file mode 100644
index 000000000..c72ca8138
--- /dev/null
+++ b/public/js/components/Cis/Cms/test.js
@@ -0,0 +1,36 @@
+
+import CoreForm from "../../Form/Form.js";
+import FormInput from "../../Form/Input.js";
+import Tabs from "../../Tabs.js";
+
+export default {
+  name: "NewsItemForm",
+  components: {
+    CoreForm,
+    FormInput,
+    Tabs,
+  },
+  data() {
+    return {
+    };
+  },
+  watch: {
+    "$p.user_language.value": function (sprache) {
+      this.fetchNews();
+    },
+  },
+  computed: {
+    sprache: function () {
+      return this.$p.user_language.value;
+    },
+  },
+  methods: {
+  },
+  created() {
+  },
+  template: /*html*/ `
+	<div :class="{'pb-3': isMobile}" class="overflow-x-hidden">
+  		test
+	</div>
+    `,
+};