Skip to content

Commit bdedc9e

Browse files
RICHARD-QuentinRICHARD-Quentin
committed
Layout
1 parent 729794e commit bdedc9e

File tree

9 files changed

+156
-10
lines changed

9 files changed

+156
-10
lines changed

‎app/nuxt.config.ts‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -21,19 +21,12 @@ export default defineNuxtConfig({
2121
enabled: true,
2222
},
2323
},
24-
plugins: [
25-
{ src: '~/plugins/ofetch' },
26-
],
24+
plugins: [{ src: '~/plugins/ofetch' }],
2725
components: {
2826
global: true,
2927
dirs: [{ path: '~/components', prefix: 'tk' }],
3028
},
31-
modules: [
32-
'nuxt-api-party',
33-
'@sidebase/nuxt-auth',
34-
'nuxt-quasar-ui',
35-
...extensions.appSetup.default(),
36-
],
29+
modules: ['nuxt-api-party', '@sidebase/nuxt-auth', 'nuxt-quasar-ui', '@vueuse/nuxt', ...extensions.appSetup.default()],
3730
auth: {
3831
baseURL: `${TK_APP_API_URL}/core/auth`,
3932
provider: {
@@ -70,7 +63,9 @@ export default defineNuxtConfig({
7063
appConfig: {
7164
customSlots: {},
7265
},
73-
quasar: {},
66+
quasar: {
67+
iconSet: 'mdi-v5',
68+
},
7469
apiParty: {
7570
endpoints: {
7671
api: {

‎app/package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@
1919
"@nuxt/devtools": "latest",
2020
"@sidebase/nuxt-auth": "^0.6.0-beta.5",
2121
"@types/node": "^18.17.3",
22+
"@vueuse/core": "^10.4.1",
23+
"@vueuse/nuxt": "^10.4.1",
2224
"nuxt": "^3.6.5",
2325
"nuxt-api-party": "^0.17.0",
2426
"nuxt-quasar-ui": "^2.0.5",

‎app/src/app.vue‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<template>
2+
<NuxtLayout>
3+
<NuxtPage />
4+
</NuxtLayout>
5+
</template>

‎app/src/components/appbar/Menu.vue‎

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
<template lang="pug">
2+
q-btn(flat icon="mdi-dots-grid" size="xl")
3+
q-tooltip.text-body2(transition-show="scale" transition-hide="scale") Apps
4+
q-menu(max-width="350px" max-height="350px").q-pa-md
5+
.row
6+
.col-4(v-for="app in apps" :key="app.name")
7+
q-btn(flat stack dense :to="app.to" rounded).full-width
8+
q-icon(:name="app.icon.name" :color="app.icon.color" size="xl")
9+
div.text-center(:class="`text-${app.title.color}`") {{ app.title.name }}
10+
</template>
11+
12+
<script lang="ts" setup>
13+
const apps: {
14+
title: {
15+
name: string
16+
color: string
17+
}
18+
icon: {
19+
name: string
20+
color: string
21+
}
22+
to: string
23+
}[] = [
24+
{
25+
title: {
26+
name: 'Accueil',
27+
color: 'primary'
28+
},
29+
icon: {
30+
name: 'mdi-home',
31+
color: 'secondary'
32+
},
33+
to: '/'
34+
},
35+
{
36+
title: {
37+
name: 'Mes tickets',
38+
color: 'primary'
39+
},
40+
icon: {
41+
name: 'mdi-ticket',
42+
color: 'primary'
43+
},
44+
to: '/tickets'
45+
},
46+
{
47+
title: {
48+
name: 'Tickets',
49+
color: 'primary'
50+
},
51+
icon: {
52+
name: 'mdi-ticket',
53+
color: 'primary'
54+
},
55+
to: '/tickets'
56+
},
57+
{
58+
title: {
59+
name: 'Profil',
60+
color: 'primary'
61+
},
62+
icon: {
63+
name: 'mdi-account',
64+
color: 'primary'
65+
},
66+
to: '/profil'
67+
},
68+
{
69+
title: {
70+
name: 'Paramètres',
71+
color: 'primary'
72+
},
73+
icon: {
74+
name: 'mdi-cog',
75+
color: 'primary'
76+
},
77+
to: '/parametres'
78+
},
79+
{
80+
title: {
81+
name: 'Déconnexion',
82+
color: 'negative'
83+
},
84+
icon: {
85+
name: 'mdi-logout',
86+
color: 'negative'
87+
},
88+
to: '/deconnexion'
89+
}
90+
]
91+
</script>

‎app/src/components/appbar/RightButtons.vue‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<template lang="pug">
2+
div
3+
q-btn(v-for="button in buttons" :key="button.icon" round flat :icon="`mdi-${button.icon}`" size="lg")
4+
q-tooltip.text-body2(transition-show="scale" transition-hide="scale") {{ button.name }}
5+
q-btn-dropdown(icon="mdi-account-circle-outline" round flat size="lg")
6+
q-list
7+
q-item(v-for="button in buttons" :key="button.name")
8+
q-btn(flat :icon="`mdi-${button.icon}`" :label="button.name" color="primary")
9+
</template>
10+
11+
<script lang="ts" setup>
12+
const buttons = [
13+
{ icon: 'cog', name: 'Paramètres', action: '' },
14+
{ icon: 'bell', name: 'Notifications', action: '' },
15+
{ icon: 'help', name: 'Aide', action: '' },
16+
17+
]
18+
</script>

‎app/src/components/appbar/Searchfield.vue‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<template lang="pug">
2+
q-input(v-model="search" label="Rechercher" standout ).q-my-xs
3+
template(v-slot:append)
4+
q-icon( v-if="search === ''" name="mdi-magnify")
5+
q-icon( v-else name="mdi-close" @click="search = ''")
6+
</template>
7+
8+
<script lang="ts" setup>
9+
import { ref } from 'vue'
10+
const search = ref('')
11+
</script>

‎app/src/components/appbar/index.vue‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<template lang="pug">
2+
q-toolbar.bg-primary.text-white
3+
q-btn(flat)
4+
q-avatar
5+
img(src="/logo.svg")
6+
q-toolbar-title Teaket
7+
q-separator(vertical dark inset).q-mx-md
8+
tk-AppbarMenu
9+
q-space
10+
tk-AppbarSearchfield
11+
q-separator(vertical dark inset).q-mx-md
12+
tk-AppbarRightButtons
13+
</template>
14+
15+
<script lang="ts" setup>
16+
</script>

‎app/src/layouts/default.vue‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<template lang="pug">
2+
div
3+
tk-appbar
4+
slot
5+
</template>

‎docs/app/NUXTAPIPARTY.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# Problem
2+
Dans le .env du projet, la variable d'environnement `NUXT_API_URL` doit être une IP en dur pour importer les types de l'API.
3+
```

0 commit comments

Comments
 (0)