forked from mirror/misskey
ユーザーのページでノートを表示するかハイライトを表示するか決められるようにした
This commit is contained in:
mattyatea
parent
4357c75a44
commit
abb79a0b36
2
locales/index.d.ts
vendored
2
locales/index.d.ts
vendored
@ -543,6 +543,8 @@ export interface Locale {
|
||||
"deleteAll": string;
|
||||
"showFixedPostForm": string;
|
||||
"showFixedPostFormInChannel": string;
|
||||
"FeaturedOrNote": string;
|
||||
"FeaturedOrNoteInfo": string;
|
||||
"newNoteRecived": string;
|
||||
"sounds": string;
|
||||
"sound": string;
|
||||
|
||||
@ -540,6 +540,8 @@ serverLogs: "サーバーログ"
|
||||
deleteAll: "全て削除"
|
||||
showFixedPostForm: "タイムライン上部に投稿フォームを表示する"
|
||||
showFixedPostFormInChannel: "タイムライン上部に投稿フォームを表示する(チャンネル)"
|
||||
FeaturedOrNote: "ユーザーのページで最新のノートを表示する"
|
||||
FeaturedOrNoteInfo: "ユーザーのページに行ったときにハイライトか最新のノートを表示するかを選択することができます。 オフでハイライト オンで最新のノート です"
|
||||
newNoteRecived: "新しいノートがあります"
|
||||
sounds: "サウンド"
|
||||
sound: "サウンド"
|
||||
|
||||
@ -30,6 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<MkSwitch v-model="showFixedPostForm">{{ i18n.ts.showFixedPostForm }}</MkSwitch>
|
||||
<MkSwitch v-model="showFixedPostFormInChannel">{{ i18n.ts.showFixedPostFormInChannel }}</MkSwitch>
|
||||
<MkSwitch v-model="showMediaTimeline">{{ i18n.ts.showMediaTimeline}}<template #caption>{{ i18n.ts.showMediaTimelineInfo }} </template></MkSwitch>
|
||||
<MkSwitch v-model="FeaturedOrNote">{{ i18n.ts.FeaturedOrNote}}<template #caption>{{ i18n.ts.FeaturedOrNoteInfo }} </template></MkSwitch>
|
||||
<MkFolder>
|
||||
<template #label>{{ i18n.ts.pinnedList }}</template>
|
||||
<!-- 複数ピン止め管理できるようにしたいけどめんどいので一旦ひとつのみ -->
|
||||
@ -286,6 +287,7 @@ const enableGamingMode = computed(defaultStore.makeGetterSetter('gamingMode'));
|
||||
const enableonlyAndWithSave = computed(defaultStore.makeGetterSetter('onlyAndWithSave'));
|
||||
const showMediaTimeline = computed(defaultStore.makeGetterSetter('showMediaTimeline'));
|
||||
const showVisibilityColor = computed(defaultStore.makeGetterSetter('showVisibilityColor'))
|
||||
const FeaturedOrNote = computed(defaultStore.makeGetterSetter('FeaturedOrNote'))
|
||||
watch(lang, () => {
|
||||
miLocalStorage.setItem('lang', lang.value as string);
|
||||
miLocalStorage.removeItem('locale');
|
||||
@ -347,6 +349,7 @@ watch([
|
||||
showMediaTimeline,
|
||||
showVisibilityColor,
|
||||
enableonlyAndWithSave,
|
||||
FeaturedOrNote,
|
||||
], async () => {
|
||||
await reloadAsk();
|
||||
});
|
||||
|
||||
@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
-->
|
||||
|
||||
<template>
|
||||
<MkSpacer :contentMax="narrow ? 800 : 1100">
|
||||
<MkSpacer :contentMax="narrow ? 800 : 1100">
|
||||
<div ref="rootEl" class="ftskorzw" :class="{ wide: !narrow }" style="container-type: inline-size;">
|
||||
<div class="main _gaps">
|
||||
<!-- TODO -->
|
||||
@ -23,7 +23,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<MkUserName class="name" :user="user" :nowrap="true"/>
|
||||
<div class="bottom">
|
||||
<span class="username"><MkAcct :user="user" :detail="true"/></span>
|
||||
<span v-if="user.isAdmin" :title="i18n.ts.isAdmin" style="color: var(--badge);"><i class="ti ti-shield"></i></span>
|
||||
<span v-if="user.isAdmin" :title="i18n.ts.isAdmin" style="color: var(--badge);"><i
|
||||
class="ti ti-shield"></i></span>
|
||||
<span v-if="user.isLocked" :title="i18n.ts.isLocked"><i class="ti ti-lock"></i></span>
|
||||
<span v-if="user.isBot" :title="i18n.ts.isBot"><i class="ti ti-robot"></i></span>
|
||||
<button v-if="!isEditingMemo && !memoDraft" class="_button add-note-button" @click="showMemoTextarea">
|
||||
@ -35,7 +36,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<div v-if="$i" class="actions">
|
||||
<button class="menu _button" @click="menu"><i class="ti ti-dots"></i></button>
|
||||
<MkNotifyButton v-if="$i.id != user.id " :user="user"></MkNotifyButton>
|
||||
<MkFollowButton v-if="$i.id != user.id" :user="user" :inline="true" :transparent="false" :full="true" class="koudoku"/>
|
||||
<MkFollowButton v-if="$i.id != user.id" :user="user" :inline="true" :transparent="false" :full="true"
|
||||
class="koudoku"/>
|
||||
</div>
|
||||
</div>
|
||||
<MkAvatar class="avatar" :user="user" indicator/>
|
||||
@ -43,13 +45,15 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<MkUserName :user="user" :nowrap="false" class="name"/>
|
||||
<div class="bottom">
|
||||
<span class="username"><MkAcct :user="user" :detail="true"/></span>
|
||||
<span v-if="user.isAdmin" :title="i18n.ts.isAdmin" style="color: var(--badge);"><i class="ti ti-shield"></i></span>
|
||||
<span v-if="user.isAdmin" :title="i18n.ts.isAdmin" style="color: var(--badge);"><i
|
||||
class="ti ti-shield"></i></span>
|
||||
<span v-if="user.isLocked" :title="i18n.ts.isLocked"><i class="ti ti-lock"></i></span>
|
||||
<span v-if="user.isBot" :title="i18n.ts.isBot"><i class="ti ti-robot"></i></span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="user.roles.length > 0" class="roles">
|
||||
<span v-for="role in user.roles" :key="role.id" v-tooltip="role.description" class="role" :style="{ '--color': role.color }">
|
||||
<span v-for="role in user.roles" :key="role.id" v-tooltip="role.description" class="role"
|
||||
:style="{ '--color': role.color }">
|
||||
<MkA v-adaptive-bg :to="`/roles/${role.id}`">
|
||||
<img v-if="role.iconUrl" style="height: 1.3em; vertical-align: -22%;" :src="role.iconUrl"/>
|
||||
{{ role.name }}
|
||||
@ -57,7 +61,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="iAmModerator" class="moderationNote">
|
||||
<MkTextarea v-if="editModerationNote || (moderationNote != null && moderationNote !== '')" v-model="moderationNote" manualSave>
|
||||
<MkTextarea v-if="editModerationNote || (moderationNote != null && moderationNote !== '')"
|
||||
v-model="moderationNote" manualSave>
|
||||
<template #label>{{ i18n.ts.moderationNote }}</template>
|
||||
</MkTextarea>
|
||||
<div v-else>
|
||||
@ -88,11 +93,17 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
</dl>
|
||||
<dl v-if="user.birthday" class="field">
|
||||
<dt class="name"><i class="ti ti-cake ti-fw"></i> {{ i18n.ts.birthday }}</dt>
|
||||
<dd class="value">{{ user.birthday.replace('-', '/').replace('-', '/') }} ({{ i18n.t('yearsOld', { age }) }})</dd>
|
||||
<dd class="value">{{ user.birthday.replace('-', '/').replace('-', '/') }} ({{
|
||||
i18n.t('yearsOld', {age})
|
||||
}})
|
||||
</dd>
|
||||
</dl>
|
||||
<dl class="field">
|
||||
<dt class="name"><i class="ti ti-calendar ti-fw"></i> {{ i18n.ts.registeredDate }}</dt>
|
||||
<dd class="value">{{ dateString(user.createdAt) }} (<MkTime :time="user.createdAt"/>)</dd>
|
||||
<dd class="value">{{ dateString(user.createdAt) }} (
|
||||
<MkTime :time="user.createdAt"/>
|
||||
)
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div v-if="user.fields.length > 0" class="fields">
|
||||
@ -102,7 +113,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
</dt>
|
||||
<dd class="value">
|
||||
<Mfm :text="field.value" :author="user" :i="$i" :colored="false"/>
|
||||
<i v-if="user.verifiedLinks.includes(field.value)" v-tooltip:dialog="i18n.ts.verifiedLink" class="ti ti-circle-check" :class="$style.verifiedLink"></i>
|
||||
<i v-if="user.verifiedLinks.includes(field.value)" v-tooltip:dialog="i18n.ts.verifiedLink"
|
||||
class="ti ti-circle-check" :class="$style.verifiedLink"></i>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
@ -132,22 +144,28 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
<XFiles :key="user.id" :user="user"/>
|
||||
<XActivity :key="user.id" :user="user"/>
|
||||
</template>
|
||||
<div v-if="!defaultStore.state.FeaturedOrNote">
|
||||
<div v-if="!disableNotes">
|
||||
<div style="margin-bottom: 8px;">{{ i18n.ts.featured }}</div>
|
||||
<MkNotes :class="$style.tl" :noGap="true" :pagination="pagination"/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div style="margin-bottom: 8px;">{{ i18n.ts._sfx.note }}</div>
|
||||
<MkNotes :class="$style.tl" :noGap="true" :pagination="Notes"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!narrow" class="sub _gaps" style="container-type: inline-size;">
|
||||
<XFiles :key="user.id" :user="user"/>
|
||||
<XActivity :key="user.id" :user="user"/>
|
||||
</div>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</MkSpacer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { defineAsyncComponent, computed, onMounted, onUnmounted, nextTick, watch } from 'vue';
|
||||
import {defineAsyncComponent, computed, onMounted, onUnmounted, nextTick, watch} from 'vue';
|
||||
import * as Misskey from 'misskey-js';
|
||||
import MkNote from '@/components/MkNote.vue';
|
||||
import MkFollowButton from '@/components/MkFollowButton.vue';
|
||||
@ -157,21 +175,22 @@ import MkTextarea from '@/components/MkTextarea.vue';
|
||||
import MkOmit from '@/components/MkOmit.vue';
|
||||
import MkInfo from '@/components/MkInfo.vue';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
import { getScrollPosition } from '@/scripts/scroll.js';
|
||||
import { getUserMenu } from '@/scripts/get-user-menu.js';
|
||||
import {getScrollPosition} from '@/scripts/scroll.js';
|
||||
import {getUserMenu} from '@/scripts/get-user-menu.js';
|
||||
import number from '@/filters/number.js';
|
||||
import { userPage } from '@/filters/user.js';
|
||||
import {userPage} from '@/filters/user.js';
|
||||
import * as os from '@/os.js';
|
||||
import { useRouter } from '@/router.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import { $i, iAmModerator } from '@/account.js';
|
||||
import { dateString } from '@/filters/date.js';
|
||||
import { confetti } from '@/scripts/confetti.js';
|
||||
import {useRouter} from '@/router.js';
|
||||
import {i18n} from '@/i18n.js';
|
||||
import {$i, iAmModerator} from '@/account.js';
|
||||
import {dateString} from '@/filters/date.js';
|
||||
import {confetti} from '@/scripts/confetti.js';
|
||||
import MkNotes from '@/components/MkNotes.vue';
|
||||
import { api } from '@/os.js';
|
||||
import { isFfVisibleForMe } from '@/scripts/isFfVisibleForMe.js';
|
||||
import {api} from '@/os.js';
|
||||
import {isFfVisibleForMe} from '@/scripts/isFfVisibleForMe.js';
|
||||
import MkNotifyButton from "@/components/MkNotifyButton.vue";
|
||||
import MkRemoteInfoUpdate from "@/components/MkRemoteInfoUpdate.vue";
|
||||
import {defaultStore} from '@/store.js';
|
||||
|
||||
function calcAge(birthdate: string): number {
|
||||
const date = new Date(birthdate);
|
||||
@ -212,7 +231,7 @@ let moderationNote = $ref(props.user.moderationNote);
|
||||
let editModerationNote = $ref(false);
|
||||
|
||||
watch($$(moderationNote), async () => {
|
||||
await os.api('admin/update-user-note', { userId: props.user.id, text: moderationNote });
|
||||
await os.api('admin/update-user-note', {userId: props.user.id, text: moderationNote});
|
||||
});
|
||||
|
||||
const pagination = {
|
||||
@ -222,11 +241,18 @@ const pagination = {
|
||||
userId: props.user.id,
|
||||
})),
|
||||
};
|
||||
const Notes ={
|
||||
endpoint: 'users/notes' as const,
|
||||
limit: 10,
|
||||
params: computed(() => ({
|
||||
userId: props.user.id,
|
||||
})),
|
||||
}
|
||||
|
||||
const style = $computed(() => {
|
||||
if (props.user.bannerUrl == null) return {};
|
||||
return {
|
||||
backgroundImage: `url(${ props.user.bannerUrl })`,
|
||||
backgroundImage: `url(${props.user.bannerUrl})`,
|
||||
};
|
||||
});
|
||||
|
||||
@ -235,7 +261,7 @@ const age = $computed(() => {
|
||||
});
|
||||
|
||||
function menu(ev) {
|
||||
const { menu, cleanup } = getUserMenu(props.user, router);
|
||||
const {menu, cleanup} = getUserMenu(props.user, router);
|
||||
os.popupMenu(menu, ev.currentTarget ?? ev.target).finally(cleanup);
|
||||
}
|
||||
|
||||
|
||||
@ -432,6 +432,10 @@ export const defaultStore = markRaw(new Storage('base', {
|
||||
where: 'device',
|
||||
default: false,
|
||||
},
|
||||
FeaturedOrNote: {
|
||||
where: 'device',
|
||||
default: false
|
||||
}
|
||||
}));
|
||||
|
||||
// TODO: 他のタブと永続化されたstateを同期
|
||||
|
||||
Loading…
Reference in New Issue
Block a user