mirror/Hangar
2
0
Fork 0
mirror of https://github.com/HangarMC/Hangar.git synced 2025-03-13 15:39:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

Move member list into own component

Browse Source 
Still doesn't have all the functionality from Nuxt build, but moving in preparation for that
This commit is contained in:
MD 2022-03-24 22:31:30 +00:00
parent d6962cd57d
commit b5adc8e517
2 changed files with 44 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
frontend-new/src/components/projects/MemberList.vue Normal file
View File

@ -0,0 +1,42 @@
<script setup lang="ts">
import { ref } from "vue";
import { useI18n } from "vue-i18n";
import { HangarProject } from "hangar-internal";
import Card from "~/components/design/Card.vue";
import UserAvatar from "~/components/UserAvatar.vue";
import Link from "~/components/design/Link.vue";
import DropdownButton from "~/components/design/DropdownButton.vue";
import DropdownItem from "~/components/design/DropdownItem.vue";
const props = defineProps<{
project: HangarProject;
forceEdit?: boolean;
}>();
const i18n = useI18n();
const editing = ref(props.forceEdit);
</script>
<template>
<Card>
<template #header>{{ i18n.t("project.members") }}</template>
<template #default>
<div
v-for="member in project.members"
:key="member.user.name"
class="p-2 w-full border border-neutral-100 dark:border-neutral-800 rounded inline-flex flex-row space-x-4"
>
<UserAvatar :username="member.user.name" size="sm" />
<div class="flex-grow">
<p class="font-semibold">
<Link :to="'/' + member.user.name">{{ member.user.name }}</Link>
</p>
<p>{{ member.role.role.title }}</p>
</div>
<DropdownButton v-if="editing">
<DropdownItem @click="alert('OK!')">Change role</DropdownItem>
</DropdownButton>
</div>
</template>
</Card>
</template>

18
frontend-new/src/pages/[user]/[project]/index.vue
View File

@ -4,8 +4,7 @@ import Card from "~/components/design/Card.vue";
import { useI18n } from "vue-i18n";
import ProjectInfo from "~/components/projects/ProjectInfo.vue";
import { HangarProject } from "hangar-internal";
import UserAvatar from "~/components/UserAvatar.vue";
import Link from "~/components/design/Link.vue";
import MemberList from "~/components/projects/MemberList.vue";
const props = defineProps<{
user: User;
@ -33,20 +32,7 @@ const i18n = useI18n();
<template #header>{{ i18n.t("page.plural") }}</template>
<template #default>Page navigation goes here</template>
</Card>
<Card>
<template #header>{{ i18n.t("project.members") }}</template>
<template #default>
<div v-for="member in project.members" :key="member.user.name" class="p-2 w-full border border-neutral-100 rounded inline-flex flex-row space-x-4">
<UserAvatar :username="member.user.name" size="sm" />
<div>
<p class="font-semibold">
<Link :to="'/' + member.user.name">{{ member.user.name }}</Link>
</p>
<p>{{ member.role.role.title }}</p>
</div>
</div>
</template>
</Card>
<MemberList :project="project" />
</section>
</div>
</template>