[Client] Admin page improved
This commit is contained in:
syuilo
55
src/client/app/admin/views/announcements.vue
Normal file
55
src/client/app/admin/views/announcements.vue
Normal file
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<div>
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@announcements%</div>
|
||||
<section>
|
||||
<textarea class="qldxjjsrseehkusjuoooapmsprvfrxyl" v-model="broadcasts" placeholder='[ { "title": "Title1", "text": "Text1" }, { "title": "Title2", "text": "Text2" } ]'></textarea>
|
||||
<ui-button @click="save">%i18n:@save%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
|
||||
export default Vue.extend({
|
||||
data() {
|
||||
return {
|
||||
broadcasts: '',
|
||||
};
|
||||
},
|
||||
created() {
|
||||
(this as any).os.getMeta().then(meta => {
|
||||
this.broadcasts = JSON.stringify(meta.broadcasts, null, ' ');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
save() {
|
||||
let json;
|
||||
|
||||
try {
|
||||
json = JSON.parse(this.broadcasts);
|
||||
} catch (e) {
|
||||
(this as any).os.apis.dialog({ text: `Failed: ${e}` });
|
||||
return;
|
||||
}
|
||||
|
||||
(this as any).api('admin/update-meta', {
|
||||
broadcasts: json
|
||||
}).then(() => {
|
||||
(this as any).os.apis.dialog({ text: `Saved` });
|
||||
}.catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed ${e}` });
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.qldxjjsrseehkusjuoooapmsprvfrxyl
|
||||
width 100%
|
||||
min-height 300px
|
||||
|
||||
</style>
|
||||
137
src/client/app/admin/views/cpu-memory.vue
Normal file
137
src/client/app/admin/views/cpu-memory.vue
Normal file
@@ -0,0 +1,137 @@
|
||||
<template>
|
||||
<div class="zyknedwtlthezamcjlolyusmipqmjgxz">
|
||||
<svg :viewBox="`0 0 ${ viewBoxX } ${ viewBoxY }`">
|
||||
<defs>
|
||||
<linearGradient :id="cpuGradientId" x1="0" x2="0" y1="1" y2="0">
|
||||
<stop offset="0%" stop-color="hsl(180, 80%, 70%)"></stop>
|
||||
<stop offset="100%" stop-color="hsl(0, 80%, 70%)"></stop>
|
||||
</linearGradient>
|
||||
<mask :id="cpuMaskId" x="0" y="0" :width="viewBoxX" :height="viewBoxY">
|
||||
<polygon
|
||||
:points="cpuPolygonPoints"
|
||||
fill="#fff"
|
||||
fill-opacity="0.5"/>
|
||||
<polyline
|
||||
:points="cpuPolylinePoints"
|
||||
fill="none"
|
||||
stroke="#fff"
|
||||
stroke-width="1"/>
|
||||
</mask>
|
||||
</defs>
|
||||
<rect
|
||||
x="0" y="0"
|
||||
:width="viewBoxX" :height="viewBoxY"
|
||||
:style="`stroke: none; fill: url(#${ cpuGradientId }); mask: url(#${ cpuMaskId })`"/>
|
||||
<text x="1" y="12">CPU <tspan>{{ cpuP }}%</tspan></text>
|
||||
</svg>
|
||||
<svg :viewBox="`0 0 ${ viewBoxX } ${ viewBoxY }`">
|
||||
<defs>
|
||||
<linearGradient :id="memGradientId" x1="0" x2="0" y1="1" y2="0">
|
||||
<stop offset="0%" stop-color="hsl(180, 80%, 70%)"></stop>
|
||||
<stop offset="100%" stop-color="hsl(0, 80%, 70%)"></stop>
|
||||
</linearGradient>
|
||||
<mask :id="memMaskId" x="0" y="0" :width="viewBoxX" :height="viewBoxY">
|
||||
<polygon
|
||||
:points="memPolygonPoints"
|
||||
fill="#fff"
|
||||
fill-opacity="0.5"/>
|
||||
<polyline
|
||||
:points="memPolylinePoints"
|
||||
fill="none"
|
||||
stroke="#fff"
|
||||
stroke-width="1"/>
|
||||
</mask>
|
||||
</defs>
|
||||
<rect
|
||||
x="0" y="0"
|
||||
:width="viewBoxX" :height="viewBoxY"
|
||||
:style="`stroke: none; fill: url(#${ memGradientId }); mask: url(#${ memMaskId })`"/>
|
||||
<text x="1" y="12">MEM <tspan>{{ memP }}%</tspan></text>
|
||||
</svg>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import * as uuid from 'uuid';
|
||||
|
||||
export default Vue.extend({
|
||||
props: ['connection'],
|
||||
data() {
|
||||
return {
|
||||
viewBoxX: 200,
|
||||
viewBoxY: 70,
|
||||
stats: [],
|
||||
cpuGradientId: uuid(),
|
||||
cpuMaskId: uuid(),
|
||||
memGradientId: uuid(),
|
||||
memMaskId: uuid(),
|
||||
cpuPolylinePoints: '',
|
||||
memPolylinePoints: '',
|
||||
cpuPolygonPoints: '',
|
||||
memPolygonPoints: '',
|
||||
cpuP: '',
|
||||
memP: ''
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.connection.on('stats', this.onStats);
|
||||
this.connection.on('statsLog', this.onStatsLog);
|
||||
this.connection.send('requestLog', {
|
||||
id: Math.random().toString().substr(2, 8),
|
||||
length: 200
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.connection.off('stats', this.onStats);
|
||||
this.connection.off('statsLog', this.onStatsLog);
|
||||
},
|
||||
methods: {
|
||||
onStats(stats) {
|
||||
this.stats.push(stats);
|
||||
if (this.stats.length > 200) this.stats.shift();
|
||||
|
||||
const cpuPolylinePoints = this.stats.map((s, i) => [this.viewBoxX - ((this.stats.length - 1) - i), (1 - s.cpu_usage) * this.viewBoxY]);
|
||||
const memPolylinePoints = this.stats.map((s, i) => [this.viewBoxX - ((this.stats.length - 1) - i), (1 - (s.mem.used / s.mem.total)) * this.viewBoxY]);
|
||||
this.cpuPolylinePoints = cpuPolylinePoints.map(xy => `${xy[0]},${xy[1]}`).join(' ');
|
||||
this.memPolylinePoints = memPolylinePoints.map(xy => `${xy[0]},${xy[1]}`).join(' ');
|
||||
|
||||
this.cpuPolygonPoints = `${this.viewBoxX - (this.stats.length - 1)},${this.viewBoxY} ${this.cpuPolylinePoints} ${this.viewBoxX},${this.viewBoxY}`;
|
||||
this.memPolygonPoints = `${this.viewBoxX - (this.stats.length - 1)},${this.viewBoxY} ${this.memPolylinePoints} ${this.viewBoxX},${this.viewBoxY}`;
|
||||
|
||||
this.cpuP = (stats.cpu_usage * 100).toFixed(0);
|
||||
this.memP = (stats.mem.used / stats.mem.total * 100).toFixed(0);
|
||||
},
|
||||
onStatsLog(statsLog) {
|
||||
statsLog.reverse().forEach(stats => this.onStats(stats));
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.zyknedwtlthezamcjlolyusmipqmjgxz
|
||||
> svg
|
||||
display block
|
||||
width 50%
|
||||
float left
|
||||
|
||||
&:first-child
|
||||
padding-right 5px
|
||||
|
||||
&:last-child
|
||||
padding-left 5px
|
||||
|
||||
> text
|
||||
font-size 10px
|
||||
fill var(--chartCaption)
|
||||
|
||||
> tspan
|
||||
opacity 0.5
|
||||
|
||||
&:after
|
||||
content ""
|
||||
display block
|
||||
clear both
|
||||
|
||||
</style>
|
||||
117
src/client/app/admin/views/dashboard.vue
Normal file
117
src/client/app/admin/views/dashboard.vue
Normal file
@@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<div class="obdskegsannmntldydackcpzezagxqfy">
|
||||
<div v-if="stats" class="stats">
|
||||
<div>
|
||||
<div>%fa:user%</div>
|
||||
<div>
|
||||
<span>%i18n:@original-users%</span>
|
||||
<b>{{ stats.originalUsersCount | number }}</b>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>%fa:pencil-alt%</div>
|
||||
<div>
|
||||
<span>%i18n:@original-notes%</span>
|
||||
<b>{{ stats.originalNotesCount | number }}</b>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>%fa:user%</div>
|
||||
<div>
|
||||
<span>%i18n:@all-users%</span>
|
||||
<b>{{ stats.usersCount | number }}</b>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>%fa:pencil-alt%</div>
|
||||
<div>
|
||||
<span>%i18n:@all-notes%</span>
|
||||
<b>{{ stats.notesCount | number }}</b>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="cpu-memory">
|
||||
<x-cpu-memory :connection="connection"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
import XCpuMemory from "./cpu-memory.vue";
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XCpuMemory
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
stats: null,
|
||||
connection: null
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.connection = (this as any).os.stream.useSharedConnection('serverStats');
|
||||
|
||||
(this as any).os.getMeta().then(meta => {
|
||||
this.disableRegistration = meta.disableRegistration;
|
||||
this.disableLocalTimeline = meta.disableLocalTimeline;
|
||||
this.bannerUrl = meta.bannerUrl;
|
||||
});
|
||||
|
||||
(this as any).api('stats').then(stats => {
|
||||
this.stats = stats;
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.connection.dispose();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.obdskegsannmntldydackcpzezagxqfy
|
||||
> .stats
|
||||
display flex
|
||||
justify-content space-between
|
||||
margin-bottom 16px
|
||||
|
||||
> div
|
||||
display flex
|
||||
align-items center
|
||||
flex 1
|
||||
max-width 300px
|
||||
margin-right 16px
|
||||
text-align center
|
||||
color var(--text)
|
||||
box-shadow 0 2px 4px rgba(0, 0, 0, 0.1)
|
||||
background var(--face)
|
||||
border-radius 8px
|
||||
|
||||
&:last-child
|
||||
margin-right 0
|
||||
|
||||
> div:first-child
|
||||
padding 16px 24px
|
||||
font-size 28px
|
||||
|
||||
> div:last-child
|
||||
flex 1
|
||||
padding 16px 32px 16px 0
|
||||
text-align right
|
||||
|
||||
> span
|
||||
opacity 0.7
|
||||
|
||||
> b
|
||||
display block
|
||||
|
||||
> .cpu-memory
|
||||
margin-bottom 16px
|
||||
padding 32px
|
||||
box-shadow 0 2px 4px rgba(0, 0, 0, 0.1)
|
||||
background var(--face)
|
||||
border-radius 8px
|
||||
|
||||
</style>
|
||||
48
src/client/app/admin/views/emoji.vue
Normal file
48
src/client/app/admin/views/emoji.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<div>
|
||||
<ui-card>
|
||||
<div slot="title">%fa:plus% %i18n:@add-emoji.title%</div>
|
||||
<section class="fit-top">
|
||||
<ui-input v-model="name">
|
||||
<span>%i18n:@add-emoji.name%</span>
|
||||
<span slot="text">%i18n:@add-emoji.name-desc%</span>
|
||||
</ui-input>
|
||||
<ui-input v-model="aliases">
|
||||
<span>%i18n:@add-emoji.aliases%</span>
|
||||
<span slot="text">%i18n:@add-emoji.aliases-desc%</span>
|
||||
</ui-input>
|
||||
<ui-input v-model="url">
|
||||
<span>%i18n:@add-emoji.url%</span>
|
||||
</ui-input>
|
||||
<ui-button @click="add">%i18n:@add-emoji.add%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
|
||||
export default Vue.extend({
|
||||
data() {
|
||||
return {
|
||||
name: '',
|
||||
url: '',
|
||||
aliases: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
add() {
|
||||
(this as any).api('admin/add-emoji', {
|
||||
name: this.name,
|
||||
url: this.url,
|
||||
aliases: this.aliases.split(' ')
|
||||
}).then(() => {
|
||||
(this as any).os.apis.dialog({ text: `Added` });
|
||||
}).catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed ${e}` });
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
46
src/client/app/admin/views/hashtags.vue
Normal file
46
src/client/app/admin/views/hashtags.vue
Normal file
@@ -0,0 +1,46 @@
|
||||
<template>
|
||||
<div>
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@hided-tags%</div>
|
||||
<section>
|
||||
<textarea class="jdnqwkzlnxcfftthoybjxrebyolvoucw" v-model="hidedTags"></textarea>
|
||||
<ui-button @click="save">%i18n:@save%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
|
||||
export default Vue.extend({
|
||||
data() {
|
||||
return {
|
||||
hidedTags: '',
|
||||
};
|
||||
},
|
||||
created() {
|
||||
(this as any).os.getMeta().then(meta => {
|
||||
this.hidedTags = meta.hidedTags.join('\n');
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
save() {
|
||||
(this as any).api('admin/update-meta', {
|
||||
hidedTags: this.hidedTags.split('\n')
|
||||
}).then(() => {
|
||||
(this as any).os.apis.dialog({ text: `Saved` });
|
||||
}).catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed ${e}` });
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.jdnqwkzlnxcfftthoybjxrebyolvoucw
|
||||
width 100%
|
||||
min-height 300px
|
||||
|
||||
</style>
|
||||
101
src/client/app/admin/views/index.vue
Normal file
101
src/client/app/admin/views/index.vue
Normal file
@@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<div class="mk-admin">
|
||||
<nav>
|
||||
<ul>
|
||||
<li @click="nav('dashboard')" :class="{ active: page == 'dashboard' }">%fa:home .fw%%i18n:@dashboard%</li>
|
||||
<li @click="nav('instance')" :class="{ active: page == 'instance' }">%fa:cog .fw%%i18n:@instance%</li>
|
||||
<li @click="nav('users')" :class="{ active: page == 'users' }">%fa:users .fw%%i18n:@users%</li>
|
||||
<li @click="nav('emoji')" :class="{ active: page == 'emoji' }">%fa:grin R .fw%%i18n:@emoji%</li>
|
||||
<li @click="nav('announcements')" :class="{ active: page == 'announcements' }">%fa:broadcast-tower .fw%%i18n:@announcements%</li>
|
||||
<li @click="nav('hashtags')" :class="{ active: page == 'hashtags' }">%fa:hashtag .fw%%i18n:@hashtags%</li>
|
||||
|
||||
<!-- <li @click="nav('drive')" :class="{ active: page == 'drive' }">%fa:cloud .fw%%i18n:common.drive%</li> -->
|
||||
<!-- <li @click="nav('update')" :class="{ active: page == 'update' }">%i18n:@update%</li> -->
|
||||
</ul>
|
||||
</nav>
|
||||
<main>
|
||||
<div v-show="page == 'dashboard'"><x-dashboard/></div>
|
||||
<div v-show="page == 'instance'"><x-instance/></div>
|
||||
<div v-if="page == 'users'"><x-users/></div>
|
||||
<div v-show="page == 'emoji'"><x-emoji/></div>
|
||||
<div v-show="page == 'announcements'"><x-announcements/></div>
|
||||
<div v-show="page == 'hashtags'"><x-hashtags/></div>
|
||||
<div v-if="page == 'drive'"></div>
|
||||
<div v-if="page == 'update'"></div>
|
||||
</main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
import XDashboard from "./dashboard.vue";
|
||||
import XInstance from "./instance.vue";
|
||||
import XEmoji from "./emoji.vue";
|
||||
import XAnnouncements from "./announcements.vue";
|
||||
import XHashtags from "./hashtags.vue";
|
||||
import XUsers from "./users.vue";
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XDashboard,
|
||||
XInstance,
|
||||
XEmoji,
|
||||
XAnnouncements,
|
||||
XHashtags,
|
||||
XUsers
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
page: 'dashboard'
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
nav(page: string) {
|
||||
this.page = page;
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
.mk-admin
|
||||
display flex
|
||||
height 100%
|
||||
|
||||
> nav
|
||||
position fixed
|
||||
z-index 10000
|
||||
top 0
|
||||
left 0
|
||||
width 250px
|
||||
height 100vh
|
||||
padding 16px 0 0 0
|
||||
overflow auto
|
||||
background #333
|
||||
color #fff
|
||||
|
||||
> ul
|
||||
margin 0
|
||||
padding 0
|
||||
list-style none
|
||||
|
||||
> li
|
||||
display block
|
||||
padding 10px 16px
|
||||
margin 0
|
||||
cursor pointer
|
||||
user-select none
|
||||
transition margin-left 0.2s ease
|
||||
|
||||
> [data-fa]
|
||||
margin-right 4px
|
||||
|
||||
&.active
|
||||
margin-left 8px
|
||||
color var(--primary) !important
|
||||
|
||||
> main
|
||||
width 100%
|
||||
padding 32px 32px 32px calc(32px + 250px)
|
||||
|
||||
</style>
|
||||
62
src/client/app/admin/views/instance.vue
Normal file
62
src/client/app/admin/views/instance.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<div>
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@banner-url%</div>
|
||||
<section class="fit-top">
|
||||
<ui-input v-model="bannerUrl"/>
|
||||
<ui-button @click="updateMeta">%i18n:@save%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@disable-registration%</div>
|
||||
<section>
|
||||
<input type="checkbox" v-model="disableRegistration" @change="updateMeta">
|
||||
<button class="ui" @click="invite">%i18n:@invite%</button>
|
||||
<p v-if="inviteCode">Code: <code>{{ inviteCode }}</code></p>
|
||||
</section>
|
||||
</ui-card>
|
||||
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@disable-local-timeline%</div>
|
||||
<section>
|
||||
<input type="checkbox" v-model="disableLocalTimeline" @change="updateMeta">
|
||||
</section>
|
||||
</ui-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
|
||||
export default Vue.extend({
|
||||
data() {
|
||||
return {
|
||||
disableRegistration: false,
|
||||
disableLocalTimeline: false,
|
||||
bannerUrl: null,
|
||||
inviteCode: null,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
invite() {
|
||||
(this as any).api('admin/invite').then(x => {
|
||||
this.inviteCode = x.code;
|
||||
}).catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed ${e}` });
|
||||
});
|
||||
},
|
||||
updateMeta() {
|
||||
(this as any).api('admin/update-meta', {
|
||||
disableRegistration: this.disableRegistration,
|
||||
disableLocalTimeline: this.disableLocalTimeline,
|
||||
bannerUrl: this.bannerUrl
|
||||
}).then(() => {
|
||||
(this as any).os.apis.dialog({ text: `Saved` });
|
||||
}).catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed ${e}` });
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
129
src/client/app/admin/views/users.vue
Normal file
129
src/client/app/admin/views/users.vue
Normal file
@@ -0,0 +1,129 @@
|
||||
<template>
|
||||
<div>
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@verify-user%</div>
|
||||
<section class="fit-top">
|
||||
<ui-input v-model="verifyUsername" type="text">
|
||||
<span slot="prefix">@</span>
|
||||
</ui-input>
|
||||
<ui-button @click="verifyUser" :disabled="verifying">%i18n:@verify%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@unverify-user%</div>
|
||||
<section class="fit-top">
|
||||
<ui-input v-model="unverifyUsername" type="text">
|
||||
<span slot="prefix">@</span>
|
||||
</ui-input>
|
||||
<ui-button @click="unverifyUser" :disabled="unverifying">%i18n:@unverify%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@suspend-user%</div>
|
||||
<section class="fit-top">
|
||||
<ui-input v-model="suspendUsername" type="text">
|
||||
<span slot="prefix">@</span>
|
||||
</ui-input>
|
||||
<ui-button @click="suspendUser" :disabled="suspending">%i18n:@suspend%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
|
||||
<ui-card>
|
||||
<div slot="title">%i18n:@unsuspend-user%</div>
|
||||
<section class="fit-top">
|
||||
<ui-input v-model="unsuspendUsername" type="text">
|
||||
<span slot="prefix">@</span>
|
||||
</ui-input>
|
||||
<ui-button @click="unsuspendUser" :disabled="unsuspending">%i18n:@unsuspend%</ui-button>
|
||||
</section>
|
||||
</ui-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from "vue";
|
||||
import parseAcct from "../../../../misc/acct/parse";
|
||||
|
||||
export default Vue.extend({
|
||||
data() {
|
||||
return {
|
||||
verifyUsername: null,
|
||||
verifying: false,
|
||||
unverifyUsername: null,
|
||||
unverifying: false,
|
||||
suspendUsername: null,
|
||||
suspending: false,
|
||||
unsuspendUsername: null,
|
||||
unsuspending: false
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
async verifyUser() {
|
||||
this.verifying = true;
|
||||
|
||||
const process = async () => {
|
||||
const user = await (this as any).os.api('users/show', parseAcct(this.verifyUsername));
|
||||
await (this as any).os.api('admin/verify-user', { userId: user.id });
|
||||
(this as any).os.apis.dialog({ text: '%i18n:@verified%' });
|
||||
};
|
||||
|
||||
await process().catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed: ${e}` });
|
||||
});
|
||||
|
||||
this.verifying = false;
|
||||
},
|
||||
|
||||
async unverifyUser() {
|
||||
this.unverifying = true;
|
||||
|
||||
const process = async () => {
|
||||
const user = await (this as any).os.api('users/show', parseAcct(this.unverifyUsername));
|
||||
await (this as any).os.api('admin/unverify-user', { userId: user.id });
|
||||
(this as any).os.apis.dialog({ text: '%i18n:@unverified%' });
|
||||
};
|
||||
|
||||
await process().catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed: ${e}` });
|
||||
});
|
||||
|
||||
this.unverifying = false;
|
||||
},
|
||||
|
||||
async suspendUser() {
|
||||
this.suspending = true;
|
||||
|
||||
const process = async () => {
|
||||
const user = await (this as any).os.api('users/show', parseAcct(this.suspendUsername));
|
||||
await (this as any).os.api('admin/suspend-user', { userId: user.id });
|
||||
(this as any).os.apis.dialog({ text: '%i18n:@suspended%' });
|
||||
};
|
||||
|
||||
await process().catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed: ${e}` });
|
||||
});
|
||||
|
||||
this.suspending = false;
|
||||
},
|
||||
|
||||
async unsuspendUser() {
|
||||
this.unsuspending = true;
|
||||
|
||||
const process = async () => {
|
||||
const user = await (this as any).os.api('users/show', parseAcct(this.unsuspendUsername));
|
||||
await (this as any).os.api('admin/unsuspend-user', { userId: user.id });
|
||||
(this as any).os.apis.dialog({ text: '%i18n:@unsuspended%' });
|
||||
};
|
||||
|
||||
await process().catch(e => {
|
||||
(this as any).os.apis.dialog({ text: `Failed: ${e}` });
|
||||
});
|
||||
|
||||
this.unsuspending = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user