@bildvitta/quasar-ui-asteroid 2.13.0 → 2.15.0

package/package.json

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

package/src/components/app-menu/QasAppMenu.stories.js

@@ -30,6 +30,10 @@ export default {
       description: 'Controls drawer menu visibility.'
     },
 
+    title: {
+      description: 'Title for displaying inside "modules" as label when is in development (local).'
+    },
+
     // Events
     input: {
       description: 'Fires when opening or closing the drawer menu.'

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

@@ -7,12 +7,12 @@
             Você está no modulo:
           </div>
 
-          <qas-select v-model="module" :options="modules" @input="redirectHandler(currentModelOption)" />
+          <qas-select v-model="module" :options="defaultModules" @input="redirectHandler(currentModelOption)" />
         </div>
 
         <q-list class="text-grey-9 text-weight-medium">
           <template v-for="(header, index) in items">
-            <q-expansion-item v-if="hasChildren(header)" :key="header.label" :ref="`item-${index}`" :default-opened="shouldExpand(header)" expand-icon="o_keyboard_arrow_down" expand-separator group="item" :icon="header.icon" :label="header.label" :to="header.to" @click="toggleItem(index)" :active-class="activeItemClassesSecondary">
+            <q-expansion-item v-if="hasChildren(header)" :key="header.label" :ref="`item-${index}`" :active-class="activeItemClassesSecondary" :default-opened="shouldExpand(header)" expand-icon="o_keyboard_arrow_down" expand-separator group="item" :icon="header.icon" :label="header.label" :to="header.to" @click="toggleItem(index)">
               <q-item v-for="(item, itemIndex) in header.children" :key="itemIndex" v-ripple :active-class="activeItemClasses" clickable :to="item.to">
                 <q-item-section v-if="item.icon" avatar>
                   <q-icon :name="item.icon" />
@@ -44,6 +44,7 @@
 
 <script>
 import { screenMixin } from '../../mixins'
+import { isLocalDevelopment } from '../../helpers'
 
 export default {
   name: 'QasAppMenu',
@@ -66,14 +67,14 @@ export default {
       type: Boolean
     },
 
+    title: {
+      default: '',
+      type: String
+    },
+
     modules: {
       default: () => [],
       type: Array
-    },
-
-    currentModule: {
-      default: '',
-      type: String
     }
   },
 
@@ -94,6 +95,22 @@ export default {
       return 'text-primary bg-secondary-contrast'
     },
 
+    defaultModules () {
+      if (!isLocalDevelopment()) return this.modules
+
+      const defaultModules = [...this.modules]
+      const { host, protocol } = window.location
+      const value = `${protocol}//${host}`
+
+      // if app is in development mode (local) it's added a default module
+      defaultModules.unshift({
+        label: `Localhost ${this.title ? `(${this.title})` : ''}`,
+        value
+      })
+
+      return defaultModules
+    },
+
     model: {
       get () {
         return this.value
@@ -105,11 +122,17 @@ export default {
     },
 
     currentModelOption () {
-      return this.modules.find(module => module?.value === this.module)
+      return this.defaultModules.find(module => module?.value === this.module)
     },
 
     displayModuleSection () {
-      return !this.isMini && this.modules.length
+      return !this.isMini && this.defaultModules.length
+    },
+
+    currentModule () {
+      const hostname = window.location.hostname
+
+      return this.defaultModules.find(module => module?.value.includes(hostname))?.value
     }
   },
 
@@ -142,9 +165,9 @@ export default {
       this.isMini = value
     },
 
-    redirectHandler ({ path }) {
-      if (!path.includes(window.location.host)) {
-        window.location.href = path
+    redirectHandler ({ value }) {
+      if (!value.includes(window.location.host)) {
+        window.location.href = value
       }
     },
 

package/src/components/layout/QasLayout.stories.js

@@ -89,9 +89,7 @@ Default.args = {
         value: 'test-2',
         path: 'https://google.com'
       }
-    ],
-
-    currentModule: 'test'
+    ]
   },
 
   appBarProps: {

package/src/components/layout/QasLayout.vue

@@ -5,7 +5,7 @@
     </slot>
 
     <slot name="app-menu">
-      <qas-app-menu v-model="menuDrawer" v-bind="appMenuProps" v-on="appMenuEvents" />
+      <qas-app-menu v-model="menuDrawer" v-bind="defaultAppMenuProps" v-on="appMenuEvents" />
     </slot>
 
     <slot>
@@ -61,11 +61,16 @@ export default {
     }
   },
 
-  watch: {
-    $route () {
-      console.log('chamado no layout')
-    },
+  computed: {
+    defaultAppMenuProps () {
+      return {
+        ...this.appMenuProps,
+        title: this.appBarProps?.title
+      }
+    }
+  },
 
+  watch: {
     value: {
       handler (value) {
         this.menuDrawer = value

package/src/components/list-items/QasListItems.stories.js

@@ -38,7 +38,12 @@ export default {
 
     redirectKey: {
       control: null,
-      description: 'Key to define the id redirect.'
+      description: 'Item key that will be the value of the redirect.'
+    },
+
+    paramKey: {
+      control: null,
+      description: 'Redirect parameter key.'
     },
 
     useIconRedirect: {

package/src/components/list-items/QasListItems.vue

@@ -44,6 +44,11 @@ export default {
       type: String
     },
 
+    paramKey: {
+      default: 'id',
+      type: String
+    },
+
     to: {
       default: () => ({}),
       type: Object
@@ -61,7 +66,7 @@ export default {
 
     getRedirectPayload (item) {
       return {
-        params: { [this.redirectKey]: item[this.redirectKey] },
+        params: { [this.paramKey]: item[this.redirectKey] },
         ...this.to
       }
     }

package/src/components/resizer/QasResizer.vue

@@ -9,7 +9,7 @@
 <script>
 import { greatestCommonDivisor } from '../../helpers'
 
-const baseURL = 'https://d17ouzaofz81f3.cloudfront.net/'
+const baseURL = 'https://image-resize.nave.dev/'
 
 export default {
   name: 'QasResizer',

package/src/components/uploader/QasCustomUploader.vue

@@ -79,7 +79,6 @@ export default {
     // overrides "__addFiles" from quasar
     async __addFiles (event, files = []) {
       const filesToUpload = event?.target?.files || files
-      this.files = []
       this.isAddingFiles = true
 
       const filesPromise = []

package/src/helpers/filters.js

@@ -97,7 +97,7 @@ function handleMasks (value) {
 // Labels
 function humanize (field = {}, value) {
   if (!value) return value
-  
+
   const mappedMasks = handleMasks(value)
 
   if (mappedMasks[field.mask]) {

package/src/helpers/index.js

@@ -1,8 +1,9 @@
 import base64ToBlob from './base64ToBlob.js'
+import constructObject from './constructObject.js'
 import filterObject from './filter-object.js'
 import greatestCommonDivisor from './greatestCommonDivisor.js'
+import isLocalDevelopment from './isLocalDevelopment.js'
 import { history, handleHistory } from './historyHandler.js'
-import constructObject from './constructObject.js'
 
 import {
   asset,
@@ -53,5 +54,6 @@ export {
 
   base64ToBlob,
   filterObject,
-  greatestCommonDivisor
+  greatestCommonDivisor,
+  isLocalDevelopment
 }

package/src/helpers/isLocalDevelopment.js

@@ -0,0 +1,3 @@
+export default function () {
+  return ['localhost', '127.0.0.1'].includes(window.location.hostname)
+}