@bildvitta/quasar-ui-asteroid 3.0.0-beta.10 → 3.0.0-beta.13

package/src/components/uploader/QasUploader.vue

@@ -250,6 +250,8 @@ export default {
       )
 
       this.updateUploading(false)
+
+      this.$qas.logger.group('QasUploader - uploaded', [this.modelValue])
     },
 
     async fetchCredentials (filename) {
@@ -260,6 +262,12 @@ export default {
           entity: this.entity,
           filename
         })
+
+        this.$qas.logger.group(
+          'QasUploader - fetchCredentials -> resposta de /upload-credentials/',
+          [data]
+        )
+
         return data
       } finally {
         this.isFetching = false
@@ -279,7 +287,9 @@ export default {
 
       const clonedValue = extend(true, [], this.modelValue)
       const numberIndex = this.modelValue.findIndex(file => this.getFileName(file) === index)
+
       clonedValue.splice(numberIndex, 1)
+
       this.$emit('update:modelValue', clonedValue)
     },
 
@@ -288,7 +298,9 @@ export default {
     },
 
     getFilesList (uploadedFiles) {
-      const pathsList = Array.isArray(this.modelValue) ? this.modelValue : (this.modelValue ? [this.modelValue] : [])
+      const pathsList = Array.isArray(this.modelValue)
+        ? this.modelValue
+        : (this.modelValue ? [this.modelValue] : [])
 
       uploadedFiles = uploadedFiles.map((file, indexToDelete) => {
         return {
@@ -324,6 +336,8 @@ export default {
         }
       })
 
+      this.$qas.logger.group('QasUploader - getFilesList', [files])
+
       return files
     },
 
@@ -362,7 +376,14 @@ export default {
         // Retorna largura e altura da original da imagem
         const { width, height } = await getImageSize(image)
 
-        if (width <= this.sizeLimit) return file
+        if (width <= this.sizeLimit) {
+          this.$qas.logger.info(`
+            QasUploader - resizeImage -> Tamanho da imagem menor que o tamanho limite,
+            sendo assim, não faz o resize
+          `)
+
+          return file
+        }
 
         // Retorna os novos tamanhos redimensionados
         const resizedDimensions = getResizeDimensions(this.sizeLimit, width, height)
@@ -380,7 +401,11 @@ export default {
         const resizedImage = await pica.resize(image, canvas, this.defaultPicaResizeOptions)
         const blob = await pica.toBlob(resizedImage, type, 0.90)
 
-        return new File([blob], file.name, { type })
+        const newFile = new File([blob], file.name, { type })
+
+        this.$qas.logger.group('QasUploader - resizeImage -> nova imagem', [newFile])
+
+        return newFile
       } catch {
         // Caso não consiga redimensionar retorna o arquivo original
         return file

package/src/helpers/camelize-fields-name.js

@@ -0,0 +1,15 @@
+import { camelize } from 'humps'
+
+export default function camelizeFieldsName (fields) {
+  for (const field in fields) {
+    const currentField = fields[field]
+
+    currentField.name = camelize(currentField.name)
+
+    if (Object.keys(currentField.children || {}).length) {
+      camelizeFieldsName(currentField.children)
+    }
+  }
+
+  return fields
+}

package/src/helpers/index.js

@@ -8,6 +8,7 @@ export { default as filterObject } from './filter-object.js'
 export { default as getGreatestCommonDivisor } from './get-greatest-common-divisor.js'
 export { default as filterObjectToArray } from './filter-object-to-array.js'
 export { default as filterListByHandle } from './filter-list-by-handle.js'
+export { default as camelizeFieldsName } from './camelize-fields-name.js'
 
 export * from './filters.js'
 export * from './images.js'

package/src/mixins/view.js

@@ -1,4 +1,4 @@
-import { camelize } from 'humps'
+import { camelizeFieldsName } from '../helpers'
 import { markRaw } from 'vue'
 
 export default {
@@ -101,11 +101,9 @@ export default {
     },
 
     mx_setFields (fields = {}) {
-      for (const field in fields) {
-        fields[field].name = camelize(fields[field].name)
-      }
+      const camelizedFields = camelizeFieldsName(fields)
 
-      this.mx_fields = markRaw(fields)
+      this.mx_fields = markRaw(camelizedFields)
     },
 
     mx_setMetadata (metadata = {}) {

package/src/plugins/index.js

@@ -1,11 +1,13 @@
 import Dialog from './dialog/Dialog.js'
+import Logger from './logger/Logger.js'
 import NotifyError from './notify-error/NotifyError.js'
 import NotifySuccess from './notify-success/NotifySuccess.js'
 import Screen from './screen/Screen.js'
 
 export {
   Dialog,
+  Logger,
   NotifyError,
-  Screen,
-  NotifySuccess
+  NotifySuccess,
+  Screen
 }

package/src/plugins/logger/Logger.js

@@ -0,0 +1,44 @@
+export default () => {
+  const isDebugEnabled = process.env.DEBUGGING
+
+  const normalizeMessage = msg => `%c ${msg}`
+  const getStyle = isError => (
+    `
+      background: ${isError ? '#C10015 ' : '#1976d2'};
+      font-weight: bold;
+      color: white;
+      padding: 6px 20px;
+      border-radius: 4px;
+      display: block;
+      width: 100%;
+      font-size: 12px;
+    `
+  )
+
+  return {
+    group (message, payload = [], { error } = {}) {
+      if (!isDebugEnabled) return
+
+      console.groupCollapsed(normalizeMessage(message), getStyle(error))
+
+      for (const item of payload) {
+        if (typeof item === 'string') {
+          console.info(normalizeMessage(item), getStyle(error))
+          continue
+        }
+
+        console.table(item)
+      }
+
+      console.groupEnd()
+    },
+
+    info (message) {
+      isDebugEnabled && console.info(normalizeMessage(message), getStyle())
+    },
+
+    error (message) {
+      isDebugEnabled && console.info(normalizeMessage(message), getStyle(true))
+    }
+  }
+}

package/src/plugins/logger/Logger.yml

@@ -0,0 +1,9 @@
+type: component
+
+meta:
+  desc: Plugin para adicionar loggers.
+
+inject:
+  'this.$qas.logger':
+    default: {}
+    type: Object

package/src/vue-plugin.js

@@ -55,7 +55,8 @@ import {
   Dialog,
   NotifyError,
   NotifySuccess,
-  Screen
+  Screen,
+  Logger
 } from './plugins'
 
 import packageInfo from '../package.json'
@@ -124,8 +125,9 @@ function install (app) {
   app.config.globalProperties.$qas = {
     dialog: Dialog,
     error: NotifyError,
-    success: NotifySuccess,
-    screen: Screen()
+    logger: Logger(),
+    screen: Screen(),
+    success: NotifySuccess
   }
 
   app.directive(Test.name, Test)
@@ -186,6 +188,7 @@ export {
 
   // plugins
   Dialog,
+  Logger,
   NotifyError,
   NotifySuccess,
   Screen,