Thomas Citharel
@@ -88,6 +88,11 @@
|
||||
:loading="$apollo.queries.group.loading"
|
||||
paginated
|
||||
backend-pagination
|
||||
:current-page.sync="membersPage"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="group.members.total"
|
||||
:per-page="EVENTS_PER_PAGE"
|
||||
@page-change="onMembersPageChange"
|
||||
@@ -119,8 +124,11 @@
|
||||
<span v-if="props.row.actor.name">{{
|
||||
props.row.actor.name
|
||||
}}</span
|
||||
><span v-else>@{{ usernameWithDomain(props.row.actor) }}</span
|
||||
><br />
|
||||
<span class="is-size-7 has-text-grey"
|
||||
<span
|
||||
v-if="props.row.actor.name"
|
||||
class="is-size-7 has-text-grey"
|
||||
>@{{ usernameWithDomain(props.row.actor) }}</span
|
||||
>
|
||||
</div>
|
||||
@@ -170,11 +178,9 @@
|
||||
</span>
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>{{ $t("Nothing to see here") }}</p>
|
||||
</div>
|
||||
</section>
|
||||
<empty-content icon="account-group" :inline="true">
|
||||
{{ $t("No members found") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</section>
|
||||
@@ -191,6 +197,11 @@
|
||||
:loading="$apollo.queries.group.loading"
|
||||
paginated
|
||||
backend-pagination
|
||||
:current-page.sync="organizedEventsPage"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="group.organizedEvents.total"
|
||||
:per-page="EVENTS_PER_PAGE"
|
||||
@page-change="onOrganizedEventsPageChange"
|
||||
@@ -213,11 +224,9 @@
|
||||
{{ props.row.beginsOn | formatDateTimeString }}
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>{{ $t("Nothing to see here") }}</p>
|
||||
</div>
|
||||
</section>
|
||||
<empty-content icon="account-group" :inline="true">
|
||||
{{ $t("No organized events found") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</section>
|
||||
@@ -234,8 +243,13 @@
|
||||
:loading="$apollo.queries.group.loading"
|
||||
paginated
|
||||
backend-pagination
|
||||
:current-page.sync="postsPage"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="group.posts.total"
|
||||
:per-page="EVENTS_PER_PAGE"
|
||||
:per-page="POSTS_PER_PAGE"
|
||||
@page-change="onPostsPageChange"
|
||||
>
|
||||
<b-table-column field="title" :label="$t('Title')" v-slot="props">
|
||||
@@ -256,11 +270,9 @@
|
||||
{{ props.row.publishAt | formatDateTimeString }}
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>{{ $t("Nothing to see here") }}</p>
|
||||
</div>
|
||||
</section>
|
||||
<empty-content icon="bullhorn" :inline="true">
|
||||
{{ $t("No posts found") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</section>
|
||||
@@ -276,8 +288,14 @@ import { IGroup } from "../../types/actor";
|
||||
import { usernameWithDomain, IActor } from "../../types/actor/actor.model";
|
||||
import RouteName from "../../router/name";
|
||||
import ActorCard from "../../components/Account/ActorCard.vue";
|
||||
import EmptyContent from "../../components/Utils/EmptyContent.vue";
|
||||
import { ApolloCache, FetchResult, InMemoryCache } from "@apollo/client/core";
|
||||
import VueRouter from "vue-router";
|
||||
const { isNavigationFailure, NavigationFailureType } = VueRouter;
|
||||
|
||||
const EVENTS_PER_PAGE = 10;
|
||||
const EVENTS_PER_PAGE = 3;
|
||||
const POSTS_PER_PAGE = 1;
|
||||
const MEMBERS_PER_PAGE = 3;
|
||||
|
||||
@Component({
|
||||
apollo: {
|
||||
@@ -287,8 +305,10 @@ const EVENTS_PER_PAGE = 10;
|
||||
variables() {
|
||||
return {
|
||||
id: this.id,
|
||||
organizedEventsPage: 1,
|
||||
organizedEventsPage: this.organizedEventsPage,
|
||||
organizedEventsLimit: EVENTS_PER_PAGE,
|
||||
postsPage: this.postsPage,
|
||||
postsLimit: POSTS_PER_PAGE,
|
||||
};
|
||||
},
|
||||
skip() {
|
||||
@@ -299,6 +319,7 @@ const EVENTS_PER_PAGE = 10;
|
||||
},
|
||||
components: {
|
||||
ActorCard,
|
||||
EmptyContent,
|
||||
},
|
||||
})
|
||||
export default class AdminGroupProfile extends Vue {
|
||||
@@ -312,14 +333,39 @@ export default class AdminGroupProfile extends Vue {
|
||||
|
||||
EVENTS_PER_PAGE = EVENTS_PER_PAGE;
|
||||
|
||||
organizedEventsPage = 1;
|
||||
POSTS_PER_PAGE = POSTS_PER_PAGE;
|
||||
|
||||
membersPage = 1;
|
||||
|
||||
postsPage = 1;
|
||||
MEMBERS_PER_PAGE = MEMBERS_PER_PAGE;
|
||||
|
||||
MemberRole = MemberRole;
|
||||
|
||||
get organizedEventsPage(): number {
|
||||
return parseInt(
|
||||
(this.$route.query.organizedEventsPage as string) || "1",
|
||||
10
|
||||
);
|
||||
}
|
||||
|
||||
set organizedEventsPage(page: number) {
|
||||
this.pushRouter({ organizedEventsPage: page.toString() });
|
||||
}
|
||||
|
||||
get membersPage(): number {
|
||||
return parseInt((this.$route.query.membersPage as string) || "1", 10);
|
||||
}
|
||||
|
||||
set membersPage(page: number) {
|
||||
this.pushRouter({ membersPage: page.toString() });
|
||||
}
|
||||
|
||||
get postsPage(): number {
|
||||
return parseInt((this.$route.query.postsPage as string) || "1", 10);
|
||||
}
|
||||
|
||||
set postsPage(page: number) {
|
||||
this.pushRouter({ postsPage: page.toString() });
|
||||
}
|
||||
|
||||
get metadata(): Array<Record<string, string>> {
|
||||
if (!this.group) return [];
|
||||
const res: Record<string, string>[] = [
|
||||
@@ -367,64 +413,85 @@ export default class AdminGroupProfile extends Vue {
|
||||
}
|
||||
|
||||
async suspendProfile(): Promise<void> {
|
||||
this.$apollo.mutate<{ suspendProfile: { id: string } }>({
|
||||
mutation: SUSPEND_PROFILE,
|
||||
variables: {
|
||||
id: this.id,
|
||||
},
|
||||
update: (store, { data }) => {
|
||||
if (data == null) return;
|
||||
const profileId = this.id;
|
||||
try {
|
||||
await this.$apollo.mutate<{ suspendProfile: { id: string } }>({
|
||||
mutation: SUSPEND_PROFILE,
|
||||
variables: {
|
||||
id: this.id,
|
||||
},
|
||||
update: (store: ApolloCache<InMemoryCache>, { data }: FetchResult) => {
|
||||
if (data == null) return;
|
||||
const profileId = this.id;
|
||||
|
||||
const profileData = store.readQuery<{ getGroup: IGroup }>({
|
||||
query: GET_GROUP,
|
||||
variables: {
|
||||
id: profileId,
|
||||
},
|
||||
});
|
||||
const profileData = store.readQuery<{ getGroup: IGroup }>({
|
||||
query: GET_GROUP,
|
||||
variables: {
|
||||
id: profileId,
|
||||
},
|
||||
});
|
||||
|
||||
if (!profileData) return;
|
||||
const { getGroup: group } = profileData;
|
||||
group.suspended = true;
|
||||
group.avatar = null;
|
||||
group.name = "";
|
||||
group.summary = "";
|
||||
store.writeQuery({
|
||||
query: GET_GROUP,
|
||||
variables: {
|
||||
id: profileId,
|
||||
},
|
||||
data: { getGroup: group },
|
||||
});
|
||||
},
|
||||
});
|
||||
if (!profileData) return;
|
||||
store.writeQuery({
|
||||
query: GET_GROUP,
|
||||
variables: {
|
||||
id: profileId,
|
||||
},
|
||||
data: {
|
||||
getGroup: {
|
||||
...profileData.getGroup,
|
||||
suspended: true,
|
||||
avatar: null,
|
||||
name: "",
|
||||
summary: "",
|
||||
},
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
this.$notifier.error(this.$t("Error while suspending group") as string);
|
||||
}
|
||||
}
|
||||
|
||||
async unsuspendProfile(): Promise<void> {
|
||||
const profileID = this.id;
|
||||
await this.$apollo.mutate<{ unsuspendProfile: { id: string } }>({
|
||||
mutation: UNSUSPEND_PROFILE,
|
||||
variables: {
|
||||
id: this.id,
|
||||
},
|
||||
refetchQueries: [
|
||||
{
|
||||
query: GET_GROUP,
|
||||
variables: {
|
||||
id: profileID,
|
||||
},
|
||||
try {
|
||||
const profileID = this.id;
|
||||
await this.$apollo.mutate<{ unsuspendProfile: { id: string } }>({
|
||||
mutation: UNSUSPEND_PROFILE,
|
||||
variables: {
|
||||
id: this.id,
|
||||
},
|
||||
],
|
||||
});
|
||||
refetchQueries: [
|
||||
{
|
||||
query: GET_GROUP,
|
||||
variables: {
|
||||
id: profileID,
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
this.$notifier.error(this.$t("Error while suspending group") as string);
|
||||
}
|
||||
}
|
||||
|
||||
async refreshProfile(): Promise<void> {
|
||||
this.$apollo.mutate<{ refreshProfile: IActor }>({
|
||||
mutation: REFRESH_PROFILE,
|
||||
variables: {
|
||||
actorId: this.id,
|
||||
},
|
||||
});
|
||||
try {
|
||||
this.$apollo.mutate<{ refreshProfile: IActor }>({
|
||||
mutation: REFRESH_PROFILE,
|
||||
variables: {
|
||||
actorId: this.id,
|
||||
},
|
||||
});
|
||||
this.$notifier.success(
|
||||
this.$t("Triggered profile refreshment") as string
|
||||
);
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
this.$notifier.error(this.$t("Error while suspending group") as string);
|
||||
}
|
||||
}
|
||||
|
||||
async onOrganizedEventsPageChange(page: number): Promise<void> {
|
||||
@@ -435,24 +502,6 @@ export default class AdminGroupProfile extends Vue {
|
||||
organizedEventsPage: this.organizedEventsPage,
|
||||
organizedEventsLimit: EVENTS_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newOrganizedEvents =
|
||||
fetchMoreResult.group.organizedEvents.elements;
|
||||
return {
|
||||
group: {
|
||||
...previousResult.group,
|
||||
organizedEvents: {
|
||||
__typename: previousResult.group.organizedEvents.__typename,
|
||||
total: previousResult.group.organizedEvents.total,
|
||||
elements: [
|
||||
...previousResult.group.organizedEvents.elements,
|
||||
...newOrganizedEvents,
|
||||
],
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
@@ -464,23 +513,6 @@ export default class AdminGroupProfile extends Vue {
|
||||
memberPage: this.membersPage,
|
||||
memberLimit: EVENTS_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newMembers = fetchMoreResult.group.members.elements;
|
||||
return {
|
||||
group: {
|
||||
...previousResult.group,
|
||||
members: {
|
||||
__typename: previousResult.group.members.__typename,
|
||||
total: previousResult.group.members.total,
|
||||
elements: [
|
||||
...previousResult.group.members.elements,
|
||||
...newMembers,
|
||||
],
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
@@ -490,24 +522,23 @@ export default class AdminGroupProfile extends Vue {
|
||||
variables: {
|
||||
actorId: this.id,
|
||||
postsPage: this.postsPage,
|
||||
postLimit: EVENTS_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newPosts = fetchMoreResult.group.posts.elements;
|
||||
return {
|
||||
group: {
|
||||
...previousResult.group,
|
||||
posts: {
|
||||
__typename: previousResult.group.posts.__typename,
|
||||
total: previousResult.group.posts.total,
|
||||
elements: [...previousResult.group.posts.elements, ...newPosts],
|
||||
},
|
||||
},
|
||||
};
|
||||
postLimit: POSTS_PER_PAGE,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
private async pushRouter(args: Record<string, string>): Promise<void> {
|
||||
try {
|
||||
await this.$router.push({
|
||||
name: RouteName.ADMIN_GROUP_PROFILE,
|
||||
query: { ...this.$route.query, ...args },
|
||||
});
|
||||
} catch (e) {
|
||||
if (isNavigationFailure(e, NavigationFailureType.redirected)) {
|
||||
throw Error(e.toString());
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -74,6 +74,11 @@
|
||||
:loading="$apollo.queries.person.loading"
|
||||
paginated
|
||||
backend-pagination
|
||||
:current-page.sync="organizedEventsPage"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="person.organizedEvents.total"
|
||||
:per-page="EVENTS_PER_PAGE"
|
||||
@page-change="onOrganizedEventsPageChange"
|
||||
@@ -93,11 +98,9 @@
|
||||
</router-link>
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>{{ $t("Nothing to see here") }}</p>
|
||||
</div>
|
||||
</section>
|
||||
<empty-content icon="account-group" :inline="true">
|
||||
{{ $t("No organized events listed") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</section>
|
||||
@@ -115,9 +118,14 @@
|
||||
(participation) => participation.event
|
||||
)
|
||||
"
|
||||
:loading="$apollo.queries.person.loading"
|
||||
:loading="$apollo.loading"
|
||||
paginated
|
||||
backend-pagination
|
||||
:current-page.sync="participationsPage"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="person.participations.total"
|
||||
:per-page="EVENTS_PER_PAGE"
|
||||
@page-change="onParticipationsPageChange"
|
||||
@@ -137,11 +145,115 @@
|
||||
</router-link>
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>{{ $t("Nothing to see here") }}</p>
|
||||
<empty-content icon="account-group" :inline="true">
|
||||
{{ $t("No participations listed") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</section>
|
||||
<section>
|
||||
<h2 class="subtitle">
|
||||
{{
|
||||
$tc("{number} memberships", person.memberships.total, {
|
||||
number: person.memberships.total,
|
||||
})
|
||||
}}
|
||||
</h2>
|
||||
<b-table
|
||||
:data="person.memberships.elements"
|
||||
:loading="$apollo.loading"
|
||||
paginated
|
||||
backend-pagination
|
||||
:current-page.sync="membershipsPage"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="person.memberships.total"
|
||||
:per-page="EVENTS_PER_PAGE"
|
||||
@page-change="onMembershipsPageChange"
|
||||
>
|
||||
<b-table-column
|
||||
field="parent.preferredUsername"
|
||||
:label="$t('Group')"
|
||||
v-slot="props"
|
||||
>
|
||||
<article class="media">
|
||||
<figure
|
||||
class="media-left image is-48x48"
|
||||
v-if="props.row.parent.avatar"
|
||||
>
|
||||
<img
|
||||
class="is-rounded"
|
||||
:src="props.row.parent.avatar.url"
|
||||
alt=""
|
||||
/>
|
||||
</figure>
|
||||
<b-icon
|
||||
class="media-left"
|
||||
v-else
|
||||
size="is-large"
|
||||
icon="account-circle"
|
||||
/>
|
||||
<div class="media-content">
|
||||
<div class="content">
|
||||
<span v-if="props.row.parent.name">{{
|
||||
props.row.parent.name
|
||||
}}</span
|
||||
><br />
|
||||
<span class="is-size-7 has-text-grey"
|
||||
>@{{ usernameWithDomain(props.row.parent) }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
</b-table-column>
|
||||
<b-table-column field="role" :label="$t('Role')" v-slot="props">
|
||||
<b-tag
|
||||
type="is-primary"
|
||||
v-if="props.row.role === MemberRole.ADMINISTRATOR"
|
||||
>
|
||||
{{ $t("Administrator") }}
|
||||
</b-tag>
|
||||
<b-tag
|
||||
type="is-primary"
|
||||
v-else-if="props.row.role === MemberRole.MODERATOR"
|
||||
>
|
||||
{{ $t("Moderator") }}
|
||||
</b-tag>
|
||||
<b-tag v-else-if="props.row.role === MemberRole.MEMBER">
|
||||
{{ $t("Member") }}
|
||||
</b-tag>
|
||||
<b-tag
|
||||
type="is-warning"
|
||||
v-else-if="props.row.role === MemberRole.NOT_APPROVED"
|
||||
>
|
||||
{{ $t("Not approved") }}
|
||||
</b-tag>
|
||||
<b-tag
|
||||
type="is-danger"
|
||||
v-else-if="props.row.role === MemberRole.REJECTED"
|
||||
>
|
||||
{{ $t("Rejected") }}
|
||||
</b-tag>
|
||||
<b-tag
|
||||
type="is-danger"
|
||||
v-else-if="props.row.role === MemberRole.INVITED"
|
||||
>
|
||||
{{ $t("Invited") }}
|
||||
</b-tag>
|
||||
</b-table-column>
|
||||
<b-table-column field="insertedAt" :label="$t('Date')" v-slot="props">
|
||||
<span class="has-text-centered">
|
||||
{{ props.row.insertedAt | formatDateString }}<br />{{
|
||||
props.row.insertedAt | formatTimeString
|
||||
}}
|
||||
</span>
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<empty-content icon="account-group" :inline="true">
|
||||
{{ $t("No memberships found") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</section>
|
||||
@@ -159,8 +271,15 @@ import { IPerson } from "../../types/actor";
|
||||
import { usernameWithDomain } from "../../types/actor/actor.model";
|
||||
import RouteName from "../../router/name";
|
||||
import ActorCard from "../../components/Account/ActorCard.vue";
|
||||
import EmptyContent from "../../components/Utils/EmptyContent.vue";
|
||||
import { ApolloCache, FetchResult, InMemoryCache } from "@apollo/client/core";
|
||||
import VueRouter from "vue-router";
|
||||
import { MemberRole } from "@/types/enums";
|
||||
const { isNavigationFailure, NavigationFailureType } = VueRouter;
|
||||
|
||||
const EVENTS_PER_PAGE = 10;
|
||||
const PARTICIPATIONS_PER_PAGE = 10;
|
||||
const MEMBERSHIPS_PER_PAGE = 10;
|
||||
|
||||
@Component({
|
||||
apollo: {
|
||||
@@ -170,8 +289,12 @@ const EVENTS_PER_PAGE = 10;
|
||||
variables() {
|
||||
return {
|
||||
actorId: this.id,
|
||||
organizedEventsPage: 1,
|
||||
organizedEventsPage: this.organizedEventsPage,
|
||||
organizedEventsLimit: EVENTS_PER_PAGE,
|
||||
participationsPage: this.participationsPage,
|
||||
participationLimit: PARTICIPATIONS_PER_PAGE,
|
||||
membershipsPage: this.membershipsPage,
|
||||
membershipsLimit: MEMBERSHIPS_PER_PAGE,
|
||||
};
|
||||
},
|
||||
skip() {
|
||||
@@ -181,6 +304,7 @@ const EVENTS_PER_PAGE = 10;
|
||||
},
|
||||
components: {
|
||||
ActorCard,
|
||||
EmptyContent,
|
||||
},
|
||||
})
|
||||
export default class AdminProfile extends Vue {
|
||||
@@ -194,9 +318,41 @@ export default class AdminProfile extends Vue {
|
||||
|
||||
EVENTS_PER_PAGE = EVENTS_PER_PAGE;
|
||||
|
||||
organizedEventsPage = 1;
|
||||
PARTICIPATIONS_PER_PAGE = PARTICIPATIONS_PER_PAGE;
|
||||
|
||||
participationsPage = 1;
|
||||
MEMBERSHIPS_PER_PAGE = MEMBERSHIPS_PER_PAGE;
|
||||
|
||||
MemberRole = MemberRole;
|
||||
|
||||
get organizedEventsPage(): number {
|
||||
return parseInt(
|
||||
(this.$route.query.organizedEventsPage as string) || "1",
|
||||
10
|
||||
);
|
||||
}
|
||||
|
||||
set organizedEventsPage(page: number) {
|
||||
this.pushRouter({ organizedEventsPage: page.toString() });
|
||||
}
|
||||
|
||||
get participationsPage(): number {
|
||||
return parseInt(
|
||||
(this.$route.query.participationsPage as string) || "1",
|
||||
10
|
||||
);
|
||||
}
|
||||
|
||||
set participationsPage(page: number) {
|
||||
this.pushRouter({ participationsPage: page.toString() });
|
||||
}
|
||||
|
||||
get membershipsPage(): number {
|
||||
return parseInt((this.$route.query.membershipsPage as string) || "1", 10);
|
||||
}
|
||||
|
||||
set membershipsPage(page: number) {
|
||||
this.pushRouter({ membershipsPage: page.toString() });
|
||||
}
|
||||
|
||||
get metadata(): Array<Record<string, unknown>> {
|
||||
if (!this.person) return [];
|
||||
@@ -233,7 +389,7 @@ export default class AdminProfile extends Vue {
|
||||
variables: {
|
||||
id: this.id,
|
||||
},
|
||||
update: (store, { data }) => {
|
||||
update: (store: ApolloCache<InMemoryCache>, { data }: FetchResult) => {
|
||||
if (data == null) return;
|
||||
const profileId = this.id;
|
||||
|
||||
@@ -248,16 +404,20 @@ export default class AdminProfile extends Vue {
|
||||
|
||||
if (!profileData) return;
|
||||
const { person } = profileData;
|
||||
person.suspended = true;
|
||||
person.avatar = null;
|
||||
person.name = "";
|
||||
person.summary = "";
|
||||
store.writeQuery({
|
||||
query: GET_PERSON,
|
||||
variables: {
|
||||
actorId: profileId,
|
||||
},
|
||||
data: { person },
|
||||
data: {
|
||||
person: {
|
||||
...person,
|
||||
suspended: true,
|
||||
avatar: null,
|
||||
name: "",
|
||||
summary: "",
|
||||
},
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
@@ -283,63 +443,48 @@ export default class AdminProfile extends Vue {
|
||||
});
|
||||
}
|
||||
|
||||
async onOrganizedEventsPageChange(page: number): Promise<void> {
|
||||
this.organizedEventsPage = page;
|
||||
async onOrganizedEventsPageChange(): Promise<void> {
|
||||
await this.$apollo.queries.person.fetchMore({
|
||||
variables: {
|
||||
actorId: this.id,
|
||||
organizedEventsPage: this.organizedEventsPage,
|
||||
organizedEventsLimit: EVENTS_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newOrganizedEvents =
|
||||
fetchMoreResult.person.organizedEvents.elements;
|
||||
return {
|
||||
person: {
|
||||
...previousResult.person,
|
||||
organizedEvents: {
|
||||
__typename: previousResult.person.organizedEvents.__typename,
|
||||
total: previousResult.person.organizedEvents.total,
|
||||
elements: [
|
||||
...previousResult.person.organizedEvents.elements,
|
||||
...newOrganizedEvents,
|
||||
],
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async onParticipationsPageChange(page: number): Promise<void> {
|
||||
this.participationsPage = page;
|
||||
async onParticipationsPageChange(): Promise<void> {
|
||||
await this.$apollo.queries.person.fetchMore({
|
||||
variables: {
|
||||
actorId: this.id,
|
||||
participationPage: this.participationsPage,
|
||||
participationLimit: EVENTS_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newParticipations =
|
||||
fetchMoreResult.person.participations.elements;
|
||||
return {
|
||||
person: {
|
||||
...previousResult.person,
|
||||
participations: {
|
||||
__typename: previousResult.person.participations.__typename,
|
||||
total: previousResult.person.participations.total,
|
||||
elements: [
|
||||
...previousResult.person.participations.elements,
|
||||
...newParticipations,
|
||||
],
|
||||
},
|
||||
},
|
||||
};
|
||||
participationLimit: PARTICIPATIONS_PER_PAGE,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async onMembershipsPageChange(): Promise<void> {
|
||||
await this.$apollo.queries.person.fetchMore({
|
||||
variables: {
|
||||
actorId: this.id,
|
||||
membershipsPage: this.participationsPage,
|
||||
membershipsLimit: MEMBERSHIPS_PER_PAGE,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
private async pushRouter(args: Record<string, string>): Promise<void> {
|
||||
try {
|
||||
await this.$router.push({
|
||||
name: RouteName.ADMIN_PROFILE,
|
||||
query: { ...this.$route.query, ...args },
|
||||
});
|
||||
} catch (e) {
|
||||
if (isNavigationFailure(e, NavigationFailureType.redirected)) {
|
||||
throw Error(e.toString());
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -32,7 +32,6 @@
|
||||
tag="li"
|
||||
active-class="is-active"
|
||||
:to="{ name: RouteName.RELAY_FOLLOWINGS }"
|
||||
exact
|
||||
>
|
||||
<a>
|
||||
<b-icon icon="inbox-arrow-down"></b-icon>
|
||||
@@ -46,7 +45,6 @@
|
||||
tag="li"
|
||||
active-class="is-active"
|
||||
:to="{ name: RouteName.RELAY_FOLLOWERS }"
|
||||
exact
|
||||
>
|
||||
<a>
|
||||
<b-icon icon="inbox-arrow-up"></b-icon>
|
||||
|
||||
@@ -23,6 +23,12 @@
|
||||
paginated
|
||||
backend-pagination
|
||||
backend-filtering
|
||||
:debounce-search="200"
|
||||
:current-page.sync="page"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="groups.total"
|
||||
:per-page="PROFILES_PER_PAGE"
|
||||
@page-change="onPageChange"
|
||||
@@ -81,20 +87,21 @@
|
||||
</template>
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>{{ $t("No profile matches the filters") }}</p>
|
||||
</div>
|
||||
</section>
|
||||
<empty-content icon="account-group" :inline="true">
|
||||
{{ $t("No group matches the filters") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { Component, Vue, Watch } from "vue-property-decorator";
|
||||
import { Component, Vue } from "vue-property-decorator";
|
||||
import { LIST_GROUPS } from "@/graphql/group";
|
||||
import RouteName from "../../router/name";
|
||||
import EmptyContent from "../../components/Utils/EmptyContent.vue";
|
||||
import VueRouter from "vue-router";
|
||||
const { isNavigationFailure, NavigationFailureType } = VueRouter;
|
||||
|
||||
const PROFILES_PER_PAGE = 10;
|
||||
|
||||
@@ -102,7 +109,6 @@ const PROFILES_PER_PAGE = 10;
|
||||
apollo: {
|
||||
groups: {
|
||||
query: LIST_GROUPS,
|
||||
fetchPolicy: "cache-and-network",
|
||||
variables() {
|
||||
return {
|
||||
preferredUsername: this.preferredUsername,
|
||||
@@ -110,54 +116,65 @@ const PROFILES_PER_PAGE = 10;
|
||||
domain: this.domain,
|
||||
local: this.local,
|
||||
suspended: this.suspended,
|
||||
page: 1,
|
||||
page: this.page,
|
||||
limit: PROFILES_PER_PAGE,
|
||||
};
|
||||
},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
EmptyContent,
|
||||
},
|
||||
})
|
||||
export default class GroupProfiles extends Vue {
|
||||
page = 1;
|
||||
|
||||
preferredUsername = "";
|
||||
|
||||
name = "";
|
||||
|
||||
domain = "";
|
||||
|
||||
local = true;
|
||||
|
||||
suspended = false;
|
||||
|
||||
PROFILES_PER_PAGE = PROFILES_PER_PAGE;
|
||||
|
||||
RouteName = RouteName;
|
||||
|
||||
async onPageChange(page: number): Promise<void> {
|
||||
this.page = page;
|
||||
await this.$apollo.queries.groups.fetchMore({
|
||||
variables: {
|
||||
preferredUsername: this.preferredUsername,
|
||||
name: this.name,
|
||||
domain: this.domain,
|
||||
local: this.local,
|
||||
suspended: this.suspended,
|
||||
page: this.page,
|
||||
limit: PROFILES_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newProfiles = fetchMoreResult.groups.elements;
|
||||
return {
|
||||
groups: {
|
||||
__typename: previousResult.groups.__typename,
|
||||
total: previousResult.groups.total,
|
||||
elements: [...previousResult.groups.elements, ...newProfiles],
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
async onPageChange(): Promise<void> {
|
||||
await this.doFetchMore();
|
||||
}
|
||||
|
||||
get page(): number {
|
||||
return parseInt((this.$route.query.page as string) || "1", 10);
|
||||
}
|
||||
|
||||
set page(page: number) {
|
||||
this.pushRouter({ page: page.toString() });
|
||||
}
|
||||
|
||||
get domain(): string {
|
||||
return (this.$route.query.domain as string) || "";
|
||||
}
|
||||
|
||||
set domain(domain: string) {
|
||||
this.pushRouter({ domain });
|
||||
}
|
||||
|
||||
get preferredUsername(): string {
|
||||
return (this.$route.query.preferredUsername as string) || "";
|
||||
}
|
||||
|
||||
set preferredUsername(preferredUsername: string) {
|
||||
this.pushRouter({ preferredUsername });
|
||||
}
|
||||
|
||||
get local(): boolean {
|
||||
return this.$route.query.local === "1";
|
||||
}
|
||||
|
||||
set local(local: boolean) {
|
||||
this.pushRouter({ local: local ? "1" : "0" });
|
||||
}
|
||||
|
||||
get suspended(): boolean {
|
||||
return this.$route.query.suspended === "1";
|
||||
}
|
||||
|
||||
set suspended(suspended: boolean) {
|
||||
this.pushRouter({ suspended: suspended ? "1" : "0" });
|
||||
}
|
||||
|
||||
onFiltersChange({
|
||||
@@ -169,11 +186,34 @@ export default class GroupProfiles extends Vue {
|
||||
}): void {
|
||||
this.preferredUsername = preferredUsername;
|
||||
this.domain = domain;
|
||||
this.doFetchMore();
|
||||
}
|
||||
|
||||
@Watch("domain")
|
||||
domainNotLocal(): void {
|
||||
this.local = this.domain === "";
|
||||
private async pushRouter(args: Record<string, string>): Promise<void> {
|
||||
try {
|
||||
await this.$router.push({
|
||||
name: RouteName.ADMIN_GROUPS,
|
||||
query: { ...this.$route.query, ...args },
|
||||
});
|
||||
} catch (e) {
|
||||
if (isNavigationFailure(e, NavigationFailureType.redirected)) {
|
||||
throw Error(e.toString());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private async doFetchMore(): Promise<void> {
|
||||
await this.$apollo.queries.groups.fetchMore({
|
||||
variables: {
|
||||
preferredUsername: this.preferredUsername,
|
||||
name: this.name,
|
||||
domain: this.domain,
|
||||
local: this.local,
|
||||
suspended: this.suspended,
|
||||
page: this.page,
|
||||
limit: PROFILES_PER_PAGE,
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -23,6 +23,12 @@
|
||||
paginated
|
||||
backend-pagination
|
||||
backend-filtering
|
||||
:debounce-search="200"
|
||||
:current-page.sync="page"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:total="persons.total"
|
||||
:per-page="PROFILES_PER_PAGE"
|
||||
@page-change="onPageChange"
|
||||
@@ -81,20 +87,21 @@
|
||||
</template>
|
||||
</b-table-column>
|
||||
<template slot="empty">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>{{ $t("No profile matches the filters") }}</p>
|
||||
</div>
|
||||
</section>
|
||||
<empty-content icon="account" :inline="true">
|
||||
{{ $t("No profile matches the filters") }}
|
||||
</empty-content>
|
||||
</template>
|
||||
</b-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { Component, Vue, Watch } from "vue-property-decorator";
|
||||
import { Component, Vue } from "vue-property-decorator";
|
||||
import { LIST_PROFILES } from "../../graphql/actor";
|
||||
import RouteName from "../../router/name";
|
||||
import EmptyContent from "../../components/Utils/EmptyContent.vue";
|
||||
import VueRouter from "vue-router";
|
||||
const { isNavigationFailure, NavigationFailureType } = VueRouter;
|
||||
|
||||
const PROFILES_PER_PAGE = 10;
|
||||
|
||||
@@ -110,53 +117,88 @@ const PROFILES_PER_PAGE = 10;
|
||||
domain: this.domain,
|
||||
local: this.local,
|
||||
suspended: this.suspended,
|
||||
page: 1,
|
||||
page: this.page,
|
||||
limit: PROFILES_PER_PAGE,
|
||||
};
|
||||
},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
EmptyContent,
|
||||
},
|
||||
})
|
||||
export default class Profiles extends Vue {
|
||||
page = 1;
|
||||
|
||||
preferredUsername = "";
|
||||
|
||||
name = "";
|
||||
|
||||
domain = "";
|
||||
|
||||
local = true;
|
||||
|
||||
suspended = false;
|
||||
|
||||
PROFILES_PER_PAGE = PROFILES_PER_PAGE;
|
||||
|
||||
RouteName = RouteName;
|
||||
|
||||
async onPageChange(page: number): Promise<void> {
|
||||
this.page = page;
|
||||
async onPageChange(): Promise<void> {
|
||||
await this.doFetchMore();
|
||||
}
|
||||
|
||||
get page(): number {
|
||||
return parseInt((this.$route.query.page as string) || "1", 10);
|
||||
}
|
||||
|
||||
set page(page: number) {
|
||||
this.pushRouter({ page: page.toString() });
|
||||
}
|
||||
|
||||
get domain(): string {
|
||||
return (this.$route.query.domain as string) || "";
|
||||
}
|
||||
|
||||
set domain(domain: string) {
|
||||
this.pushRouter({ domain });
|
||||
}
|
||||
|
||||
get preferredUsername(): string {
|
||||
return (this.$route.query.preferredUsername as string) || "";
|
||||
}
|
||||
|
||||
set preferredUsername(preferredUsername: string) {
|
||||
this.pushRouter({ preferredUsername });
|
||||
}
|
||||
|
||||
get local(): boolean {
|
||||
return this.$route.query.local === "1";
|
||||
}
|
||||
|
||||
set local(local: boolean) {
|
||||
this.pushRouter({ local: local ? "1" : "0" });
|
||||
}
|
||||
|
||||
get suspended(): boolean {
|
||||
return this.$route.query.suspended === "1";
|
||||
}
|
||||
|
||||
set suspended(suspended: boolean) {
|
||||
this.pushRouter({ suspended: suspended ? "1" : "0" });
|
||||
}
|
||||
|
||||
private async pushRouter(args: Record<string, string>): Promise<void> {
|
||||
try {
|
||||
await this.$router.push({
|
||||
name: RouteName.PROFILES,
|
||||
query: { ...this.$route.query, ...args },
|
||||
});
|
||||
} catch (e) {
|
||||
if (isNavigationFailure(e, NavigationFailureType.redirected)) {
|
||||
throw Error(e.toString());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private async doFetchMore(): Promise<void> {
|
||||
await this.$apollo.queries.persons.fetchMore({
|
||||
variables: {
|
||||
preferredUsername: this.preferredUsername,
|
||||
name: this.name,
|
||||
domain: this.domain,
|
||||
local: this.local,
|
||||
suspended: this.suspended,
|
||||
page: this.page,
|
||||
limit: PROFILES_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newProfiles = fetchMoreResult.persons.elements;
|
||||
return {
|
||||
persons: {
|
||||
__typename: previousResult.persons.__typename,
|
||||
total: previousResult.persons.total,
|
||||
elements: [...previousResult.persons.elements, ...newProfiles],
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
@@ -169,11 +211,7 @@ export default class Profiles extends Vue {
|
||||
}): void {
|
||||
this.preferredUsername = preferredUsername;
|
||||
this.domain = domain;
|
||||
}
|
||||
|
||||
@Watch("domain")
|
||||
domainNotLocal(): void {
|
||||
this.local = this.domain === "";
|
||||
this.doFetchMore();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -22,6 +22,11 @@
|
||||
backend-pagination
|
||||
backend-filtering
|
||||
detailed
|
||||
:current-page.sync="page"
|
||||
:aria-next-label="$t('Next page')"
|
||||
:aria-previous-label="$t('Previous page')"
|
||||
:aria-page-label="$t('Page')"
|
||||
:aria-current-label="$t('Current page')"
|
||||
:show-detail-icon="true"
|
||||
:total="users.total"
|
||||
:per-page="USERS_PER_PAGE"
|
||||
@@ -108,6 +113,8 @@
|
||||
import { Component, Vue } from "vue-property-decorator";
|
||||
import { LIST_USERS } from "../../graphql/user";
|
||||
import RouteName from "../../router/name";
|
||||
import VueRouter from "vue-router";
|
||||
const { isNavigationFailure, NavigationFailureType } = VueRouter;
|
||||
|
||||
const USERS_PER_PAGE = 10;
|
||||
|
||||
@@ -119,7 +126,7 @@ const USERS_PER_PAGE = 10;
|
||||
variables() {
|
||||
return {
|
||||
email: this.email,
|
||||
page: 1,
|
||||
page: this.page,
|
||||
limit: USERS_PER_PAGE,
|
||||
};
|
||||
},
|
||||
@@ -127,14 +134,26 @@ const USERS_PER_PAGE = 10;
|
||||
},
|
||||
})
|
||||
export default class Users extends Vue {
|
||||
page = 1;
|
||||
|
||||
email = "";
|
||||
|
||||
USERS_PER_PAGE = USERS_PER_PAGE;
|
||||
|
||||
RouteName = RouteName;
|
||||
|
||||
get page(): number {
|
||||
return parseInt((this.$route.query.page as string) || "1", 10);
|
||||
}
|
||||
|
||||
set page(page: number) {
|
||||
this.pushRouter({ page: page.toString() });
|
||||
}
|
||||
|
||||
get email(): string {
|
||||
return (this.$route.query.email as string) || "";
|
||||
}
|
||||
|
||||
set email(email: string) {
|
||||
this.pushRouter({ email });
|
||||
}
|
||||
|
||||
async onPageChange(page: number): Promise<void> {
|
||||
this.page = page;
|
||||
await this.$apollo.queries.users.fetchMore({
|
||||
@@ -143,23 +162,25 @@ export default class Users extends Vue {
|
||||
page: this.page,
|
||||
limit: USERS_PER_PAGE,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newFollowings = fetchMoreResult.users.elements;
|
||||
return {
|
||||
users: {
|
||||
__typename: previousResult.users.__typename,
|
||||
total: previousResult.users.total,
|
||||
elements: [...previousResult.users.elements, ...newFollowings],
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
onFiltersChange({ email }: { email: string }): void {
|
||||
this.email = email;
|
||||
}
|
||||
|
||||
private async pushRouter(args: Record<string, string>): Promise<void> {
|
||||
try {
|
||||
await this.$router.push({
|
||||
name: RouteName.USERS,
|
||||
query: { ...this.$route.query, ...args },
|
||||
});
|
||||
} catch (e) {
|
||||
if (isNavigationFailure(e, NavigationFailureType.redirected)) {
|
||||
throw Error(e.toString());
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user