Unified Messaging: Add info header to chats and groups, Display name of group in group management dialog, Take User to management of group within the group by pressing on the info button/To the user profile for chats

This commit is contained in:
Crimekillz 2024-04-29 18:29:26 +02:00
parent fa7f40a56d
commit c917a5e639
2 changed files with 57 additions and 4 deletions

View File

@ -1,4 +1,13 @@
<template>
<MkStickyContainer>
<template #header
><MkPageHeader
:actions="headerActions"
:tabs="headerTabs"
:display-back-button="true"
/></template>
<MkSpacer :content-max="900">
<div :class="$style.root">
<div
ref="rootEl"
class="_section"
@ -94,6 +103,9 @@
</MkSpacer>
</div>
</div>
</div>
</MkSpacer>
</MkStickyContainer>
</template>
<script lang="ts" setup>
@ -339,7 +351,7 @@ onMounted(() => {
definePageMetadata(
computed(() => ({
title: group != null ? group.name : user?.name ?? 'Chat',
icon: "ph-chats-teardrop-bold ph-lg",
icon: "ph-chats-teardrop ph-bold ph-lg",
})),
);
});
@ -349,8 +361,41 @@ onBeforeUnmount(() => {
document.removeEventListener("visibilitychange", onVisibilitychange);
if (scrollRemove) scrollRemove();
});
function info() {
if (group) {
window.open(`/my/groups/${group.id}`);
} else if (user) {
window.open(`/@${user.id}`);
}
}
const headerActions = $computed(() => [
{
asFullButton: true,
icon: "ph-info ph-bold ph-lg",
text: i18n.ts.manageGroups,
handler: info,
},
]);
const headerTabs = $computed(() => []);
definePageMetadata(
computed(() => ({
title: group != null ? group.name : user?.name ?? 'Chat',
icon: "ph-chats-teardrop ph-bold ph-lg",
})),
);
</script>
<style lang="scss" module>
.root {
margin: var(--margin);
}
</style>
<style lang="scss" scoped>
XMessage:last-of-type {
margin-bottom: 4rem;

View File

@ -37,7 +37,7 @@
</template>
<script lang="ts" setup>
import { computed, ref, watch } from "vue";
import { computed, ref, watch, onMounted } from "vue";
import { definePageMetadata } from "@/scripts/page-metadata";
import { i18n } from "@/i18n";
import { useRouter } from "@/router";
@ -75,7 +75,15 @@ async function fetch() {
});
}
onMounted(() => {
fetch();
definePageMetadata(
computed(() => ({
title: (group.value != null ? group.value.name + ': ' : '') + i18n.ts.members,
icon: "ph-users-three ph-bold ph-lg",
})),
);
});
function invite() {
os.selectLocalUser().then((user) => {
@ -134,7 +142,7 @@ async function deleteGroup() {
definePageMetadata(
computed(() => ({
title: i18n.ts.members,
title: (group.value != null ? group.value.name + ': ' : '') + i18n.ts.members,
icon: "ph-users-three ph-bold ph-lg",
})),
);