easycomponentstools 1.0.0-dev.9 → 1.0.1

package/.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "easycomponentstools",
     "private": false,
-    "version": "1.0.0-dev.9",
+    "version": "1.0.1",
     "type": "module",
     "description": "Easy Vue Components",
     "keywords": [
@@ -50,10 +50,9 @@
     },
     "dependencies": {
         "@mdi/font": "^7.4.47",
-        "@tmcw/togeojson": "^7.1.2",
         "@types/google.maps": "^3.65.0",
         "json-as-xlsx": "^2.5.6",
-        "lucide-static": "^0.426.0",
+        "lucide-static": "^0.577.0",
         "moment-timezone": "^0.6.2",
         "pdfmake": "^0.3.6",
         "print-js": "^1.6.0",

package/src/components/Form/types/map/CustomMapAutoComplete.vue

@@ -13,7 +13,7 @@
     >
         <template #append-inner>
             <v-btn elevation="0" @click="search">
-                <i class="icon-search" style="color: #282828" />
+                <i class="icon icon-search" style="color: #282828" />
             </v-btn>
         </template>
     </v-autocomplete>

package/src/components/Table/EasyTable.vue

@@ -150,8 +150,10 @@ const deletion = (id: string | number) => {
     })
         .then(async (response) => {
             if (!response.ok) {
-                const err = await response.json()
-                return await Promise.reject(err)
+                throw {
+                    statusCode: response.status,
+                    data: await response.json(),
+                }
             }
             return response.json()
         })
@@ -173,8 +175,10 @@ const multipleDelete = () => {
     })
         .then(async (response) => {
             if (!response.ok) {
-                const err = await response.json()
-                return await Promise.reject(err)
+                throw {
+                    statusCode: response.status,
+                    data: await response.json(),
+                }
             }
             return response.json()
         })
@@ -201,8 +205,10 @@ const getData = async () => {
     fetch(`${props.api.get}?${params}`, { method: 'GET' })
         .then(async (response) => {
             if (!response.ok) {
-                const err = await response.json()
-                return await Promise.reject(err)
+                throw {
+                    statusCode: response.status,
+                    data: await response.json(),
+                }
             }
             return response.json()
         })

package/src/components/Table/Headers/DialogColumns.vue

@@ -7,7 +7,7 @@
                 style="margin-left: -14px"
                 class="text-md-body-large"
             >
-                <i class="icon-columns-3 mr-1" /> {{ $i18n.t('message.columns') }}
+                <i class="icon icon-columns-3 mr-1" /> {{ $i18n.t('table.columns') }}
             </v-btn>
         </template>
         <v-card class="list_draggable" @mousemove="onDragMove">

package/src/components/Table/Headers/ExportData.vue

@@ -1,19 +1,19 @@
 <template>
     <div>
         <v-list-item :disabled="disabledComputed" @click="$useDataTableExport.exportData('pdf')">
-            <i class="icon-file-sliders" /> PDF
+            <i class="icon icon-file-sliders" /> PDF
         </v-list-item>
         <v-list-item :disabled="disabledComputed" @click="$useDataTableExport.exportData('csv')">
-            <i class="icon-file-sliders" /> CSV
+            <i class="icon icon-file-sliders" /> CSV
         </v-list-item>
         <v-list-item :disabled="disabledComputed" @click="$useDataTableExport.exportData('xlsx')">
-            <i class="icon-file-sliders" /> EXCEL
+            <i class="icon icon-file-sliders" /> EXCEL
         </v-list-item>
         <v-list-item :disabled="disabledComputed" @click="$useDataTableExport.exportData('word')">
-            <i class="icon-file-sliders" /> WORD
+            <i class="icon icon-file-sliders" /> WORD
         </v-list-item>
         <v-list-item :disabled="disabledComputed" @click="$useDataTableExport.exportData('print')">
-            <i class="icon-file-sliders" /> {{ $i18n.t('table.print') }}
+            <i class="icon icon-file-sliders" /> {{ $i18n.t('table.print') }}
         </v-list-item>
     </div>
 </template>

package/src/components/Table/Headers/Filters.vue

@@ -7,7 +7,7 @@
             class="mr-2"
             @click="clear"
         >
-            <i class="icon-funnel-x"></i>
+            <i class="icon icon-funnel-x"></i>
         </v-btn>
         <v-btn
             v-bind="props"
@@ -15,7 +15,7 @@
             :width="active_filters.length === 0 ? '100%' : '50%'"
             @click="dialog = true"
         >
-            <i class="icon-funnel mr-1"></i> {{ $i18n.t('table.filters') }}
+            <i class="icon icon-funnel mr-1"></i> {{ $i18n.t('table.filters') }}
         </v-btn>
         <v-dialog v-model="dialog" width="600">
             <v-card>
@@ -104,12 +104,12 @@
                     <v-row>
                         <v-col class="d-flex justify-start">
                             <v-btn color="error" variant="flat" @click="dialog = false">
-                                {{ $i18n.t('message.cancel') }}
+                                {{ $i18n.t('table.cancel') }}
                             </v-btn>
                         </v-col>
                         <v-col class="d-flex justify-end">
                             <v-btn color="success" variant="flat" @click="submit">
-                                {{ $i18n.t('message.submit') }}
+                                {{ $i18n.t('table.submit') }}
                             </v-btn>
                         </v-col>
                     </v-row>

package/src/components/Table/Headers/Headers.vue

@@ -18,7 +18,7 @@
         </v-col>
         <v-col cols="12" md="12" lg="2" sm="12" class="d-flex justify-end">
             <v-btn v-if="create" color="primary" width="100%" @click="create">
-                <i class="icon-plus" /> {{ $i18n.t('table.create') }}
+                <i class="icon icon-plus" /> {{ $i18n.t('table.create') }}
             </v-btn>
         </v-col>
         <v-col cols="12" md="12" lg="2" sm="12" class="d-flex justify-end">
@@ -42,17 +42,20 @@
                     <slot name="moreActions"></slot>
                     <ExportData
                         v-if="showExportData"
-                        ref="exportData"
+                        ref="exportDataRef"
                         @loading="(v: boolean) => emit('loading', v)"
                     ></ExportData>
                 </v-list>
             </v-menu>
         </v-col>
     </v-row>
-    <v-row v-if="multipleDeletion && selected.length !== 0" class="mb-2 d-flex justify-end">
+    <v-row
+        v-if="multipleDeletion && selected.length !== 0"
+        class="mb-2 d-flex justify-end multipleDeletion"
+    >
         <v-col cols="12" md="12" lg="2" sm="12">
             <v-btn color="error" width="100%" @click="multipleDelete">
-                <i class="icon-trash" /> {{ $i18n.t('table.delete') }}
+                <i class="icon icon-trash" /> {{ $i18n.t('table.delete') }}
             </v-btn>
         </v-col>
     </v-row>
@@ -61,10 +64,11 @@
 <script setup lang="ts">
 import { AdvancedFiltersDTO, HardFiltersDTO, HeaderDTO, SortDTO } from '../../../types/table'
 import { useI18n } from 'vue-i18n'
-import { onMounted, ref, Ref } from 'vue'
+import { nextTick, onMounted, ref, Ref } from 'vue'
 import useHeadersStorage from '../../../composables/useHeadersStorage'
 import Filters from './Filters.vue'
 import DialogColumns from './DialogColumns.vue'
+import ExportData from './ExportData.vue'
 
 type propsType = {
     id: string
@@ -83,7 +87,7 @@ const $i18n = useI18n()
 const $useHeadersStorage = useHeadersStorage()
 const emit = defineEmits(['loading', 'headers', 'search', 'hardFilters', 'multipleDelete'])
 const active_hard_filters: Ref<any[]> = ref([])
-const exportData: any = ref(null)
+const exportDataRef: any = ref(null)
 
 const updateHardFilters = (hard_filters_keys: any) => {
     const hard_filters: HardFiltersDTO[] = []
@@ -97,27 +101,27 @@ const updateHardFilters = (hard_filters_keys: any) => {
             })
         }
     })
