グループ招待の通知とか

Resolve #5880
Resolve #5927
This commit is contained in:
syuilo
2020-02-13 02:17:54 +09:00
parent 037d4b581b
commit 2feef81516
17 changed files with 163 additions and 82 deletions

View File

@ -6,6 +6,7 @@
<fa :icon="faPlus" v-if="notification.type === 'follow'"/>
<fa :icon="faClock" v-if="notification.type === 'receiveFollowRequest'"/>
<fa :icon="faCheck" v-if="notification.type === 'followRequestAccepted'"/>
<fa :icon="faIdCardAlt" v-if="notification.type === 'groupInvited'"/>
<fa :icon="faRetweet" v-if="notification.type === 'renote'"/>
<fa :icon="faReply" v-if="notification.type === 'reply'"/>
<fa :icon="faAt" v-if="notification.type === 'mention'"/>
@ -40,13 +41,14 @@
<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ $t('youGotNewFollower') }}<div v-if="full"><mk-follow-button :user="notification.user" :full="true"/></div></span>
<span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ $t('followRequestAccepted') }}</span>
<span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ $t('receiveFollowRequest') }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ $t('accept') }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ $t('reject') }}</button></div></span>
<span v-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ $t('groupInvited') }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ $t('accept') }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ $t('reject') }}</button></div></span>
</div>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import { faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faCheck } from '@fortawesome/free-solid-svg-icons';
import { faIdCardAlt, faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faCheck } from '@fortawesome/free-solid-svg-icons';
import { faClock } from '@fortawesome/free-regular-svg-icons';
import getNoteSummary from '../../misc/get-note-summary';
import XReactionIcon from './reaction-icon.vue';
@ -78,7 +80,8 @@ export default Vue.extend({
return {
getNoteSummary,
followRequestDone: false,
faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faClock, faCheck
groupInviteDone: false,
faIdCardAlt, faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faClock, faCheck
};
},
methods: {
@ -90,6 +93,18 @@ export default Vue.extend({
this.followRequestDone = true;
this.$root.api('following/requests/reject', { userId: this.notification.user.id });
},
acceptGroupInvitation() {
this.groupInviteDone = true;
this.$root.api('users/groups/invitations/accept', { invitationId: this.notification.invitation.id });
this.$root.dialog({
type: 'success',
iconOnly: true, autoClose: true
});
},
rejectGroupInvitation() {
this.groupInviteDone = true;
this.$root.api('users/groups/invitations/reject', { invitationId: this.notification.invitation.id });
},
}
});
</script>
@ -149,7 +164,7 @@ export default Vue.extend({
height: 100%;
}
&.follow, &.followRequestAccepted, &.receiveFollowRequest {
&.follow, &.followRequestAccepted, &.receiveFollowRequest, &.groupInvited {
padding: 3px;
background: #36aed2;
}

View File

@ -17,13 +17,13 @@
<mk-container :body-togglable="true">
<template #header><fa :icon="faEnvelopeOpenText"/> {{ $t('invites') }}</template>
<mk-pagination :pagination="invitePagination" #default="{items}" ref="invites">
<div class="_frame" v-for="invite in items" :key="invite.id">
<div class="_title">{{ invite.group.name }}</div>
<div class="_content"><mk-avatars :user-ids="invite.group.userIds"/></div>
<mk-pagination :pagination="invitationPagination" #default="{items}" ref="invitations">
<div class="_frame" v-for="invitation in items" :key="invitation.id">
<div class="_title">{{ invitation.group.name }}</div>
<div class="_content"><mk-avatars :user-ids="invitation.group.userIds"/></div>
<div class="_footer">
<mk-button @click="acceptInvite(invite)" primary inline><fa :icon="faCheck"/> {{ $t('accept') }}</mk-button>
<mk-button @click="rejectInvite(invite)" primary inline><fa :icon="faBan"/> {{ $t('reject') }}</mk-button>
<mk-button @click="acceptInvite(invitation)" primary inline><fa :icon="faCheck"/> {{ $t('accept') }}</mk-button>
<mk-button @click="rejectInvite(invitation)" primary inline><fa :icon="faBan"/> {{ $t('reject') }}</mk-button>
</div>
</div>
</mk-pagination>
@ -73,7 +73,7 @@ export default Vue.extend({
endpoint: 'users/groups/joined',
limit: 10,
},
invitePagination: {
invitationPagination: {
endpoint: 'i/user-group-invites',
limit: 10,
},
@ -95,23 +95,23 @@ export default Vue.extend({
iconOnly: true, autoClose: true
});
},
acceptInvite(invite) {
acceptInvite(invitation) {
this.$root.api('users/groups/invitations/accept', {
inviteId: invite.id
invitationId: invitation.id
}).then(() => {
this.$root.dialog({
type: 'success',
iconOnly: true, autoClose: true
});
this.$refs.invites.reload();
this.$refs.invitations.reload();
this.$refs.joined.reload();
});
},
rejectInvite(invite) {
rejectInvite(invitation) {
this.$root.api('users/groups/invitations/reject', {
inviteId: invite.id
invitationId: invitation.id
}).then(() => {
this.$refs.invites.reload();
this.$refs.invitations.reload();
});
}
}