@ramathibodi/nuxt-commons 0.1.37 → 0.1.38

package/dist/module.json

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

package/dist/runtime/components/ExportCSV.vue

@@ -1,43 +1,76 @@
 <script lang="ts" setup>
-import {ref} from 'vue'
+import { ref } from 'vue'
 import * as XLSX from 'xlsx'
-import {VBtn} from 'vuetify/components/VBtn'
-import {useAlert} from '../composables/alert'
+import { VBtn } from 'vuetify/components/VBtn'
+import { useAlert } from '../composables/alert'
 
 interface ExportButtonProps extends /* @vue-ignore */ InstanceType<typeof VBtn['$props']> {
   fileName?: string
+  sheetName?: string
   modelValue?: object[]
 }
 
 const props = withDefaults(defineProps<ExportButtonProps>(), {
   fileName: 'download',
+  sheetName: 'Sheet1',
 })
 
 const alert = useAlert()
 const loading = ref(false)
 
+/**
+ * Triggers file export
+ */
 function exportFile() {
-  if (props.modelValue && Array.isArray(props.modelValue)) {
+  if (props.modelValue && Array.isArray(props.modelValue) && props.modelValue.length > 0) {
     loading.value = true
-    const workbook = XLSX.utils.book_new()
-    const worksheet = XLSX.utils.json_to_sheet(serializeRoleField(props.modelValue))
-    const fileName = `${props.fileName}.xlsx`
-    XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1')
-    XLSX.writeFile(workbook, fileName)
-    loading.value = false
-  }
-  else {
+
+    try {
+      const workbook = XLSX.utils.book_new()
+      const worksheet = XLSX.utils.json_to_sheet(flattenNestedFields(props.modelValue))
+      const fileName = `${props.fileName}.xlsx`
+
+      XLSX.utils.book_append_sheet(workbook, worksheet, props.sheetName)
+      XLSX.writeFile(workbook, fileName)
+    } catch (error: any) {
+      alert?.addAlert({ message: `Export failed: ${error.message}`, alertType: 'error' })
+    } finally {
+      loading.value = false
+    }
+  } else {
     alert?.addAlert({ message: 'Invalid or no data to export', alertType: 'error' })
   }
 }
 
-const serializeRoleField = (items: any) => {
-  return items.map((item:any) => {
-    if (item.properties && typeof item.properties === 'object') {
-      item.properties = JSON.stringify(item.properties);
+/**
+ * Recursively flattens nested fields for export
+ * @param items - Array of objects to flatten
+ */
+function flattenNestedFields(items: any[]) {
+  return items.map((item: any) => {
+    return flattenObject(item)
+  })
+}
+
+/**
+ * Recursively flattens an object, converting nested keys into dot-separated keys
+ * @param obj - Object to flatten
+ * @param parentKey - Parent key (for recursion)
+ * @param separator - Separator for nested keys
+ */
+function flattenObject(obj: any, parentKey = '', separator = '.') {
+  return Object.keys(obj).reduce((acc: any, key: string) => {
+    const newKey = parentKey ? `${parentKey}${separator}${key}` : key
+    const value = obj[key]
+
+    if (value && typeof value === 'object' && !Array.isArray(value)) {
+      Object.assign(acc, flattenObject(value, newKey, separator))
+    } else {
+      acc[newKey] = typeof value === 'object' ? JSON.stringify(value) : value
     }
-    return item;
-  });
+
+    return acc
+  }, {})
 }
 </script>
 

package/dist/runtime/components/ImportCSV.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import * as XLSX from 'xlsx'
-import {ref} from 'vue'
-import {useAlert} from '../composables/alert'
+import { ref } from 'vue'
+import { useAlert } from '../composables/alert'
 
 const alert = useAlert()
 const emit = defineEmits<{
@@ -23,15 +23,17 @@ function uploadedFile(files: File[] | File | undefined) {
 
   const fileExtension = files.name.slice(files.name.lastIndexOf('.')).toLowerCase()
   if (!['.xlsx', '.csv'].includes(fileExtension)) {
-    alert?.addAlert({ message: 'Please upload a file with .csv or .xlsx extension only (' + files.name + ')', alertType: 'error' })
+    alert?.addAlert({ message: `Please upload a file with .csv or .xlsx extension only (${files.name})`, alertType: 'error' })
     return
   }
 
   const reader = new FileReader()
   reader.onload = (e: ProgressEvent<FileReader>) => {
     const workbook = XLSX.read(e.target?.result)
-    const parseData = parsePropertiesField(XLSX.utils.sheet_to_json(workbook.Sheets[workbook.SheetNames[0]]))
-    emit('import', parseData)
+    const parsedData = parseAndAggregateColumns(
+        XLSX.utils.sheet_to_json(workbook.Sheets[workbook.SheetNames[0]])
+    )
+    emit('import', parsedData)
     loading.value = false
     fileBtnRef.value.reset()
   }
@@ -39,14 +41,63 @@ function uploadedFile(files: File[] | File | undefined) {
   reader.readAsArrayBuffer(files)
 }
 
-const parsePropertiesField = (items:any) => {
-  return items.map((item : any) => {
-    if (item.properties && typeof item.properties === 'string') {
-      item.properties = JSON.parse(item.properties);
+/**
+ * Recursively aggregates nested columns and properties.
+ * @param items - Array of data from the Excel sheet
+ */
+const parseAndAggregateColumns = (items: any[]) => {
+  return items.map((item: any) => {
+    const aggregatedItem: any = {}
+
+    for (const key in item) {
+      if (key.includes('.')) {
+        // Extract root key and subKey
+        const [rootKey, ...subKeys] = key.split('.')
+
+        // Recursively aggregate subKeys
+        aggregatedItem[rootKey] = aggregatedItem[rootKey] || {}
+        assignNestedValue(aggregatedItem[rootKey], subKeys, parseIfJson(item[key]))
+      } else {
+        // Directly assign root-level properties
+        aggregatedItem[key] = parseIfJson(item[key])
+      }
     }
-    return item;
-  });
-};
+
+    return aggregatedItem
+  })
+}
+
+/**
+ * Recursively assigns a value to a nested key structure.
+ * @param obj - The object to assign to
+ * @param keys - Array of keys leading to the final property
+ * @param value - The value to assign
+ */
+const assignNestedValue = (obj: any, keys: string[], value: any) => {
+  const [currentKey, ...remainingKeys] = keys
+  if (remainingKeys.length === 0) {
+    obj[currentKey] = value
+  } else {
+    obj[currentKey] = obj[currentKey] || {}
+    assignNestedValue(obj[currentKey], remainingKeys, value)
+  }
+}
+
+/**
+ * Attempt to parse a value as JSON or array.
+ * @param value - The value to parse
+ */
+const parseIfJson = (value: any) => {
+  if (typeof value === 'string') {
+    try {
+      return JSON.parse(value)
+    } catch {
+      // If parsing fails, return the original value
+      return value
+    }
+  }
+  return value
+}
 </script>
 
 <template>