mazdik / ng-mazdik

Angular UI component library
https://mazdik.github.io/ng-mazdik
MIT License
89 stars 34 forks source link

Export All #55

Closed hghew closed 4 years ago

hghew commented 4 years ago

Hi, is that a way to export all table content base on filter? (instead of the current page only)

for example, base on the filter, the total rows is 300 over total 500 rows, but pagination only shows 100 per rows, I would like to export all 300 rows.

thanks in advance.

mazdik commented 4 years ago

Server side (DataManager) or client side (DataTable)? This is how it is implemented in dt-toolbar:

import { downloadCSV } from 'ng-mazdik-lib';

  downloadCsv() {
    const keys = this.table.columns.map(col => col.name);
    const titles = this.table.columns.map(col => col.title);
    downloadCSV({rows: this.table.rows, keys, titles});
  }

If with pagination from the server side, then you need to download all the data.

dataManager.service..getItems(requestMeta).then(data => {
    downloadCSV({rows: data.items, keys, titles});
});

RequestMetadata

hghew commented 4 years ago

hi, I am using server-side DataManager, thanks for the sample code, I got it. Now able to export all based on filter/globalfilter/sorter.

hghew commented 4 years ago

hi, i have one question, current I have select-dropdown with [{id: '1', name: 'Something one'}, {id: '2', name: 'Something two'}]

when I export it write value 1 / 2 instead of Something one or two, can I make it write the name attribute?

mazdik commented 4 years ago

try

    const result = [];
    this.table.rows.forEach((x: Row) => {
      const row = x.clone();
      this.table.columns.forEach(col => {
        row[col.name] = col.getValueView(row);
      });
      result.push(row);
    });
mazdik commented 4 years ago

update export

hghew commented 4 years ago

update export

got it for the single page export

for the customize export all, i have doubts, seems not possible to copy from PagedResult data below is my code to export all, the data is in PagedResult

    private exportAllPages(): void {
        const requestMeta = {
            pageMeta: {perPage: this.dataManager.rows.length},
            filters: this.dataManager.filters,
            globalFilterValue: this.dataManager.dataFilter.globalFilterValue,
            sortMeta: this.dataManager.sorter.sortMeta
        } as RequestMetadata;

        this.dataManager.service.getItems(requestMeta).then(data => {
            const keys = this.dataManager.columns.map(col => col.name);
            const titles = this.dataManager.columns.map(col => col.title);

           // need to copy the value string here?

            downloadCSV({rows: data.items , keys, titles});
        });
    }

since i am using the following method, how do i actually assign the value string from data.items before passing in to downloadCSV

    dataManager.service..getItems(requestMeta).then(data => {
        downloadCSV({rows: data.items, keys, titles});
    });
mazdik commented 4 years ago
  exportAllPages(): void {
    const requestMeta = {
      pageMeta: { perPage: this.dataManager.rows.length },
      filters: this.dataManager.filters,
      globalFilterValue: this.dataManager.dataFilter.globalFilterValue,
      sortMeta: this.dataManager.sorter.sortMeta
    } as RequestMetadata;

    this.dataManager.service.getItems(requestMeta).then(data => {
      const keys = this.dataManager.columns.map(col => col.name);
      const titles = this.dataManager.columns.map(col => col.title);

      const resultRows = [];
      data.items.forEach(x => {
        const row = Object.assign({}, x);
        this.dataManager.columns.forEach(col => {
          row[col.name] = col.getValueView(row);
        });
        resultRows.push(row);
      });

      downloadCSV({ rows: resultRows, keys, titles });
    });
  }
hghew commented 4 years ago
  exportAllPages(): void {
    const requestMeta = {
      pageMeta: { perPage: this.dataManager.rows.length },
      filters: this.dataManager.filters,
      globalFilterValue: this.dataManager.dataFilter.globalFilterValue,
      sortMeta: this.dataManager.sorter.sortMeta
    } as RequestMetadata;

    this.dataManager.service.getItems(requestMeta).then(data => {
      const keys = this.dataManager.columns.map(col => col.name);
      const titles = this.dataManager.columns.map(col => col.title);

      const resultRows = [];
      data.items.forEach(x => {
        const row = Object.assign({}, x);
        this.dataManager.columns.forEach(col => {
          row[col.name] = col.getValueView(row);
        });
        resultRows.push(row);
      });

      downloadCSV({ rows: resultRows, keys, titles });
    });
  }

thanks