mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
Implement switching of tabs and updating list
This commit is contained in:
parent
4278c75d52
commit
c9ef1bc5ce
@ -1,7 +1,7 @@
|
|||||||
import gql from 'graphql-tag'
|
import gql from 'graphql-tag'
|
||||||
|
|
||||||
export default app => {
|
export default (i18n) => {
|
||||||
const lang = app.$i18n.locale().toUpperCase()
|
const lang = i18n.locale().toUpperCase()
|
||||||
return gql(`
|
return gql(`
|
||||||
query Post($filter: _PostFilter, $first: Int, $offset: Int) {
|
query Post($filter: _PostFilter, $first: Int, $offset: Int) {
|
||||||
Post(filter: $filter, first: $first, offset: $offset, orderBy: createdAt_desc) {
|
Post(filter: $filter, first: $first, offset: $offset, orderBy: createdAt_desc) {
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import gql from 'graphql-tag'
|
import gql from 'graphql-tag'
|
||||||
|
|
||||||
export default app => {
|
export default (i18n) => {
|
||||||
const lang = app.$i18n.locale().toUpperCase()
|
const lang = i18n.locale().toUpperCase()
|
||||||
return gql(`
|
return gql(`
|
||||||
query User($id: ID!) {
|
query User($id: ID!) {
|
||||||
User(id: $id) {
|
User(id: $id) {
|
||||||
|
|||||||
@ -223,6 +223,17 @@ import HcUpload from '~/components/Upload'
|
|||||||
import HcAvatar from '~/components/Avatar/Avatar.vue'
|
import HcAvatar from '~/components/Avatar/Avatar.vue'
|
||||||
import PostMutationHelpers from '~/mixins/PostMutationHelpers'
|
import PostMutationHelpers from '~/mixins/PostMutationHelpers'
|
||||||
|
|
||||||
|
import PostQuery from '~/graphql/UserProfile/Post.js'
|
||||||
|
import UserQuery from '~/graphql/UserProfile/User.js'
|
||||||
|
|
||||||
|
const tabToFilterMapping = ({ tab, id }) => {
|
||||||
|
return {
|
||||||
|
post: { author: { id } },
|
||||||
|
comment: { comments_some: { author: { id } } },
|
||||||
|
shout: { shoutedBy_some: { id } },
|
||||||
|
}[tab]
|
||||||
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
User,
|
User,
|
||||||
@ -242,6 +253,7 @@ export default {
|
|||||||
mode: 'out-in',
|
mode: 'out-in',
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
|
const filter = tabToFilterMapping({ tab: 'post', id: this.$route.params.id })
|
||||||
return {
|
return {
|
||||||
User: [],
|
User: [],
|
||||||
Post: [],
|
Post: [],
|
||||||
@ -249,6 +261,7 @@ export default {
|
|||||||
page: 1,
|
page: 1,
|
||||||
pageSize: 6,
|
pageSize: 6,
|
||||||
tabActive: 'post',
|
tabActive: 'post',
|
||||||
|
filter
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -300,9 +313,10 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleTab(str) {
|
handleTab(tab) {
|
||||||
this.$toast.info('!load posts here! =>' + str)
|
this.tabActive = tab
|
||||||
this.tabActive = str
|
this.filter = tabToFilterMapping({ tab, id: this.$route.params.id })
|
||||||
|
this.showMoreContributions()
|
||||||
},
|
},
|
||||||
uniq(items, field = 'id') {
|
uniq(items, field = 'id') {
|
||||||
return uniqBy(items, field)
|
return uniqBy(items, field)
|
||||||
@ -317,17 +331,14 @@ export default {
|
|||||||
this.page++
|
this.page++
|
||||||
this.$apollo.queries.Post.fetchMore({
|
this.$apollo.queries.Post.fetchMore({
|
||||||
variables: {
|
variables: {
|
||||||
filter: { author: { id: this.$route.params.id } },
|
filter: this.filter,
|
||||||
first: this.pageSize,
|
first: this.pageSize,
|
||||||
offset: this.offset,
|
offset: this.offset,
|
||||||
},
|
},
|
||||||
// Transform the previous result with new data
|
// Transform the previous result with new data
|
||||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||||
let output = { Post: this.Post}
|
let output = { Post: this.Post }
|
||||||
output.Post = [
|
output.Post = [...previousResult.Post, ...fetchMoreResult.Post]
|
||||||
...previousResult.Post,
|
|
||||||
...fetchMoreResult.Post,
|
|
||||||
]
|
|
||||||
return output
|
return output
|
||||||
},
|
},
|
||||||
fetchPolicy: 'cache-and-network',
|
fetchPolicy: 'cache-and-network',
|
||||||
@ -337,11 +348,11 @@ export default {
|
|||||||
apollo: {
|
apollo: {
|
||||||
Post: {
|
Post: {
|
||||||
query() {
|
query() {
|
||||||
return require('~/graphql/UserProfile/Post.js').default(this)
|
return PostQuery(this.$i18n)
|
||||||
},
|
},
|
||||||
variables() {
|
variables() {
|
||||||
return {
|
return {
|
||||||
filter: { author: { id: this.$route.params.id } },
|
filter: this.filter,
|
||||||
first: this.pageSize,
|
first: this.pageSize,
|
||||||
offset: 0,
|
offset: 0,
|
||||||
}
|
}
|
||||||
@ -350,7 +361,7 @@ export default {
|
|||||||
},
|
},
|
||||||
User: {
|
User: {
|
||||||
query() {
|
query() {
|
||||||
return require('~/graphql/UserProfile/User.js').default(this)
|
return UserQuery(this.$i18n)
|
||||||
},
|
},
|
||||||
variables() {
|
variables() {
|
||||||
return { id: this.$route.params.id }
|
return { id: this.$route.params.id }
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user