src/components/admin/MemberSearchSelect.vue

@@ -19,25 +19,13 @@
           <ComboboxOptions
             class="absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-md ring-1 ring-black/5 focus:outline-none sm:text-sm"
           >
-            <ComboboxOption v-if="loading || deferingSearch" as="template" disabled>
-              <li class="flex flex-row gap-2 text-text relative cursor-default select-none py-2 pl-3 pr-4">
-                <Spinner />
-                <span class="font-normal block truncate">suche</span>
-              </li>
-            </ComboboxOption>
-            <ComboboxOption v-else-if="filtered.length === 0 && query == ''" as="template" disabled>
+            <ComboboxOption v-if="filtered.length === 0" as="template" disabled>
               <li class="text-text relative cursor-default select-none py-2 pl-3 pr-4">
-                <span class="font-normal block truncate">tippe, um zu suchen...</span>
-              </li>
-            </ComboboxOption>
-            <ComboboxOption v-else-if="filtered.length === 0" as="template" disabled>
-              <li class="text-text relative cursor-default select-none py-2 pl-3 pr-4">
-                <span class="font-normal block truncate">Keine Auswahl gefunden.</span>
+                <span class="font-normal block truncate">Keine Auswahl</span>
               </li>
             </ComboboxOption>
 
             <ComboboxOption
-              v-if="!(loading || deferingSearch)"
               v-for="member in filtered"
               as="template"
               :key="member.id"
@@ -86,7 +74,6 @@ import { CheckIcon, ChevronUpDownIcon } from "@heroicons/vue/20/solid";
 import { useMemberStore } from "@/stores/admin/club/member/member";
 import type { MemberViewModel } from "@/viewmodels/admin/club/member/member.models";
 import difference from "lodash.difference";
-import Spinner from "../Spinner.vue";
 </script>
 
 <script lang="ts">
@@ -155,7 +142,6 @@ export default defineComponent({
     ...mapActions(useMemberStore, ["searchMembers", "getMembersByIds"]),
     search() {
       this.filtered = [];
-      if (this.query == "") return;
       this.loading = true;
       this.searchMembers(this.query)
         .then((res) => {

src/stores/admin/club/member/member.ts

@@ -40,11 +40,6 @@ export const useMemberStore = defineStore("member", {
           this.loading = "failed";
         });
     },
-    async getAllMembers(): Promise<AxiosResponse<any, any>> {
-      return await http.get(`/admin/member?noLimit=true`).then((res) => {
-        return { ...res, data: res.data.members };
-      });
-    },
     async getMembersByIds(ids: Array<number>): Promise<AxiosResponse<any, any>> {
       return await http.get(`/admin/member?ids=${ids.join(",")}&noLimit=true`).then((res) => {
         return { ...res, data: res.data.members };

src/views/admin/club/newsletter/NewsletterRecipients.vue

@@ -27,6 +27,8 @@
       title="weitere Empfänger suchen"
       v-model="recipients"
       :disabled="!can('create', 'club', 'newsletter')"
+      @add:member="(s) => members.push(s)"
+      @add:member-by-array="(s) => members.push(...s)"
     />
 
     <p>Ausgewählte Empfänger</p>
@@ -147,10 +149,9 @@ export default defineComponent({
     // this.fetchNewsletterRecipients();
     this.fetchQueries();
     this.loadQuery();
-    this.loadMembers();
   },
   methods: {
-    ...mapActions(useMemberStore, ["getAllMembers"]),
+    ...mapActions(useMemberStore, ["fetchMembers"]),
     ...mapActions(useNewsletterRecipientsStore, ["fetchNewsletterRecipients"]),
     ...mapActions(useQueryStoreStore, ["fetchQueries"]),
     ...mapActions(useQueryBuilderStore, ["sendQuery"]),
@@ -160,13 +161,6 @@ export default defineComponent({
         this.recipients.splice(index, 1);
       }
     },
-    loadMembers() {
-      this.getAllMembers()
-        .then((res) => {
-          this.members = res.data;
-        })
-        .catch(() => {});
-    },
     loadQuery() {
       if (this.recipientsByQuery) {
         this.sendQuery(0, 1000, this.recipientsByQuery.query);