Configuring access rights in the CRM Super Admin

apps/web/src/layouts/AdmLayout.vue

@@ -68,7 +68,9 @@ function onLogout() {
   min-height: 100dvh;
   display: grid;
   grid-template-columns: 240px minmax(0, 1fr);
-  background: var(--bg);
+  background:
+    radial-gradient(ellipse 60% 40% at 100% 0%, rgba(45, 212, 191, 0.08), transparent 55%),
+    var(--bg);
 }
 
 .sidebar {
@@ -78,6 +80,7 @@ function onLogout() {
   padding: 1.15rem 0.9rem;
   background: #fff;
   border-inline-end: 1px solid var(--line);
+  box-shadow: 8px 0 24px rgba(15, 23, 42, 0.03);
 }
 
 .brand {

apps/web/src/layouts/AppLayout.vue

@@ -79,17 +79,43 @@ const moreSectionActive = computed(
     settingsActive.value,
 );
 
+const enabledModules = computed(() => auth.user?.enabledModules ?? null);
+const subscription = computed(() => auth.user?.subscription ?? null);
+
+function moduleAllowed(module?: string) {
+  if (!module) return true;
+  if (!enabledModules.value) return true;
+  return enabledModules.value.includes(module as never);
+}
+
 const openHub = computed<NavHubDef | null>(() => {
   if (!openHubKey.value) return null;
   const hub = NAV_HUBS.find((item) => item.key === openHubKey.value);
   if (!hub) return null;
   return {
     ...hub,
-    cards: hub.cards.filter((card) => !card.admin || canSettings.value),
-    shortcuts: hub.shortcuts.filter((item) => !item.admin || canSettings.value),
+    cards: hub.cards.filter(
+      (card) =>
+        (!card.admin || canSettings.value) && moduleAllowed(card.module),
+    ),
+    shortcuts: hub.shortcuts.filter(
+      (item) =>
+        (!item.admin || canSettings.value) && moduleAllowed(item.module),
+    ),
   };
 });
 
+const hubVisible = computed(() => {
+  const map: Record<string, boolean> = {};
+  for (const hub of NAV_HUBS) {
+    map[hub.key] = hub.cards.some(
+      (card) =>
+        (!card.admin || canSettings.value) && moduleAllowed(card.module),
+    );
+  }
+  return map;
+});
+
 function givenName(fullName: string): string {
   const parts = fullName.trim().split(/\s+/).filter(Boolean);
   if (parts.length <= 1) return fullName.trim();
@@ -368,7 +394,7 @@ onUnmounted(() => {
             <span>داشبورد</span>
           </RouterLink>
 
-          <div class="nav-fold" :class="{ active: customersActive || openHubKey === 'customers' }">
+          <div class="nav-fold" v-if="hubVisible.customers" :class="{ active: customersActive || openHubKey === 'customers' }">
             <button
               class="nav-item nav-fold-btn"
               type="button"
@@ -383,7 +409,7 @@ onUnmounted(() => {
             </button>
           </div>
 
-          <div class="nav-fold" :class="{ active: salesActive || openHubKey === 'sales' }">
+          <div class="nav-fold" v-if="hubVisible.sales" :class="{ active: salesActive || openHubKey === 'sales' }">
             <button
               class="nav-item nav-fold-btn"
               type="button"
@@ -398,7 +424,7 @@ onUnmounted(() => {
             </button>
           </div>
 
-          <div class="nav-fold" :class="{ active: activitiesActive || openHubKey === 'activities' }">
+          <div class="nav-fold" v-if="hubVisible.activities" :class="{ active: activitiesActive || openHubKey === 'activities' }">
             <button
               class="nav-item nav-fold-btn"
               type="button"
@@ -600,6 +626,17 @@ onUnmounted(() => {
           <RouterLink class="round-btn" :to="{ name: 'tickets' }" title="پیام‌ها">
             <UiIcon name="mail" :size="18" />
           </RouterLink>
+          <div
+            v-if="subscription"
+            class="sub-chip"
+            :class="{ warn: subscription.warn }"
+            :title="`انقضا: ${subscription.expiresAt}`"
+          >
+            <UiIcon name="clock" :size="15" />
+            <span>
+              {{ toFaDigits(subscription.daysRemaining) }} روز باقی‌مانده
+            </span>
+          </div>
           <div class="date-chip">
             <UiIcon name="calendar" :size="16" />
             <span>{{ todayLabel }}</span>
@@ -1601,6 +1638,24 @@ onUnmounted(() => {
   height: 34px;
 }
 
+.sub-chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.35rem;
+  padding: 0.35rem 0.7rem;
+  border-radius: 999px;
+  background: var(--accent-subtle);
+  color: var(--accent-deep);
+  font-size: 0.78rem;
+  font-weight: 800;
+  white-space: nowrap;
+}
+
+.sub-chip.warn {
+  background: color-mix(in srgb, var(--danger) 12%, white);
+  color: var(--danger);
+}
+
 .date-chip {
   display: inline-flex;
   align-items: center;