@ramathibodi/nuxt-commons 0.1.31 → 0.1.33

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "0.1.31",
+  "version": "0.1.33",
   "builder": {
     "@nuxt/module-builder": "0.8.3",
     "unbuild": "2.0.0"

package/dist/runtime/components/form/Iterator.vue

@@ -19,6 +19,7 @@ interface Props extends /* @vue-ignore */ InstanceType<typeof VDataIterator['$pr
   toolbarColor?: string
   importable?: boolean
   exportable?: boolean
+  insertable?: boolean
 
   viewSwitch?: boolean
   viewSwitchMultiple?: boolean
@@ -39,6 +40,7 @@ const props = withDefaults(defineProps<Props>(), {
   toolbarColor: 'primary',
   importable: true,
   exportable: true,
+  insertable: true,
 
   viewSwitch: false,
   viewSwitchMultiple:false,
@@ -46,8 +48,8 @@ const props = withDefaults(defineProps<Props>(), {
   cols: 12,
   xxl: false,
   xl: false,
-  lg: false,
-  md: 2,
+  lg: 2,
+  md: 4,
   sm: 6,
   itemsPerPage: 12,
 })
@@ -308,6 +310,7 @@ const operation = ref({ openDialog, createItem, updateItem, deleteItem, moveUpIt
                   :color="toolbarColor"
               />
               <VBtn
+                  v-if="props.insertable"
                   :color="toolbarColor"
                   prepend-icon="mdi:mdi-plus"
                   variant="flat"
@@ -316,7 +319,7 @@ const operation = ref({ openDialog, createItem, updateItem, deleteItem, moveUpIt
                 add
               </VBtn>
               <v-row align="center" class="mr-2 ml-2" v-if="viewSwitch">
-                <v-btn-toggle v-model="viewType" :multiple="viewSwitchMultiple">
+                <v-btn-toggle v-model="viewType" :multiple="viewSwitchMultiple" mandatory>
                   <v-btn icon="mdi mdi-view-grid-outline" value="iterator"></v-btn>
                   <v-btn icon="mdi mdi-table-large" value="table"></v-btn>
                 </v-btn-toggle>

package/dist/runtime/components/form/Table.vue

@@ -18,6 +18,7 @@ interface Props extends /* @vue-ignore */ InstanceType<typeof VDataTable['$props
   toolbarColor?: string
   importable?: boolean
   exportable?: boolean
+  insertable?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -27,6 +28,7 @@ const props = withDefaults(defineProps<Props>(), {
   toolbarColor: 'primary',
   importable: true,
   exportable: true,
+  insertable: true,
 })
 
 const emit = defineEmits(['update:modelValue'])
@@ -158,11 +160,11 @@ const operation = ref({ openDialog, createItem, updateItem, deleteItem, moveUpIt
   <v-card>
     <VToolbar :color="toolbarColor">
       <v-row
-        justify="end"
-        class="ma-1"
-        dense
-        no-gutters
-        align="center"
+          justify="end"
+          class="ma-1"
+          dense
+          no-gutters
+          align="center"
       >
         <v-col cols="7">
           <VToolbarTitle class="pl-3">
@@ -174,13 +176,13 @@ const operation = ref({ openDialog, createItem, updateItem, deleteItem, moveUpIt
         <v-col cols="5">
           <slot name="search">
             <VTextField
-              v-model="search"
-              class="justify-end w-100"
-              density="compact"
-              hide-details
-              placeholder="ค้นหา"
-              clearable
-              variant="solo"
+                v-model="search"
+                class="justify-end w-100"
+                density="compact"
+                hide-details
+                placeholder="ค้นหา"
+                clearable
+                variant="solo"
             />
           </slot>
         </v-col>
@@ -189,25 +191,26 @@ const operation = ref({ openDialog, createItem, updateItem, deleteItem, moveUpIt
       <VToolbarItems>
         <slot name="toolbarItems" />
         <ImportCSV
-          v-if="props.importable"
-          icon="mdi:mdi-file-upload"
-          variant="flat"
-          @import="importItems"
-          :color="toolbarColor"
+            v-if="props.importable"
+            icon="mdi:mdi-file-upload"
+            variant="flat"
+            @import="importItems"
+            :color="toolbarColor"
         />
         <ExportCSV
-          v-if="props.exportable && items.length"
-          icon="mdi:mdi-file-download"
-          variant="flat"
-          :file-name="title"
-          :model-value="items"
-          :color="toolbarColor"
+            v-if="props.exportable && items.length"
+            icon="mdi:mdi-file-download"
+            variant="flat"
+            :file-name="title"
+            :model-value="items"
+            :color="toolbarColor"
         />
         <VBtn
-          :color="toolbarColor"
-          prepend-icon="mdi:mdi-plus"
-          variant="flat"
-          @click="openDialog()"
+            v-if="props.insertable"
+            :color="toolbarColor"
+            prepend-icon="mdi:mdi-plus"
+            variant="flat"
+            @click="openDialog()"
         >
           add
         </VBtn>
@@ -258,13 +261,13 @@ const operation = ref({ openDialog, createItem, updateItem, deleteItem, moveUpIt
       </template>
     </v-data-table>
     <FormDialog
-      v-model="isDialogOpen"
-      :title="title"
-      :fullscreen="dialogFullscreen"
-      :initial-data="initialData"
-      :form-data="currentItem"
-      @create="createItem"
-      @update="updateItem"
+        v-model="isDialogOpen"
+        :title="title"
+        :fullscreen="dialogFullscreen"
+        :initial-data="initialData"
+        :form-data="currentItem"
+        @create="createItem"
+        @update="updateItem"
     >
       <template #default="slotData">
         <slot

package/dist/runtime/components/form/images/Field.vue

@@ -175,7 +175,6 @@ onMounted(() => {
     })
   }
 })
-
 </script>
 
 <template>
@@ -224,7 +223,7 @@ onMounted(() => {
             </VToolbar>
             <v-img
                 :src="image.data"
-                @click="readonly ? openImageFullScreen(image) : setDataUpdate(image)"
+                @click="() => { (readonly) ? openImageFullScreen(image) : setDataUpdate(image)}"
                 height="250"
             />
           </VCard>

package/dist/runtime/components/model/iterator.vue

@@ -52,8 +52,8 @@ const props = withDefaults(defineProps<Props & GraphqlModelProps>(), {
   cols: 12,
   xxl: false,
   xl: false,
-  lg: false,
-  md: 2,
+  lg: 2,
+  md: 4,
   sm: 6,
   itemsPerPage: 12,
 })

package/dist/runtime/composables/document/template.js

@@ -28,7 +28,7 @@ function templateItemToString(item) {
     }
     if (item.inputType == "VRadio" || item.inputType == "VRadioInline") {
       const choice = optionStringToChoiceObject(item.inputOptions);
-      optionString = choice.map((choiceItem) => `<v-radio label="${choiceItem.label}" value="${choiceItem.value}"></v-radio>`).join("");
+      optionString = choice.map((choiceItem) => `<v-radio label="${choiceItem.label}" value="${choiceItem.value}" ${item.inputAttributes ? " " + item.inputAttributes : ""}></v-radio>`).join("");
     }
     if (item.inputType == "Header") {
       optionString = item.inputOptions.split(",").join(" ");

package/dist/runtime/composables/graphqlModel.js

@@ -3,6 +3,7 @@ import { watchDebounced } from "@vueuse/core";
 import { useAlert } from "./alert.js";
 import { buildRequiredInputFields } from "./graphqlOperation.js";
 import { useGraphqlModelOperation } from "./graphqlModelOperation.js";
+import pLimit from "p-limit";
 export function useGraphqlModel(props) {
   const alert = useAlert();
   const items = ref([]);
@@ -69,21 +70,19 @@ export function useGraphqlModel(props) {
   }
   function importItems(importItems2, callback) {
     isLoading.value = true;
-    const importPromise = [];
-    importItems2.forEach((item) => {
-      if (item[props.modelKey || "id"]) {
-        importPromise.push(operationUpdate.value?.call(fields.value, { input: item }).then((result) => {
+    const limit = pLimit(50);
+    const importPromises = importItems2.map(
+      (item) => limit(
+        () => (item[props.modelKey || "id"] ? operationUpdate.value?.call(fields.value, { input: item }).then((result) => {
           if (!result) {
             return createItem(Object.assign({}, props.initialData, item), void 0, true);
           }
-        }).catch((error) => {
+        }) : createItem(Object.assign({}, props.initialData, item), void 0, true)).catch((error) => {
           alert?.addAlert({ alertType: "error", message: error });
-        }));
-      } else {
-        importPromise.push(createItem(Object.assign({}, props.initialData, item), void 0, true));
-      }
-    });
-    Promise.all(importPromise).finally(() => {
+        })
+      )
+    );
+    Promise.all(importPromises).finally(() => {
       isLoading.value = false;
       reload();
       if (callback) callback.done();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ramathibodi/nuxt-commons",
-  "version": "0.1.31",
+  "version": "0.1.33",
   "description": "Ramathibodi Nuxt modules for common components",
   "repository": {
     "type": "git",
@@ -83,6 +83,7 @@
     "lodash": "^4.17.21",
     "luxon": "^3.5.0",
     "maska": "^2.1.11",
+    "p-limit": "^6.1.0",
     "painterro": "^1.2.87",
     "pdf-vue3": "^1.0.12",
     "prettier": "3.3.2",
@@ -114,5 +115,5 @@
     "vitest": "^1.6.0",
     "vue-tsc": "2.0.29"
   },
-  "packageManager": "pnpm@9.12.2+sha512.22721b3a11f81661ae1ec68ce1a7b879425a1ca5b991c975b074ac220b187ce56c708fe5db69f4c962c989452eee76c82877f4ee80f474cebd61ee13461b6228"
+  "packageManager": "pnpm@9.12.3+sha512.cce0f9de9c5a7c95bef944169cc5dfe8741abfb145078c0d508b868056848a87c81e626246cb60967cbd7fd29a6c062ef73ff840d96b3c86c40ac92cf4a813ee"
 }