2025-10-09 18:25:02 +03:00

114 lines
3.0 KiB
Vue

<template>
<div
id="sidenav-collapse-main"
class="w-auto h-auto collapse navbar-collapse max-height-vh-100 h-100"
>
<ul class="navbar-nav">
<li class="nav-item">
<sidenav-collapse
collapse-ref="dashboardsExamples"
nav-text="Dashboards"
:class="getRoute() === 'dashboards' ? 'active' : ''"
>
<template #icon>
<Shop />
</template>
<template #list>
<ul class="nav ms-4 ps-3">
<!-- nav links -->
<sidenav-item
:to="{ name: 'Default' }"
mini-icon="D"
text="Default"
/>
<sidenav-item :to="{ name: 'CRM' }" mini-icon="C" text="CRM" />
</ul>
</template>
</sidenav-collapse>
</li>
<li class="mt-3 nav-item">
<h6
class="text-xs ps-4 text-uppercase font-weight-bolder opacity-6"
:class="isRTL ? 'me-4' : 'ms-2'"
>
CRM
</h6>
</li>
<li class="nav-item">
<sidenav-collapse
collapse-ref="pagesExamples"
nav-text="Pages"
:class="getRoute() === 'pages' ? 'active' : ''"
>
<template #icon>
<Office />
</template>
<template #list>
<ul class="nav ms-4 ps-3">
<!-- nav links -->
<sidenav-collapse-item
refer="profileExample"
mini-icon="P"
text="Client"
>
<template #nav-child-item>
<sidenav-item
:to="{ name: 'Gestion contacts' }"
mini-icon="P"
text="Gestion Contact"
/>
<sidenav-item
:to="{ name: 'Gestion clients' }"
mini-icon="T"
text="Gestion Clients"
/>
<sidenav-item
:to="{ name: 'Localisation clients' }"
mini-icon="A"
text="Localisation clients"
/>
</template>
</sidenav-collapse-item>
</ul>
</template>
</sidenav-collapse>
</li>
</ul>
</div>
</template>
<script>
import SidenavItem from "./SidenavItem.vue";
import SidenavCollapse from "./SidenavCollapse.vue";
import SidenavCard from "./SidenavCard.vue";
import SidenavCollapseItem from "./SidenavCollapseItem.vue";
import Shop from "../../components/Icon/Shop.vue";
import Office from "../../components/Icon/Office.vue";
import { mapState } from "vuex";
export default {
name: "SidenavList",
components: {
SidenavItem,
SidenavCollapse,
SidenavCollapseItem,
Shop,
Office,
},
props: {
cardBg: {
type: String,
default: "",
},
},
computed: {
...mapState(["isRTL"]),
},
methods: {
getRoute() {
const routeArr = this.$route.path.split("/");
return routeArr[1];
},
},
};
</script>