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

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

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