Basix/admin-fe
1
0
Fork 0
forked from AkkomaGang/admin-fe
Code Issues Pull requests Projects Releases Packages Wiki Activity

Chats panel on user profile pulls in list of chats

Browse source
This commit is contained in:
Mary Kate 2020-09-09 15:37:34 -05:00 committed by Angelina Filippova
parent 855f8640b2
commit ffb8f3412c
4 changed files with 138 additions and 72 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/api/users.js
View file

@ -22,6 +22,15 @@ export async function addRight(nicknames, right, authHost, token) {
}) })
} }
export async function fetchUserChats(id, authHost, token) {
return await request({
baseURL: baseName(authHost),
url: `/api/pleroma/admin/users/${id}/chats`,
method: 'get',
headers: authHeaders(token)
})
}
export async function approveUserAccount(nicknames, authHost, token) { export async function approveUserAccount(nicknames, authHost, token) {
return await request({ return await request({
baseURL: baseName(authHost), baseURL: baseName(authHost),

2
src/lang/en.js
View file

@ -309,6 +309,7 @@ export default {
actorType: 'Actor Type', actorType: 'Actor Type',
nickname: 'Nickname', nickname: 'Nickname',
recentStatuses: 'Recent Statuses', recentStatuses: 'Recent Statuses',
chats: 'Chats',
roles: 'Roles', roles: 'Roles',
active: 'Active', active: 'Active',
status: 'Status', status: 'Status',
@ -316,6 +317,7 @@ export default {
deactivated: 'Deactivated', deactivated: 'Deactivated',
pending: 'Pending', pending: 'Pending',
noStatuses: 'No statuses to show', noStatuses: 'No statuses to show',
noChats: 'No chats to show',
openAccountInInstance: 'Open account in instance', openAccountInInstance: 'Open account in instance',
securitySettings: { securitySettings: {
email: 'Email', email: 'Email',

22
src/store/modules/userProfile.js
View file

@ -1,9 +1,11 @@
import { fetchUser, fetchUserStatuses, fetchUserCredentials, updateUserCredentials } from '@/api/users' import { fetchUser, fetchUserStatuses, fetchUserChats, fetchUserCredentials, updateUserCredentials } from '@/api/users'
const userProfile = { const userProfile = {
state: { state: {
statuses: [], statuses: [],
statusesLoading: true, statusesLoading: true,
chats: [],
chatsLoading: true,
user: {}, user: {},
userCredentials: {}, userCredentials: {},
userProfileLoading: true userProfileLoading: true
@ -15,6 +17,12 @@ const userProfile = {
SET_STATUSES_LOADING: (state, status) => { SET_STATUSES_LOADING: (state, status) => {
state.statusesLoading = status state.statusesLoading = status
}, },
SET_CHATS: (state, chats) => {
state.chats = chats
},
SET_CHATS_LOADING: (state, chat) => {
state.chatsLoading = chat
},
SET_USER: (state, user) => { SET_USER: (state, user) => {
state.user = user state.user = user
}, },
@ -34,6 +42,7 @@ const userProfile = {
commit('SET_USER_PROFILE_LOADING', false) commit('SET_USER_PROFILE_LOADING', false)
dispatch('FetchUserStatuses', { userId, godmode }) dispatch('FetchUserStatuses', { userId, godmode })
dispatch('FetchUserChats', { userId })
}, },
FetchUserStatuses({ commit, dispatch, getters }, { userId, godmode }) { FetchUserStatuses({ commit, dispatch, getters }, { userId, godmode }) {
commit('SET_STATUSES_LOADING', true) commit('SET_STATUSES_LOADING', true)
@ -43,6 +52,14 @@ const userProfile = {
commit('SET_STATUSES_LOADING', false) commit('SET_STATUSES_LOADING', false)
}, },
FetchUserChats({ commit, dispatch, getters }, { userId }) {
commit('SET_CHATS_LOADING', true)
fetchUserChats(userId, getters.authHost, getters.token)
.then(chats => dispatch('SetChats', chats.data))
commit('SET_CHATS_LOADING', false)
},
async FetchUserCredentials({ commit, getters }, { nickname }) { async FetchUserCredentials({ commit, getters }, { nickname }) {
const userResponse = await fetchUserCredentials(nickname, getters.authHost, getters.token) const userResponse = await fetchUserCredentials(nickname, getters.authHost, getters.token)
commit('SET_USER_CREDENTIALS', userResponse.data) commit('SET_USER_CREDENTIALS', userResponse.data)
@ -50,6 +67,9 @@ const userProfile = {
SetStatuses({ commit }, statuses) { SetStatuses({ commit }, statuses) {
commit('SET_STATUSES', statuses) commit('SET_STATUSES', statuses)
}, },
SetChats({ commit }, chats) {
commit('SET_CHATS', chats)
},
async UpdateUserCredentials({ dispatch, getters }, { nickname, credentials }) { async UpdateUserCredentials({ dispatch, getters }, { nickname, credentials }) {
await updateUserCredentials(nickname, credentials, getters.authHost, getters.token) await updateUserCredentials(nickname, credentials, getters.authHost, getters.token)
dispatch('FetchUserCredentials', { nickname }) dispatch('FetchUserCredentials', { nickname })

177
src/views/users/show.vue
View file

@ -37,78 +37,97 @@
:reset-password-dialog-open="resetPasswordDialogOpen" :reset-password-dialog-open="resetPasswordDialogOpen"
@close-reset-token-dialog="closeResetPasswordDialog"/> @close-reset-token-dialog="closeResetPasswordDialog"/>
<div class="user-profile-container"> <div class="user-profile-container">
<el-card class="user-profile-card"> <div class="user-cards-container">
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition el-table--medium"> <el-card class="user-profile-card">
<el-tag v-if="!propertyExists(user, 'nickname')" type="info" class="invalid-user-tag"> <div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition el-table--medium">
{{ $t('users.invalidAccount') }} <el-tag v-if="!propertyExists(user, 'nickname')" type="info" class="invalid-user-tag">
</el-tag> {{ $t('users.invalidAccount') }}
<table class="user-profile-table"> </el-tag>
<tbody> <table class="user-profile-table">
<tr class="el-table__row"> <tbody>
<td class="name-col">ID</td> <tr class="el-table__row">
<td> <td class="name-col">ID</td>
{{ user.id }} <td>
</td> {{ user.id }}
</tr> </td>
<tr class="el-table__row"> </tr>
<td>{{ $t('userProfile.actorType') }}</td> <tr class="el-table__row">
<td> <td>{{ $t('userProfile.actorType') }}</td>
<el-tag <td>
:type="userCredentials.actor_type === 'Person' ? 'success' : 'warning'"> <el-tag
{{ userCredentials.actor_type }} :type="userCredentials.actor_type === 'Person' ? 'success' : 'warning'">
</el-tag> {{ userCredentials.actor_type }}
</td> </el-tag>
</tr> </td>
<tr class="el-table__row"> </tr>
<td>{{ $t('userProfile.tags') }}</td> <tr class="el-table__row">
<td> <td>{{ $t('userProfile.tags') }}</td>
<span v-if="user.tags.length === 0 || !propertyExists(user, 'tags')">—</span> <td>
<el-tag v-for="tag in user.tags" v-else :key="tag" class="user-profile-tag">{{ humanizeTag(tag) }}</el-tag> <span v-if="user.tags.length === 0 || !propertyExists(user, 'tags')">—</span>
</td> <el-tag v-for="tag in user.tags" v-else :key="tag" class="user-profile-tag">{{ humanizeTag(tag) }}</el-tag>
</tr> </td>
<tr class="el-table__row"> </tr>
<td>{{ $t('userProfile.roles') }}</td> <tr class="el-table__row">
<td> <td>{{ $t('userProfile.roles') }}</td>
<el-tag v-if="user.roles.admin" class="user-profile-tag"> <td>
{{ $t('users.admin') }} <el-tag v-if="user.roles.admin" class="user-profile-tag">
</el-tag> {{ $t('users.admin') }}
<el-tag v-if="user.roles.moderator" class="user-profile-tag"> </el-tag>
{{ $t('users.moderator') }} <el-tag v-if="user.roles.moderator" class="user-profile-tag">
</el-tag> {{ $t('users.moderator') }}
<span v-if="!propertyExists(user, 'roles') || (!user.roles.moderator && !user.roles.admin)">—</span> </el-tag>
</td> <span v-if="!propertyExists(user, 'roles') || (!user.roles.moderator && !user.roles.admin)">—</span>
</tr> </td>
<tr class="el-table__row"> </tr>
<td>{{ $t('userProfile.accountType') }}</td> <tr class="el-table__row">
<td> <td>{{ $t('userProfile.accountType') }}</td>
<el-tag v-if="user.local" type="info">{{ $t('userProfile.local') }}</el-tag> <td>
<el-tag v-if="!user.local" type="info">{{ $t('userProfile.external') }}</el-tag> <el-tag v-if="user.local" type="info">{{ $t('userProfile.local') }}</el-tag>
</td> <el-tag v-if="!user.local" type="info">{{ $t('userProfile.external') }}</el-tag>
</tr> </td>
<tr class="el-table__row"> </tr>
<td>{{ $t('userProfile.status') }}</td> <tr class="el-table__row">
<td> <td>{{ $t('userProfile.status') }}</td>
<el-tag v-if="user.approval_pending" type="info">{{ $t('userProfile.pending') }}</el-tag> <td>
<el-tag v-if="!user.deactivated & !user.approval_pending" type="success">{{ $t('userProfile.active') }}</el-tag> <el-tag v-if="user.approval_pending" type="info">{{ $t('userProfile.pending') }}</el-tag>
<el-tag v-if="user.deactivated" type="danger">{{ $t('userProfile.deactivated') }}</el-tag> <el-tag v-if="!user.deactivated & !user.approval_pending" type="success">{{ $t('userProfile.active') }}</el-tag>
</td> <el-tag v-if="user.deactivated" type="danger">{{ $t('userProfile.deactivated') }}</el-tag>
</tr> </td>
</tbody> </tr>
</table> </tbody>
<div v-if="user.registration_reason"> </table>
<div class="reason-label">{{ $t('userProfile.reason') }}</div> <div v-if="user.registration_reason">
"{{ user.registration_reason }}" <div class="reason-label">{{ $t('userProfile.reason') }}</div>
"{{ user.registration_reason }}"
</div>
</div> </div>
</div> <el-button v-if="propertyExists(user, 'nickname')" icon="el-icon-lock" class="security-setting-button" @click="securitySettingsModalVisible = true">
<el-button v-if="propertyExists(user, 'nickname')" icon="el-icon-lock" class="security-setting-button" @click="securitySettingsModalVisible = true"> {{ $t('userProfile.securitySettings.securitySettings') }}
{{ $t('userProfile.securitySettings.securitySettings') }} </el-button>
</el-button> <SecuritySettingsModal
<SecuritySettingsModal v-if="propertyExists(user, 'nickname')"
v-if="propertyExists(user, 'nickname')" :user="user"
:user="user" :visible="securitySettingsModalVisible"
:visible="securitySettingsModalVisible" @close="securitySettingsModalVisible = false" />
@close="securitySettingsModalVisible = false" /> </el-card>
</el-card> <el-card class="user-chats-card">
<h2 class="chats">{{ $t('userProfile.chats') }}</h2>
<div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition el-table--medium">
<table class="user-chats-table">
<tbody v-if="!chatsLoading" class="chats">
<tr v-if="statuses.length === 0" class="no-statuses">>
{{ $t('userProfile.noChats') }}
</tr>
<tr v-for="chat in chats" :key="chat.id" class="el-table__row">
<td class="chat-item">
{{ chat.account.acct }}
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</div>
<div class="recent-statuses-container"> <div class="recent-statuses-container">
<h2 class="recent-statuses">{{ $t('userProfile.recentStatuses') }}</h2> <h2 class="recent-statuses">{{ $t('userProfile.recentStatuses') }}</h2>
<el-checkbox v-model="showPrivate" class="show-private-statuses" @change="onTogglePrivate"> <el-checkbox v-model="showPrivate" class="show-private-statuses" @change="onTogglePrivate">
@ -161,6 +180,12 @@ export default {
statusesLoading() { statusesLoading() {
return this.$store.state.userProfile.statusesLoading return this.$store.state.userProfile.statusesLoading
}, },
chats() {
return this.$store.state.userProfile.chats
},
chatsLoading() {
return this.$store.state.userProfile.chatsLoading
},
user() { user() {
return this.$store.state.userProfile.user return this.$store.state.userProfile.user
}, },
@ -315,12 +340,22 @@ table {
display: inline display: inline
} }
} }
.user-cards-container{
display: flex;
flex-direction: column;
}
.user-profile-card { .user-profile-card {
margin: 0 20px; margin: 0 20px;
width: 30%; width: 30%;
min-width: 300px; min-width: 300px;
height: fit-content; height: fit-content;
} }
.user-chats-card {
margin: 20px 20px;
width: 30%;
min-width: 300px;
height: fit-content;
}
.user-profile-container { .user-profile-container {
display: flex; display: flex;
} }