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
+ }})
+ onProfileDrop(event, categoryIndex)"
+ >
+
+
+
+
-
@@ -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,
+}
+