implement advanced availability logic

src/views/profile/View.vue

@@ -55,10 +55,28 @@ SPDX-License-Identifier: AGPL-3.0-or-later
         </div>
       </Section>
 
-      <Section
-        v-if="profile.availability"
-        title="Verfügbarkeit">
-        <div class="lh-base">{{ profile.availability }}</div>
+      <Section title="Verfügbarkeit">
+        <div class="d-flex align-items-center">
+          <div v-if="profile.availability_status">
+            <i class="bi bi-check-square me-1"></i>
+            ja
+          </div>
+          <div v-else>
+            <i class="bi bi-x-square me-1"></i>
+            nein
+          </div>
+          <span 
+            class="ms-3" 
+            v-if="profile.availability_status && profile.availability_hours_per_week">
+            ({{ profile.availability_hours_per_week }} Stunden pro Woche)
+          </span>
+        </div>
+        <div v-if="profile.availability_text" class="mt-3">
+          <label class="form-label fw-bold">
+            Anmerkungen
+          </label>
+          <div>{{ profile.availability_text }}</div>
+        </div>
       </Section>
 
       <Section