This commit is contained in:
ogerly 2022-09-13 20:46:18 +02:00
parent 41955c5f56
commit f1957c5fe7
9 changed files with 193 additions and 191 deletions

View File

@ -1,6 +1,5 @@
<template> <template>
<div> <div>
<nuxt-link to="/my-groups"><base-button icon="users" circle ghost /></nuxt-link> <nuxt-link to="/my-groups"><base-button icon="users" circle ghost /></nuxt-link>
</div> </div>
</template> </template>

View File

@ -150,49 +150,48 @@ export default {
computed: { computed: {
submitDisable() { submitDisable() {
if ( if (
this.formData.name !== '' this.formData.name !== '' &&
&& this.formData.groupType !== '' this.formData.groupType !== '' &&
&& this.formData.about !== '' this.formData.about !== '' &&
&& this.formData.description !== '' this.formData.description !== '' &&
&& this.formData.actionRadius !== '' this.formData.actionRadius !== '' &&
&& this.formData.categoryIds.length > 0 this.formData.categoryIds.length > 0
) { ) {
return false return false
} }
return true return true
}, },
submitDisableEdit() { submitDisableEdit() {
if ( if (
this.formData.name !== this.group.name this.formData.name !== this.group.name ||
|| this.formData.groupType !== this.group.groupType this.formData.groupType !== this.group.groupType ||
|| this.formData.about !== this.group.about this.formData.about !== this.group.about ||
|| this.formData.description !== this.group.description this.formData.description !== this.group.description ||
|| this.formData.actionRadius !== this.group.actionRadius this.formData.actionRadius !== this.group.actionRadius ||
|| this.formData.categoryIds.length === 0 this.formData.categoryIds.length === 0 ||
|| !this.sameCategories !this.sameCategories
) { ) {
return false return false
} }
return true return true
}, },
sameCategories(){ sameCategories() {
let formDataCategories = this.formData.categoryIds.map((categoryIds) => categoryIds) const formDataCategories = this.formData.categoryIds.map((categoryIds) => categoryIds)
let groupDataCategories = this.group.categories.map((category) => category.id) const groupDataCategories = this.group.categories.map((category) => category.id)
let result let result
let each = true let each = true
if (formDataCategories.length !== groupDataCategories.length) return false if (formDataCategories.length !== groupDataCategories.length) return false
if (JSON.stringify(formDataCategories) !== JSON.stringify(groupDataCategories)) { if (JSON.stringify(formDataCategories) !== JSON.stringify(groupDataCategories)) {
formDataCategories.forEach(element => { formDataCategories.forEach((element) => {
result = groupDataCategories.filter(groupCategorieId => groupCategorieId === element) result = groupDataCategories.filter((groupCategorieId) => groupCategorieId === element)
if (result.length === 0) each = false if (result.length === 0) each = false
}) })
return each return each
} }
return true return true
} },
} },
} }
</script> </script>

View File

