From dd004276162a2bf9d042ff0aaa569dc30a95d827 Mon Sep 17 00:00:00 2001 From: binxie <137736985@qq.com> Date: 星期一, 26 六月 2023 14:23:26 +0800 Subject: [PATCH] newbackup0626 --- force-app/main/default/lwc/lwcDatatableUtility/lwcDatatableUtility.html | 135 ++++++++++++++++++++++++++++++++------------ 1 files changed, 98 insertions(+), 37 deletions(-) diff --git a/force-app/main/default/lwc/lwcDatatableUtility/lwcDatatableUtility.html b/force-app/main/default/lwc/lwcDatatableUtility/lwcDatatableUtility.html index 8294ccc..93200b0 100644 --- a/force-app/main/default/lwc/lwcDatatableUtility/lwcDatatableUtility.html +++ b/force-app/main/default/lwc/lwcDatatableUtility/lwcDatatableUtility.html @@ -1,13 +1,32 @@ <template> <template if:true={records}> - <div class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread"> - <div class="slds-col"><!--RECORDS PER PAGE--> - <div style={paginationVisibility} class="slds-list_inline slds-p-bottom_xx-small customSelect"> - <label class="slds-text-color_weak slds-p-horizontal_x-small" for="recordsPerPage">Page Size:</label> + <div + class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread" + > + <div class="slds-col"> + <!--RECORDS PER PAGE--> + <div + style={paginationVisibility} + class="slds-list_inline slds-p-bottom_xx-small customSelect" + > + <label + class="slds-text-color_weak slds-p-horizontal_x-small" + for="recordsPerPage" + >Page Size:</label + > <div class="slds-select_container"> - <select class="slds-select" id="recordsPerPage" onchange={handleRecordsPerPage}> - <template for:each={pageSizeOptions} for:item="option"> - <option key={option} value={option}>{option}</option> + <select + class="slds-select" + id="recordsPerPage" + onchange={handleRecordsPerPage} + > + <template + for:each={pageSizeOptions} + for:item="option" + > + <option key={option} value={option}> + {option} + </option> </template> </select> </div> @@ -22,59 +41,101 @@ </div> --> </div> - <div class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread"> - <div class="slds-col"> + <div + class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread" + > + <div class="slds-col"> <div class="slds-col slds-p-bottom_xx-small"> <span> - <label class="slds-text-color_weak slds-p-horizontal_x-small" >Total: {filtredNum}</label> - </span> + <label + class="slds-text-color_weak slds-p-horizontal_x-small" + >Total: {filtredNum}</label + > + </span> <span> - <label class="slds-text-color_weak slds-p-horizontal_x-small" >Selected: {totalSelected}</label> - </span> + <label + class="slds-text-color_weak slds-p-horizontal_x-small" + >Selected: {totalSelected}</label + > + </span> </div> </div> - </div> - + </div> - <div class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread" > + <div + class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread" + > <div class="slds-col" style={tableHeightStyle}> - <lightning-datatable key-field={keyField} - hide-checkbox-column = {hidecheckboxcolumn} - data={recordsToDisplay} + <lightning-datatable + key-field={keyField} + hide-checkbox-column={hidecheckboxcolumn} + data={recordsToDisplay} columns={columns} - max-row-selection={maxRowSelection} - onrowselection={getSelectedRows} - selected-rows={preSelected} + max-row-selection={maxRowSelection} + onrowselection={getSelectedRows} + selected-rows={preSelected} default-sort-direction={defaultSortDirection} sorted-direction={sortDirection} sorted-by={sortedBy} onsort={handelSort} - show-row-number-column = {showrownumber}> - </lightning-datatable> + show-row-number-column={showrownumber} + > + </lightning-datatable> </div> - </div> + </div> - <div class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread" style="padding-top: 0.5em;"> + <div + class="slds-grid slds-grid_vertical-align-center slds-grid_align-spread" + style="padding-top: 0.5em" + > <div class="slds-col"></div> <div class="slds-col"></div> <!--PAGE NAVIGATION--> <div class="slds-col"> - <div style={paginationVisibility}> - <div class="slds-col slds-p-bottom_xx-small"> + <div style={paginationVisibility}> + <div class="slds-col slds-p-bottom_xx-small"> <span> - <lightning-button-icon icon-name="utility:chevronleft" variant="bare" size="medium" alternative-text="Previous Page" onclick={previousPage}></lightning-button-icon> + <lightning-button-icon + icon-name="utility:chevronleft" + variant="bare" + size="medium" + alternative-text="Previous Page" + onclick={previousPage} + ></lightning-button-icon> </span> - <label class="slds-text-color_weak slds-p-horizontal_x-small" for="pageNum">Page:</label> - <input type="number" id="pageNum" value={pageNumber} maxlength="4" onkeypress={handlePageNumberChange} class="customInput" title="Go to a Page"></input> - <span> of <b id="totalPages">{totalPages}</b></span> + <label + class="slds-text-color_weak slds-p-horizontal_x-small" + for="pageNum" + >Page:</label + > + <input + type="number" + id="pageNum" + value={pageNumber} + maxlength="4" + onkeypress={handlePageNumberChange} + class="customInput" + title="Go to a Page" + /> + <span + > of <b id="totalPages" + >{totalPages}</b + ></span + > <span> <template if:true={pageNumber}></template> - <lightning-button-icon icon-name="utility:chevronright" variant="bare" size="medium" alternative-text="Next Page" onclick={nextPage} class="slds-p-horizontal_x-small"></lightning-button-icon> - </span> + <lightning-button-icon + icon-name="utility:chevronright" + variant="bare" + size="medium" + alternative-text="Next Page" + onclick={nextPage} + class="slds-p-horizontal_x-small" + ></lightning-button-icon> + </span> </div> </div> - </div> + </div> </div> - - </template> + </template> </template> \ No newline at end of file -- Gitblit v1.9.1