sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

vue3: filterの移行 (#6590)

Browse Source 
* bytes

* notePage

* number

* acct, userName, userPage

* Move methods property

* fix

* Delete unnecessary file
This commit is contained in:
fuyu
2020-07-25 23:20:14 +09:00
committed by GitHub
parent 66cc7a28ba
commit 098d960f10
28 changed files with 183 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/client/components/autocomplete.vue
View File

@@ -6,7 +6,7 @@
<span class="name">
<mk-user-name :user="user" :key="user.id"/>
</span>
<span class="username">@{{ user | acct }}</span>
<span class="username">@{{ acct(user) }}</span>
</li>
<li @click="chooseUser()" @keydown="onKeydown" tabindex="-1" class="choose">{{ $t('selectUser') }}</li>
</ol>
@@ -34,6 +34,7 @@ import contains from '../scripts/contains';
import { twemojiSvgBase } from '../../misc/twemoji-base';
import { getStaticImageUrl } from '../scripts/get-static-image-url';
import MkUserSelect from './user-select.vue';
import { acct } from '../filters/user';
type EmojiDef = {
emoji: string;
@@ -381,7 +382,9 @@ export default defineComponent({
vm.$once('closed', () => {
this.textarea.focus();
});
}
},
acct
}
});
</script>

11
src/client/components/avatar.vue
View File

