atom-nuxt 1.4.5 → 1.4.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/module.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@atomengine/atom-nuxt",
3
3
  "configKey": "atomNuxt",
4
- "version": "1.4.5",
4
+ "version": "1.4.9",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "1.0.1",
7
7
  "unbuild": "3.5.0"
@@ -245,7 +245,7 @@ const dialogOpen = computed({
245
245
  }
246
246
  });
247
247
  const page = computed(() => props.loaderKey ? parseQuery(route.query[props.loaderKey])?.page ?? 1 : route.query.page ?? 1);
248
- const filterValues = props.loaderKey ? ref({ ...props.customFilters, ...parseQuery(route.query[props.loaderKey]) }) : ref({ ...props.customFilters, ...route.query });
248
+ const filterValues = props.loaderKey ? ref({ fromPaginatedLoader: true, ...props.customFilters, ...parseQuery(route.query[props.loaderKey]) }) : ref({ ...props.customFilters, ...route.query });
249
249
  const isInitialLoad = ref(true);
250
250
  const onQueryChange = (page2) => {
251
251
  console.error("QUERY CHANGED");
@@ -470,61 +470,71 @@ const exportAction = async () => {
470
470
  >
471
471
  </slot>
472
472
  <div :class="contentClasses">
473
- <v-progress-linear :active="listPending && !isInitialLoad" indeterminate color="primary"></v-progress-linear>
474
473
  <v-row>
475
474
  <v-col v-if="!hideFilters && (filters.length > 0 || isInitialLoad)" cols="12" md="3">
476
475
  <div>
477
- <div v-if="isInitialLoad">
478
- <v-skeleton-loader
479
- type="heading, list-item, list-item, list-item"
480
- class="mb-3"
481
- ></v-skeleton-loader>
482
- </div>
483
- <template v-else>
484
- <slot name="filtersTitle">
485
- <h3 v-if="filtersTitle" class="mb-2">{{ filtersTitle }}</h3>
486
- </slot>
487
- <slot name="filters" :filters="filters">
488
- <div :class="filterClasses">
489
- <crud-filter-list v-model="filterValues" :filters="filters"></crud-filter-list>
490
- </div>
491
- </slot>
492
- </template>
476
+ <Transition name="fade" mode="out-in">
477
+ <div v-if="isInitialLoad" key="skeleton">
478
+ <v-skeleton-loader
479
+ type="heading, list-item, list-item, list-item"
480
+ class="mb-3"
481
+ ></v-skeleton-loader>
482
+ </div>
483
+ <div v-else key="content">
484
+ <slot name="filtersTitle">
485
+ <h3 v-if="filtersTitle" class="mb-2">{{ filtersTitle }}</h3>
486
+ </slot>
487
+ <slot name="filters" :filters="filters">
488
+ <div :class="filterClasses">
489
+ <crud-filter-list v-model="filterValues" :filters="filters"></crud-filter-list>
490
+ </div>
491
+ </slot>
492
+ </div>
493
+ </Transition>
493
494
  </div>
494
495
  </v-col>
495
496
  <v-col cols="12" :md="hideFilters || (filters.length === 0 && !isInitialLoad) ? '12' : '9'">
497
+ <v-progress-linear :active="listPending && !isInitialLoad" indeterminate color="primary"></v-progress-linear>
496
498
  <div class="">
497
- <div v-if="isInitialLoad">
498
- <v-skeleton-loader
499
- type="heading, card, card, card"
500
- class="mb-3"
501
- ></v-skeleton-loader>
502
- </div>
503
- <template v-else>
504
- <slot name="resultsTitle">
505
- <h3 v-if="resultsTitle" class="mb-2">{{ resultsTitle }}</h3>
506
- </slot>
507
- <slot v-if="!listPending && totalItems === 0 && !hasListErrors" name="empty" :create-action="createForm">
508
- <v-alert icon="mdi-playlist-remove" type="info" class="pa-5">
509
- {{ noResultsText }}
510
- </v-alert>
511
- </slot>
512
- <slot v-if="hasListErrors" name="error" :errors="listErrors">
513
- <crud-error-display :errors="listErrors"></crud-error-display>
514
- </slot>
515
- <div :class="resultClasses">
516
- <slot
517
- v-if="totalItems > 0"
518
- :items="items"
519
- :pending="listPending"
520
- :update-action="updateForm"
521
- :view-action="viewForm"
522
- :delete-action="deleteForm"
523
- :form-pending="formPending"
524
- >
499
+ <Transition name="fade" mode="out-in">
500
+ <div v-if="isInitialLoad" key="skeleton">
501
+ <v-skeleton-loader
502
+ type="heading, card, card, card"
503
+ class="mb-3"
504
+ ></v-skeleton-loader>
505
+ </div>
506
+ <div v-else key="content">
507
+ <slot name="resultsTitle">
508
+ <h3 v-if="resultsTitle" class="mb-2">{{ resultsTitle }}</h3>
509
+ </slot>
510
+ <slot v-if="!listPending && totalItems === 0 && !hasListErrors" name="empty" :create-action="createForm">
511
+ <v-alert icon="mdi-playlist-remove" type="info" class="pa-5">
512
+ {{ noResultsText }}
513
+ </v-alert>
514
+ </slot>
515
+ <slot v-if="hasListErrors" name="error" :errors="listErrors">
516
+ <crud-error-display :errors="listErrors"></crud-error-display>
525
517
  </slot>
518
+ <div
519
+ :class="resultClasses"
520
+ :style="{
521
+ opacity: listPending && !isInitialLoad && totalItems > 0 ? 0.6 : 1,
522
+ transition: 'opacity 0.3s ease'
523
+ }"
524
+ >
525
+ <slot
526
+ v-if="totalItems > 0"
527
+ :items="items"
528
+ :pending="listPending"
529
+ :update-action="updateForm"
530
+ :view-action="viewForm"
531
+ :delete-action="deleteForm"
532
+ :form-pending="formPending"
533
+ >
534
+ </slot>
535
+ </div>
526
536
  </div>
527
- </template>
537
+ </Transition>
528
538
  </div>
529
539
  <div v-if="totalItems > 0 && totalPages > 1" class="pa-3">
530
540
  <span class="d-none d-md-block pa-3">Page {{ currentPage }} of {{ totalPages }} pages with {{ totalItems }} items</span>
@@ -574,3 +584,7 @@ const exportAction = async () => {
574
584
 
575
585
  </div>
576
586
  </template>
587
+
588
+ <style scoped>
589
+ .fade-enter-active,.fade-leave-active{transition:opacity .3s ease}.fade-enter-from,.fade-leave-to{opacity:0}
590
+ </style>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "atom-nuxt",
3
- "version": "1.4.5",
3
+ "version": "1.4.9",
4
4
  "description": "My new Nuxt module",
5
5
  "repository": "atomengine/atom-nuxt",
6
6
  "license": "MIT",