133 lines
3.3 KiB
Vue
133 lines
3.3 KiB
Vue
<template>
|
|
<div>
|
|
<Popover
|
|
trigger="click"
|
|
class="moderation-tools-popover"
|
|
:disabled="disabled"
|
|
placement="bottom"
|
|
:offset="{ y: 5 }"
|
|
@show="setOpen(true)"
|
|
@close="setOpen(false)"
|
|
>
|
|
<template #content="{close}">
|
|
<div class="dropdown-menu">
|
|
<template v-for="(entry, index) in entries">
|
|
<div
|
|
v-if="entry === 'separator'"
|
|
:key="index"
|
|
role="separator"
|
|
class="dropdown-divider"
|
|
/>
|
|
<div
|
|
v-else
|
|
:key="entry.label"
|
|
class="menu-item dropdown-item"
|
|
:class="entry.checkbox ? '-icon' : '-icon-space'"
|
|
>
|
|
<button
|
|
class="main-button"
|
|
@click="() => maybeShowConfirm(close, entry)"
|
|
>
|
|
<span
|
|
v-if="entry.checkbox"
|
|
class="input menu-checkbox"
|
|
:class="entry.checkboxClass"
|
|
/>
|
|
{{ $t(entry.label) }}
|
|
</button>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
<template #trigger>
|
|
<button
|
|
class="btn button-default btn-block moderation-tools-button"
|
|
:class="{ toggled: open, disabled }"
|
|
:disabled="disabled"
|
|
>
|
|
{{ $t('user_card.admin_menu.moderation') }}
|
|
<FAIcon
|
|
v-if="ready"
|
|
icon="chevron-down"
|
|
/>
|
|
<span
|
|
v-else
|
|
class="loading-spinner"
|
|
>
|
|
<FAIcon
|
|
class="fa-old-padding"
|
|
spin
|
|
icon="circle-notch"
|
|
/>
|
|
</span>
|
|
</button>
|
|
</template>
|
|
</Popover>
|
|
<teleport to="#modal">
|
|
<ConfirmModal
|
|
v-if="confirmDialogShow"
|
|
:title="$t(confirmDialogTitle)"
|
|
:confirm-text="confirmDialogConfirm"
|
|
:confirm-danger="confirmDialogDanger"
|
|
:cancel-text="$t('general.cancel')"
|
|
@accepted="doConfirmDialogAction"
|
|
@cancelled="clearConfirmDialog"
|
|
>
|
|
<i18n-t
|
|
:plural="users.length"
|
|
scope="global"
|
|
:keypath="confirmDialogContent"
|
|
tag="p"
|
|
>
|
|
<template #user>
|
|
<span
|
|
v-text="users[0].screen_name_ui"
|
|
/>
|
|
</template>
|
|
<template #count>
|
|
{{ users.length }}
|
|
</template>
|
|
<template #name>
|
|
<code>
|
|
{{ confirmDialogName }}
|
|
</code>
|
|
</template>
|
|
</i18n-t>
|
|
<p v-if="confirmDialogContent2">
|
|
{{ $t(confirmDialogContent2) }}
|
|
</p>
|
|
<ul v-if="users.length > 1">
|
|
<li
|
|
v-for="user in users"
|
|
:key="user.screen_name"
|
|
>
|
|
{{ user.screen_name }}
|
|
</li>
|
|
</ul>
|
|
</ConfirmModal>
|
|
</teleport>
|
|
</div>
|
|
</template>
|
|
|
|
<script src="./moderation_tools.js"></script>
|
|
|
|
<style lang="scss">
|
|
.moderation-tools-popover {
|
|
height: 100%;
|
|
|
|
.trigger {
|
|
/* stylelint-disable-next-line declaration-no-important */
|
|
display: flex !important;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.moderation-tools-button {
|
|
white-space: nowrap;
|
|
|
|
svg,
|
|
i {
|
|
font-size: 0.8em;
|
|
}
|
|
}
|
|
</style>
|