Mirrored_Repos/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2026-09-15 17:23:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: option to create group in add to group modal

Browse Source
This commit is contained in:
Bnyro
2023-12-19 16:44:16 +01:00
parent ff7cc2dd3f
commit 8b4949349e
8 changed files with 93 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/components/AddToGroupModal.vue
View File

@@ -1,27 +1,38 @@
<template>
<ModalComponent @close="$emit('close')">
<div class="h-[80vh] overflow-y-scroll pr-4">
<span v-t="'actions.add_to_group'" class="mb-3 inline-block w-max text-2xl" />
<div v-for="(group, index) in channelGroups" :key="group.groupName" class="px-1">
<div class="flex items-center justify-between">
<span>{{ group.groupName }}</span>
<input
type="checkbox"
:checked="group.channels.includes(channelId)"
@change="onCheckedChange(index, group)"
/>
<div class="min-w-[50vw] flex flex-col">
<div class="h-[70vh] overflow-y-scroll pr-4">
<span v-t="'actions.add_to_group'" class="mb-3 inline-block w-max text-2xl" />
<div v-for="(group, index) in channelGroups" :key="group.groupName" class="px-1">
<div class="flex items-center justify-between">
<span>{{ group.groupName }}</span>
<input
type="checkbox"
:checked="group.channels.includes(channelId)"
@change="onCheckedChange(index, group)"
/>
</div>
<hr class="h-1 w-full" />
</div>
<hr class="h-1 w-full" />
</div>
<button v-t="'actions.create_group'" class="btn ml-auto w-max" @click="showCreateGroupModal = true" />
</div>
</ModalComponent>
<CreateGroupModal
v-if="showCreateGroupModal"
:on-create-group="onCreateGroup"
@close="showCreateGroupModal = false"
/>
</template>
<script>
import ModalComponent from "./ModalComponent.vue";
import CreateGroupModal from "./CreateGroupModal.vue";
export default {
components: {
ModalComponent,
CreateGroupModal,
},
props: {
channelId: {
@@ -32,6 +43,7 @@ export default {
emits: ["close"],
data() {
return {
showCreateGroupModal: false,
channelGroups: [],
};
},
@@ -51,6 +63,18 @@ export default {
}
this.createOrUpdateChannelGroup(group);
},
onCreateGroup(newGroupName) {
if (!newGroupName || this.channelGroups.some(group => group.groupName == newGroupName)) return;
const newGroup = {
groupName: newGroupName,
channels: [],
};
this.channelGroups.push(newGroup);
this.createOrUpdateChannelGroup(newGroup);
this.showCreateGroupModal = false;
},
},
};
</script>