now menu is rendered one time only
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<script setup>
|
||||
import { getCurrentInstance, onMounted, ref } from 'vue'
|
||||
import { getCurrentInstance, onMounted, onUpdated, ref } from 'vue'
|
||||
import axios from 'axios'
|
||||
import { usePage } from '@inertiajs/inertia-vue3'
|
||||
import Builder from './Sidebar/Builder.vue'
|
||||
@@ -11,10 +11,11 @@ const self = getCurrentInstance()
|
||||
const menus = ref(usePage().props.value.$menus || [])
|
||||
const { user } = usePage().props.value
|
||||
|
||||
const fetch = async () => {
|
||||
const f = async () => {
|
||||
try {
|
||||
const response = await axios.get(route('api.v1.user.menu', user.id))
|
||||
return menus.value = response.data
|
||||
|
||||
menus.value = response.data
|
||||
} catch (e) {
|
||||
const response = await Swal.fire({
|
||||
title: 'Do you want to try again?',
|
||||
@@ -27,10 +28,6 @@ const fetch = async () => {
|
||||
response.isConfirmed && fetch()
|
||||
}
|
||||
}
|
||||
|
||||
Inertia.on('finish', () => fetch())
|
||||
|
||||
onMounted(fetch)
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -35,5 +35,5 @@ export default defineComponent({
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="hidden pl-8 pl-16 pl-24 pl-32 pl-40 pl-48 pl-56 pl-64 pl-72 pl-80 pl-96"></div>
|
||||
<div class="hidden pl-0 pl-8 pl-16 pl-24 pl-32 pl-40 pl-48 pl-56 pl-64 pl-72 pl-80 pl-96"></div>
|
||||
</template>
|
||||
@@ -13,7 +13,7 @@ const link = route().has(menu.route_or_url) ? route(menu.route_or_url) : menu.ro
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Link :href="link" class="w-full px-4 py-3" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${active && 'bg-slate-800'} pl-${padding}`">
|
||||
<Link :href="link" class="w-full px-4 py-3" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${active && 'bg-slate-800'} pl-${padding !== 0 && padding}`">
|
||||
<div class="flex items-center space-x-2">
|
||||
<Icon :name="menu.icon" />
|
||||
<p class="uppercase font-semibold">{{ menu.name }}</p>
|
||||
|
||||
@@ -27,7 +27,7 @@ const open = ref(active ? true : false)
|
||||
|
||||
<template>
|
||||
<div class="w-full flex flex-col">
|
||||
<button @click.prevent="open = ! open" class="w-full p-4" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${open && 'dark:bg-gray-800'} pl-${padding}`">
|
||||
<button @click.prevent="open = ! open" class="w-full p-4" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${open && 'dark:bg-gray-800'} pl-${padding !== 0 && padding}`">
|
||||
<div class="flex items-center space-x-2">
|
||||
<Icon :name="menu.icon" />
|
||||
<p class="uppercase font-semibold w-full text-left">{{ menu.name }}</p>
|
||||
|
||||
Reference in New Issue
Block a user