Просмотр исходного кода

fix default value + Menu css style

Vincent GUFFON 4 лет назад
Родитель
Сommit
d4f055d982

+ 46 - 22
components/Layout/Header/Menu.vue

@@ -4,7 +4,7 @@ header principal (configuration, paramètres du compte...)
 -->
 
 <template>
-  <v-menu offset-y left max-height="300">
+  <v-menu offset-y left>
     <template v-slot:activator="{ on: { click }, attrs }">
       <v-tooltip bottom>
         <template v-slot:activator="{ on: on_tooltips , attrs: attrs_tooltips }">
@@ -37,31 +37,49 @@ header principal (configuration, paramètres du compte...)
         <span>{{ $t(menu.title) }}</span>
       </v-tooltip>
     </template>
-    <v-list dense :subheader="true">
-      <v-list-item dense class="ot_light_grey">
-        <v-list-item-title v-text="$t(menu.title)" />
-      </v-list-item>
-      <template v-for="(item, index) in menu.children">
-        <v-list-item
-          :key="item.title"
-          :href="item.isExternalLink ? item.to : undefined"
-          :to="!item.isExternalLink ? item.to : undefined"
-          router
-          exact
-        >
-          <v-list-item-title v-text="$t(item.title)" />
-        </v-list-item>
-        <v-divider
-          v-if="index < menu.length - 1"
-          :key="index"
-        />
-      </template>
-    </v-list>
+    <v-card scrollable>
+      <v-card-title class="ot_super_light_grey text-body-2 font-weight-bold">
+        {{$t(menu.title)}}
+      </v-card-title>
+      <v-card-text style="max-height: 300px; overflow-y: scroll" class="ma-0 pa-0">
+        <v-list dense :subheader="true">
+          <template v-for="(item, index) in menu.children">
+            <v-list-item
+
+              :id="item.title"
+              :key="item.title"
+              :href="item.isExternalLink ? item.to : undefined"
+              :to="!item.isExternalLink ? item.to : undefined"
+              router
+              exact
+            >
+              <v-list-item-title v-text="$t(item.title)"/>
+            </v-list-item>
+          </template>
+        </v-list>
+      </v-card-text>
+      <v-card-actions class="ma-0 pa-0">
+        <template v-for="(item, index) in menu.actions">
+          <v-list-item
+            class="text-body-2"
+            :id="item.title"
+            :key="item.title"
+            :href="item.isExternalLink ? item.to : undefined"
+            :to="!item.isExternalLink ? item.to : undefined"
+            router
+          >
+            <v-list-item-title v-text="$t(item.title)"/>
+          </v-list-item>
+        </template>
+      </v-card-actions>
+    </v-card>
+
+
   </v-menu>
 </template>
 
 <script lang="ts">
-import { defineComponent } from '@nuxtjs/composition-api'
+import {defineComponent} from '@nuxtjs/composition-api'
 
 export default defineComponent({
   props: {
@@ -76,3 +94,9 @@ export default defineComponent({
   }
 })
 </script>
+<style scoped>
+  #logout{
+    background: var(--v-ot_green-base, white);
+    color: white;
+  }
+</style>

+ 1 - 1
components/Ui/Input/Autocomplete.vue

@@ -28,7 +28,7 @@ export default defineComponent({
     label: {
       type: String,
       required: false,
-      default: ''
+      default: null
     },
     field: {
       type: String,

+ 1 - 1
components/Ui/Input/AutocompleteWithAPI.vue

@@ -35,7 +35,7 @@ export default defineComponent({
     label: {
       type: String,
       required: false,
-      default: ''
+      default: null
     },
     field: {
       type: String,

+ 1 - 1
components/Ui/Input/Checkbox.vue

@@ -31,7 +31,7 @@ export default defineComponent({
     label: {
       type: String,
       required: false,
-      default: ''
+      default: null
     },
     data: {
       type: Boolean,

+ 1 - 1
components/Ui/Input/DatePicker.vue

@@ -53,7 +53,7 @@ export default defineComponent({
     label: {
       type: String,
       required: false,
-      default: ''
+      default: null
     },
     data: {
       type: [String, Array],

+ 1 - 1
components/Ui/Input/Enum.vue

@@ -40,7 +40,7 @@ export default defineComponent({
     label: {
       type: String,
       required: false,
-      default: ''
+      default: null
     },
     field: {
       type: String,

+ 1 - 1
components/Ui/Input/Text.vue

@@ -26,7 +26,7 @@ export default defineComponent({
     label: {
       type: String,
       required: false,
-      default: ''
+      default: null
     },
     field: {
       type: String,

+ 1 - 1
layouts/default.vue

@@ -1,7 +1,7 @@
 <template>
   <main>
     <!-- The client only is used to show the loading picture (@see https://nuxtjs.org/docs/2.x/features/nuxt-components#the-client-only-component) -->
-    <client-only placeholder="Loading..." />
+    <client-only placeholder=" " />
 
     <v-app dark>
       <LayoutMenu v-if="displayedMenu" :menu="menu" :mini-variant="properties.miniVariant" />

+ 0 - 2
pages/subscription.vue

@@ -289,8 +289,6 @@ export default defineComponent({
     const { store } = useContext()
     const organizationProfile = $organizationProfile(store)
 
-    console.log(organizationProfile)
-
     return {
       organizationProfile
     }

+ 1 - 0
types/interfaces.d.ts

@@ -25,6 +25,7 @@ interface ItemMenu {
   to?: string,
   children?: ItemsMenu,
   isExternalLink?: boolean,
+  actions?: ItemsMenu,
 }
 interface ItemsMenu extends Array<ItemMenu> {}
 

+ 7 - 2
use/layout/Menus/accountMenu.ts

@@ -89,9 +89,14 @@ class AccountMenu extends BaseMenu implements Menu {
       children.push(this.constructMenu('print_my_licence', undefined, `/licence-cmf`, true))
     }
 
-    children.push(this.constructMenu('logout', undefined, `/logout`, true))
+    const accountMenu = this.constructMenu('my_account', 'fa-user', undefined, undefined, children, false)
 
-    return children.length > 0 ? this.constructMenu('my_account', 'fa-user', undefined, undefined, children) : null;
+    const actions: ItemsMenu = [];
+    actions.push(this.constructMenu('logout', undefined, `/logout`, true))
+
+    accountMenu.actions = actions
+
+    return accountMenu
   }
 }
 

+ 1 - 0
use/layout/Menus/baseMenu.ts

@@ -25,6 +25,7 @@ class BaseMenu {
    * @param {boolean} isOldLink est-ce un lien renvoyant vers l'ancien admin?
    * @param {Array<ItemMenu>} children Tableau d'ItemMenu représentant les sous menu du menu principal
    * @param {boolean} isExternalLink est-ce un lien renvoyant vers l'extérieur?
+   * @param {Array<ItemMenu>} actions Tableau d'ItemMenu représentant les actions devant apparaitre en bas du menu
    * @return {ItemMenu}
    */
   constructMenu (title: string, icon?: string, link?: string, isOldLink?: boolean, children?: Array<ItemMenu>, isExternalLink?: boolean): ItemMenu {

+ 4 - 0
use/layout/Menus/configurationMenu.ts

@@ -77,6 +77,10 @@ class ConfigurationMenu extends BaseMenu implements Menu {
       children.push(this.constructMenu('course_duplication', undefined, '/duplicate_courses/', true))
     }
 
+    if (this.$ability.can('display', 'import_page')) {
+      children.push(this.constructMenu('import', undefined, '/import/all', true))
+    }
+
     if (children.length === 1) {
       return children[0]
     } else if (children.length > 0) {