quasar-ui-danx 0.0.29 → 0.0.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar-ui-danx",
-  "version": "0.0.29",
+  "version": "0.0.31",
   "author": "Dan <dan@flytedesk.com>",
   "description": "DanX Vue / Quasar component library",
   "license": "MIT",

package/src/components/ActionTable/ActionMenu.vue

@@ -1,11 +1,12 @@
 <template>
   <PopoverMenu
       class="px-4 h-full flex"
-      :items="items"
+      :items="activeItems"
       @action-item="onAction"
   />
 </template>
 <script setup>
+import { computed } from 'vue';
 import { performAction } from '../../helpers';
 import { PopoverMenu } from '../Utility';
 
@@ -15,15 +16,19 @@ const props = defineProps({
     type: Array,
     required: true
   },
-  rows: {
+  targets: {
     type: Array,
     required: true
   }
 });
 
+const activeItems = computed(() => props.items.filter(item => {
+  if (item.enabled === undefined) return true;
+  return typeof item.enabled === 'function' ? !!item.enabled(props.targets) : !!item.enabled;
+}));
 
 function onAction(item) {
   emit('action', item);
-  performAction(item, props.rows);
+  performAction(item, props.targets);
 }
 </script>

package/src/components/ActionTable/ActionTable.vue

@@ -52,6 +52,7 @@
         <component
             :is="rowProps.col.onClick ? 'a' : 'div'"
             class="flex items-center flex-nowrap"
+            :class="{'justify-end': rowProps.col.align === 'right', 'justify-center': rowProps.col.align === 'center', 'justify-start': rowProps.col.align === 'left'}"
             @click="() => rowProps.col.onClick && rowProps.col.onClick(rowProps.row)"
         >
           <RenderComponent
@@ -72,7 +73,7 @@
           <ActionMenu
               v-if="rowProps.col.actions" class="ml-2"
               :items="rowProps.col.actions"
-              :rows="[rowProps.row]"
+              :targets="[rowProps.row]"
               @action="(action) => $emit('action', {action: action, row: rowProps.row})"
           />
         </component>

package/src/components/ActionTable/listActions.ts

@@ -165,7 +165,7 @@ export function useListActions(name, {
      * @returns {Promise<Awaited<void>[]>}
      */
     async function refreshAll() {
-        return Promise.all([loadList(), loadSummary(), loadFilterFieldOptions()]);
+        return Promise.all([loadList(), loadSummary(), loadFilterFieldOptions(), getActiveItemDetails()]);
     }
 
     /**
@@ -260,19 +260,30 @@ export function useListActions(name, {
     // Controls the tab on the Ad Form
     const formTab = ref("general");
 
+    /**
+     * Gets the additional details for the currently active item.
+     * (ie: data that is not normally loaded in the list because it is not needed for the list view)
+     * @returns {Promise<void>}
+     */
+    async function getActiveItemDetails() {
+        if (!activeItem.value) return;
+        
+        const result = await itemDetailsRoute(activeItem.value);
+
+        // Only set the ad details if we are the response for the currently loaded item
+        // NOTE: race conditions might allow the finished loading item to be different to the currently
+        // requested item
+        if (result?.id === activeItem.value?.id) {
+            activeItem.value = result;
+        }
+    }
+
     // Whenever the active item changes, fill the additional item details
     // (ie: tasks, verifications, creatives, etc.)
     if (itemDetailsRoute) {
         watch(() => activeItem.value, async (newItem, oldItem) => {
             if (newItem && oldItem?.id !== newItem.id) {
-                const result = await itemDetailsRoute(newItem);
-
-                // Only set the ad details if we are the response for the currently loaded item
-                // NOTE: race conditions might allow the finished loading item to be different to the currently
-                // requested item
-                if (result?.id === activeItem.value?.id) {
-                    activeItem.value = result;
-                }
+                await getActiveItemDetails();
             }
         });
     }

package/src/helpers/performAction.ts

@@ -18,17 +18,20 @@ export function usePerformAction(actions: any[]) {
          *
          * @param name - can either be a string or an action object
          * @param targets - an array of targets (or a single target object)
+         * @param options
          * @returns {Promise<void>}
          */
-        async performAction(name, targets) {
+        async performAction(name, targets, options = {}) {
             const action = typeof name === "string" ? actions.find(a => a.name === name) : name;
             if (!action) {
                 throw new Error(`Unknown action: ${name}`);
             }
             targets = Array.isArray(targets) ? targets : [targets];
 
-            await performAction(action, targets);
-        }
+            await performAction({ ...action, ...options }, targets);
+        },
+
+        batchActions: actions.filter(a => a.batch)
     };
 }