worldcone/cherrypick
2
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

chore: group

Browse source
This commit is contained in:
NoriDev 2023-06-04 15:37:50 +09:00
parent a83ae95a9f
commit 0a238ac468
2 changed files with 36 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
packages/frontend/src/pages/my-groups/group.vue
View file

@ -1,40 +1,42 @@
<template><MkStickyContainer>
<template>
<MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :content-max="700">
<div class="mk-group-page">
<transition :name="defaultStore.state.animation ? 'zoom' : ''" mode="out-in">
<div v-if="group && $i.id === group.ownerId" class="_section actions">
<div class="_content" style="">
<MkButton inline @click="invite()">{{ i18n.ts.invite }}</MkButton>
<MkButton inline @click="renameGroup()">{{ i18n.ts.rename }}</MkButton>
<MkButton inline @click="transfer()">{{ i18n.ts.transfer }}</MkButton>
<MkButton inline danger @click="deleteGroup()">{{ i18n.ts.delete }}</MkButton>
<MkSpacer :contentMax="700">
<div class="mk-group-page">
<transition :name="defaultStore.state.animation ? 'zoom' : ''" mode="out-in">
<div v-if="group && $i.id === group.ownerId" class="_section actions">
<div class="_content" style="">
<MkButton inline @click="invite()">{{ i18n.ts.invite }}</MkButton>
<MkButton inline @click="renameGroup()">{{ i18n.ts.rename }}</MkButton>
<MkButton inline @click="transfer()">{{ i18n.ts.transfer }}</MkButton>
<MkButton inline danger @click="deleteGroup()">{{ i18n.ts.delete }}</MkButton>
</div>
</div>
</div>
</transition>
</transition>
<transition :name="defaultStore.state.animation ? 'zoom' : ''" mode="out-in">
<div v-if="group" class="_section members _gap">
<div class="_title">{{ i18n.ts.members }}</div>
<div class="_content">
<div class="users">
<div v-for="user in users" :key="user.id" class="user _panel">
<MkAvatar :user="user" class="avatar" :show-indicator="true"/>
<div class="body">
<MkUserName :user="user" class="name"/>
<MkAcct :user="user" class="acct"/>
</div>
<div v-if="user.id === group.ownerId" :title="i18n.ts.leader" style="color: var(--badge);"><i class="ti ti-crown"></i></div>
<div v-else-if="group && $i.id === group.ownerId" class="action">
<button class="_button" :title="i18n.ts.banish" @click="removeUser(user)"><i class="ti ti-x"></i></button>
<transition :name="defaultStore.state.animation ? 'zoom' : ''" mode="out-in">
<div v-if="group" class="_section members _gap">
<div class="_title">{{ i18n.ts.members }}</div>
<div class="_content">
<div class="users">
<div v-for="user in users" :key="user.id" class="user _panel">
<MkAvatar :user="user" class="avatar" :showIndicator="true"/>
<div class="body">
<MkUserName :user="user" class="name"/>
<MkAcct :user="user" class="acct"/>
</div>
<div v-if="user.id === group.ownerId" :title="i18n.ts.leader" style="color: var(--badge);"><i class="ti ti-crown"></i></div>
<div v-else-if="group && $i.id === group.ownerId" class="action">
<button class="_button" :title="i18n.ts.banish" @click="removeUser(user)"><i class="ti ti-x"></i></button>
</div>
</div>
</div>
</div>
</div>
</div>
</transition>
</div>
</MkSpacer></MkStickyContainer>
</transition>
</div>
</MkSpacer>
</MkStickyContainer>
</template>
<script lang="ts" setup>

8
packages/frontend/src/pages/my-groups/index.vue
View file

@ -1,12 +1,12 @@
<template>
<MkStickyContainer>
<template #header><MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :content-max="700">
<MkSpacer :contentMax="700">
<div v-if="tab === 'owned'" class="_content">
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="ownedPagination" class="groups">
<MkA v-for="group in items" :key="group.id" class="group _panel" :to="`/my/groups/${ group.id }`">
<div class="name">{{ group.name }}</div>
<MkAvatars :user-ids="group.userIds"/>
<MkAvatars :userIds="group.userIds"/>
</MkA>
</MkPagination>
</div>
@ -15,7 +15,7 @@
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="joinedPagination" class="groups">
<MkA v-for="group in items" :key="group.id" class="group _panel" :to="`/my/groups/${ group.id }`">
<div class="name">{{ group.name }}</div>
<MkAvatars :user-ids="group.userIds"/>
<MkAvatars :userIds="group.userIds"/>
<div class="actions">
<MkButton danger @click="leave(group)">{{ i18n.ts.leaveGroup }}</MkButton>
</div>
@ -27,7 +27,7 @@
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="invitationPagination">
<MkA v-for="invitation in items" :key="invitation.id" class="group _panel">
<div class="name">{{ invitation.group.name }}</div>
<MkAvatars :user-ids="invitation.group.userIds"/>
<MkAvatars :userIds="invitation.group.userIds"/>
<div class="actions">
<MkButton primary inline @click="acceptInvite(invitation)"><i class="ti ti-check"></i> {{ i18n.ts.accept }}</MkButton>
<MkButton primary inline @click="rejectInvite(invitation)"><i class="ti ti-x"></i> {{ i18n.ts.reject }}</MkButton>