mirror/misskey
1
0
Fork 0
mirror of https://github.com/misskey-dev/misskey synced 2024-12-20 01:29:02 +09:00
Code

ユーザーピッカーに最近使用したユーザーを表示するように

Browse Source
This commit is contained in:
syuilo 2020-11-08 12:40:56 +09:00
parent 4f1409601e
commit d01c465a8d
2 changed files with 34 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/client/components/user-select-dialog.vue
View File

@ -14,10 +14,10 @@
<MkInput v-model:value="host" class="input" @update:value="search"><span>{{ $t('host') }}</span><template #prefix>@</template></MkInput> <MkInput v-model:value="host" class="input" @update:value="search"><span>{{ $t('host') }}</span><template #prefix>@</template></MkInput>
</div> </div>
</div> </div>
<div class="tbhwbxda _section" :style="users.length > 0 ? 'padding: 0;' : ''"> <div class="tbhwbxda _section result" v-if="username != '' || host != ''" :class="{ hit: users.length > 0 }">
<div class="users" v-if="users.length > 0"> <div class="users" v-if="users.length > 0">
<div class="user" v-for="user in users" :key="user.id" :class="{ selected: selected && selected.id === user.id }" @click="selected = user" @dblclick="ok()"> <div class="user" v-for="user in users" :key="user.id" :class="{ selected: selected && selected.id === user.id }" @click="selected = user" @dblclick="ok()">
<MkAvatar :user="user" class="avatar" :disable-link="true"/> <MkAvatar :user="user" class="avatar"/>
<div class="body"> <div class="body">
<MkUserName :user="user" class="name"/> <MkUserName :user="user" class="name"/>
<MkAcct :user="user" class="acct"/> <MkAcct :user="user" class="acct"/>
@ -28,6 +28,17 @@
<span>{{ $t('noUsers') }}</span> <span>{{ $t('noUsers') }}</span>
</div> </div>
</div> </div>
<div class="tbhwbxda _section recent" v-if="username == '' && host == ''">
<div class="users">
<div class="user" v-for="user in recentUsers" :key="user.id" :class="{ selected: selected && selected.id === user.id }" @click="selected = user" @dblclick="ok()">
<MkAvatar :user="user" class="avatar"/>
<div class="body">
<MkUserName :user="user" class="name"/>
<MkAcct :user="user" class="acct"/>
</div>
</div>
</div>
</div>
</XModalWindow> </XModalWindow>
</template> </template>
@ -53,18 +64,23 @@ export default defineComponent({
return { return {
username: '', username: '',
host: '', host: '',
recentUsers: [],
users: [], users: [],
selected: null, selected: null,
faTimes, faCheck faTimes, faCheck
}; };
}, },
mounted() { async mounted() {
this.focus(); this.focus();
this.$nextTick(() => { this.$nextTick(() => {
this.focus(); this.focus();
}); });
this.recentUsers = await os.api('users/show', {
userIds: this.$store.state.device.recentlyUsedUsers
});
}, },
methods: { methods: {
@ -90,6 +106,12 @@ export default defineComponent({
ok() { ok() {
this.$emit('ok', this.selected); this.$emit('ok', this.selected);
this.$refs.dialog.close(); this.$refs.dialog.close();
// 最近使ったユーザー更新
let recents = this.$store.state.device.recentlyUsedUsers;
recents = recents.filter(x => x !== this.selected.id);
recents.unshift(this.selected.id);
this.$store.commit('device/set', { key: 'recentlyUsedUsers', value: recents.splice(0, 16) });
}, },
cancel() { cancel() {
@ -107,6 +129,14 @@ export default defineComponent({
overflow: auto; overflow: auto;
height: 100%; height: 100%;
&.result.hit {
padding: 0;
}
&.recent {
padding: 0;
}
> .inputs { > .inputs {
> .input { > .input {
display: inline-block; display: inline-block;

1
src/client/store.ts
View File

@ -60,6 +60,7 @@ export const defaultDeviceSettings = {
serverDisconnectedBehavior: 'quiet', serverDisconnectedBehavior: 'quiet',
accounts: [], accounts: [],
recentlyUsedEmojis: [], recentlyUsedEmojis: [],
recentlyUsedUsers: [],
themes: [], themes: [],
darkTheme: '8050783a-7f63-445a-b270-36d0f6ba1677', darkTheme: '8050783a-7f63-445a-b270-36d0f6ba1677',
lightTheme: '4eea646f-7afa-4645-83e9-83af0333cd37', lightTheme: '4eea646f-7afa-4645-83e9-83af0333cd37',