@ -1,25 +1,36 @@
<template> <template>
<div> <div>
<ds-container class="group-card"> <ds-container class="group-card">
<ds-space> <ds-space>
<div @click="onlyOwnerGroups(true)" ref="myGruops" >show only my groups</div> <div @click="onlyOwnerGroups(true)" ref="myGruops">show only my groups</div>
<div @click="onlyOwnerGroups(false)" ref="allGruops" hidden>show all groups</div> <div @click="onlyOwnerGroups(false)" ref="allGruops" hidden>show all groups</div>
</ds-space> </ds-space>
<ds-flex v-for="item in items" :key="item.id" class="border-bottom" <ds-flex
:ref="item.myRole === null ? 'null' : item.myRole"> v-for="item in items"
:key="item.id"
class="border-bottom"
:ref="item.myRole === null ? 'null' : item.myRole"
>
<ds-flex-item width="90%" centered> <ds-flex-item width="90%" centered>
{{item.myRole}} {{ item.myRole }}
<ds-space margin="large"> <ds-space margin="large">
<nuxt-link :to="`/group/${item.id}`"> <nuxt-link :to="`/group/${item.id}`">
<ds-text size="x-large">{{ item.name }}</ds-text> <ds-text size="x-large">{{ item.name }}</ds-text>
</nuxt-link> </nuxt-link>
<ds-chip v-if="item.groupType === 'public'" color="primary">{{item.groupType}}</ds-chip> <ds-chip v-if="item.groupType === 'public'" color="primary">
<ds-chip v-if="item.groupType === 'hidden'" color="warning">{{item.groupType}}</ds-chip> {{ item.groupType }}
<ds-chip v-if="item.groupType === 'closed'" color="danger">{{item.groupType}}</ds-chip> </ds-chip>
<ds-chip v-if="item.myRole === 'owner'" color="inverse">{{item.myRole}}</ds-chip> <ds-chip v-if="item.groupType === 'hidden'" color="warning">
<ds-chip v-if="item.myRole === 'usual' || item.myRole === 'pending'">{{item.myRole}}</ds-chip> {{ item.groupType }}
</ds-chip>
<ds-chip v-if="item.groupType === 'closed'" color="danger">
{{ item.groupType }}
</ds-chip>
<ds-chip v-if="item.myRole === 'owner'" color="inverse">{{ item.myRole }}</ds-chip>
<ds-chip v-if="item.myRole === 'usual' || item.myRole === 'pending'">
{{ item.myRole }}
</ds-chip>
<div> <div>
<ds-space margin-top="small"> <ds-space margin-top="small">
@ -29,17 +40,13 @@
<ds-space margin-top="small"> <ds-space margin-top="small">
<ds-chip v-for="category in item.categories" :key="category.name"> <ds-chip v-for="category in item.categories" :key="category.name">
<ds-icon :name="category.icon"></ds-icon> <ds-icon :name="category.icon"></ds-icon>
{{category.name}} {{ category.name }}
</ds-chip> </ds-chip>
</ds-space> </ds-space>
</ds-space> </ds-space>
</ds-flex-item> </ds-flex-item>
<ds-flex-item width="10%" centered> <ds-flex-item width="10%" centered>
<group-menu <group-menu resource-type="group" :resource="item" :isOwner="item.myRole" />
resource-type="group"
:resource="item"
:isOwner="item.myRole"
/>
</ds-flex-item> </ds-flex-item>
</ds-flex> </ds-flex>
</ds-container> </ds-container>
@ -72,34 +79,29 @@ export default {
addMemeberToGroup() { addMemeberToGroup() {
alert('addMemeberToGroup group') alert('addMemeberToGroup group')
}, },
onlyOwnerGroups(bool){ onlyOwnerGroups(bool) {
console.log('bool', bool)
console.log('this.$refs.usual', this.$refs.usual)
console.log('this.$refs.pending', this.$refs.pending)
console.log('this.$refs.null', this.$refs.null)
this.$refs.myGruops.hidden = bool this.$refs.myGruops.hidden = bool
this.$refs.allGruops.hidden = !bool this.$refs.allGruops.hidden = !bool
if (this.$refs.usual) { if (this.$refs.usual) {
this.$refs.usual.forEach(element => { this.$refs.usual.forEach((element) => {
element.$el.hidden = bool}) element.$el.hidden = bool
})
} }
if (this.$refs.null) { if (this.$refs.null) {
this.$refs.null.forEach(element => { this.$refs.null.forEach((element) => {
element.$el.hidden = bool}) element.$el.hidden = bool
})
} }
if (this.$refs.pending) { if (this.$refs.pending) {
this.$refs.pending.forEach(element => { this.$refs.pending.forEach((element) => {
element.$el.hidden = bool}) element.$el.hidden = bool
} })
} }
}, },
},
} }
</script> </script>
<style scoped> <style scoped>

View File

