src/components/common/RightMenu.vue

@@ -0,0 +1,27 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+import { useStateStore } from 'stores/useStateStore';
+
+defineProps({
+    dataKey: { type: String, required: true },
+});
+
+const { t } = useI18n();
+const stateStore = useStateStore();
+</script>
+<template>
+    <Teleport to="#actions-append">
+        <div class="row q-gutter-x-sm">
+            <QBtn flat @click="stateStore.toggleRightDrawer()" round dense icon="menu">
+                <QTooltip bottom anchor="bottom right">
+                    {{ t('globals.collapseMenu') }}
+                </QTooltip>
+            </QBtn>
+        </div>
+    </Teleport>
+    <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
+        <QScrollArea class="fit text-grey-8">
+            <slot name="right-panel" />
+        </QScrollArea>
+    </QDrawer>
+</template>