IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2025-12-13 07:45:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(webapp): group categories on posts

Browse Source
This commit is contained in:
Moriz Wahl 2023-04-25 12:35:46 +02:00
parent e2667a1a98
commit 3244f3f86d
2 changed files with 264 additions and 248 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
webapp/components/CategoriesSelect/CategoriesSelect.vue
View File

@ -20,12 +20,12 @@
</template> </template>
<script> <script>
import CategoryQuery from '~/graphql/CategoryQuery' import CategoryQuery from '~/graphql/CategoryQuery'
import { CATEGORIES_MAX } from '~/constants/categories.js' import { CATEGORIES_MAX } from '~/constants/categories.js'
import xor from 'lodash/xor' import xor from 'lodash/xor'
import SortCategories from '~/mixins/sortCategoriesMixin.js' import SortCategories from '~/mixins/sortCategoriesMixin.js'
export default { export default {
inject: { inject: {
$parentForm: { $parentForm: {
default: null, default: null,
@ -43,6 +43,13 @@ export default {
selectedCategoryIds: this.existingCategoryIds, selectedCategoryIds: this.existingCategoryIds,
} }
}, },
watch: {
existingCategoryIds() {
console.log('existingCategoryIds', this.selectedCategoryIds)
if (!this.selectedCategoryIds.length)
this.selectedCategoryIds = this.existingCategoryIds
},
},
computed: { computed: {
selectedCount() { selectedCount() {
return this.selectedCategoryIds.length return this.selectedCategoryIds.length
@ -78,11 +85,11 @@ export default {
}, },
}, },
}, },
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.categories-select { .categories-select {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -90,5 +97,5 @@ export default {
margin-right: $space-xx-small; margin-right: $space-xx-small;
margin-bottom: $space-xx-small; margin-bottom: $space-xx-small;
} }
} }
</style> </style>

31
webapp/components/ContributionForm/ContributionForm.vue
View File

@ -94,16 +94,16 @@
</template> </template>
<script> <script>
import gql from 'graphql-tag' import gql from 'graphql-tag'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import Editor from '~/components/Editor/Editor' import Editor from '~/components/Editor/Editor'
import PostMutations from '~/graphql/PostMutations.js' import PostMutations from '~/graphql/PostMutations.js'
import CategoriesSelect from '~/components/CategoriesSelect/CategoriesSelect' import CategoriesSelect from '~/components/CategoriesSelect/CategoriesSelect'
import ImageUploader from '~/components/Uploader/ImageUploader' import ImageUploader from '~/components/Uploader/ImageUploader'
import links from '~/constants/links.js' import links from '~/constants/links.js'
import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue' import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
export default { export default {
components: { components: {
Editor, Editor,
ImageUploader, ImageUploader,
@ -138,7 +138,7 @@ export default {
imageAspectRatio, imageAspectRatio,
imageType, imageType,
imageBlurred, imageBlurred,
categoryIds: categories ? categories.map((category) => category.id) : [], categoryIds: categories ? categories.map((category) => category.id) : []
}, },
formSchema: { formSchema: {
title: { required: true, min: 3, max: 100 }, title: { required: true, min: 3, max: 100 },
@ -177,6 +177,15 @@ export default {
groupName() { groupName() {
return this.group && this.group.name return this.group && this.group.name
}, },
groupCategories() {
return this.group && this.group.categories
},
},
watch: {
groupCategories() {
console.log('groupCategories', this.groupCategories)
if (!this.formData.categoryIds && this.groupCategories) this.formData.categoryIds = this.groupCategories
},
}, },
methods: { methods: {
submit() { submit() {
@ -275,7 +284,7 @@ export default {
}, },
}, },
}, },
} }
</script> </script>
<style lang="scss"> <style lang="scss">