@bildvitta/quasar-ui-asteroid 2.12.1 → 2.12.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bildvitta/quasar-ui-asteroid",
-  "version": "2.12.1",
+  "version": "2.12.2",
   "description": "",
   "main": "./src/index.js",
   "scripts": {

package/src/components/app-menu/QasAppMenu.vue

@@ -1,6 +1,6 @@
 <template>
   <q-drawer v-model="model" content-class="bg-primary-contrast" :mini="miniMode" :width="230" @before-hide="beforeHide">
-    <q-list class="text-primary" padding>
+    <q-list class="text-primary">
       <div v-for="(header, index) in items" :key="index">
         <q-expansion-item v-if="hasChildren(header)" :active-class="activeSecondaryItemClasses" :default-opened="shouldExpand(header)" expand-icon="o_keyboard_arrow_down" expand-separator :icon="header.icon" :label="header.label" :to="header.to">
           <q-item v-for="(item, itemIndex) in header.children" :key="itemIndex" v-ripple :active-class="activeItemClasses" clickable :to="item.to">

package/src/components/filters/QasFilters.vue

@@ -41,7 +41,7 @@
     </div>
 
     <div v-if="badges && hasActiveFilters" class="q-mt-md">
-      <q-chip v-for="(filterItem, key) in activeFilters" :key="key" color="grey-4" dense removable size="md" text-color="grey-8" @remove="removeFilter(filterItem)">{{ filterItem.label }} = "{{ filterItem.value }}"</q-chip>
+      <q-chip v-for="(filterItem, key) in activeFilters" :key="key" color="grey-4" dense removable size="md" text-color="grey-8" @remove="removeFilter(filterItem)">{{ filterItem.label }} = "{{ handleChipValue(filterItem.value) }}"</q-chip>
     </div>
 
     <slot :context="context" :filter="filter" :filters="activeFilters" :removeFilter="removeFilter" />
@@ -188,7 +188,7 @@ export default {
 
   created () {
     this.fetchFilters()
-    this.updateValues()
+    this.watchOnceFields()
   },
 
   methods: {
@@ -252,6 +252,10 @@ export default {
       this.$router.push({ query })
     },
 
+    getChipValue (value) {
+      return Array.isArray(value) ? value.join(', ') : value
+    },
+
     removeFilter ({ name }) {
       const query = { ...this.$route.query }
 
@@ -266,8 +270,23 @@ export default {
       this.search = search || ''
 
       for (const key in filters) {
-        this.$set(this.filters, key, parseValue(filters[key]))
+        this.$set(this.filters, key, parseValue(this.normalizeValues(filters[key], this.fields[key]?.multiple)))
       }
+    },
+
+    normalizeValues (value, isMultiple) {
+      if (Array.isArray(value)) return value
+
+      return isMultiple ? [value] : value
+    },
+
+    watchOnceFields () {
+      const watchOnce = this.$watch('fields', values => {
+        if (Object.keys(values).length) {
+          this.updateValues()
+          watchOnce()
+        }
+      })
     }
   }
 }