tes

2025-06-16 14:16:24 +07:00
parent e07a30b204
commit 08542471d0
171 changed files with 5042 additions and 19 deletions
@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import {appsLink} from '~/_mockApis/headerData';
+import { Icon } from '@iconify/vue';
+</script>
+<template>
+    <!-- ---------------------------------------------- -->
+    <!-- apps link -->
+    <!-- ---------------------------------------------- -->
+    <v-row>
+        <v-col cols="12" md="6" v-for="(item, i) in appsLink" :key="i">
+            <router-link :to="item.href" class="text-decoration-none custom-text-primary">
+                <div class="d-flex align-center">
+                    <v-avatar size="45" :color=" 'light' + item.color" rounded="md">
+                        <Icon :icon="'solar:' + item.avatar" height="24" :class="'text-' + item.color"/>
+                    </v-avatar>
+                    <div class="ml-3">
+                        <h6 class="text-subtitle-1 mb-1 heading custom-title">{{ item.title }}</h6>
+                        <p class="text-subtitle-2 textSecondary">{{ item.subtext }}</p>
+                    </div>
+                </div>
+            </router-link>
+        </v-col>
+    </v-row>
+</template>
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+//import QuickLinks from './QuickLinks';
+import AppsLink from './AppsLink.vue';
+import { HelpIcon,ChevronDownIcon } from 'vue-tabler-icons';
+</script>
+
+<template>
+    <!-- ---------------------------------------------- -->
+    <!-- mega menu DD -->
+    <!-- ---------------------------------------------- -->
+    <v-menu open-on-hover :close-on-content-click="false">
+        <template v-slot:activator="{ props }">
+            <v-btn class="hidden-sm-and-down" rounded="sm" variant="text" color="primary" v-bind="props"> Apps  <ChevronDownIcon size="16" class="mt-1 ml-1" /> </v-btn>
+        </template>
+        <v-sheet width="900" height="382" elevation="10" rounded="md" class="pa-4 pb-0">
+            <div>
+                <v-row>
+                    <v-col cols="12" lg="8" class="d-flex py-0">
+                        <div class="pa-4 pb-0 pr-0">
+                            <AppsLink />
+                            <v-divider class="mt-6"></v-divider>
+                            <div class="pa-5 pl-0">
+                                <div class="d-flex align-center justify-space-between">
+                                    <router-link to="/" class="text-decoration-none d-flex align-center">
+                                        <HelpIcon size="20" stroke-width="1.5" class="text-hover-primary" />
+                                        <h6 class="text-subtitle-1 font-weight-bold text-hover-primary ml-2">Frequently Asked Questions</h6>
+                                    </router-link>
+                                    <v-btn color="primary" variant="flat">Check</v-btn>
+                                </div>
+                            </div>
+                        </div>
+
+                        <v-divider vertical></v-divider>
+                    </v-col>
+                    <v-col cols="12" lg="4" class="py-0">
+                        <div class="pa-4">
+                            <h5 class="text-h5">Quick Links</h5>
+                            <!-- <QuickLinks /> -->
+                        </div>
+                    </v-col>
+                </v-row>
+            </div>
+        </v-sheet>
+    </v-menu>
+    <v-btn variant="text" color="primary">Chat </v-btn>
+    <v-btn variant="text" color="primary">Calendar </v-btn>
+    <v-btn variant="text" color="primary">Email </v-btn>
+</template>
@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+import { AppsIcon, CalendarIcon, MailIcon, MessagesIcon } from 'vue-tabler-icons';
+import AppsLink from './AppsLink.vue';
+//import QuickLinks from './QuickLinks.vue';
+
+const open = ref(['Apps']);
+</script>
+
+<template>
+    <div class="pt-6">
+        <h5 class="text-h5 mb-4 px-5">Navigation</h5>
+        <v-list v-model:opened="open" class="right-sidebar">
+            <v-list-group value="Apps">
+                <template v-slot:activator="{ props }">
+                    <v-list-item v-bind="props">
+                        <template v-slot:prepend>
+                            <AppsIcon width="21" stroke-width="1.5" />
+                        </template>
+                        <h5 class="text-subtitle-1 ml-2">Apps</h5>
+                    </v-list-item>
+                </template>
+                <v-list-item class="pl-6 pb-6">
+                    <div>
+                        <AppsLink />
+                    </div>
+                </v-list-item>
+            </v-list-group>
+            <v-list-item>
+                <template v-slot:prepend>
+                    <MessagesIcon width="21" stroke-width="1.5" />
+                </template>
+                <h5 class="text-subtitle-1 ml-2">Chats</h5>
+            </v-list-item>
+            <v-list-item>
+                <template v-slot:prepend>
+                    <CalendarIcon width="21" stroke-width="1.5" />
+                </template>
+                <h5 class="text-subtitle-1 ml-2">Calendar</h5>
+            </v-list-item>
+            <v-list-item>
+                <template v-slot:prepend>
+                    <MailIcon width="21" stroke-width="1.5" />
+                </template>
+                <h5 class="text-subtitle-1 ml-2">Mail</h5>
+            </v-list-item>
+        </v-list>
+        <div class="px-5">
+            <h5 class="text-h5 my-4">Quick Links</h5>
+            <!-- <QuickLinks /> -->
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.right-sidebar .v-list-group__items .v-list-item {
+    padding-inline-start: 26px !important;
+}
+</style>