Add public/private news system with homepage display

pages/index.vue

@@ -1,9 +1,11 @@
 <template>
   <div class="min-h-full">
     <Hero />
+    <PublicNews />
   </div>
 </template>
 
 <script setup>
 import Hero from '~/components/Hero.vue'
+import PublicNews from '~/components/PublicNews.vue'
 </script>

pages/mitgliederbereich/news.vue

@@ -32,9 +32,18 @@
         >
           <div class="flex justify-between items-start mb-4">
             <div class="flex-1">
-              <h2 class="text-2xl font-display font-bold text-gray-900 mb-2">
-                {{ item.title }}
-              </h2>
+              <div class="flex items-center space-x-3 mb-2">
+                <h2 class="text-2xl font-display font-bold text-gray-900">
+                  {{ item.title }}
+                </h2>
+                <span
+                  v-if="item.isPublic"
+                  class="px-3 py-1 bg-blue-100 text-blue-800 text-xs font-semibold rounded-full flex items-center"
+                >
+                  <Globe :size="14" class="mr-1" />
+                  Öffentlich
+                </span>
+              </div>
               <div class="flex items-center text-sm text-gray-500 space-x-4">
                 <div class="flex items-center">
                   <User :size="16" class="mr-1" />
@@ -117,6 +126,25 @@
               />
             </div>
 
+            <div class="flex items-center space-x-3 p-4 bg-blue-50 rounded-lg border border-blue-200">
+              <input
+                id="isPublic"
+                v-model="formData.isPublic"
+                type="checkbox"
+                class="w-5 h-5 text-primary-600 border-gray-300 rounded focus:ring-primary-500"
+                :disabled="isSaving"
+              />
+              <label for="isPublic" class="text-sm font-medium text-gray-900 cursor-pointer flex-1">
+                <div class="flex items-center">
+                  <Globe :size="18" class="mr-2 text-blue-600" />
+                  <span>Öffentliche News (auf Startseite anzeigen)</span>
+                </div>
+                <p class="text-xs text-gray-600 mt-1 ml-6">
+                  Wenn aktiviert, wird diese News auch für nicht angemeldete Besucher auf der Startseite sichtbar.
+                </p>
+              </label>
+            </div>
+
             <div v-if="errorMessage" class="flex items-center p-3 rounded-md bg-red-50 text-red-700 text-sm">
               <AlertCircle :size="20" class="mr-2" />
               {{ errorMessage }}
@@ -149,7 +177,7 @@
 
 <script setup>
 import { ref, computed, onMounted } from 'vue'
-import { Newspaper, Plus, User, Calendar, Edit, Trash2, Loader2, AlertCircle } from 'lucide-vue-next'
+import { Newspaper, Plus, User, Calendar, Edit, Trash2, Loader2, AlertCircle, Globe } from 'lucide-vue-next'
 
 const authStore = useAuthStore()
 
@@ -162,7 +190,8 @@ const errorMessage = ref('')
 
 const formData = ref({
   title: '',
-  content: ''
+  content: '',
+  isPublic: false
 })
 
 const canWrite = computed(() => {
@@ -185,7 +214,8 @@ const openAddModal = () => {
   editingNews.value = null
   formData.value = {
     title: '',
-    content: ''
+    content: '',
+    isPublic: false
   }
   showModal.value = true
   errorMessage.value = ''
@@ -195,7 +225,8 @@ const openEditModal = (item) => {
   editingNews.value = item
   formData.value = {
     title: item.title,
-    content: item.content
+    content: item.content,
+    isPublic: item.isPublic || false
   }
   showModal.value = true
   errorMessage.value = ''