@bildvitta/quasar-ui-asteroid 3.9.0 → 3.10.0-beta.1

package/src/mixins/search-filter.js

@@ -1,6 +1,5 @@
 import { decamelize } from 'humps'
 import { isEqual } from 'lodash'
-import { getNormalizedOptions } from '../helpers'
 import { getAction } from '@bildvitta/store-adapter'
 
 export default {
@@ -20,11 +19,11 @@ export default {
       type: String
     },
 
-    useLazyLoading: {
+    fetching: {
       type: Boolean
     },
 
-    fetching: {
+    useLazyLoading: {
       type: Boolean
     }
   },
@@ -38,12 +37,15 @@ export default {
 
   data () {
     return {
+      mx_cachedOptions: [],
+      mx_fetchCount: 0,
       mx_filteredOptions: [],
+      mx_foundDuplicatedOptions: [],
+      mx_fromSearch: false,
       mx_hasFetchError: false,
       mx_isFetching: false,
       mx_isScrolling: false,
       mx_search: '',
-      mx_fetchCount: 0,
       mx_pagination: {
         page: 1,
         lastPage: null,
@@ -77,10 +79,6 @@ export default {
       return !!this.mx_filteredOptions.length
     },
 
-    mx_isFilterByFuse () {
-      return !this.useLazyLoading
-    },
-
     mx_isMultiple () {
       return this.$attrs.multiple || this.$attrs.multiple === ''
     }
@@ -101,11 +99,24 @@ export default {
   methods: {
     async mx_filterOptionsByStore (search) {
       this.mx_resetFilter(search)
-      await this.mx_setFetchOptions()
+
+      this.mx_fromSearch = !!search
+
+      const options = await this.mx_fetchOptions()
+
+      this.mx_resetOptions()
+
+      this.mx_filteredOptions.push(...options)
+
+      if (this.mx_cachedOptions.length && !search) this.mx_setInitialCachedOptions()
     },
 
-    mx_resetFilter (search) {
+    mx_resetOptions () {
       this.mx_filteredOptions = []
+      this.mx_foundDuplicatedOptions = []
+    },
+
+    mx_resetFilter (search) {
       this.mx_search = search
       this.mx_pagination = {
         page: 1,
@@ -180,14 +191,8 @@ export default {
 
         this.$emit('fetch-options-success', data)
 
-        return this.mx_handleOptions(results)
+        return this.mx_getNonDuplicatedOptions(results)
       } catch (error) {
-        this.$qas.logger.group(
-          `Mixin: searchFilterMixin - mx_fetchOptions -> exceção da action ${this.entity}/fetchFieldOptions`,
-          [error],
-          { error: true }
-        )
-
         this.mx_hasFetchError = true
         this.$emit('fetch-options-error', error)
 
@@ -199,7 +204,48 @@ export default {
     },
 
     async mx_setFetchOptions () {
-      this.mx_filteredOptions = await this.mx_fetchOptions()
+      const options = await this.mx_fetchOptions()
+
+      this.mx_filteredOptions.push(...options)
+    },
+
+    mx_setInitialCachedOptions () {
+      this.mx_cachedOptions.forEach(cachedOption => {
+        const hasOption = this.mx_filteredOptions.find(filteredOption => {
+          return filteredOption.value === cachedOption.value
+        })
+
+        if (!hasOption && this.mx_filteredOptions.length) {
+          this.mx_filteredOptions.unshift(cachedOption)
+        }
+      })
+    },
+
+    mx_getNonDuplicatedOptions (options = []) {
+      if (this.mx_fromSearch) {
+        this.mx_fromSearch = false
+
+        return options
+      }
+
+      if (!options.length) return []
+
+      const nonDuplicatedOptions = [...options]
+
+      this.mx_cachedOptions.forEach(cachedOption => {
+        if (this.mx_foundDuplicatedOptions.includes(cachedOption.value)) return
+
+        const duplicatedOptionIndex = nonDuplicatedOptions.findIndex(option => {
+          return option.value === cachedOption.value
+        })
+
+        if (~duplicatedOptionIndex) {
+          this.mx_foundDuplicatedOptions.push(cachedOption.value)
+          nonDuplicatedOptions.splice(duplicatedOptionIndex, 1)
+        }
+      })
+
+      return nonDuplicatedOptions
     },
 
     mx_canFetchOptions () {
@@ -210,18 +256,6 @@ export default {
       return hasMorePages && !this.mx_isFetching && !this.mx_isScrolling && this.useLazyLoading
     },
 
-    mx_handleOptions (options) {
-      if (this.labelKey && this.valueKey) {
-        return getNormalizedOptions({
-          options,
-          label: this.labelKey,
-          value: this.valueKey
-        })
-      }
-
-      return options
-    },
-
     mx_getMissingPropsMessage (prop) {
       return `A propriedade "${prop}" é obrigatória quando a propriedade "useLazyLoading" está ativa.`
     },
@@ -232,6 +266,15 @@ export default {
 
     mx_getNormalizedFuseResults (results = []) {
       return results.map(({ item }) => item)
+    },
+
+    mx_setCachedOptions (model) {
+      this.$watch(model, options => {
+        if (!options?.length) return
+
+        this.mx_filteredOptions = [...options]
+        this.mx_cachedOptions = [...options]
+      }, { immediate: true })
     }
   }
 }

package/src/vue-plugin.js

@@ -13,12 +13,15 @@ import QasBtnDropdown from './components/btn-dropdown/QasBtnDropdown.vue'
 import QasCard from './components/card/QasCard.vue'
 import QasCheckboxGroup from './components/checkbox-group/QasCheckboxGroup.vue'
 import QasCopy from './components/copy/QasCopy.vue'
+import QasDate from './components/date/QasDate.vue'
 import QasDateTimeInput from './components/date-time-input/QasDateTimeInput.vue'
 import QasDebugger from './components/debugger/QasDebugger.vue'
 import QasDelete from './components/delete/QasDelete.vue'
 import QasDialog from './components/dialog/QasDialog.vue'
 import QasDialogRouter from './components/dialog-router/QasDialogRouter.vue'
+import QasEmptyResultText from './components/empty-result-text/QasEmptyResultText.vue'
 import QasField from './components/field/QasField.vue'
+import QasSearchInput from './components/search-input/QasSearchInput.vue'
 import QasFilters from './components/filters/QasFilters.vue'
 import QasFormGenerator from './components/form-generator/QasFormGenerator.vue'
 import QasFormView from './components/form-view/QasFormView.vue'
@@ -93,12 +96,15 @@ function install (app) {
   app.component('QasCard', QasCard)
   app.component('QasCheckboxGroup', QasCheckboxGroup)
   app.component('QasCopy', QasCopy)
+  app.component('QasDate', QasDate)
   app.component('QasDateTimeInput', QasDateTimeInput)
   app.component('QasDebugger', QasDebugger)
   app.component('QasDelete', QasDelete)
   app.component('QasDialog', QasDialog)
   app.component('QasDialogRouter', QasDialogRouter)
+  app.component('QasEmptyResultText', QasEmptyResultText)
   app.component('QasField', QasField)
+  app.component('QasSearchInput', QasSearchInput)
   app.component('QasFilters', QasFilters)
   app.component('QasFormGenerator', QasFormGenerator)
   app.component('QasFormView', QasFormView)
@@ -174,12 +180,15 @@ export {
   QasCard,
   QasCheckboxGroup,
   QasCopy,
+  QasDate,
   QasDateTimeInput,
   QasDebugger,
   QasDelete,
   QasDialog,
   QasDialogRouter,
+  QasEmptyResultText,
   QasField,
+  QasSearchInput,
   QasFilters,
   QasFormGenerator,
   QasFormView,