oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues Activity

feat(profile): 相互リンク機能の追加 (MisskeyIO#675)

Browse source
This commit is contained in:
まっちゃてぃー。 2024-08-10 01:05:19 +09:00 • committed by GitHub
parent b059162324
commit b6a5a36eaa
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
37 changed files with 1130 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

65
packages/frontend/src/pages/user/home.vue
View file

@ -143,6 +143,28 @@ SPDX-License-Identifier: AGPL-3.0-only
</dd>
</dl>
</div>
<div v-if="user?.myMutualBanner" class="fields">
{{ i18n.ts.mutualBannerThisUser }}
<div :class="$style.myMutualBanner">
<MkLink :hideIcon="true" :url="user.myMutualBanner.url">
<img :class="$style.mutualBannerImg" :src="user.myMutualBanner.imgUrl" :alt="user.myMutualBanner.description"/>
</MkLink>
<span>{{ (user.myMutualBanner?.description === '' || user.myMutualBanner?.description === null) ? i18n.ts.noDescription : user.myMutualBanner?.description }}</span>
<MkButton v-if="$i && $i?.id !== user.id && !$i?.mutualBanners?.some(banner => banner.id === user.myMutualBanner?.id) " @click="mutualBannerFollow(user.myMutualBanner?.id)">{{ i18n.ts.follow }}</MkButton>
<MkButton v-else-if="$i && $i?.id !== user.id" @click="mutualBannerUnFollow(user.myMutualBanner?.id)">{{ i18n.ts.unfollow }}</MkButton>
</div>
</div>
<div v-if="user?.mutualBanners && user?.mutualBanners.length > 0" class="fields">
{{ i18n.ts.mutualBanner }}
<div :class="$style.mutualBanner">
<div v-for="(mutualBanner, i) in mutualBanners?.slice(0, 9)" :key="i">
<MkLink :hideIcon="true" :url="mutualBanner.url">
<img :class="$style.mutualBannerImg" :src="mutualBanner.imgUrl" :alt="mutualBanner.description"/>
</MkLink>
</div>
</div>
</div>
<div class="status">
<MkA :to="userPage(user)">
<b>{{ number(user.notesCount) }}</b>
@ -212,6 +234,7 @@ import { confetti } from '@/scripts/confetti.js';
import { misskeyApi, misskeyApiGet } from '@/scripts/misskey-api.js';
import { isFollowingVisibleForMe, isFollowersVisibleForMe } from '@/scripts/isFfVisibleForMe.js';
import { useRouter } from '@/router/supplier.js';
import MkLink from '@/components/MkLink.vue';
function calcAge(birthdate: string): number {
const date = new Date(birthdate);
@ -253,6 +276,7 @@ const memoDraft = ref(props.user.memo);
const isEditingMemo = ref(false);
const moderationNote = ref(props.user.moderationNote);
const editModerationNote = ref(false);
const mutualBanners = ref(props.user.mutualBanners);
watch(moderationNote, async () => {
await misskeyApi('admin/update-user-note', { userId: props.user.id, text: moderationNote.value });
@ -299,6 +323,23 @@ function showMemoTextarea() {
});
}
function mutualBannerFollow(id: string) {
os.apiWithDialog('i/update', {
mutualBannerPining: [
...($i?.mutualBanners?.map(banner => banner.id) ?? []),
id,
],
});
}
function mutualBannerUnFollow(id:string) {
os.apiWithDialog('i/update', {
mutualBannerPining: [
...($i?.mutualBanners?.map(banner => banner.id) ?? []).filter(bannerId => bannerId !== id),
],
});
}
function adjustMemoTextarea() {
if (!memoTextareaEl.value) return;
memoTextareaEl.value.style.height = '0px';
@ -787,4 +828,28 @@ onUnmounted(() => {
color: rgb(255, 255, 255);
background-color: rgb(54, 54, 54);
}
.myMutualBanner {
display: flex;
justify-content: space-around;
align-items: center;
flex-flow: column wrap;
padding: 16px;
}
.mutualBanner {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
padding: 16px;
}
.mutualBannerImg {
max-width: 300px;
min-width: 200px;
max-height: 60px;
min-height: 40px;
object-fit: contain;
}
</style>