2022-11-12 19:35:07 +00:00
|
|
|
<template>
|
|
|
|
<div :label="$t('moderation.users.users')">
|
|
|
|
<div class="content">
|
2022-11-14 17:18:34 +00:00
|
|
|
<div class="users-header">
|
2022-11-12 19:35:07 +00:00
|
|
|
<h2>{{ $t('moderation.users.users') }}</h2>
|
|
|
|
<div class="right-side">
|
|
|
|
<div class="search-input-container">
|
|
|
|
<div class="input-search">
|
|
|
|
<FAIcon
|
|
|
|
class="search-icon fa-scale-110 fa-old-padding"
|
|
|
|
icon="search"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<input
|
|
|
|
v-model="searchTerm"
|
|
|
|
class="search-input"
|
|
|
|
:placeholder="$t('nav.search')"
|
2022-11-14 17:20:40 +00:00
|
|
|
@keyup.enter="search()"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<Popover
|
|
|
|
trigger="click"
|
|
|
|
placement="bottom"
|
|
|
|
:offset="{ x: -45, y: 5 }"
|
|
|
|
remove-padding
|
|
|
|
>
|
|
|
|
<template v-slot:trigger>
|
|
|
|
<button class="button-unstyled">
|
|
|
|
<FAIcon icon="filter" />
|
|
|
|
</button>
|
|
|
|
</template>
|
|
|
|
<template v-slot:content>
|
|
|
|
<div class="dropdown-menu">
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
|
|
|
@click="setAccountType('local')"
|
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': accountType.local }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.local') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
|
|
|
@click="setAccountType('external')"
|
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': accountType.external }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.external') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
2022-11-13 18:05:36 +00:00
|
|
|
@click="setAccountType()"
|
2022-11-12 19:35:07 +00:00
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': all(accountType) }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.all') }}
|
|
|
|
</button>
|
|
|
|
<div
|
|
|
|
role="separator"
|
|
|
|
class="dropdown-divider"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<div class="dropdown-menu">
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
|
|
|
@click="setStatus('active')"
|
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': status.active }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.active') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
|
|
|
@click="setStatus('deactivated')"
|
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': status.deactivated }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.deactivated') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
2022-11-13 18:05:36 +00:00
|
|
|
@click="setStatus('need_approval')"
|
2022-11-12 19:35:07 +00:00
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': status.need_approval }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.pending') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
|
|
|
@click="setStatus('unconfirmed')"
|
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': status.unconfirmed }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.unconfirmed') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
2022-11-13 18:05:36 +00:00
|
|
|
@click="setStatus()"
|
2022-11-12 19:35:07 +00:00
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': all(status) }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.all') }}
|
|
|
|
</button>
|
|
|
|
<div
|
|
|
|
role="separator"
|
|
|
|
class="dropdown-divider"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<div class="dropdown-menu">
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
2022-11-13 18:05:36 +00:00
|
|
|
@click="setActorType('Person')"
|
2022-11-12 19:35:07 +00:00
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': actorType.Person }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.person') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
2022-11-13 18:05:36 +00:00
|
|
|
@click="setActorType('Service')"
|
2022-11-12 19:35:07 +00:00
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': actorType.Service }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.bot') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
2022-11-13 18:05:36 +00:00
|
|
|
@click="setActorType('Application')"
|
2022-11-12 19:35:07 +00:00
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': actorType.Application }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.application') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="button-default dropdown-item"
|
2022-11-13 18:05:36 +00:00
|
|
|
@click="setActorType()"
|
2022-11-12 19:35:07 +00:00
|
|
|
>
|
|
|
|
<span
|
|
|
|
class="menu-checkbox -radio"
|
2022-11-13 18:05:36 +00:00
|
|
|
:class="{ 'menu-checkbox-checked': all(actorType) }"
|
2022-11-12 19:35:07 +00:00
|
|
|
/>{{ $t('moderation.users.filter.all') }}
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</Popover>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="users">
|
2022-11-13 20:50:09 +00:00
|
|
|
<div v-if="users.length == 0 && page == 1">
|
|
|
|
<p>{{ $t('moderation.users.no_results') }}</p>
|
|
|
|
</div>
|
2022-11-13 18:05:36 +00:00
|
|
|
<div
|
|
|
|
v-for="user in users"
|
|
|
|
:key="user.id"
|
|
|
|
class="user"
|
|
|
|
>
|
2022-11-14 17:18:34 +00:00
|
|
|
<BasicUserCard :user="user" />
|
2022-11-14 21:11:28 +00:00
|
|
|
<ModerationTools
|
|
|
|
:user="user"
|
|
|
|
class="user-moderation"
|
|
|
|
extended="true"
|
|
|
|
/>
|
2022-11-13 18:05:36 +00:00
|
|
|
</div>
|
2022-11-12 19:35:07 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
2022-11-13 18:05:36 +00:00
|
|
|
|
|
|
|
<teleport
|
|
|
|
v-if="isActive"
|
|
|
|
to="#navigation"
|
|
|
|
>
|
2022-11-14 17:18:34 +00:00
|
|
|
<div class="pagination-container">
|
2022-11-13 18:05:36 +00:00
|
|
|
<button
|
|
|
|
class="btn button-default submit"
|
|
|
|
:disabled="page == 1"
|
|
|
|
@click="prevPage"
|
|
|
|
>
|
|
|
|
{{ $t('moderation.previous') }}
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="btn button-default"
|
|
|
|
:disabled="users.length < 50"
|
|
|
|
@click="nextPage"
|
|
|
|
>
|
|
|
|
{{ $t('moderation.next') }}
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</teleport>
|
2022-11-12 19:35:07 +00:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script src="./users_tab.js"></script>
|
|
|
|
<style src="./users_tab.scss" lang="scss"></style>
|