@webitel/ui-sdk 25.10.30 → 25.10.32

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "25.10.30",
+  "version": "25.10.32",
   "private": false,
   "scripts": {
     "make-all": "npm version patch --git-tag-version false && npm run build && (npm run build:types || true) && (npm run lint:fix || true) && npm run publish-lib",
@@ -56,7 +56,7 @@
     "@vuepic/vue-datepicker": "^4.5.1",
     "@vueuse/components": "^13.0.0",
     "@webitel/api-services": "^0.0.44",
-    "@webitel/styleguide": "^24.12.72",
+    "@webitel/styleguide": "^24.12.73",
     "autosize": "^6.0.1",
     "axios": "^1.8.3",
     "clipboard-copy": "^4.0.1",

package/src/components/wt-table/wt-table.vue

@@ -24,6 +24,7 @@
       row-reorder
       :reorderable-column="false"
       header-style="width: 1%;"
+      body-style="width: 1%;"
       :pt="{
         columnresizer: { 
             class: { 
@@ -45,6 +46,7 @@
       column-key="row-select"
       :reorderable-column="false"
       header-style="width: 1%;"
+      body-style="width: 1%;"
       :pt="{
         columnresizer: { 
             class: { 
@@ -420,5 +422,6 @@ const columnReorder = async ({dropIndex, originalEvent}) => {
   position: absolute;
   transform: translateY(-50%);
   top: 50%;
+  z-index: 1;
 }
 </style>

package/src/modules/CSVExport/composables/useCSVExport.ts

@@ -0,0 +1,70 @@
+import applyTransform, { notify } from '@webitel/ui-sdk/api/transformers/index';
+import { computed, Ref, ref } from 'vue';
+import { useRoute } from 'vue-router';
+
+import CSVExport from '../CSVExport';
+
+export type CSVRow = Record<string, any>;
+
+export type FetchMethod = (params: Record<string, any>) => Promise<{
+  items: CSVRow[];
+  next: boolean;
+}>;
+
+interface CSVExportOptions {
+  filename?: string;
+  delimiter?: string;
+}
+
+const CSV_EXPORT_BATCH_SIZE = 5000;
+
+export function useCSVExport({ selected }: { selected: Ref<number[]> }) {
+  const CSVExportInstance = ref<null | InstanceType<typeof CSVExport>>(null);
+  const route = useRoute();
+
+  const CSVDownloadProgress = computed(() =>
+    CSVExportInstance.value
+      ? CSVExportInstance.value.downloadProgress.count
+      : 0,
+  );
+
+  const isCSVLoading = computed(() => !!CSVDownloadProgress.value);
+
+  const isAnySelected = computed(() => !!selected.value.length);
+
+  function initCSVExport(
+    fetchMethod: FetchMethod,
+    options: CSVExportOptions = {},
+  ) {
+    CSVExportInstance.value = new CSVExport(fetchMethod, options);
+  }
+
+  async function exportCSV(exportParams?: Record<string, any>) {
+    const routeQuery = route.query;
+    const params = {
+      ...(exportParams || routeQuery),
+      size: CSV_EXPORT_BATCH_SIZE,
+    };
+
+    if (isAnySelected.value) {
+      params.id = selected.value;
+    }
+
+    try {
+      await CSVExportInstance.value?.export(params);
+    } catch (err) {
+      throw applyTransform(err, [notify]);
+    }
+  }
+
+  return {
+    CSVExportInstance,
+
+    CSVDownloadProgress,
+    isCSVLoading,
+    isAnySelected,
+
+    initCSVExport,
+    exportCSV,
+  };
+}

package/src/plugins/primevue/theme/components/table/table.js

@@ -50,6 +50,8 @@ const table = {
 
         .p-datatable-thead > tr > th {
             overflow: hidden;
+            position: relative;
+            z-index: 2;
         }
 
         .p-datatable-column-resizer {

package/types/modules/CSVExport/composables/useCSVExport.d.ts

@@ -0,0 +1,50 @@
+import { Ref } from 'vue';
+import CSVExport from '../CSVExport';
+export type CSVRow = Record<string, any>;
+export type FetchMethod = (params: Record<string, any>) => Promise<{
+    items: CSVRow[];
+    next: boolean;
+}>;
+interface CSVExportOptions {
+    filename?: string;
+    delimiter?: string;
+}
+export declare function useCSVExport({ selected }: {
+    selected: Ref<number[]>;
+}): {
+    CSVExportInstance: Ref<{
+        filename: string;
+        fetchMethod: any;
+        downloadProgress: {
+            count: number;
+        };
+        delimiter: any;
+        resetProgress: () => void;
+        zippingProgress: {
+            percent: number;
+        };
+        save: (csv: any) => void;
+        stringify: (params?: {}) => Promise<string>;
+        export: (params: any) => Promise<void>;
+    }, CSVExport | {
+        filename: string;
+        fetchMethod: any;
+        downloadProgress: {
+            count: number;
+        };
+        delimiter: any;
+        resetProgress: () => void;
+        zippingProgress: {
+            percent: number;
+        };
+        save: (csv: any) => void;
+        stringify: (params?: {}) => Promise<string>;
+        export: (params: any) => Promise<void>;
+    }>;
+    CSVDownloadProgress: import("vue").ComputedRef<number>;
+    isCSVLoading: import("vue").ComputedRef<boolean>;
+    isAnySelected: import("vue").ComputedRef<boolean>;
+    initCSVExport: (fetchMethod: FetchMethod, options?: CSVExportOptions) => void;
+    exportCSV: (exportParams?: Record<string, any>) => Promise<void>;
+};
+export {};