@@ -1,8 +1,8 @@
<template>
<span class="eiwwqkts" :class="{ cat }" :title="user | acct" v-if="disableLink" v-user-preview="disablePreview ? undefined : user.id" @click="onClick">
<span class="eiwwqkts" :class="{ cat }" :title="acct(user)" v-if="disableLink" v-user-preview="disablePreview ? undefined : user.id" @click="onClick">
<img class="inner" :src="url"/>
</span>
<router-link class="eiwwqkts" :class="{ cat }" :to="user | userPage" :title="user | acct" :target="target" v-else v-user-preview="disablePreview ? undefined : user.id">
<router-link class="eiwwqkts" :class="{ cat }" :to="userPage(user)" :title="acct(user)" :target="target" v-else v-user-preview="disablePreview ? undefined : user.id">
<img class="inner" :src="url"/>
</router-link>
</template>
@@ -10,6 +10,7 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { getStaticImageUrl } from '../scripts/get-static-image-url';
import { acct, userPage } from '../filters/user';
export default defineComponent({
props: {
@@ -60,7 +61,9 @@ export default defineComponent({
},
onClick(e) {
this.$emit('click', e);
}
},
acct,
userPage
}
});
</script>
@@ -95,7 +98,7 @@ export default defineComponent({
transform: rotate(-37.5deg) skew(-30deg);
}
}
.inner {
position: absolute;
bottom: 0;

9
src/client/components/drive-window.vue
View File

@@ -2,7 +2,7 @@
<x-window ref="window" :width="800" :height="500" @closed="() => { $emit('closed'); destroyDom(); }" :with-ok-button="true" :ok-button-disabled="(type === 'file') && (selected.length === 0)" @ok="ok()">
<template #header>
{{ multiple ? ((type === 'file') ? $t('selectFiles') : $t('selectFolders')) : ((type === 'file') ? $t('selectFile') : $t('selectFolder')) }}
<span v-if="selected.length > 0" style="margin-left: 8px; opacity: 0.5;">({{ selected.length | number }})</span>
<span v-if="selected.length > 0" style="margin-left: 8px; opacity: 0.5;">({{ number(number) }})</span>
</template>
<div>
<x-drive :multiple="multiple" @change-selection="onChangeSelection" :select="type"/>
@@ -14,6 +14,7 @@
import { defineComponent } from 'vue';
import XDrive from './drive.vue';
import XWindow from './window.vue';
import number from '../filters/number';
export default defineComponent({
components: {
@@ -25,7 +26,7 @@ export default defineComponent({
type: {
type: String,
required: false,
default: 'file'
default: 'file'
},
multiple: {
type: Boolean,
@@ -47,7 +48,9 @@ export default defineComponent({
onChangeSelection(xs) {
this.selected = xs;
}
},
number
}
});
</script>

7
src/client/components/drive.file.vue
View File

@@ -37,6 +37,7 @@ import copyToClipboard from '../scripts/copy-to-clipboard';
//import updateBanner from '../api/update-banner';
import XFileThumbnail from './drive-file-thumbnail.vue';
import { faDownload, faLink, faICursor, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
import bytes from '../filters/bytes';
export default defineComponent({
components: {
@@ -72,7 +73,7 @@ export default defineComponent({
return this.$parent;
},
title(): string {
return `${this.file.name}\n${this.file.type} ${Vue.filter('bytes')(this.file.size)}`;
return `${this.file.name}\n${this.file.type} ${bytes(this.file.size)}`;
}
},
@@ -181,7 +182,9 @@ export default defineComponent({
this.$root.api('drive/files/delete', {
fileId: this.file.id
});
}
},
bytes
}
});
</script>

27
src/client/components/instance-stats.vue
View File

@@ -9,15 +9,15 @@
<div>
<dl class="total">
<dt>{{ $t('total') }}</dt>
<dd>{{ info.originalUsersCount | number }}</dd>
<dd>{{ number(info.originalUsersCount) }}</dd>
</dl>
<dl class="diff" :class="{ inc: usersLocalDoD > 0 }">
<dt>{{ $t('dayOverDayChanges') }}</dt>
<dd>{{ usersLocalDoD | number }}</dd>
<dd>{{ number(usersLocalDoD) }}</dd>
</dl>
<dl class="diff" :class="{ inc: usersLocalWoW > 0 }">
<dt>{{ $t('weekOverWeekChanges') }}</dt>
<dd>{{ usersLocalWoW | number }}</dd>
<dd>{{ number(usersLocalWoW) }}</dd>
</dl>
</div>
</div>
@@ -29,15 +29,15 @@
<div>
<dl class="total">
<dt>{{ $t('total') }}</dt>
<dd>{{ (info.usersCount - info.originalUsersCount) | number }}</dd>
<dd>{{ number((info.usersCount - info.originalUsersCount)) }}</dd>
</dl>
<dl class="diff" :class="{ inc: usersRemoteDoD > 0 }">
<dt>{{ $t('dayOverDayChanges') }}</dt>
<dd>{{ usersRemoteDoD | number }}</dd>
<dd>{{ number(usersRemoteDoD) }}</dd>
</dl>
<dl class="diff" :class="{ inc: usersRemoteWoW > 0 }">
<dt>{{ $t('weekOverWeekChanges') }}</dt>
<dd>{{ usersRemoteWoW | number }}</dd>
<dd>{{ number(usersRemoteWoW) }}</dd>
</dl>
</div>
</div>
@@ -49,15 +49,15 @@
<div>
<dl class="total">
<dt>{{ $t('total') }}</dt>
<dd>{{ info.originalNotesCount | number }}</dd>
<dd>{{ number(info.originalNotesCount) }}</dd>
</dl>
<dl class="diff" :class="{ inc: notesLocalDoD > 0 }">
<dt>{{ $t('dayOverDayChanges') }}</dt>
<dd>{{ notesLocalDoD | number }}</dd>
<dd>{{ number(notesLocalDoD) }}</dd>
</dl>
<dl class="diff" :class="{ inc: notesLocalWoW > 0 }">
<dt>{{ $t('weekOverWeekChanges') }}</dt>
<dd>{{ notesLocalWoW | number }}</dd>
<dd>{{ number(notesLocalWoW) }}</dd>
</dl>
</div>
</div>
@@ -69,15 +69,15 @@
<div>
<dl class="total">
<dt>{{ $t('total') }}</dt>
<dd>{{ (info.notesCount - info.originalNotesCount) | number }}</dd>
<dd>{{ number((info.notesCount - info.originalNotesCount)) }}</dd>
</dl>
<dl class="diff" :class="{ inc: notesRemoteDoD > 0 }">
<dt>{{ $t('dayOverDayChanges') }}</dt>
<dd>{{ notesRemoteDoD | number }}</dd>
<dd>{{ number(notesRemoteDoD) }}</dd>
</dl>
<dl class="diff" :class="{ inc: notesRemoteWoW > 0 }">
<dt>{{ $t('weekOverWeekChanges') }}</dt>
<dd>{{ notesRemoteWoW | number }}</dd>
<dd>{{ number(notesRemoteWoW) }}</dd>
</dl>
</div>
</div>
@@ -126,6 +126,7 @@ import { defineComponent } from 'vue';
import { faChartBar, faUser, faPencilAlt } from '@fortawesome/free-solid-svg-icons';
import Chart from 'chart.js';
import MkSelect from './ui/select.vue';
import number from '../filters/number';
const chartLimit = 90;
const sum = (...arr) => arr.reduce((r, a) => r.map((b, i) => a[i] + b));
@@ -580,6 +581,8 @@ export default defineComponent({
}]
};
},
number
}
});
</script>

9
src/client/components/note-header.vue
View File

@@ -1,6 +1,6 @@
<template>
<header class="kkwtjztg">
<router-link class="name" :to="note.user | userPage" v-user-preview="note.user.id">
<router-link class="name" :to="userPage(note.user)" v-user-preview="note.user.id">
<mk-user-name :user="note.user"/>
</router-link>
<span class="is-bot" v-if="note.user.isBot">bot</span>
@@ -26,6 +26,8 @@
import { defineComponent } from 'vue';
import { faHome, faUnlock, faEnvelope, faMobileAlt, faBookmark, faBiohazard } from '@fortawesome/free-solid-svg-icons';
import { faBookmark as farBookmark } from '@fortawesome/free-regular-svg-icons';
import notePage from '../filters/note';
import { userPage } from '../filters/user';
export default defineComponent({
props: {
@@ -39,6 +41,11 @@ export default defineComponent({
return {
faHome, faUnlock, faEnvelope, faMobileAlt, faBookmark, farBookmark, faBiohazard
};
},
methods: {
notePage,
userPage
}
});
</script>

7
src/client/components/note.vue
View File

@@ -16,7 +16,7 @@
<mk-avatar class="avatar" :user="note.user"/>
<fa :icon="faRetweet"/>
<i18n-t path="renotedBy" tag="span">
<router-link class="name" :to="note.user | userPage" v-user-preview="note.userId" place="user">
<router-link class="name" :to="userPage(note.user)" v-user-preview="note.userId" place="user">
<mk-user-name :user="note.user"/>
</router-link>
</i18n-t>
@@ -106,6 +106,7 @@ import pleaseLogin from '../scripts/please-login';
import { focusPrev, focusNext } from '../scripts/focus';
import { url } from '../config';
import copyToClipboard from '../scripts/copy-to-clipboard';
import { userPage } from '../filters/user';
export default defineComponent({
components: {
@@ -722,7 +723,9 @@ export default defineComponent({
focusAfter() {
focusNext(this.$el);
}
},
userPage
}
});
</script>

18
src/client/components/notification.vue
View File

@@ -18,30 +18,30 @@
</div>
<div class="tail">
<header>
<router-link v-if="notification.user" class="name" :to="notification.user | userPage" v-user-preview="notification.user.id"><mk-user-name :user="notification.user"/></router-link>
<router-link v-if="notification.user" class="name" :to="userPage(notification.user)" v-user-preview="notification.user.id"><mk-user-name :user="notification.user"/></router-link>
<span v-else>{{ notification.header }}</span>
<mk-time :time="notification.createdAt" v-if="withTime"/>
</header>
<router-link v-if="notification.type === 'reaction'" class="text" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
<router-link v-if="notification.type === 'reaction'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
<fa :icon="faQuoteLeft"/>
<mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
<fa :icon="faQuoteRight"/>
</router-link>
<router-link v-if="notification.type === 'renote'" class="text" :to="notification.note | notePage" :title="getNoteSummary(notification.note.renote)">
<router-link v-if="notification.type === 'renote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note.renote)">
<fa :icon="faQuoteLeft"/>
<mfm :text="getNoteSummary(notification.note.renote)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.renote.emojis"/>
<fa :icon="faQuoteRight"/>
</router-link>
<router-link v-if="notification.type === 'reply'" class="text" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
<router-link v-if="notification.type === 'reply'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
<mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
</router-link>
<router-link v-if="notification.type === 'mention'" class="text" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
<router-link v-if="notification.type === 'mention'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
<mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
</router-link>
<router-link v-if="notification.type === 'quote'" class="text" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
<router-link v-if="notification.type === 'quote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
<mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
</router-link>
<router-link v-if="notification.type === 'pollVote'" class="text" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
<router-link v-if="notification.type === 'pollVote'" class="text" :to="notePage(notification.note)" :title="getNoteSummary(notification.note)">
<fa :icon="faQuoteLeft"/>
<mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
<fa :icon="faQuoteRight"/>
@@ -64,6 +64,8 @@ import { faClock } from '@fortawesome/free-regular-svg-icons';
import noteSummary from '../../misc/get-note-summary';
import XReactionIcon from './reaction-icon.vue';
import MkFollowButton from './follow-button.vue';
import notePage from '../filters/note';
import { userPage } from '../filters/user';
export default defineComponent({
components: {
@@ -141,6 +143,8 @@ export default defineComponent({
this.groupInviteDone = true;
this.$root.api('users/groups/invitations/reject', { invitationId: this.notification.invitation.id });
},
notePage,
userPage
}
});
</script>

6
src/client/components/page-preview.vue
View File

@@ -8,7 +8,7 @@
<p v-if="page.summary" :title="page.summary">{{ page.summary.length > 85 ? page.summary.slice(0, 85) + '…' : page.summary }}</p>
<footer>
<img class="icon" :src="page.user.avatarUrl"/>
<p>{{ page.user | userName }}</p>
<p>{{ userName(page.user) }}</p>
</footer>
</article>
</router-link>
@@ -16,6 +16,7 @@
<script lang="ts">
import { defineComponent } from 'vue';
import { userName } from '../filters/user';
export default defineComponent({
props: {
@@ -24,6 +25,9 @@ export default defineComponent({
required: true
},
},
methods: {
userName
}
});
</script>

9
src/client/components/user-list.vue
View File

@@ -12,7 +12,7 @@
<mk-avatar class="avatar" :user="user"/>
<div class="body">
<div class="name">
<router-link class="name" :to="user | userPage" v-user-preview="user.id"><mk-user-name :user="user"/></router-link>
<router-link class="name" :to="userPage(user)" v-user-preview="user.id"><mk-user-name :user="user"/></router-link>
<span class="username"><mk-acct :user="user"/></span>
</div>
<div class="description">
@@ -34,6 +34,7 @@ import { defineComponent } from 'vue';
import paging from '../scripts/paging';
import MkContainer from './ui/container.vue';
import MkFollowButton from './follow-button.vue';
import { userPage } from '../filters/user';
export default defineComponent({
components: {
@@ -62,6 +63,10 @@ export default defineComponent({
users() {
return this.extract ? this.extract(this.items) : this.items;
}
},
methods: {
userPage
}
});
</script>
@@ -96,7 +101,7 @@ export default defineComponent({
> .name {
font-weight: bold;
> .name {
margin-right: 8px;
}

6
src/client/components/user-preview.vue
View File

@@ -4,7 +4,7 @@
<div class="banner" :style="u.bannerUrl ? `background-image: url(${u.bannerUrl})` : ''"></div>
<mk-avatar class="avatar" :user="u" :disable-preview="true"/>
<div class="title">
<router-link class="name" :to="u | userPage"><mk-user-name :user="u" :nowrap="false"/></router-link>
<router-link class="name" :to="userPage(u)"><mk-user-name :user="u" :nowrap="false"/></router-link>
<p class="username"><mk-acct :user="u"/></p>
</div>
<div class="description">
@@ -30,6 +30,7 @@
import { defineComponent } from 'vue';
import parseAcct from '../../misc/acct/parse';
import MkFollowButton from './follow-button.vue';
import { userPage } from '../filters/user';
export default defineComponent({
components: {
@@ -85,7 +86,8 @@ export default defineComponent({
this.closed = true;
this.show = false;
if (this.$refs.content) (this.$refs.content as any).style.pointerEvents = 'none';
}
},
userPage
}
});
</script>

4
src/client/components/users-dialog.vue
View File

@@ -7,7 +7,7 @@
</div>
<div class="users">
<router-link v-for="item in items" class="user" :key="item.id" :to="extract ? extract(item) : item | userPage">
<router-link v-for="item in items" class="user" :key="item.id" :to="userPage(extract ? extract(item) : item)">
<mk-avatar :user="extract ? extract(item) : item" class="avatar" :disable-link="true"/>
<div class="body">
<mk-user-name :user="extract ? extract(item) : item" class="name"/>
@@ -32,6 +32,7 @@ import { defineComponent } from 'vue';
import { faTimes } from '@fortawesome/free-solid-svg-icons';
import paging from '../scripts/paging';
import XModal from './modal.vue';
import { userPage } from '../filters/user';
export default defineComponent({
components: {
@@ -64,6 +65,7 @@ export default defineComponent({
close() {
this.$refs.modal.close();
},
userPage
}
});
</script>