diff --git a/src/components/profile/ProfileButton.vue b/src/components/profile/ProfileButton.vue index fdeab34..43a30ae 100644 --- a/src/components/profile/ProfileButton.vue +++ b/src/components/profile/ProfileButton.vue @@ -7,7 +7,7 @@ v-if="nameEditable && editing" class="flex-1 flex h-full text-left whitespace-nowrap overflow-hidden" :class="{'bg-zinc-300' : selected}" - @submit.prevent="profile.name = nameInput; editing=false"> + @submit.prevent="store.renameProfile(profile.id, nameInput); editing=false"> - + - {{ profileTag }} ({{ tagProfiles.length }}) + {{ category.name }} ({{ category.profiles?.length || 0 + }}) + + + - @@ -88,6 +100,7 @@ import ScrambleText from '@/components/common/ScrambleText.vue' import { useStore } from '@/store.js' import ProfileButton from '@/components/profile/ProfileButton.vue' import ProfileConfig from '@/components/profile/ProfileConfig.vue' +import draggable from 'vuedraggable' defineProps({ showFilter: { @@ -129,6 +142,25 @@ const filteredProfilesByTag = computed(() => { return map }) +const onProfileDrop = (event, categoryIndex) => { + if (event.moved) { + const profile = event.moved.element + const oldIndex = event.moved.oldIndex + const newIndex = event.moved.newIndex + store.moveProfile(profile.id, oldIndex, newIndex) + } + if (event.added) { + const profile = event.added.element + const newIndex = event.added.newIndex + store.changeProfileCategory(profile.id, categoryIndex, newIndex) + } +} + +const dragOptions = { + group: 'profiles', + animation: 150, +} +