update
This commit is contained in:
mattyatea
parent
5e140a7ff5
commit
509181a6d0
|
|
@ -436,6 +436,10 @@ export interface Locale extends ILocale {
|
|||
* フォロワー
|
||||
*/
|
||||
"followers": string;
|
||||
/**
|
||||
* プリズム
|
||||
*/
|
||||
"points": string;
|
||||
/**
|
||||
* フォローされています
|
||||
*/
|
||||
|
|
@ -9291,6 +9295,10 @@ export interface Locale extends ILocale {
|
|||
* 実績を獲得
|
||||
*/
|
||||
"achievementEarned": string;
|
||||
/**
|
||||
* ログインボーナス
|
||||
*/
|
||||
"loginbonus": string;
|
||||
/**
|
||||
* 通知テスト
|
||||
*/
|
||||
|
|
@ -9380,6 +9388,10 @@ export interface Locale extends ILocale {
|
|||
* 実績の獲得
|
||||
*/
|
||||
"achievementEarned": string;
|
||||
/**
|
||||
* ログインボーナス
|
||||
*/
|
||||
"loginbonus": string;
|
||||
/**
|
||||
* 連携アプリからの通知
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -105,6 +105,7 @@ note: "ノート"
|
|||
notes: "ノート"
|
||||
following: "フォロー"
|
||||
followers: "フォロワー"
|
||||
points: "プリズム"
|
||||
followsYou: "フォローされています"
|
||||
createList: "リスト作成"
|
||||
manageLists: "リストの管理"
|
||||
|
|
@ -2452,6 +2453,7 @@ _notification:
|
|||
roleAssigned: "ロールが付与されました"
|
||||
emptyPushNotificationMessage: "プッシュ通知の更新をしました"
|
||||
achievementEarned: "実績を獲得"
|
||||
loginbonus: "ログインボーナス"
|
||||
testNotification: "通知テスト"
|
||||
checkNotificationBehavior: "通知の表示を確かめる"
|
||||
sendTestNotification: "テスト通知を送信する"
|
||||
|
|
@ -2476,6 +2478,7 @@ _notification:
|
|||
followRequestAccepted: "フォローが受理された"
|
||||
roleAssigned: "ロールが付与された"
|
||||
achievementEarned: "実績の獲得"
|
||||
loginbonus: "ログインボーナス"
|
||||
app: "連携アプリからの通知"
|
||||
|
||||
_actions:
|
||||
|
|
|
|||
|
|
@ -163,6 +163,9 @@ export class NotificationEntityService implements OnModuleInit {
|
|||
...(notification.type === 'achievementEarned' ? {
|
||||
achievement: notification.achievement,
|
||||
} : {}),
|
||||
...(notification.type === 'loginbonus' ? {
|
||||
loginbonus: notification.loginbonus,
|
||||
} : {}),
|
||||
...(notification.type === 'app' ? {
|
||||
body: notification.customBody,
|
||||
header: notification.customHeader,
|
||||
|
|
|
|||
|
|
@ -404,6 +404,7 @@ export class UserEntityService implements OnModuleInit {
|
|||
userRelations?: Map<MiUser['id'], UserRelation>,
|
||||
userMemos?: Map<MiUser['id'], string | null>,
|
||||
pinNotes?: Map<MiUser['id'], MiUserNotePining[]>,
|
||||
todayGetPoints?: number,
|
||||
},
|
||||
): Promise<Packed<S>> {
|
||||
const opts = Object.assign({
|
||||
|
|
@ -507,7 +508,7 @@ export class UserEntityService implements OnModuleInit {
|
|||
iconUrl: r.iconUrl,
|
||||
displayOrder: r.displayOrder,
|
||||
}))) : undefined,
|
||||
|
||||
...(user.host == null ? { getPoints: profile!.getPoints } : {}),
|
||||
...(isDetailed ? {
|
||||
url: profile!.url,
|
||||
uri: user.uri,
|
||||
|
|
@ -602,6 +603,9 @@ export class UserEntityService implements OnModuleInit {
|
|||
achievements: profile!.achievements,
|
||||
loggedInDays: profile!.loggedInDates.length,
|
||||
policies: this.roleService.getUserPolicies(user.id),
|
||||
...(opts.todayGetPoints ? {
|
||||
todayGetPoints: opts.todayGetPoints,
|
||||
} : {}),
|
||||
} : {}),
|
||||
|
||||
...(opts.includeSecrets ? {
|
||||
|
|
|
|||
|
|
@ -261,6 +261,10 @@ export class MiUserProfile {
|
|||
length: 32, array: true, default: '{}',
|
||||
})
|
||||
public loggedInDates: string[];
|
||||
@Column('integer', {
|
||||
default: '0',
|
||||
})
|
||||
public getPoints: number;
|
||||
|
||||
@Column('jsonb', {
|
||||
default: [],
|
||||
|
|
|
|||
|
|
@ -8,13 +8,14 @@ import type { UserProfilesRepository } from '@/models/_.js';
|
|||
import { Endpoint } from '@/server/api/endpoint-base.js';
|
||||
import { UserEntityService } from '@/core/entities/UserEntityService.js';
|
||||
import { DI } from '@/di-symbols.js';
|
||||
import { NotificationService } from '@/core/NotificationService.js';
|
||||
import { ApiError } from '../error.js';
|
||||
|
||||
export const meta = {
|
||||
tags: ['account'],
|
||||
|
||||
requireCredential: true,
|
||||
kind: "read:account",
|
||||
kind: 'read:account',
|
||||
|
||||
res: {
|
||||
type: 'object',
|
||||
|
|
@ -43,7 +44,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
|
|||
constructor(
|
||||
@Inject(DI.userProfilesRepository)
|
||||
private userProfilesRepository: UserProfilesRepository,
|
||||
|
||||
private notificationService: NotificationService,
|
||||
private userEntityService: UserEntityService,
|
||||
) {
|
||||
super(meta, paramDef, async (ps, user, token) => {
|
||||
|
|
@ -51,7 +52,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
|
|||
|
||||
const now = new Date();
|
||||
const today = `${now.getFullYear()}/${now.getMonth() + 1}/${now.getDate()}`;
|
||||
|
||||
let todayGetPoints = 0;
|
||||
// 渡ってきている user はキャッシュされていて古い可能性があるので改めて取得
|
||||
const userProfile = await this.userProfilesRepository.findOne({
|
||||
where: {
|
||||
|
|
@ -65,9 +66,16 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
|
|||
}
|
||||
|
||||
if (!userProfile.loggedInDates.includes(today)) {
|
||||
todayGetPoints = Math.floor(Math.random() * 5) + 1;
|
||||
this.userProfilesRepository.update({ userId: user.id }, {
|
||||
loggedInDates: [...userProfile.loggedInDates, today],
|
||||
});
|
||||
this.userProfilesRepository.update({ userId: user.id }, {
|
||||
getPoints: userProfile.getPoints + todayGetPoints,
|
||||
});
|
||||
this.notificationService.createNotification(user.id, 'loginbonus', {
|
||||
loginbonus: todayGetPoints,
|
||||
});
|
||||
userProfile.loggedInDates = [...userProfile.loggedInDates, today];
|
||||
}
|
||||
|
||||
|
|
@ -75,6 +83,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
|
|||
schema: 'MeDetailed',
|
||||
includeSecrets: isSecure,
|
||||
userProfile,
|
||||
...(todayGetPoints && { todayGetPoints }),
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ export const notificationTypes = [
|
|||
'achievementEarned',
|
||||
'app',
|
||||
'test',
|
||||
'loginbonus',
|
||||
] as const;
|
||||
|
||||
export const groupedNotificationTypes = [
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<div :class="$style.root">
|
||||
<div :class="$style.head">
|
||||
<MkAvatar v-if="['pollEnded', 'note'].includes(notification.type) && notification.note" :class="$style.icon" :user="notification.note.user" link preview/>
|
||||
<MkAvatar v-else-if="['roleAssigned', 'achievementEarned'].includes(notification.type)" :class="$style.icon" :user="$i" link preview/>
|
||||
<MkAvatar v-else-if="['roleAssigned', 'achievementEarned', 'loginbonus'].includes(notification.type)" :class="$style.icon" :user="$i" link preview/>
|
||||
<div v-else-if="notification.type === 'reaction:grouped' && notification.note.reactionAcceptance === 'likeOnly'" :class="[$style.icon, $style.icon_reactionGroupHeart]"><i class="ti ti-heart" style="line-height: 1;"></i></div>
|
||||
<div v-else-if="notification.type === 'reaction:grouped'" :class="[$style.icon, $style.icon_reactionGroup]"><i class="ti ti-plus" style="line-height: 1;"></i></div>
|
||||
<div v-else-if="notification.type === 'renote:grouped'" :class="[$style.icon, $style.icon_renoteGroup]"><i class="ti ti-repeat" style="line-height: 1;"></i></div>
|
||||
|
|
@ -25,6 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
[$style.t_quote]: notification.type === 'quote',
|
||||
[$style.t_pollEnded]: notification.type === 'pollEnded',
|
||||
[$style.t_achievementEarned]: notification.type === 'achievementEarned',
|
||||
[$style.t_achievementEarned]: notification.type === 'loginbonus',
|
||||
[$style.t_roleAssigned]: notification.type === 'roleAssigned' && notification.role.iconUrl == null,
|
||||
}]"
|
||||
>
|
||||
|
|
@ -37,6 +38,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<i v-else-if="notification.type === 'quote'" class="ti ti-quote"></i>
|
||||
<i v-else-if="notification.type === 'pollEnded'" class="ti ti-chart-arrows"></i>
|
||||
<i v-else-if="notification.type === 'achievementEarned'" class="ti ti-medal"></i>
|
||||
<i v-else-if="notification.type === 'loginbonus'" class="ti ti-medal"></i>
|
||||
|
||||
<template v-else-if="notification.type === 'roleAssigned'">
|
||||
<img v-if="notification.role.iconUrl" style="height: 1.3em; vertical-align: -22%;" :src="notification.role.iconUrl" alt=""/>
|
||||
<i v-else class="ti ti-badges"></i>
|
||||
|
|
@ -56,6 +59,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<span v-else-if="notification.type === 'note'">{{ i18n.ts._notification.newNote }}: <MkUserName :user="notification.note.user"/></span>
|
||||
<span v-else-if="notification.type === 'roleAssigned'">{{ i18n.ts._notification.roleAssigned }}</span>
|
||||
<span v-else-if="notification.type === 'achievementEarned'">{{ i18n.ts._notification.achievementEarned }}</span>
|
||||
<span v-else-if="notification.type === 'loginbonus'">{{ i18n.ts._notification.loginbonus }}</span>
|
||||
<span v-else-if="notification.type === 'test'">{{ i18n.ts._notification.testNotification }}</span>
|
||||
<MkA v-else-if="notification.type === 'follow' || notification.type === 'mention' || notification.type === 'reply' || notification.type === 'renote' || notification.type === 'quote' || notification.type === 'reaction' || notification.type === 'receiveFollowRequest' || notification.type === 'followRequestAccepted'" v-user-preview="notification.user.id" :class="$style.headerName" :to="userPage(notification.user)"><MkUserName :user="notification.user"/></MkA>
|
||||
<span v-else-if="notification.type === 'reaction:grouped' && notification.note.reactionAcceptance === 'likeOnly'">{{ i18n.tsx._notification.likedBySomeUsers({ n: getActualReactedUsersCount(notification) }) }}</span>
|
||||
|
|
@ -94,10 +98,13 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</MkA>
|
||||
<div v-else-if="notification.type === 'roleAssigned'" :class="$style.text">
|
||||
{{ notification.role.name }}
|
||||
</div> <div v-else-if="notification.type === 'loginbonus'" :class="$style.text">
|
||||
{{ notification.loginbonus }}プリズム入手しました！
|
||||
</div>
|
||||
<MkA v-else-if="notification.type === 'achievementEarned'" :class="$style.text" to="/my/achievements">
|
||||
{{ i18n.ts._achievements._types['_' + notification.achievement].title }}
|
||||
</MkA>
|
||||
|
||||
<template v-else-if="notification.type === 'follow'">
|
||||
<span :class="$style.text" style="opacity: 0.6;">{{ i18n.ts.youGotNewFollower }}</span>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -11,159 +11,175 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<!-- <div class="punished" v-if="user.isSuspended"><i class="ti ti-alert-triangle" style="margin-right: 8px;"></i> {{ i18n.ts.userSuspended }}</div> -->
|
||||
<!-- <div class="punished" v-if="user.isSilenced"><i class="ti ti-alert-triangle" style="margin-right: 8px;"></i> {{ i18n.ts.userSilenced }}</div> -->
|
||||
|
||||
<div class="profile _gaps">
|
||||
<MkAccountMoved v-if="user.movedTo" :movedTo="user.movedTo"/>
|
||||
<MkRemoteCaution v-if="user.host != null" :href="user.url ?? user.uri!" class="warn"/>
|
||||
<MkRemoteInfoUpdate v-if="user.host != null" :UserId="user.id" class="warn"/>
|
||||
<div :key="user.id" class="main _panel">
|
||||
<div class="banner-container" :style="style">
|
||||
<div ref="bannerEl" class="banner" :style="style"></div>
|
||||
<div class="fade"></div>
|
||||
<div class="title">
|
||||
<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.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="$i && !isEditingMemo && !memoDraft" class="_button add-note-button" @click="showMemoTextarea">
|
||||
<i class="ti ti-edit"/> {{ i18n.ts.addMemo }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<span v-if="$i && $i.id != user.id && user.isFollowed" class="followed">{{ i18n.ts.followsYou }}</span>
|
||||
<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" v-model:user="user" :inline="true" :transparent="false" :full="true"
|
||||
class="koudoku"/>
|
||||
</div>
|
||||
</div>
|
||||
<MkAvatar class="avatar" :user="user" indicator/>
|
||||
<div class="title">
|
||||
<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.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 }">
|
||||
<div class="profile _gaps">
|
||||
<MkAccountMoved v-if="user.movedTo" :movedTo="user.movedTo"/>
|
||||
<MkRemoteCaution v-if="user.host != null" :href="user.url ?? user.uri!" class="warn"/>
|
||||
<MkRemoteInfoUpdate v-if="user.host != null" :UserId="user.id" class="warn"/>
|
||||
<div :key="user.id" class="main _panel">
|
||||
<div class="banner-container" :style="style">
|
||||
<div ref="bannerEl" class="banner" :style="style"></div>
|
||||
<div class="fade"></div>
|
||||
<div class="title">
|
||||
<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.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="$i && !isEditingMemo && !memoDraft" class="_button add-note-button" @click="showMemoTextarea">
|
||||
<i class="ti ti-edit"/> {{ i18n.ts.addMemo }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<span v-if="$i && $i.id != user.id && user.isFollowed" class="followed">{{ i18n.ts.followsYou }}</span>
|
||||
<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" v-model:user="user" :inline="true" :transparent="false" :full="true"
|
||||
class="koudoku"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<MkAvatar class="avatar" :user="user" indicator/>
|
||||
<div class="title">
|
||||
<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.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 }"
|
||||
>
|
||||
<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 }}
|
||||
</MkA>
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="iAmModerator" class="moderationNote">
|
||||
<MkTextarea v-if="editModerationNote || (moderationNote != null && moderationNote !== '')"
|
||||
v-model="moderationNote" manualSave>
|
||||
<template #label>{{ i18n.ts.moderationNote }}</template>
|
||||
</MkTextarea>
|
||||
<div v-else>
|
||||
<MkButton small @click="editModerationNote = true">{{ i18n.ts.addModerationNote }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="isEditingMemo || memoDraft" class="memo" :class="{'no-memo': !memoDraft}">
|
||||
<div class="heading" v-text="i18n.ts.memo"/>
|
||||
<textarea
|
||||
ref="memoTextareaEl"
|
||||
v-model="memoDraft"
|
||||
rows="1"
|
||||
@focus="isEditingMemo = true"
|
||||
@blur="updateMemo"
|
||||
@input="adjustMemoTextarea"
|
||||
/>
|
||||
</div>
|
||||
<div class="description">
|
||||
<MkOmit>
|
||||
<Mfm v-if="user.description" :text="user.description" :isNote="false" :author="user"/>
|
||||
<p v-else class="empty">{{ i18n.ts.noAccountDescription }}</p>
|
||||
</MkOmit>
|
||||
</div>
|
||||
<div class="fields system">
|
||||
<dl v-if="user.location" class="field">
|
||||
<dt class="name"><i class="ti ti-map-pin ti-fw"></i> {{ i18n.ts.location }}</dt>
|
||||
<dd class="value">{{ user.location }}</dd>
|
||||
</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.tsx.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>
|
||||
</dl>
|
||||
</div>
|
||||
<div v-if="user.fields.length > 0" class="fields">
|
||||
<dl v-for="(field, i) in user.fields" :key="i" class="field">
|
||||
<dt class="name">
|
||||
<Mfm :text="field.name" :plain="true" :colored="false"/>
|
||||
</dt>
|
||||
<dd class="value">
|
||||
<Mfm :text="field.value" :author="user" :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>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="status">
|
||||
<MkA :to="userPage(user)">
|
||||
<b>{{ number(user.notesCount) }}</b>
|
||||
<span>{{ i18n.ts.notes }}</span>
|
||||
</MkA>
|
||||
<MkA v-if="isFollowingVisibleForMe(user)" :to="userPage(user, 'following')">
|
||||
<b>{{ number(user.followingCount) }}</b>
|
||||
<span>{{ i18n.ts.following }}</span>
|
||||
</MkA>
|
||||
<MkA v-if="isFollowersVisibleForMe(user)" :to="userPage(user, 'followers')">
|
||||
<b>{{ number(user.followersCount) }}</b>
|
||||
<span>{{ i18n.ts.followers }}</span>
|
||||
</MkA>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="iAmModerator" class="moderationNote">
|
||||
<MkTextarea
|
||||
v-if="editModerationNote || (moderationNote != null && moderationNote !== '')"
|
||||
v-model="moderationNote" manualSave
|
||||
>
|
||||
<template #label>{{ i18n.ts.moderationNote }}</template>
|
||||
</MkTextarea>
|
||||
<div v-else>
|
||||
<MkButton small @click="editModerationNote = true">{{ i18n.ts.addModerationNote }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="isEditingMemo || memoDraft" class="memo" :class="{'no-memo': !memoDraft}">
|
||||
<div class="heading" v-text="i18n.ts.memo"/>
|
||||
<textarea
|
||||
ref="memoTextareaEl"
|
||||
v-model="memoDraft"
|
||||
rows="1"
|
||||
@focus="isEditingMemo = true"
|
||||
@blur="updateMemo"
|
||||
@input="adjustMemoTextarea"
|
||||
/>
|
||||
</div>
|
||||
<div class="description">
|
||||
<MkOmit>
|
||||
<Mfm v-if="user.description" :text="user.description" :isNote="false" :author="user"/>
|
||||
<p v-else class="empty">{{ i18n.ts.noAccountDescription }}</p>
|
||||
</MkOmit>
|
||||
</div>
|
||||
<div class="fields system">
|
||||
<dl v-if="user.location" class="field">
|
||||
<dt class="name"><i class="ti ti-map-pin ti-fw"></i> {{ i18n.ts.location }}</dt>
|
||||
<dd class="value">{{ user.location }}</dd>
|
||||
</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.tsx.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>
|
||||
</dl>
|
||||
</div>
|
||||
<div v-if="user.fields.length > 0" class="fields">
|
||||
<dl v-for="(field, i) in user.fields" :key="i" class="field">
|
||||
<dt class="name">
|
||||
<Mfm :text="field.name" :plain="true" :colored="false"/>
|
||||
</dt>
|
||||
<dd class="value">
|
||||
<Mfm :text="field.value" :author="user" :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>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="status">
|
||||
<MkA :to="userPage(user)">
|
||||
<b>{{ number(user.notesCount) }}</b>
|
||||
<span>{{ i18n.ts.notes }}</span>
|
||||
</MkA>
|
||||
<MkA v-if="isFollowingVisibleForMe(user)" :to="userPage(user, 'following')">
|
||||
<b>{{ number(user.followingCount) }}</b>
|
||||
<span>{{ i18n.ts.following }}</span>
|
||||
</MkA>
|
||||
<MkA v-if="isFollowersVisibleForMe(user)" :to="userPage(user, 'followers')">
|
||||
<b>{{ number(user.followersCount) }}</b>
|
||||
<span>{{ i18n.ts.followers }}</span>
|
||||
</MkA>
|
||||
<MkA>
|
||||
<b> {{ number(user.getPoints) }}</b>
|
||||
<span>{{ i18n.ts.points }}</span>
|
||||
</MkA>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contents _gaps">
|
||||
<div v-if="user.pinnedNotes.length > 0" class="_gaps">
|
||||
<MkNote v-for="note in user.pinnedNotes" :key="note.id" class="note _panel" :note="note" :pinned="true"/>
|
||||
</div>
|
||||
<MkInfo v-else-if="$i && $i.id === user.id">{{ i18n.ts.userPagePinTip }}</MkInfo>
|
||||
<template v-if="narrow">
|
||||
<MkLazy>
|
||||
<div class="contents _gaps">
|
||||
<div v-if="user.pinnedNotes.length > 0" class="_gaps">
|
||||
<MkNote v-for="note in user.pinnedNotes" :key="note.id" class="note _panel" :note="note" :pinned="true"/>
|
||||
</div>
|
||||
<MkInfo v-else-if="$i && $i.id === user.id">{{ i18n.ts.userPagePinTip }}</MkInfo>
|
||||
<template v-if="narrow">
|
||||
<MkLazy>
|
||||
<XFiles :key="user.id" :user="user"/>
|
||||
</MkLazy>
|
||||
</MkLazy>
|
||||
<MkLazy>
|
||||
<XActivity :key="user.id" :user="user"/>
|
||||
</MkLazy>
|
||||
</MkLazy>
|
||||
</template>
|
||||
<div>
|
||||
<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>
|
||||
<div>
|
||||
<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>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {defineAsyncComponent, computed, onMounted, onUnmounted, nextTick, watch, ref } from 'vue';
|
||||
import { defineAsyncComponent, computed, onMounted, onUnmounted, nextTick, watch, ref } from 'vue';
|
||||
import * as Misskey from 'misskey-js';
|
||||
import MkNote from '@/components/MkNote.vue';
|
||||
import MkFollowButton from '@/components/MkFollowButton.vue';
|
||||
|
|
@ -173,36 +189,36 @@ 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/supplier.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 {misskeyApi} from '@/scripts/misskey-api.js';
|
||||
import {isFollowingVisibleForMe, isFollowersVisibleForMe} from '@/scripts/isFfVisibleForMe.js';
|
||||
import MkNotifyButton from "@/components/MkNotifyButton.vue";
|
||||
import MkRemoteInfoUpdate from "@/components/MkRemoteInfoUpdate.vue";
|
||||
import MkNotes from "@/components/MkNotes.vue";
|
||||
import MkLazy from "@/components/global/MkLazy.vue";
|
||||
import { i18n } from '@/i18n.js';
|
||||
import { $i, iAmModerator } from '@/account.js';
|
||||
import { dateString } from '@/filters/date.js';
|
||||
import { confetti } from '@/scripts/confetti.js';
|
||||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
import { isFollowingVisibleForMe, isFollowersVisibleForMe } from '@/scripts/isFfVisibleForMe.js';
|
||||
import MkNotifyButton from '@/components/MkNotifyButton.vue';
|
||||
import MkRemoteInfoUpdate from '@/components/MkRemoteInfoUpdate.vue';
|
||||
import MkNotes from '@/components/MkNotes.vue';
|
||||
import MkLazy from '@/components/global/MkLazy.vue';
|
||||
|
||||
function calcAge(birthdate: string): number {
|
||||
const date = new Date(birthdate);
|
||||
const now = new Date();
|
||||
const date = new Date(birthdate);
|
||||
const now = new Date();
|
||||
|
||||
let yearDiff = now.getFullYear() - date.getFullYear();
|
||||
const monthDiff = now.getMonth() - date.getMonth();
|
||||
const pastDate = now.getDate() < date.getDate();
|
||||
let yearDiff = now.getFullYear() - date.getFullYear();
|
||||
const monthDiff = now.getMonth() - date.getMonth();
|
||||
const pastDate = now.getDate() < date.getDate();
|
||||
|
||||
if (monthDiff < 0 || (monthDiff === 0 && pastDate)) {
|
||||
yearDiff--;
|
||||
}
|
||||
if (monthDiff < 0 || (monthDiff === 0 && pastDate)) {
|
||||
yearDiff--;
|
||||
}
|
||||
|
||||
return yearDiff;
|
||||
return yearDiff;
|
||||
}
|
||||
|
||||
const XFiles = defineAsyncComponent(() => import('./index.files.vue'));
|
||||
|
|
@ -214,7 +230,7 @@ const props = withDefaults(defineProps<{
|
|||
/** Test only; MkNotes currently causes problems in vitest */
|
||||
disableNotes: boolean;
|
||||
}>(), {
|
||||
disableNotes: false,
|
||||
disableNotes: false,
|
||||
});
|
||||
|
||||
const router = useRouter();
|
||||
|
|
@ -231,107 +247,107 @@ const moderationNote = ref(props.user.moderationNote);
|
|||
const editModerationNote = ref(false);
|
||||
|
||||
watch(moderationNote, async () => {
|
||||
await misskeyApi('admin/update-user-note', {userId: props.user.id, text: moderationNote.value });
|
||||
await misskeyApi('admin/update-user-note', { userId: props.user.id, text: moderationNote.value });
|
||||
});
|
||||
|
||||
const pagination = {
|
||||
endpoint: 'users/featured-notes' as const,
|
||||
limit: 10,
|
||||
params: computed(() => ({
|
||||
userId: props.user.id,
|
||||
})),
|
||||
endpoint: 'users/featured-notes' as const,
|
||||
limit: 10,
|
||||
params: computed(() => ({
|
||||
userId: props.user.id,
|
||||
})),
|
||||
};
|
||||
const Notes = {
|
||||
endpoint: 'users/notes' as const,
|
||||
limit: 10,
|
||||
params: computed(() => ({
|
||||
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})`,
|
||||
};
|
||||
if (props.user.bannerUrl == null) return {};
|
||||
return {
|
||||
backgroundImage: `url(${props.user.bannerUrl})`,
|
||||
};
|
||||
});
|
||||
|
||||
const age = computed(() => {
|
||||
return calcAge(props.user.birthday);
|
||||
return calcAge(props.user.birthday);
|
||||
});
|
||||
|
||||
function menu(ev: MouseEvent) {
|
||||
const {menu, cleanup} = getUserMenu(user.value, router);
|
||||
os.popupMenu(menu, ev.currentTarget ?? ev.target).finally(cleanup);
|
||||
const { menu, cleanup } = getUserMenu(user.value, router);
|
||||
os.popupMenu(menu, ev.currentTarget ?? ev.target).finally(cleanup);
|
||||
}
|
||||
|
||||
function parallaxLoop() {
|
||||
parallaxAnimationId.value = window.requestAnimationFrame(parallaxLoop);
|
||||
parallax();
|
||||
parallaxAnimationId.value = window.requestAnimationFrame(parallaxLoop);
|
||||
parallax();
|
||||
}
|
||||
|
||||
function parallax() {
|
||||
const banner = bannerEl.value as any;
|
||||
if (banner == null) return;
|
||||
const banner = bannerEl.value as any;
|
||||
if (banner == null) return;
|
||||
|
||||
const top = getScrollPosition(rootEl.value);
|
||||
const top = getScrollPosition(rootEl.value);
|
||||
|
||||
if (top < 0) return;
|
||||
if (top < 0) return;
|
||||
|
||||
const z = 1.75; // 奥行き(小さいほど奥)
|
||||
const pos = -(top / z);
|
||||
banner.style.backgroundPosition = `center calc(50% - ${pos}px)`;
|
||||
const z = 1.75; // 奥行き(小さいほど奥)
|
||||
const pos = -(top / z);
|
||||
banner.style.backgroundPosition = `center calc(50% - ${pos}px)`;
|
||||
}
|
||||
|
||||
function showMemoTextarea() {
|
||||
isEditingMemo.value = true;
|
||||
nextTick(() => {
|
||||
memoTextareaEl.value?.focus();
|
||||
});
|
||||
isEditingMemo.value = true;
|
||||
nextTick(() => {
|
||||
memoTextareaEl.value?.focus();
|
||||
});
|
||||
}
|
||||
|
||||
function adjustMemoTextarea() {
|
||||
if (!memoTextareaEl.value) return;
|
||||
memoTextareaEl.value.style.height = '0px';
|
||||
memoTextareaEl.value.style.height = `${memoTextareaEl.value.scrollHeight}px`;
|
||||
if (!memoTextareaEl.value) return;
|
||||
memoTextareaEl.value.style.height = '0px';
|
||||
memoTextareaEl.value.style.height = `${memoTextareaEl.value.scrollHeight}px`;
|
||||
}
|
||||
|
||||
async function updateMemo() {
|
||||
await misskeyApi('users/update-memo', {
|
||||
memo: memoDraft.value,
|
||||
userId: props.user.id,
|
||||
});
|
||||
isEditingMemo.value = false;
|
||||
await misskeyApi('users/update-memo', {
|
||||
memo: memoDraft.value,
|
||||
userId: props.user.id,
|
||||
});
|
||||
isEditingMemo.value = false;
|
||||
}
|
||||
|
||||
watch([props.user], () => {
|
||||
memoDraft.value = props.user.memo;
|
||||
memoDraft.value = props.user.memo;
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
window.requestAnimationFrame(parallaxLoop);
|
||||
narrow.value = rootEl.value!.clientWidth < 1000;
|
||||
window.requestAnimationFrame(parallaxLoop);
|
||||
narrow.value = rootEl.value!.clientWidth < 1000;
|
||||
|
||||
if (props.user.birthday) {
|
||||
const m = new Date().getMonth() + 1;
|
||||
const d = new Date().getDate();
|
||||
const bm = parseInt(props.user.birthday.split('-')[1]);
|
||||
const bd = parseInt(props.user.birthday.split('-')[2]);
|
||||
if (m === bm && d === bd) {
|
||||
confetti({
|
||||
duration: 1000 * 4,
|
||||
});
|
||||
}
|
||||
}
|
||||
nextTick(() => {
|
||||
adjustMemoTextarea();
|
||||
});
|
||||
if (props.user.birthday) {
|
||||
const m = new Date().getMonth() + 1;
|
||||
const d = new Date().getDate();
|
||||
const bm = parseInt(props.user.birthday.split('-')[1]);
|
||||
const bd = parseInt(props.user.birthday.split('-')[2]);
|
||||
if (m === bm && d === bd) {
|
||||
confetti({
|
||||
duration: 1000 * 4,
|
||||
});
|
||||
}
|
||||
}
|
||||
nextTick(() => {
|
||||
adjustMemoTextarea();
|
||||
});
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
if (parallaxAnimationId.value) {
|
||||
window.cancelAnimationFrame(parallaxAnimationId.value);
|
||||
}
|
||||
if (parallaxAnimationId.value) {
|
||||
window.cancelAnimationFrame(parallaxAnimationId.value);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue