summaryrefslogtreecommitdiff
path: root/packages
diff options
context:
space:
mode:
Diffstat (limited to 'packages')
-rw-r--r--packages/client/src/pages/admin/files.vue123
-rw-r--r--packages/client/src/pages/admin/users.vue152
2 files changed, 121 insertions, 154 deletions
diff --git a/packages/client/src/pages/admin/files.vue b/packages/client/src/pages/admin/files.vue
index 87dd12f489..c62f053092 100644
--- a/packages/client/src/pages/admin/files.vue
+++ b/packages/client/src/pages/admin/files.vue
@@ -28,7 +28,7 @@
<template #label>MIME type</template>
</MkInput>
</div>
- <MkPagination v-slot="{items}" ref="files" :pagination="pagination" class="urempief">
+ <MkPagination v-slot="{items}" :pagination="pagination" class="urempief">
<button v-for="file in items" :key="file.id" class="file _panel _button _gap" @click="show(file, $event)">
<MkDriveFileThumbnail class="thumbnail" :file="file" fit="contain"/>
<div class="body">
@@ -54,8 +54,8 @@
</div>
</template>
-<script lang="ts">
-import { computed, defineComponent } from 'vue';
+<script lang="ts" setup>
+import { computed } from 'vue';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
import MkSelect from '@/components/form/select.vue';
@@ -65,80 +65,63 @@ import MkDriveFileThumbnail from '@/components/drive-file-thumbnail.vue';
import bytes from '@/filters/bytes';
import * as os from '@/os';
import * as symbols from '@/symbols';
+import { i18n } from '@/i18n';
-export default defineComponent({
- components: {
- MkButton,
- MkInput,
- MkSelect,
- MkPagination,
- MkContainer,
- MkDriveFileThumbnail,
- },
+let q = $ref(null);
+let origin = $ref('local');
+let type = $ref(null);
+let searchHost = $ref('');
+const pagination = {
+ endpoint: 'admin/drive/files' as const,
+ limit: 10,
+ params: computed(() => ({
+ type: (type && type !== '') ? type : null,
+ origin: origin,
+ hostname: (searchHost && searchHost !== '') ? searchHost : null,
+ })),
+};
- emits: ['info'],
+function clear() {
+ os.confirm({
+ type: 'warning',
+ text: i18n.ts.clearCachedFilesConfirm,
+ }).then(({ canceled }) => {
+ if (canceled) return;
- data() {
- return {
- [symbols.PAGE_INFO]: {
- title: this.$ts.files,
- icon: 'fas fa-cloud',
- bg: 'var(--bg)',
- actions: [{
- text: this.$ts.clearCachedFiles,
- icon: 'fas fa-trash-alt',
- handler: this.clear
- }]
- },
- q: null,
- origin: 'local',
- type: null,
- searchHost: '',
- pagination: {
- endpoint: 'admin/drive/files' as const,
- limit: 10,
- params: computed(() => ({
- type: (this.type && this.type !== '') ? this.type : null,
- origin: this.origin,
- hostname: (this.searchHost && this.searchHost !== '') ? this.searchHost : null,
- })),
- },
- }
- },
-
- methods: {
- clear() {
- os.confirm({
- type: 'warning',
- text: this.$ts.clearCachedFilesConfirm,
- }).then(({ canceled }) => {
- if (canceled) return;
-
- os.apiWithDialog('admin/drive/clean-remote-files', {});
- });
- },
+ os.apiWithDialog('admin/drive/clean-remote-files', {});
+ });
+}
- show(file, ev) {
- os.popup(import('./file-dialog.vue'), {
- fileId: file.id
- }, {}, 'closed');
- },
+function show(file) {
+ os.popup(import('./file-dialog.vue'), {
+ fileId: file.id
+ }, {}, 'closed');
+}
- find() {
- os.api('admin/drive/show-file', this.q.startsWith('http://') || this.q.startsWith('https://') ? { url: this.q.trim() } : { fileId: this.q.trim() }).then(file => {
- this.show(file);
- }).catch(e => {
- if (e.code === 'NO_SUCH_FILE') {
- os.alert({
- type: 'error',
- text: this.$ts.notFound
- });
- }
+function find() {
+ os.api('admin/drive/show-file', q.startsWith('http://') || q.startsWith('https://') ? { url: q.trim() } : { fileId: q.trim() }).then(file => {
+ show(file);
+ }).catch(err => {
+ if (err.code === 'NO_SUCH_FILE') {
+ os.alert({
+ type: 'error',
+ text: i18n.ts.notFound
});
- },
+ }
+ });
+}
- bytes
- }
+defineExpose({
+ [symbols.PAGE_INFO]: computed(() => ({
+ title: i18n.ts.files,
+ icon: 'fas fa-cloud',
+ bg: 'var(--bg)',
+ actions: [{
+ text: i18n.ts.clearCachedFiles,
+ icon: 'fas fa-trash-alt',
+ handler: clear,
+ }],
+ })),
});
</script>
diff --git a/packages/client/src/pages/admin/users.vue b/packages/client/src/pages/admin/users.vue
index 03e155ddcf..f05aa5ff45 100644
--- a/packages/client/src/pages/admin/users.vue
+++ b/packages/client/src/pages/admin/users.vue
@@ -36,7 +36,7 @@
</MkInput>
</div>
- <MkPagination v-slot="{items}" ref="users" :pagination="pagination" class="users">
+ <MkPagination v-slot="{items}" ref="paginationComponent" :pagination="pagination" class="users">
<button v-for="user in items" :key="user.id" class="user _panel _button _gap" @click="show(user)">
<MkAvatar class="avatar" :user="user" :disable-link="true" :show-indicator="true"/>
<div class="body">
@@ -61,9 +61,8 @@
</div>
</template>
-<script lang="ts">
-import { computed, defineComponent } from 'vue';
-import MkButton from '@/components/ui/button.vue';
+<script lang="ts" setup>
+import { computed } from 'vue';
import MkInput from '@/components/form/input.vue';
import MkSelect from '@/components/form/select.vue';
import MkPagination from '@/components/ui/pagination.vue';
@@ -71,94 +70,79 @@ import { acct } from '@/filters/user';
import * as os from '@/os';
import * as symbols from '@/symbols';
import { lookupUser } from '@/scripts/lookup-user';
+import { i18n } from '@/i18n';
-export default defineComponent({
- components: {
- MkButton,
- MkInput,
- MkSelect,
- MkPagination,
- },
+let paginationComponent = $ref<InstanceType<typeof MkPagination>>();
- emits: ['info'],
+let sort = $ref('+createdAt');
+let state = $ref('all');
+let origin = $ref('local');
+let searchUsername = $ref('');
+let searchHost = $ref('');
+const pagination = {
+ endpoint: 'admin/show-users' as const,
+ limit: 10,
+ params: computed(() => ({
+ sort: sort,
+ state: state,
+ origin: origin,
+ username: searchUsername,
+ hostname: searchHost,
+ })),
+ offsetMode: true
+};
- data() {
- return {
- [symbols.PAGE_INFO]: {
- title: this.$ts.users,
- icon: 'fas fa-users',
- bg: 'var(--bg)',
- actions: [{
- icon: 'fas fa-search',
- text: this.$ts.search,
- handler: this.searchUser
- }, {
- asFullButton: true,
- icon: 'fas fa-plus',
- text: this.$ts.addUser,
- handler: this.addUser
- }, {
- asFullButton: true,
- icon: 'fas fa-search',
- text: this.$ts.lookup,
- handler: this.lookupUser
- }],
- },
- sort: '+createdAt',
- state: 'all',
- origin: 'local',
- searchUsername: '',
- searchHost: '',
- pagination: {
- endpoint: 'admin/show-users' as const,
- limit: 10,
- params: computed(() => ({
- sort: this.sort,
- state: this.state,
- origin: this.origin,
- username: this.searchUsername,
- hostname: this.searchHost,
- })),
- offsetMode: true
- },
- }
- },
-
- methods: {
- lookupUser,
-
- searchUser() {
- os.selectUser().then(user => {
- this.show(user);
- });
- },
+function searchUser() {
+ os.selectUser().then(user => {
+ show(user);
+ });
+}
- async addUser() {
- const { canceled: canceled1, result: username } = await os.inputText({
- title: this.$ts.username,
- });
- if (canceled1) return;
+async function addUser() {
+ const { canceled: canceled1, result: username } = await os.inputText({
+ title: i18n.ts.username,
+ });
+ if (canceled1) return;
- const { canceled: canceled2, result: password } = await os.inputText({
- title: this.$ts.password,
- type: 'password'
- });
- if (canceled2) return;
+ const { canceled: canceled2, result: password } = await os.inputText({
+ title: i18n.ts.password,
+ type: 'password'
+ });
+ if (canceled2) return;
- os.apiWithDialog('admin/accounts/create', {
- username: username,
- password: password,
- }).then(res => {
- this.$refs.users.reload();
- });
- },
+ os.apiWithDialog('admin/accounts/create', {
+ username: username,
+ password: password,
+ }).then(res => {
+ paginationComponent.reload();
+ });
+}
- show(user) {
- os.pageWindow(`/user-info/${user.id}`);
- },
+function show(user) {
+ os.pageWindow(`/user-info/${user.id}`);
+}
- acct
- }
+defineExpose({
+ [symbols.PAGE_INFO]: computed(() => ({
+ title: i18n.ts.users,
+ icon: 'fas fa-users',
+ bg: 'var(--bg)',
+ actions: [{
+ icon: 'fas fa-search',
+ text: i18n.ts.search,
+ handler: searchUser
+ }, {
+ asFullButton: true,
+ icon: 'fas fa-plus',
+ text: i18n.ts.addUser,
+ handler: addUser
+ }, {
+ asFullButton: true,
+ icon: 'fas fa-search',
+ text: i18n.ts.lookup,
+ handler: lookupUser
+ }],
+ })),
});
</script>