@ -72,7 +72,7 @@ export default {
mutation: changeGroupMemberRoleMutation, mutation: changeGroupMemberRoleMutation,
variables: { groupId: this.groupId, userId: id, roleInGroup: newRole }, variables: { groupId: this.groupId, userId: id, roleInGroup: newRole },
}) })
this.$toast.success('Die Rolle wurde auf ('+newRole+') geändert!') this.$toast.success('Die Rolle wurde auf (' + newRole + ') geändert!')
} catch (error) { } catch (error) {
this.$toast.error(error.message) this.$toast.error(error.message)
} }

View File

@ -42,7 +42,7 @@ export default {
props: { props: {
placement: { type: String, default: 'top-end' }, placement: { type: String, default: 'top-end' },
resource: { type: Object, required: true }, resource: { type: Object, required: true },
isOwner: { type: String, default: false }, isOwner: { type: String, default: null },
resourceType: { resourceType: {
type: String, type: String,
required: true, required: true,
@ -55,7 +55,6 @@ export default {
routes() { routes() {
const routes = [] const routes = []
if (this.resourceType === 'group') { if (this.resourceType === 'group') {
if (this.isOwner === 'owner') { if (this.isOwner === 'owner') {
routes.push({ routes.push({

View File

@ -105,7 +105,6 @@ import InviteButton from '~/components/InviteButton/InviteButton'
import CategoriesMenu from '~/components/FilterMenu/CategoriesMenu.vue' import CategoriesMenu from '~/components/FilterMenu/CategoriesMenu.vue'
import GroupButton from '~/components/Group/GroupButton.vue' import GroupButton from '~/components/Group/GroupButton.vue'
export default { export default {
components: { components: {
Logo, Logo,

View File

@ -1,7 +1,9 @@
<template> <template>
<div><ds-section> <div>
<h1 class="ds-heading ds-heading-h1">Create New Groupe</h1></ds-section> <ds-section>
<ds-space margin="large" > <h1 class="ds-heading ds-heading-h1">Create New Groupe</h1>
</ds-section>
<ds-space margin="large">
<ds-flex :width="{ base: '100%' }" gutter="base"> <ds-flex :width="{ base: '100%' }" gutter="base">
<ds-flex-item :width="{ base: '100%', md: 5 }"> <ds-flex-item :width="{ base: '100%', md: 5 }">
<group-form @createGroup="createGroup" /> <group-form @createGroup="createGroup" />
@ -9,7 +11,6 @@
<ds-flex-item :width="{ base: '100%', md: 1 }">&nbsp;</ds-flex-item> <ds-flex-item :width="{ base: '100%', md: 1 }">&nbsp;</ds-flex-item>
</ds-flex> </ds-flex>
</ds-space> </ds-space>
</div> </div>
</template> </template>

View File

@ -1,9 +1,10 @@
<template> <template>
<div> <div>
<ds-section> <ds-section>
<h1 class="ds-heading ds-heading-h1">{{group.name}}</h1> <h1 class="ds-heading ds-heading-h1">{{ group.name }}</h1>
<div class="">Group Setting</div></ds-section> <div class="">Group Setting</div>
<ds-space margin="large" > </ds-section>
<ds-space margin="large">
<ds-flex gutter="small"> <ds-flex gutter="small">
<ds-flex-item :width="{ base: '100%', md: '200px' }"> <ds-flex-item :width="{ base: '100%', md: '200px' }">
<ds-menu :routes="routes" :is-exact="() => true" /> <ds-menu :routes="routes" :is-exact="() => true" />

View File

@ -1,5 +1,6 @@
<template> <template>
<div><ds-section> <div>
<ds-section>
<h1 class="ds-heading ds-heading-h1">My Groups</h1> <h1 class="ds-heading ds-heading-h1">My Groups</h1>
<nuxt-link :to="{ name: 'group-create' }"> <nuxt-link :to="{ name: 'group-create' }">
<base-button <base-button
@ -14,7 +15,8 @@
circle circle
filled filled
/> />
</nuxt-link></ds-section> </nuxt-link>
</ds-section>
<br /> <br />
<br /> <br />
<group-list :items="responseGroupListQuery" /> <group-list :items="responseGroupListQuery" />