Add: Tags for member overview

resources/js/components/VBool.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="bool" :class="value ? 'enabled' : 'disabled'">
+    <div class="bool" v-tooltip="comment" :class="value ? 'enabled' : 'disabled'">
         <svg-sprite v-if="!$slots.default" :src="value ? 'check' : 'close'"></svg-sprite>
         <slot></slot>
     </div>
@@ -8,13 +8,25 @@
 <script>
 export default {
     props: {
-        value: {}
+        value: {},
+        trueComment: {},
+        falseComment: {},
     },
 
     computed: {
         t() {
             return this.value ? 'Ja' : 'Nein';
-        }
+        },
-    }
+        comment() {
+            if (this.value && this.trueComment) {
+                return this.trueComment;
+            }
+            if (!this.value && this.falseComment) {
+                return this.falseComment;
+            }
+
+            return '';
+        },
+    },
 };
 </script>

resources/js/views/member/VIndex.vue

@@ -40,9 +40,24 @@
                 <td v-text="`${member.location}`"></td>
                 <td>
                     <div class="bool-row">
-                        <v-bool v-model="member.send_newspaper">M</v-bool>
+                        <v-bool
-                        <v-bool v-model="member.has_nami">N</v-bool>
+                            true-comment="Mittendrin abonniert"
-                        <v-bool v-model="member.is_confirmed">C</v-bool>
+                            false-comment="Mittendrin nicht abonníert"
+                            v-model="member.send_newspaper"
+                            >M</v-bool
+                        >
+                        <v-bool
+                            true-comment="In NaMi eingetragen"
+                            false-comment="Nicht in NaMi eingetragen"
+                            v-model="member.has_nami"
+                            >N</v-bool
+                        >
+                        <v-bool
+                            true-comment="Daten bestätigt"
+                            false-comment="Daten warten auf Bestätigung"
+                            v-model="member.is_confirmed"
+                            >C</v-bool
+                        >
                     </div>
                 </td>
                 <td v-text="member.subscription_name"></td>