merge

binxie

2023-06-26 de9565270a88b0749d17c1961cd41399c8483c96

 force-app/main/default/lwc/paginatedList/paginatedList.js

New file
@@ -0,0 +1,126 @@
import { LightningElement, api, track } from 'lwc';
import getAccountsPaginated from '@salesforce/apex/PaginatedListControllerLwc.getAccountsPaginated';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { reduceErrors } from 'c/ldsUtils';
import ACCOUNT_NAME_FIELD from '@salesforce/schema/Account.Name';
import ACCOUNT_TYPE_FIELD from '@salesforce/schema/Account.Type';
import ACCOUNT_PHONE_FIELD from '@salesforce/schema/Account.Type';
import ACCOUNT_EMPLOYEES_FIELD from '@salesforce/schema/Account.NumberOfEmployees';

const COLUMNS = [
    {
        label: 'Account Name',
        fieldName: ACCOUNT_NAME_FIELD.fieldApiName,
        type: 'text',
        sortable: 'true'
    },
    { label: 'Type', fieldName: ACCOUNT_TYPE_FIELD.fieldApiName, type: 'text' },
    {
        label: 'Phone',
        fieldName: ACCOUNT_PHONE_FIELD.fieldApiName,
        type: 'phone'
    },
    {
        label: 'Employees',
        fieldName: ACCOUNT_EMPLOYEES_FIELD.fieldApiName,
        type: 'Number'
    }
];

export default class PaginatedList extends LightningElement {
    columns = COLUMNS;
    @track sortBy = 'Name';
    @track sortDirection = 'asc';
    @track pageSize = 10;
    error;
    records;
    currentPageToken = 0;
    nextPageToken = this.pageSize;
    @track loader = false;
    @track pageNumber = 1;
    @track paginationVisibility = false;
    @track totalPages = 1;
    @api pageSizeOptions = [10, 25, 50, 75, 100];
    connectedCallback() {
        this.getAccounts();
    }

    getAccounts() {
        this.loader = true;
        getAccountsPaginated({
            pageSize: this.pageSize,
            pageToken: this.currentPageToken,
            sortField: this.sortBy,
            sortOrder: this.sortDirection
        })
            .then((result) => {
                this.loader = false;
                if (result) {
                    this.records = result.records;
                    this.nextPageToken = result.nextPageToken;
                    this.totalRecords = result.totalRecords;
                    this.recordStart = result.recordStart;
                    this.recordEnd = result.recordEnd;
                    this.totalPages = Math.ceil(
                        result.totalRecords / this.pageSize
                    );
                    this.paginationVisibility =
                        this.totalPages > 1 ? true : false;
                }
            })
            .catch((error) => {
                this.loader = false;
                this.error = error;
                this.currentPageToken = 0;
                const evt = new ShowToastEvent({
                    title: 'Error',
                    message: reduceErrors(error).join(', '),
                    variant: 'error'
                });
                this.dispatchEvent(evt);
            });
    }
    doSorting(event) {
        console.log('Sort');
        this.sortBy = event.detail.fieldName;
        this.sortDirection = event.detail.sortDirection;
        this.currentPageToken = 0;
        this.getAccounts();
    }

    handlePrevious() {
        this.currentPageToken =
            Number(this.currentPageToken) - Number(this.pageSize);
        this.getAccounts();
    }

    handleNext() {
        this.currentPageToken =
            Number(this.currentPageToken) + Number(this.pageSize);
        this.getAccounts();
    }
    handleFirst() {
        this.currentPageToken = 0;
        this.getAccounts();
    }

    handleLast() {
        this.currentPageToken =
            this.totalPages > 1 ? (this.totalPages - 1) * this.pageSize : 0;
        this.getAccounts();
    }

    handlePageschange(event) {
        console.log(event.detail);
        this.pageSize = event.detail;
        this.currentPageToken = 0;
        this.getAccounts();
    }
    get previousButtonDisabled() {
        return this.currentPageToken === 0;
    }

    get nextButtonDisabled() {
        return this.nextPageToken === undefined;
    }
}