Sharkey/packages/client/src/pages/user-info.vue

243 lines
6.3 KiB
Vue
Raw Normal View History

<template>
<FormBase>
<FormSuspense :p="init">
2021-09-29 18:50:45 +03:00
<div class="_debobigegoItem aeakzknw">
2021-04-23 06:00:07 +03:00
<MkAvatar class="avatar" :user="user" :show-indicator="true"/>
</div>
<FormLink :to="userPage(user)">Profile</FormLink>
<FormGroup>
2021-04-23 06:00:07 +03:00
<FormKeyValueView>
<template #key>Acct</template>
<template #value><span class="_monospace">{{ acct(user) }}</span></template>
</FormKeyValueView>
2021-04-17 08:06:32 +03:00
<FormKeyValueView>
<template #key>ID</template>
<template #value><span class="_monospace">{{ user.id }}</span></template>
2021-04-17 08:06:32 +03:00
</FormKeyValueView>
2021-04-23 06:00:07 +03:00
</FormGroup>
<FormGroup v-if="iAmModerator">
2021-09-29 18:50:45 +03:00
<FormSwitch v-if="user.host == null && $i.isAdmin && (moderator || !user.isAdmin)" @update:modelValue="toggleModerator" v-model="moderator">{{ $ts.moderator }}</FormSwitch>
<FormSwitch @update:modelValue="toggleSilence" v-model="silenced">{{ $ts.silence }}</FormSwitch>
<FormSwitch @update:modelValue="toggleSuspend" v-model="suspended">{{ $ts.suspend }}</FormSwitch>
2021-04-23 06:00:07 +03:00
</FormGroup>
<FormGroup>
<FormButton v-if="user.host != null" @click="updateRemoteUser"><i class="fas fa-sync"></i> {{ $ts.updateRemoteUser }}</FormButton>
<FormButton v-if="user.host == null && iAmModerator" @click="resetPassword"><i class="fas fa-key"></i> {{ $ts.resetPassword }}</FormButton>
</FormGroup>
<FormGroup>
<FormLink :to="`/user-ap-info/${user.id}`">ActivityPub</FormLink>
<FormLink v-if="user.host" :to="`/instance-info/${user.host}`">{{ $ts.instanceInfo }}<template #suffix>{{ user.host }}</template></FormLink>
<FormKeyValueView v-else>
<template #key>{{ $ts.instanceInfo }}</template>
<template #value>(Local user)</template>
</FormKeyValueView>
</FormGroup>
2021-04-17 08:06:32 +03:00
2021-04-23 06:00:07 +03:00
<FormGroup>
<FormKeyValueView>
<template #key>{{ $ts.updatedAt }}</template>
<template #value><MkTime v-if="user.lastFetchedAt" mode="detail" :time="user.lastFetchedAt"/><span v-else>N/A</span></template>
</FormKeyValueView>
</FormGroup>
2021-04-23 06:00:07 +03:00
<FormObjectView tall :value="user">
<span>Raw</span>
</FormObjectView>
</FormSuspense>
</FormBase>
</template>
<script lang="ts">
2021-04-16 15:47:12 +03:00
import { computed, defineAsyncComponent, defineComponent } from 'vue';
2021-11-11 19:02:25 +02:00
import FormObjectView from '@/components/debobigego/object-view.vue';
import FormTextarea from '@/components/debobigego/textarea.vue';
import FormSwitch from '@/components/debobigego/switch.vue';
import FormLink from '@/components/debobigego/link.vue';
import FormBase from '@/components/debobigego/base.vue';
import FormGroup from '@/components/debobigego/group.vue';
import FormButton from '@/components/debobigego/button.vue';
import FormKeyValueView from '@/components/debobigego/key-value-view.vue';
import FormSuspense from '@/components/debobigego/suspense.vue';
import * as os from '@/os';
import number from '@/filters/number';
import bytes from '@/filters/bytes';
import * as symbols from '@/symbols';
import { url } from '@/config';
import { userPage, acct } from '@/filters/user';
export default defineComponent({
components: {
FormBase,
FormTextarea,
2021-04-23 06:00:07 +03:00
FormSwitch,
FormObjectView,
FormButton,
FormLink,
FormGroup,
FormKeyValueView,
FormSuspense,
},
props: {
userId: {
type: String,
required: true
}
},
data() {
return {
2021-04-16 15:47:12 +03:00
[symbols.PAGE_INFO]: computed(() => ({
2021-04-23 06:00:07 +03:00
title: this.user ? acct(this.user) : this.$ts.userInfo,
icon: 'fas fa-info-circle',
2021-04-16 15:47:12 +03:00
actions: this.user ? [this.user.url ? {
text: this.user.url,
icon: 'fas fa-external-link-alt',
2021-04-16 15:47:12 +03:00
handler: () => {
window.open(this.user.url, '_blank');
}
} : undefined].filter(x => x !== undefined) : [],
})),
init: null,
user: null,
2021-04-23 06:00:07 +03:00
info: null,
moderator: false,
silenced: false,
suspended: false,
2021-11-18 16:52:51 +02:00
};
2021-04-23 06:00:07 +03:00
},
computed: {
iAmModerator(): boolean {
return this.$i && (this.$i.isAdmin || this.$i.isModerator);
}
},
watch: {
userId: {
handler() {
2021-04-23 06:00:07 +03:00
this.init = this.createFetcher();
},
immediate: true
}
},
methods: {
number,
bytes,
2021-04-23 06:00:07 +03:00
userPage,
acct,
createFetcher() {
if (this.iAmModerator) {
return () => Promise.all([os.api('users/show', {
userId: this.userId
}), os.api('admin/show-user', {
userId: this.userId
})]).then(([user, info]) => {
this.user = user;
this.info = info;
this.moderator = this.info.isModerator;
this.silenced = this.info.isSilenced;
this.suspended = this.info.isSuspended;
});
} else {
return () => os.api('users/show', {
userId: this.userId
}).then((user) => {
this.user = user;
});
}
},
refreshUser() {
this.init = this.createFetcher();
},
async updateRemoteUser() {
2021-04-23 06:05:15 +03:00
await os.apiWithDialog('federation/update-remote-user', { userId: this.user.id });
2021-04-23 06:00:07 +03:00
this.refreshUser();
},
async resetPassword() {
const { password } = await os.api('admin/reset-password', {
2021-04-23 06:00:07 +03:00
userId: this.user.id,
});
os.alert({
type: 'success',
text: this.$t('newPasswordIs', { password })
2021-04-23 06:00:07 +03:00
});
},
async toggleSilence(v) {
const confirm = await os.confirm({
2021-04-23 06:00:07 +03:00
type: 'warning',
text: v ? this.$ts.silenceConfirm : this.$ts.unsilenceConfirm,
});
if (confirm.canceled) {
this.silenced = !v;
} else {
await os.api(v ? 'admin/silence-user' : 'admin/unsilence-user', { userId: this.user.id });
await this.refreshUser();
}
},
async toggleSuspend(v) {
const confirm = await os.confirm({
2021-04-23 06:00:07 +03:00
type: 'warning',
text: v ? this.$ts.suspendConfirm : this.$ts.unsuspendConfirm,
});
if (confirm.canceled) {
this.suspended = !v;
} else {
await os.api(v ? 'admin/suspend-user' : 'admin/unsuspend-user', { userId: this.user.id });
await this.refreshUser();
}
},
async toggleModerator(v) {
await os.api(v ? 'admin/moderators/add' : 'admin/moderators/remove', { userId: this.user.id });
await this.refreshUser();
},
async deleteAllFiles() {
const confirm = await os.confirm({
2021-04-23 06:00:07 +03:00
type: 'warning',
text: this.$ts.deleteAllFilesConfirm,
});
if (confirm.canceled) return;
const process = async () => {
await os.api('admin/delete-all-files-of-a-user', { userId: this.user.id });
os.success();
};
await process().catch(e => {
os.alert({
2021-04-23 06:00:07 +03:00
type: 'error',
text: e.toString()
});
});
await this.refreshUser();
},
}
});
</script>
2021-04-23 06:00:07 +03:00
<style lang="scss" scoped>
.aeakzknw {
> .avatar {
display: block;
margin: 0 auto;
width: 64px;
height: 64px;
}
}
</style>