create, edit, delete member related Data

This commit is contained in:
Julian Krauser 2024-09-27 14:55:49 +02:00
parent 585ff008b9
commit 27a4d2187d
36 changed files with 2375 additions and 70 deletions

View file

@ -4,23 +4,27 @@
<MemberAwardListItem v-for="award in memberAwards" :key="award.id" :award="award" />
</div>
<Spinner v-if="loading == 'loading'" class="mx-auto" />
<p v-else-if="loading == 'failed'">laden fehlgeschlagen</p>
<p v-else-if="loading == 'failed'" @click="fetchItem" class="cursor-pointer">&#8634; laden fehlgeschlagen</p>
</div>
<div class="flex flex-row gap-4">
<button primary class="!w-fit" @click="">Auszeichnung hinzufügen</button>
<button primary class="!w-fit" @click="openCreateModal">Auszeichnung hinzufügen</button>
</div>
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { defineAsyncComponent, defineComponent, markRaw } from "vue";
import { mapActions, mapState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import { useMemberAwardStore } from "@/stores/admin/memberAward";
import MemberAwardListItem from "@/components/admin/club/member/MemberAwardListItem.vue";
import { useModalStore } from "@/stores/modal";
</script>
<script lang="ts">
export default defineComponent({
props: {
memberId: String,
},
computed: {
...mapState(useMemberAwardStore, ["memberAwards", "loading"]),
},
@ -29,9 +33,15 @@ export default defineComponent({
},
methods: {
...mapActions(useMemberAwardStore, ["fetchMemberAwardsForMember"]),
...mapActions(useModalStore, ["openModal"]),
fetchItem() {
this.fetchMemberAwardsForMember();
},
openCreateModal() {
this.openModal(
markRaw(defineAsyncComponent(() => import("@/components/admin/club/member/MemberAwardCreateModal.vue")))
);
},
},
});
</script>

View file

@ -8,15 +8,15 @@
/>
</div>
<Spinner v-if="loading == 'loading'" class="mx-auto" />
<p v-else-if="loading == 'failed'">laden fehlgeschlagen</p>
<p v-else-if="loading == 'failed'" @click="fetchItem" class="cursor-pointer">&#8634; laden fehlgeschlagen</p>
</div>
<div class="flex flex-row gap-4">
<button primary class="!w-fit" @click="">Kommunikation hinzufügen</button>
<button primary class="!w-fit" @click="openCreateModal">Kommunikation hinzufügen</button>
</div>
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { defineAsyncComponent, defineComponent, markRaw } from "vue";
import { mapActions, mapState } from "pinia";
import { useMemberStore } from "@/stores/admin/member";
import type { MemberViewModel, UpdateMemberViewModel } from "@/viewmodels/admin/member.models";
@ -24,10 +24,14 @@ import Spinner from "@/components/Spinner.vue";
import type { CommunicationViewModel } from "@/viewmodels/admin/communication.models";
import { useCommunicationStore } from "@/stores/admin/communication";
import MemberCommunicationListItem from "@/components/admin/club/member/MemberCommunicationListItem.vue";
import { useModalStore } from "@/stores/modal";
</script>
<script lang="ts">
export default defineComponent({
props: {
memberId: String,
},
computed: {
...mapState(useCommunicationStore, ["communications", "loading"]),
},
@ -36,9 +40,15 @@ export default defineComponent({
},
methods: {
...mapActions(useCommunicationStore, ["fetchCommunicationsForMember"]),
...mapActions(useModalStore, ["openModal"]),
fetchItem() {
this.fetchCommunicationsForMember();
},
openCreateModal() {
this.openModal(
markRaw(defineAsyncComponent(() => import("@/components/admin/club/member/MemberCommunicationCreateModal.vue")))
);
},
},
});
</script>

View file

@ -8,23 +8,27 @@
/>
</div>
<Spinner v-if="loading == 'loading'" class="mx-auto" />
<p v-else-if="loading == 'failed'">laden fehlgeschlagen</p>
<p v-else-if="loading == 'failed'" @click="fetchItem" class="cursor-pointer">&#8634; laden fehlgeschlagen</p>
</div>
<div class="flex flex-row gap-4">
<button primary class="!w-fit" @click="">Vereinsamt hinzufügen</button>
<button primary class="!w-fit" @click="openCreateModal">Vereinsamt hinzufügen</button>
</div>
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { defineAsyncComponent, defineComponent, markRaw } from "vue";
import { mapActions, mapState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import { useMemberExecutivePositionStore } from "@/stores/admin/memberExecutivePosition";
import MemberExecutivePositionListItem from "@/components/admin/club/member/MemberExecutivePositionListItem.vue";
import { useModalStore } from "@/stores/modal";
</script>
<script lang="ts">
export default defineComponent({
props: {
memberId: String,
},
computed: {
...mapState(useMemberExecutivePositionStore, ["memberExecutivePositions", "loading"]),
},
@ -33,9 +37,17 @@ export default defineComponent({
},
methods: {
...mapActions(useMemberExecutivePositionStore, ["fetchMemberExecutivePositionsForMember"]),
...mapActions(useModalStore, ["openModal"]),
fetchItem() {
this.fetchMemberExecutivePositionsForMember();
},
openCreateModal() {
this.openModal(
markRaw(
defineAsyncComponent(() => import("@/components/admin/club/member/MemberExecutivePositionCreateModal.vue"))
)
);
},
},
});
</script>

View file

@ -58,17 +58,19 @@
</div>
<div v-if="activeMemberObj.preferredCommunication?.length != 0">
<p>bevorzugte Kommunikationswege</p>
<div
v-for="com in activeMemberObj.preferredCommunication"
class="flex flex-col h-fit w-full border border-primary rounded-md"
>
<div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
<p>
{{ com.type.type }}
</p>
</div>
<div class="p-2">
<p v-for="field in com.type.fields" :key="field">{{ field }}: {{ com[field] || "--" }}</p>
<div class="flex flex-col gap-2">
<div
v-for="com in activeMemberObj.preferredCommunication"
class="flex flex-col h-fit w-full border border-primary rounded-md"
>
<div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
<p>
{{ com.type.type }}
</p>
</div>
<div class="p-2">
<p v-for="field in com.type.fields" :key="field">{{ field }}: {{ com[field] || "--" }}</p>
</div>
</div>
</div>
</div>
@ -90,7 +92,9 @@
</div>
<Spinner v-if="loadingActive == 'loading'" class="mx-auto" />
<p v-else-if="loadingActive == 'failed'">laden fehlgeschlagen</p>
<p v-else-if="loadingActive == 'failed'" @click="fetchMemberByActiveId" class="cursor-pointer">
&#8634; laden fehlgeschlagen
</p>
</div>
</template>
@ -103,6 +107,9 @@ import { useMemberStore } from "@/stores/admin/member";
<script lang="ts">
export default defineComponent({
props: {
memberId: String,
},
computed: {
...mapState(useMemberStore, ["activeMemberObj", "loadingActive"]),
},

View file

@ -8,23 +8,27 @@
/>
</div>
<Spinner v-if="loading == 'loading'" class="mx-auto" />
<p v-else-if="loading == 'failed'">laden fehlgeschlagen</p>
<p v-else-if="loading == 'failed'" @click="fetchItem" class="cursor-pointer">&#8634; laden fehlgeschlagen</p>
</div>
<div class="flex flex-row gap-4">
<button primary class="!w-fit" @click="">Qualifikation hinzufügen</button>
<button primary class="!w-fit" @click="openCreateModal">Qualifikation hinzufügen</button>
</div>
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { defineAsyncComponent, defineComponent, markRaw } from "vue";
import { mapActions, mapState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import { useMemberQualificationStore } from "@/stores/admin/memberQualification";
import MemberQualificationListItem from "@/components/admin/club/member/MemberQualificationListItem.vue";
import { useModalStore } from "@/stores/modal";
</script>
<script lang="ts">
export default defineComponent({
props: {
memberId: String,
},
computed: {
...mapState(useMemberQualificationStore, ["memberQualifications", "loading"]),
},
@ -33,9 +37,15 @@ export default defineComponent({
},
methods: {
...mapActions(useMemberQualificationStore, ["fetchMemberQualificationsForMember"]),
...mapActions(useModalStore, ["openModal"]),
fetchItem() {
this.fetchMemberQualificationsForMember();
},
openCreateModal() {
this.openModal(
markRaw(defineAsyncComponent(() => import("@/components/admin/club/member/MemberQualificationCreateModal.vue")))
);
},
},
});
</script>

View file

@ -4,23 +4,27 @@
<MembershipListItem v-for="membership in memberships" :key="membership.id" :membership="membership" />
</div>
<Spinner v-if="loading == 'loading'" class="mx-auto" />
<p v-else-if="loading == 'failed'">laden fehlgeschlagen</p>
<p v-else-if="loading == 'failed'" @click="fetchItem" class="cursor-pointer">&#8634; laden fehlgeschlagen</p>
</div>
<div class="flex flex-row gap-4">
<button primary class="!w-fit" @click="">Mitgliedschaft hinzufügen</button>
<button primary class="!w-fit" @click="openCreateModal">Mitgliedschaft hinzufügen</button>
</div>
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { defineComponent, markRaw, defineAsyncComponent } from "vue";
import { mapActions, mapState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import { useMembershipStore } from "@/stores/admin/membership";
import { useModalStore } from "@/stores/modal";
import MembershipListItem from "@/components/admin/club/member/MembershipListItem.vue";
</script>
<script lang="ts">
export default defineComponent({
props: {
memberId: String,
},
computed: {
...mapState(useMembershipStore, ["memberships", "loading"]),
},
@ -29,9 +33,15 @@ export default defineComponent({
},
methods: {
...mapActions(useMembershipStore, ["fetchMembershipsForMember"]),
...mapActions(useModalStore, ["openModal"]),
fetchItem() {
this.fetchMembershipsForMember();
},
openCreateModal() {
this.openModal(
markRaw(defineAsyncComponent(() => import("@/components/admin/club/member/MembershipCreateModal.vue")))
);
},
},
});
</script>