Merge pull request #22 from Libertech-FR/app-developement

App developement

Author: tacxou

app/nuxt.config.ts

@@ -28,15 +28,7 @@ export default defineNuxtConfig({
     global: true,
     dirs: [{ path: '~/components', prefix: 'tk' }],
   },
-  modules: [
-    '@nuxt-alt/auth',
-    '@nuxt-alt/http',
-    '@pinia/nuxt',
-    'nuxt-quasar-ui',
-    '@vueuse/nuxt',
-    'dayjs-nuxt',
-    ...appSetup(),
-  ],
+  modules: ['@nuxt-alt/auth', '@nuxt-alt/http', '@pinia/nuxt', 'nuxt-quasar-ui', '@vueuse/nuxt', 'dayjs-nuxt', ...appSetup()],
   auth: {
     globalMiddleware: true,
     rewriteRedirects: true,
@@ -78,18 +70,24 @@ export default defineNuxtConfig({
     locales: ['fr', 'en'],
     defaultLocale: 'fr',
     defaultTimezone: 'Paris',
-    plugins: ['timezone', 'relativeTime']
+    plugins: ['timezone', 'relativeTime'],
   },
-  pinia:{
-    autoImports: [
-        'defineStore'
-    ]
+  pinia: {
+    autoImports: ['defineStore'],
   },
   appConfig: {
     customSlots: {},
   },
   quasar: {
     iconSet: 'mdi-v5',
+    plugins: ['Notify'],
+    config: {
+      notify: {
+        timeout: 2500,
+        position: 'top-right',
+        actions: [{ icon: 'mdi-close', color: 'white' }],
+      },
+    },
   },
   vite: {
     define: {
@@ -98,6 +96,7 @@ export default defineNuxtConfig({
     plugins: [
       pugPlugin(<any>{
         pretty: true,
+        compilerOptions: {},
       }),
     ],
   },
@@ -112,7 +111,7 @@ export default defineNuxtConfig({
     shim: false,
   },
   hooks: {
-    'ready': async () => {
+    ready: async () => {
       console.log('[OpenapiTS] Generating .nuxt/types/service-api.d.ts...')
       try {
         const fileData = await openapiTS(`${TK_APP_API_URL}/swagger/json`)
@@ -121,6 +120,6 @@ export default defineNuxtConfig({
       } catch (error) {
         console.debug('[OpenapiTS] Error while generating .nuxt/types/service-api.d.ts', error)
       }
-    }
-  }
+    },
+  },
 })

app/package.json

@@ -16,6 +16,9 @@
     "@nuxt-alt/http": "^1.6.8",
     "@pinia/nuxt": "^0.4.11",
     "@quasar/extras": "^1.16.6",
+    "@tiptap/pm": "^2.1.11",
+    "@tiptap/starter-kit": "^2.1.11",
+    "@tiptap/vue-3": "^2.1.11",
     "@vueuse/router": "^10.4.1",
     "bson-objectid": "^2.0.4",
     "cookie": "^0.5.0",

app/src/components/TiptapEditor.vue

@@ -0,0 +1,15 @@
+<template>
+    <editor-content :editor="editor" />
+</template>
+  
+<script setup>
+import { useEditor, EditorContent } from '@tiptap/vue-3'
+import StarterKit from '@tiptap/starter-kit'
+
+const editor = useEditor({
+    content: '<p>I’m running Tiptap with Vue.js. 🎉</p>',
+    extensions: [
+        StarterKit,
+    ],
+})
+</script>

app/src/components/searchfilters/Main.vue

@@ -1,38 +1,39 @@
 <template lang="pug">
 .row.q-gutter-sm.items-center.q-mt-sm
-    //- .col.col-md-2
-    //-     q-select(:options="fieldTypes" label="Type de champ" v-model="fieldType" clearable @update:model-value="clearFields(['field', 'comparator'])")
-    .col.col-md-2
-      q-select(:options="fields" label="Champs" v-model="field" clearable @update:model-value="onFieldChange($event)")
-    .col.col-md-2
-      q-select(:options="comparatorFilteredByType" label="Comparateurs" v-model="comparator" clearable @update:model-value="clearFields([])" :disable="isFieldDisabled.comparator")
-        template(v-slot:selected-item="scope")
-          q-icon(:name="scope.opt.icon" size="xs")
-        template(v-slot:option="scope")
-          q-item(v-bind="scope.itemProps")
-            q-item-section(avatar)
-              q-icon(:name="scope.opt.icon")
-            q-item-section
-              q-item-label
-                span {{ scope.opt.label }}
-
-    .col-12.col-md-2(v-show="!comparator?.multiplefields")
-      q-input(v-model="search" label="Rechercher" clearable :type="searchInputType" :disable="isFieldDisabled.search" :prefix="comparator?.prefix" :suffix="comparator?.suffix")
-    .col-6.col-md-2(v-show="comparator?.multiplefields")
-      q-input(v-model="searchMin" label="Min" clearable :type="searchInputType" :disable="isFieldDisabled.search" )
-    .col-6.col-md-2(v-show="comparator?.multiplefields")
-      q-input(v-model="searchMax" label="Max" clearable :type="searchInputType" :disable="isFieldDisabled.search" )
-    .col-12.col-md-1
-      q-btn(color="primary" @click="addFilter" :disable="isFieldDisabled.addButton") Ajouter
-    q-space
-    .col-12.col-md-2
-      tk-SearchfiltersRightSelect(ref="rightSelect")
+  //- .col.col-md-2
+  //-     q-select(:options="fieldTypes" label="Type de champ" v-model="fieldType" clearable @update:model-value="clearFields(['field', 'comparator'])")
+  .col.col-md-2
+    q-select(:options="fields" label="Champs" v-model="field" clearable @update:model-value="onFieldChange($event)")
+  .col.col-md-2
+    q-select(:options="comparatorFilteredByType" label="Comparateurs" v-model="comparator" clearable @update:model-value="clearFields([])" :disable="isFieldDisabled.comparator")
+      template(v-slot:selected-item="scope")
+        q-icon(:name="scope.opt.icon" size="xs")
+      template(v-slot:option="scope")
+        q-item(v-bind="scope.itemProps")
+          q-item-section(avatar)
+            q-icon(:name="scope.opt.icon")
+          q-item-section
+            q-item-label
+              span {{ scope.opt.label }}
+
+  .col-12.col-md-2(v-show="!comparator?.multiplefields")
+    q-input(v-model="search" label="Rechercher" clearable :type="searchInputType" :disable="isFieldDisabled.search" :prefix="comparator?.prefix" :suffix="comparator?.suffix")
+  .col-6.col-md-2(v-show="comparator?.multiplefields")
+    q-input(v-model="searchMin" label="Min" clearable :type="searchInputType" :disable="isFieldDisabled.search" )
+  .col-6.col-md-2(v-show="comparator?.multiplefields")
+    q-input(v-model="searchMax" label="Max" clearable :type="searchInputType" :disable="isFieldDisabled.search" )
+  .col-12.col-md-1
+    q-btn(color="primary" @click="addFilter" :disable="isFieldDisabled.addButton") Ajouter
+  q-space
+  .col-12.col-md-2
+    tk-SearchfiltersRightSelect(ref="rightSelect")
 </template>
 
 <script lang="ts" setup>
 import { ref, computed, inject } from 'vue'
 import { useRouter, useRoute } from 'nuxt/app'
 import { useDayjs } from '#imports';
+import { pushQuery } from '~/composables'
 import type { Filter, Field, Comparator, SearchFilter } from '~/types'
 const dayjs = useDayjs()
 
@@ -95,11 +96,11 @@ const addFilter = async () => {
   if (!searchFilter) return
   if (searchFilter.comparator.multiplefields) {
     for (const { key, value } of parseMultipleFilter(searchFilter)) {
-      await pushQuery(key, value)
+      await pushQuery({ key, value })
     }
   } else {
     const { key, value } = parseSimpleFilter(searchFilter)
-    await pushQuery(key, value)
+    await pushQuery({ key, value })
   }
 }
 
@@ -130,15 +131,15 @@ const parseMultipleFilter = (searchFilter: SearchFilter) => {
   return [min, max]
 }
 
-const pushQuery = async (key: string, value: string) => {
-  const query = {
-    ...route.query,
-  }
-  query[key] = value
-  await router.push({
-    query
-  })
-}
+// const pushQuery = async (key: string, value: string) => {
+//   const query = {
+//     ...route.query,
+//   }
+//   query[key] = value
+//   await router.push({
+//     query
+//   })
+// }
 
 const getSearchFilter = computed(() => {
   if (field.value === undefined || field.value === null) return null