hak akses hapus atur urutan
This commit is contained in:
@@ -507,20 +507,11 @@
|
||||
color="white"
|
||||
@click="showAddForm"
|
||||
elevation="0"
|
||||
class="add-btn mr-2"
|
||||
class="add-btn"
|
||||
>
|
||||
<v-icon left size="20">mdi-plus-circle</v-icon>
|
||||
Tambah Baru
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="white"
|
||||
@click="toggleReorderMode"
|
||||
elevation="0"
|
||||
class="add-btn"
|
||||
>
|
||||
<v-icon left size="20">mdi-format-list-numbered</v-icon>
|
||||
{{ reorderMode ? 'Selesai' : 'Atur Urutan' }}
|
||||
</v-btn>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -703,34 +694,6 @@
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<v-dialog v-model="reorderMode" max-width="600px">
|
||||
<v-card class="pa-6 rounded-xl elevation-4">
|
||||
<v-card-title class="text-h6 font-weight-bold">Atur Urutan Menu</v-card-title>
|
||||
<v-card-text>
|
||||
<VueDraggableNext
|
||||
v-model="draggableMenus"
|
||||
item-key="name"
|
||||
tag="v-list"
|
||||
class="pa-0"
|
||||
handle=".handle"
|
||||
:animation="200"
|
||||
>
|
||||
<template #item="{ element }">
|
||||
<v-list-item class="rounded-lg elevation-1 my-2" :title="element.name">
|
||||
<template #prepend>
|
||||
<v-icon icon="mdi-drag-vertical" class="handle"></v-icon>
|
||||
</template>
|
||||
</v-list-item>
|
||||
</template>
|
||||
</VueDraggableNext>
|
||||
</v-card-text>
|
||||
<v-card-actions class="d-flex justify-end">
|
||||
<v-btn color="grey-darken-1" variant="text" rounded="lg" @click="cancelReorder">Batal</v-btn>
|
||||
<v-btn color="primary" variant="text" rounded="lg" @click="saveReorder">Simpan Urutan</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<v-snackbar
|
||||
v-model="snackbar.show"
|
||||
:color="snackbar.color"
|
||||
@@ -750,7 +713,6 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, onMounted, nextTick } from 'vue';
|
||||
import { useLocalStorage } from '@vueuse/core';
|
||||
import { VueDraggableNext } from 'vue-draggable-next';
|
||||
import EditHakAkses from '@/components/HakAkses/editHakAkses.vue';
|
||||
import { useNavItemsStore } from '~/stores/navItems1';
|
||||
|
||||
@@ -812,13 +774,10 @@ interface SessionData {
|
||||
|
||||
// State for views
|
||||
const viewMode = ref<'table' | 'add' | 'editName' | 'editAccess' | 'view'>('table');
|
||||
const reorderMode = ref(false);
|
||||
|
||||
const allHakAksesData = useLocalStorage<HakAksesData[]>('allHakAksesData', []);
|
||||
const navItemsStore = useNavItemsStore();
|
||||
|
||||
const draggableMenus = ref<NavItem[]>([]);
|
||||
|
||||
// Data table headers
|
||||
// Changed to show user with their multiple access rights
|
||||
const headers = ref([
|
||||
@@ -1047,24 +1006,6 @@ const formTitle = computed(() => {
|
||||
// Delete dialog state
|
||||
const showDeleteDialog = ref(false);
|
||||
|
||||
// Functions to reorder data and sync
|
||||
const toggleReorderMode = () => {
|
||||
reorderMode.value = !reorderMode.value;
|
||||
if (reorderMode.value) {
|
||||
draggableMenus.value = navItemsStore.navItems.map(item => ({ ...item }));
|
||||
}
|
||||
};
|
||||
|
||||
const saveReorder = () => {
|
||||
navItemsStore.updateNavItems(draggableMenus.value);
|
||||
reorderMode.value = false;
|
||||
reindexData();
|
||||
};
|
||||
|
||||
const cancelReorder = () => {
|
||||
reorderMode.value = false;
|
||||
};
|
||||
|
||||
// Re-indexes IDs to be sequential
|
||||
const reindexData = () => {
|
||||
allHakAksesData.value.forEach((item, index) => {
|
||||
|
||||
Reference in New Issue
Block a user