-    exportData.value?.setHardFilters(hard_filters)
+    exportDataRef.value?.setHardFilters(hard_filters)
     emit('hardFilters', hard_filters)
 }
 const multipleDelete = () => {
     emit('multipleDelete', true)
 }
 const search = (filters: AdvancedFiltersDTO[]) => {
-    exportData.value?.setFilters(filters)
+    exportDataRef.value?.setFilters(filters)
     emit('search', filters)
 }
 const submitHeaders = (headers: HeaderDTO[]) => {
     $useHeadersStorage.submitHeaders(headers, props.id)
     const displayHeaders = headers.filter((v) => !v.hidden)
     emit('headers', displayHeaders)
-    exportData.value?.setHeaders(displayHeaders)
+    exportDataRef.value?.setHeaders(displayHeaders)
 }
 const updateExportSortData = (sort: SortDTO) => {
-    exportData.value?.setSort(sort)
+    exportDataRef.value?.setSort(sort)
 }
 const updateExportDataTotal = (total: number) => {
-    exportData.value?.setTotal(total)
+    exportDataRef.value?.setTotal(total)
 }
 const updateExportData = (
     api: string,
@@ -128,9 +132,16 @@ const updateExportData = (
     hard_filters: HardFiltersDTO[]
 ) => {
     const displayHeaders = headers.filter((header: HeaderDTO) => !header.hidden)
-    setTimeout(() => {
-        exportData.value?.setExportDataInfo(api, displayHeaders, total, sort, filters, hard_filters)
-    }, 500)
+    nextTick(() => {
+        exportDataRef.value?.setExportDataInfo(
+            api,
+            displayHeaders,
+            total,
+            sort,
+            filters,
+            hard_filters
+        )
+    })
 }
 
 onMounted(() => {

package/src/composables/useDataTableExport.ts

@@ -46,7 +46,7 @@ export default function useDataTableExport() {
             if (!response.ok) {
                 throw new Error(`Error: ${response.status}`)
             }
-            const data = response.json()
+            const data = await response.json()
             allPrintableItems.value = 'data' in data ? data.data : data
         } catch (e) {
             console.error('Failed Export Error', e)

package/src/scss/app.scss

@@ -9,6 +9,19 @@
   }
 }
 
+.maintable{
+  .multipleDeletion{
+    margin-top: -54px;
+  }
+}
+@media only screen and (max-width: 1155px) {
+  .maintable{
+    .multipleDeletion{
+      margin-top: 0;
+    }
+  }
+}
+
 .cardMap{
   &:fullscreen{
     .vue-map-container{