TreeList için Pager ve diğer güncellemeler

This commit is contained in:
Sedat Öztürk 2025-11-08 02:57:04 +03:00
parent a6ad6e076c
commit 950fbf2a41
6 changed files with 46 additions and 9 deletions

View file

@ -152,6 +152,7 @@ public class ListFormsAppService : CrudAppService<
} }
else if (input.EditType == ListFormEditTabs.PagerForm) else if (input.EditType == ListFormEditTabs.PagerForm)
{ {
item.PageSize = input.PageSize;
item.PagerOptionJson = JsonSerializer.Serialize(input.PagerOptionDto); item.PagerOptionJson = JsonSerializer.Serialize(input.PagerOptionDto);
} }
else if (input.EditType == ListFormEditTabs.StateForm) else if (input.EditType == ListFormEditTabs.StateForm)

View file

@ -5413,6 +5413,12 @@
"en": "Allowed Page Sizes", "en": "Allowed Page Sizes",
"tr": "İzin Verilen Sayfa Boyutları" "tr": "İzin Verilen Sayfa Boyutları"
}, },
{
"resourceName": "Platform",
"key": "ListForms.ListFormEdit.PageSize",
"en": "Page Size",
"tr": "Sayfa Boyutu"
},
{ {
"resourceName": "Platform", "resourceName": "Platform",
"key": "ListForms.ListFormEdit.PagingInfoText", "key": "ListForms.ListFormEdit.PagingInfoText",

View file

@ -36,6 +36,21 @@ function FormTabPager(props: FormEditProps) {
{({ touched, errors, isSubmitting, values }) => ( {({ touched, errors, isSubmitting, values }) => (
<Form> <Form>
<FormContainer size="sm"> <FormContainer size="sm">
<FormItem
label={translate('::ListForms.ListFormEdit.PageSize')}
invalid={errors.pageSize && touched.pageSize}
errorMessage={errors.pageSize}
>
<Field
type="number"
className="w-20"
autoComplete="off"
name="pageSize"
placeholder={translate('::ListForms.ListFormEdit.PageSize')}
component={Input}
/>
</FormItem>
<FormItem <FormItem
label={translate('::ListForms.ListFormEdit.PagingVisible')} label={translate('::ListForms.ListFormEdit.PagingVisible')}
invalid={errors.pagerOptionDto?.visible && touched.pagerOptionDto?.visible} invalid={errors.pagerOptionDto?.visible && touched.pagerOptionDto?.visible}

View file

@ -31,7 +31,7 @@ type Option = {
const Card = (props: CardProps) => { const Card = (props: CardProps) => {
const { listFormCode, searchParams, gridDto } = props const { listFormCode, searchParams, gridDto } = props
const { createSelectDataSource } = useListFormCustomDataSource({}) const { createSelectDataSource } = useListFormCustomDataSource({} as any)
const [data, setData] = useState<any[]>([]) const [data, setData] = useState<any[]>([])
const [totalCount, setTotalCount] = useState(0) const [totalCount, setTotalCount] = useState(0)
const [currentPage, setCurrentPage] = useState(1) const [currentPage, setCurrentPage] = useState(1)

View file

@ -32,6 +32,7 @@ import DataGrid, {
IStateStoringProps, IStateStoringProps,
LoadPanel, LoadPanel,
Pager, Pager,
Paging,
Scrolling, Scrolling,
SearchPanel, SearchPanel,
Selection, Selection,
@ -1091,7 +1092,10 @@ const Grid = (props: GridProps) => {
selectAllMode={gridDto.gridOptions.selectionDto?.selectAllMode} selectAllMode={gridDto.gridOptions.selectionDto?.selectAllMode}
showCheckBoxesMode={gridDto.gridOptions.selectionDto?.showCheckBoxesMode} showCheckBoxesMode={gridDto.gridOptions.selectionDto?.showCheckBoxesMode}
></Selection> ></Selection>
{/* <Paging pageSize={gridDto.gridOptions.pageSize ?? 0}></Paging> */} <Paging
defaultPageSize={gridDto.gridOptions.pageSize ?? 20}
pageSize={gridDto.gridOptions.pageSize ?? 20}
/>
<Pager <Pager
visible={gridDto.gridOptions.pagerOptionDto?.visible} visible={gridDto.gridOptions.pagerOptionDto?.visible}
allowedPageSizes={gridDto.gridOptions.pagerOptionDto?.allowedPageSizes allowedPageSizes={gridDto.gridOptions.pagerOptionDto?.allowedPageSizes

View file

@ -22,6 +22,7 @@ import TreeListDx, {
IStateStoringProps, IStateStoringProps,
LoadPanel, LoadPanel,
Pager, Pager,
Paging,
RemoteOperations, RemoteOperations,
Scrolling, Scrolling,
SearchPanel, SearchPanel,
@ -671,16 +672,22 @@ const Tree = (props: TreeProps) => {
mode={gridDto.gridOptions.selectionDto?.mode} mode={gridDto.gridOptions.selectionDto?.mode}
recursive={gridDto.gridOptions.treeOptionDto?.recursiveSelection || false} recursive={gridDto.gridOptions.treeOptionDto?.recursiveSelection || false}
></Selection> ></Selection>
<Paging
enabled={true}
defaultPageSize={gridDto.gridOptions.pagerOptionDto?.allowedPageSizes
?.split(',')
.map((a: any) => +a)?.[0] ?? 20}
/>
<Pager <Pager
visible={gridDto.gridOptions.pagerOptionDto?.visible} visible={gridDto.gridOptions.pagerOptionDto?.visible ?? true}
allowedPageSizes={gridDto.gridOptions.pagerOptionDto?.allowedPageSizes allowedPageSizes={gridDto.gridOptions.pagerOptionDto?.allowedPageSizes
?.split(',') ?.split(',')
.map((a: any) => +a)} .map((a: any) => +a) ?? [10, 20, 50, 100]}
showPageSizeSelector={gridDto.gridOptions.pagerOptionDto?.showPageSizeSelector} showPageSizeSelector={gridDto.gridOptions.pagerOptionDto?.showPageSizeSelector ?? true}
showInfo={gridDto.gridOptions.pagerOptionDto?.showInfo} showInfo={gridDto.gridOptions.pagerOptionDto?.showInfo ?? true}
showNavigationButtons={gridDto.gridOptions.pagerOptionDto?.showNavigationButtons} showNavigationButtons={gridDto.gridOptions.pagerOptionDto?.showNavigationButtons ?? true}
infoText={gridDto.gridOptions.pagerOptionDto?.infoText} infoText={gridDto.gridOptions.pagerOptionDto?.infoText}
displayMode={gridDto.gridOptions.pagerOptionDto?.displayMode} displayMode={gridDto.gridOptions.pagerOptionDto?.displayMode ?? 'full'}
></Pager> ></Pager>
<ColumnChooser <ColumnChooser
enabled={gridDto.gridOptions.columnOptionDto?.columnChooserEnabled} enabled={gridDto.gridOptions.columnOptionDto?.columnChooserEnabled}
@ -689,7 +696,11 @@ const Tree = (props: TreeProps) => {
<ColumnFixing <ColumnFixing
enabled={gridDto.gridOptions.columnOptionDto?.columnFixingEnabled} enabled={gridDto.gridOptions.columnOptionDto?.columnFixingEnabled}
></ColumnFixing> ></ColumnFixing>
<Scrolling mode={gridDto.gridOptions.pagerOptionDto?.scrollingMode}></Scrolling> <Scrolling
mode="virtual"
rowRenderingMode="virtual"
showScrollbar="always"
></Scrolling>
<LoadPanel <LoadPanel
enabled={gridDto.gridOptions.pagerOptionDto?.loadPanelEnabled} enabled={gridDto.gridOptions.pagerOptionDto?.loadPanelEnabled}
text={gridDto.gridOptions.pagerOptionDto?.loadPanelText} text={gridDto.gridOptions.pagerOptionDto?.loadPanelText}