@bildvitta/quasar-ui-asteroid 2.11.0 → 2.12.2

package/package.json

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

package/src/components/{settings-menu/QasSettingsMenu.stories.js → actions-menu/QasActionsMenu.stories.js}

@@ -1,14 +1,14 @@
-import QasSettingsMenu from './QasSettingsMenu.vue'
+import QasActionsMenu from './QasActionsMenu.vue'
 import { Notify } from 'quasar'
 
 export default {
-  component: QasSettingsMenu,
-  title: 'Components/SettingsMenu',
+  component: QasActionsMenu,
+  title: 'Components/ActionsMenu',
 
   parameters: {
     docs: {
       description: {
-        component: 'Settings menu.'
+        component: 'Actions menu.'
       }
     }
   },
@@ -19,7 +19,15 @@ export default {
     },
 
     list: {
-      description: 'Settings list as an object containing `label`, `icon`, `props` and `handle` click event.'
+      description: 'Actions list as an object containing `label`, `icon`, `props` and `handler` click event.'
+    },
+
+    hideLabel: {
+      description: 'Controls label visibility.'
+    },
+
+    icon: {
+      description: 'Icon button.'
     },
 
     // slots
@@ -41,23 +49,23 @@ export default {
 }
 
 const Template = (args, { argTypes }) => ({
-  components: { QasSettingsMenu },
+  components: { QasActionsMenu },
   props: Object.keys(argTypes),
   template:
-    '<qas-settings-menu v-bind="$props" />'
+    '<qas-actions-menu v-bind="$props" />'
 })
 
 export const Default = Template.bind({})
 Default.args = {
   block: {
-    handle: () => Notify.create('Block clicked!'),
+    handler: () => Notify.create('Block clicked!'),
     icon: 'o_locked',
     label: 'Block'
   },
 
   list: {
     delete: {
-      handle: () => Notify.create('Delete clicked!'),
+      handler: () => Notify.create('Delete clicked!'),
       icon: 'o_delete',
       label: 'Delete'
     }

package/src/components/{settings-menu/QasSettingsMenu.vue → actions-menu/QasActionsMenu.vue}

@@ -1,7 +1,7 @@
 <template>
-  <qas-btn class="qas-settings-menu" color="primary" v-bind="$attrs" hide-mobile-label icon="o_settings" :label="label" outline v-on="$listeners">
-    <q-menu class="qas-settings-menu__menu">
-      <q-list class="qas-settings-menu__list" separator>
+  <qas-btn class="qas-actions-menu" color="primary" v-bind="$attrs" hide-mobile-label :icon="icon" :label="labelValue" outline v-on="$listeners">
+    <q-menu class="qas-actions-menu__menu">
+      <q-list class="qas-actions-menu__list" separator>
         <slot v-for="(item, key) in list" :item="item" :name="key">
           <q-item :key="key" class="text-bold text-primary" clickable v-bind="item.props" @click="onClick(item)">
             <q-item-section>
@@ -21,6 +21,8 @@
 import QasBtn from '../btn/QasBtn'
 
 export default {
+  name: 'QasActionsMenu',
+
   components: {
     QasBtn
   },
@@ -34,23 +36,37 @@ export default {
     list: {
       default: () => ({}),
       type: Object
+    },
+
+    hideLabel: {
+      type: Boolean
+    },
+
+    icon: {
+      default: 'o_settings',
+      type: String
     }
   },
 
   methods: {
     onClick (item) {
-      // TODO: Alterar para "handler".
-      if (typeof item.handle === 'function') {
-        const { handle, ...filtered } = item
-        item.handle(filtered)
+      if (typeof item.handler === 'function') {
+        const { handler, ...filtered } = item
+        item.handler(filtered)
       }
     }
+  },
+
+  computed: {
+    labelValue () {
+      return this.hideLabel ? '' : this.label
+    }
   }
 }
 </script>
 
 <style lang="scss">
-.qas-settings-menu {
+.qas-actions-menu {
   &__list {
     width: 265px;
     z-index: 1;

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/date-time-input/QasDateTimeInput.stories.js

@@ -26,6 +26,10 @@ export default {
       description: 'Bypass [QDate](https://quasar.dev/vue-components/date) props.'
     },
 
+    gmt: {
+      description: 'Use GMT (Greenwich Mean Time) on date input'
+    },
+
     timeMask: {
       description: 'Mask string to parse and format time value.'
     },

package/src/components/date-time-input/QasDateTimeInput.vue

@@ -20,6 +20,7 @@
 
 <script>
 import { date } from 'quasar'
+import { date as dateFn } from '../../helpers/filters'
 
 export default {
   props: {
@@ -37,6 +38,10 @@ export default {
       type: Object
     },
 
+    gmt: {
+      type: Boolean
+    },
+
     timeMask: {
       default: 'HH:mm',
       type: String
@@ -155,6 +160,14 @@ export default {
         return ''
       }
 
+      if (this.dateOnly && !this.gmt) {
+        return dateFn(date.extractDate(value, this.maskDate), 'yyyy-MM-dd')
+      }
+
+      if (this.timeOnly && !this.gmt) {
+        return date.extractDate(value, 'HH:MM')
+      }
+
       return date.extractDate(value, this.maskDate).toISOString()
     },
 

package/src/components/field/QasField.vue

@@ -70,7 +70,8 @@ export default {
         mask,
         pattern,
         maxFiles,
-        searchable
+        searchable,
+        gmt
       } = this.formatedField
 
       // Default error attributes for Quasar.
@@ -91,10 +92,11 @@ export default {
         maxlength,
         minlength,
         suffix,
-        prefix
+        prefix,
+        gmt
       }
 
-      const datetimeInput = { is: 'qas-date-time-input', ...input }
+      const datetimeInput = { is: 'qas-date-time-input', gmt, ...input }
       const decimalInput = { is: 'qas-decimal-input', comma: true, fillMask: '0', reverseFillMask: true, ...input }
 
       // It'll generate a list of acceptable files extensions.

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()
+        }
+      })
     }
   }
 }

package/src/index.js

@@ -1,5 +1,6 @@
 import { version } from '../package.json'
 
+import QasActionsMenu from './components/actions-menu/QasActionsMenu'
 import QasAppBar from './components/app-bar/QasAppBar'
 import QasAppMenu from './components/app-menu/QasAppMenu'
 import QasAppsMenu from './components/apps-menu/QasAppsMenu'
@@ -37,7 +38,6 @@ import QasResizer from './components/resizer/QasResizer'
 import QasSearchBox from './components/search-box/QasSearchBox'
 import QasSelect from './components/select/QasSelect'
 import QasSelectList from './components/select-list/QasSelectList'
-import QasSettingsMenu from './components/settings-menu/QasSettingsMenu'
 import QasSignaturePad from './components/signature-pad/QasSignaturePad'
 import QasSignatureUploader from './components/signature-uploader/QasSignatureUploader'
 import QasSingleView from './components/single-view/QasSingleView'
@@ -73,6 +73,7 @@ export {
   NotifyError,
   NotifySuccess,
 
+  QasActionsMenu,
   QasAppBar,
   QasAppMenu,
   QasAppsMenu,
@@ -110,7 +111,6 @@ export {
   QasSearchBox,
   QasSelect,
   QasSelectList,
-  QasSettingsMenu,
   QasSignaturePad,
   QasSignatureUploader,
   QasSingleView,
@@ -132,6 +132,7 @@ export default {
   NotifyError,
   NotifySuccess,
 
+  QasActionsMenu,
   QasAppBar,
   QasAppMenu,
   QasAppsMenu,
@@ -169,7 +170,6 @@ export default {
   QasSearchBox,
   QasSelect,
   QasSelectList,
-  QasSettingsMenu,
   QasSignaturePad,
   QasSignatureUploader,
   QasSingleView,
@@ -190,6 +190,7 @@ export default {
       success: NotifySuccess
     }
 
+    Vue.component('QasActionsMenu', QasActionsMenu)
     Vue.component('QasAppBar', QasAppBar)
     Vue.component('QasAppMenu', QasAppMenu)
     Vue.component('QasAppsMenu', QasAppsMenu)
@@ -227,7 +228,6 @@ export default {
     Vue.component('QasSearchBox', QasSearchBox)
     Vue.component('QasSelect', QasSelect)
     Vue.component('QasSelectList', QasSelectList)
-    Vue.component('QasSettingsMenu', QasSettingsMenu)
     Vue.component('QasSignaturePad', QasSignaturePad)
     Vue.component('QasSignatureUploader', QasSignatureUploader)
     Vue.component('QasSingleView', QasSingleView)

package/src/mixins/map-markers.js

@@ -5,12 +5,13 @@ export default {
 
       referencePoints.forEach((referencePoint, index) => {
         const { latitude, longitude, city, name, icon } = referencePoint
+        const isCreateOrEdit = !!this.$_mode
 
         referencePointsList.push({
           position: { lat: +latitude, lng: +longitude },
           title: name,
           description: city,
-          draggable: !index && this.$_isEditMode,
+          draggable: !index && isCreateOrEdit,
           icon
         })
       })