diff --git a/src/components/CommunityComponents/CommunitySettings.vue b/src/components/CommunityComponents/CommunitySettings.vue new file mode 100644 index 0000000000000000000000000000000000000000..9e6b3d4484c26cffbafd66a1c0bf1f516ff1cd6c --- /dev/null +++ b/src/components/CommunityComponents/CommunitySettings.vue @@ -0,0 +1,28 @@ +<template> + <div class="grid place-content-center h-48"> + <IconButton + @click="deleteCommunity" + :buttonColor="'red'" + :text="'Slett felleskap'" + /> + </div> +</template> + +<script> +// import AdminService from "@/services/community-admin.service"; +import IconButton from "@/components/BaseComponents/IconButton.vue"; + +//TODO: OPEN CONFIRMATION DIALOG WHEN DELETING + +export default { + components: { + IconButton, + }, + methods: { + deleteCommunity() { + console.log("DELETED"); + // AdminService.deleteCommunity(this.$route.params.communityID); + }, + }, +}; +</script> diff --git a/src/views/CommunityViews/AdminView.vue b/src/views/CommunityViews/AdminView.vue new file mode 100644 index 0000000000000000000000000000000000000000..271de838c4778ae42fbffd1ffec36d4273b3b3c6 --- /dev/null +++ b/src/views/CommunityViews/AdminView.vue @@ -0,0 +1,51 @@ +<template> + <CommunityHeader :admin="true" class="mb-5" /> + <div class="flex border-b border-gray-200 dark:border-gray-700 overflow-auto"> + <button + v-for="(tab, index) in tabs" + :key="tab" + @click="changeTab(index)" + class="h-10 px-4 py-2 -mb-px text-sm text-center bg-transparent border-b-2 sm:text-base whitespace-nowrap focus:outline-none" + :class="[currentTab === index ? activeClasses : inactiveClasses]" + > + {{ tab }} + </button> + </div> + <MemberList :buttons="['chat', 'kick']" v-if="currentTab === 0" /> + <MemberList :buttons="['accept', 'reject']" v-if="currentTab === 1" /> + <CommunitySettings v-if="currentTab === 2" /> +</template> + +<script> +import MemberList from "@/components/CommunityComponents/MemberList.vue"; +import CommunitySettings from "@/components/CommunityComponents/CommunitySettings.vue"; +import CommunityHeader from "@/components/BaseComponents/CommunityHeader.vue"; + +export default { + name: "CommunityAdminView", + components: { + CommunityHeader, + MemberList, + CommunitySettings, + }, + data() { + return { + tabs: ["Medlemsliste", "Medlemsforespørsler", "Felleskap-innstillinger"], + currentTab: 0, //Currently selected tab (default 0 "Medlemsliste") + }; + }, + methods: { + changeTab(index) { + this.currentTab = index; + }, + }, + computed: { + activeClasses() { + return "text-primary-medium border-primary-medium dark:border-primary-light dark:text-primary-light"; + }, + inactiveClasses() { + return "text-gray-700 border-transparent dark:text-white cursor-base hover:border-gray-400"; + }, + }, +}; +</script>