editorOptions içerisinde dataSource bilgisi eklendi

This commit is contained in:
Sedat Öztürk 2025-09-22 00:32:05 +03:00
parent 74075aa68e
commit b75158bc01
5 changed files with 70 additions and 57 deletions

View file

@ -11,7 +11,6 @@ import { GridBoxEditorComponent } from './editors/GridBoxEditorComponent'
import { TagBoxEditorComponent } from './editors/TagBoxEditorComponent'
import { RowMode, SimpleItemWithColData } from './types'
import { PlatformEditorTypes } from '@/proxy/form/models'
import { useLookupDataSource } from './useLookupDataSource'
const FormDevExpress = (props: {
listFormCode: string
@ -23,7 +22,6 @@ const FormDevExpress = (props: {
setFormData: Dispatch<any>
}) => {
const { listFormCode, isSubForm, mode, refForm, formData, formItems, setFormData } = props
const { getLookupDataSource } = useLookupDataSource({ listFormCode, isSubForm })
return (
<form className={`${DX_CLASSNAMES} p-2`}>
@ -51,6 +49,7 @@ const FormDevExpress = (props: {
caption={formGroupItem.caption}
>
{(formGroupItem.items as SimpleItemWithColData[])?.map((formItem, i) => {
console.log('formItem', formItem.colData)
return formItem.editorType2 === PlatformEditorTypes.dxTagBox ? (
<SimpleItemDx
key={'formItem-' + i}
@ -69,10 +68,6 @@ const FormDevExpress = (props: {
...formItem.editorOptions,
...(mode === 'view' ? { readOnly: true } : {}),
}}
dataSource={getLookupDataSource(
formItem.colData?.editorOptions,
formItem.colData,
)}
></TagBoxEditorComponent>
)}
>
@ -95,10 +90,6 @@ const FormDevExpress = (props: {
...formItem.editorOptions,
...(mode === 'view' ? { readOnly: true } : {}),
}}
dataSource={getLookupDataSource(
formItem.colData?.editorOptions,
formItem.colData,
)}
></GridBoxEditorComponent>
)}
>
@ -110,16 +101,6 @@ const FormDevExpress = (props: {
{...formItem}
editorOptions={{
...formItem.editorOptions,
...(formItem.colData?.lookupDto?.dataSourceType
? {
dataSource: getLookupDataSource(
formItem.colData?.editorOptions,
formItem.colData,
),
valueExpr: formItem.colData?.lookupDto?.valueExpr,
displayExpr: formItem.colData?.lookupDto?.displayExpr,
}
: {}),
...(mode === 'view' ? { readOnly: true } : { autoFocus: i === 1 }),
}}
/>

View file

@ -11,7 +11,6 @@ const GridBoxEditorComponent = ({
onValueChanged,
col,
editorOptions,
dataSource
}: {
value: any
options?: GridBoxOptionsDto
@ -19,7 +18,6 @@ const GridBoxEditorComponent = ({
onValueChanged: (e: any) => void
col?: ColumnFormatDto
editorOptions: any
dataSource: any
}): ReactElement => {
const gridRef = useRef<DataGrid>(null)
const val = Array.isArray(value) ? value : [value]
@ -34,7 +32,7 @@ const GridBoxEditorComponent = ({
<DropDownBox
{...editorOptions}
value={val}
dataSource={dataSource}
dataSource={editorOptions?.dataSource}
valueExpr={lookupDto?.valueExpr}
displayExpr={lookupDto?.displayExpr}
showClearButton={options?.showClearButton}
@ -52,7 +50,7 @@ const GridBoxEditorComponent = ({
<>
<DataGrid
ref={gridRef}
dataSource={dataSource}
dataSource={editorOptions?.dataSource}
key={lookupDto?.valueExpr}
filterRow={{
visible: options?.filterRowVisible,
@ -78,7 +76,7 @@ const GridBoxEditorComponent = ({
//TODO:Bu kısım tekrar değerlendirilmeli
onEditorPrepared={(event) => {
const getListValues = async () => {
const data = await dataSource?.load()
const data = await editorOptions?.dataSource?.load()
const listValues = data.map((a: any) => ({
key: a.key,

View file

@ -10,7 +10,6 @@ const TagBoxEditorComponent = ({
onValueChanged,
col,
editorOptions,
dataSource
}: {
value: any
setDefaultValue: boolean
@ -19,7 +18,6 @@ const TagBoxEditorComponent = ({
onValueChanged: (e: any) => void
col?: ColumnFormatDto
editorOptions: any
dataSource: any
}): ReactElement => {
const val = Array.isArray(value) ? value : [value]
const lookupDto = col?.lookupDto
@ -33,7 +31,7 @@ const TagBoxEditorComponent = ({
<TagBox
{...editorOptions}
{...(setDefaultValue ? { defaultValue: val } : { value: val })}
dataSource={dataSource}
dataSource={editorOptions?.dataSource}
valueExpr={lookupDto?.valueExpr}
displayExpr={lookupDto?.displayExpr}
showClearButton={options?.showClearButton}

View file

@ -16,6 +16,7 @@ import { PermissionResults, RowMode, SimpleItemWithColData } from './types'
import { EditingFormItemDto, GridDto, PlatformEditorTypes } from '@/proxy/form/models'
import { getAccessDeniedPath } from '@/utils/routing'
import { ROUTES_ENUM } from '@/routes/route.constant'
import { useLookupDataSource } from '../form/useLookupDataSource'
const useGridData = (props: {
mode: RowMode
@ -49,6 +50,7 @@ const useGridData = (props: {
isSubForm,
})
const { createSelectDataSource } = useListFormCustomDataSource({})
const { getLookupDataSource } = useLookupDataSource({ listFormCode, isSubForm })
const fetchData = async () => {
setLoading(true)
@ -220,6 +222,8 @@ const useGridData = (props: {
})
.map((i: EditingFormItemDto) => {
let editorOptions = {}
const colData = gridDto.columnFormats.find((x) => x.fieldName === i.dataField)
try {
editorOptions = i.editorOptions && JSON.parse(i.editorOptions)
} catch {}
@ -243,8 +247,17 @@ const useGridData = (props: {
i.editorType2 == PlatformEditorTypes.dxGridBox ? 'dxDropDownBox' : i.editorType2,
colSpan: i.colSpan,
isRequired: i.isRequired,
editorOptions,
colData: gridDto?.columnFormats.find((x) => x.fieldName === i.dataField),
editorOptions: {
...editorOptions,
...(colData?.lookupDto?.dataSourceType
? {
dataSource: getLookupDataSource(colData?.editorOptions, colData),
valueExpr: colData?.lookupDto?.valueExpr?.toLowerCase(),
displayExpr: colData?.lookupDto?.displayExpr?.toLowerCase(),
}
: {}),
},
colData,
tagBoxOptions: i.tagBoxOptions,
gridBoxOptions: i.gridBoxOptions,
}

View file

@ -16,6 +16,7 @@ import CustomStore from 'devextreme/data/custom_store'
import { PermissionResults, SimpleItemWithColData } from '../form/types'
import { usePermission } from '@/utils/hooks/usePermission'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { useLookupDataSource } from '../form/useLookupDataSource'
interface CardProps {
listFormCode: string
@ -34,6 +35,7 @@ const CardItem = ({
listFormCode,
dataSource,
refreshData,
getCachedLookupDataSource, // 🔹 Carddan gelen cache fonksiyonu
}: {
isSubForm?: boolean
row: any
@ -41,6 +43,7 @@ const CardItem = ({
listFormCode: string
dataSource: CustomStore
refreshData: () => void
getCachedLookupDataSource: (editorOptions: any, colData: any) => any
}) => {
const [formData, setFormData] = useState(row)
const refForm = useRef<FormDx>(null)
@ -51,41 +54,33 @@ const CardItem = ({
const keyField = gridDto.gridOptions.keyFieldName
const rowId = row[keyField!]
// Form Items
const formItems: GroupItem[] = useMemo(() => {
if (!gridDto) return []
return gridDto?.gridOptions.editingFormDto
?.sort((a: any, b: any) => {
return a.order >= b.order ? 1 : -1
})
.map((e: any) => {
return gridDto.gridOptions.editingFormDto
?.sort((a, b) => (a.order >= b.order ? 1 : -1))
.map((e) => {
return {
itemType: e.itemType,
colCount: e.colCount,
colSpan: e.colSpan,
caption: e.caption,
items: e.items
?.sort((a: any, b: any) => {
return a.order >= b.order ? 1 : -1
})
?.sort((a, b) => (a.order >= b.order ? 1 : -1))
.map((i: EditingFormItemDto) => {
let editorOptions = {}
const colData = gridDto.columnFormats.find((x) => x.fieldName === i.dataField)
try {
editorOptions = i.editorOptions && JSON.parse(i.editorOptions)
} catch {}
const item: SimpleItemWithColData = {
canRead:
gridDto.columnFormats.find((x: any) => x.fieldName === i.dataField)?.canRead ??
false,
canUpdate:
gridDto.columnFormats.find((x: any) => x.fieldName === i.dataField)?.canUpdate ??
false,
canCreate:
gridDto.columnFormats.find((x: any) => x.fieldName === i.dataField)?.canCreate ??
false,
canExport:
gridDto.columnFormats.find((x: any) => x.fieldName === i.dataField)?.canExport ??
false,
canRead: colData?.canRead ?? false,
canUpdate: colData?.canUpdate ?? false,
canCreate: colData?.canCreate ?? false,
canExport: colData?.canExport ?? false,
dataField: i.dataField,
name: i.dataField,
editorType2: i.editorType2,
@ -93,8 +88,17 @@ const CardItem = ({
i.editorType2 == PlatformEditorTypes.dxGridBox ? 'dxDropDownBox' : i.editorType2,
colSpan: i.colSpan,
isRequired: i.isRequired,
editorOptions,
colData: gridDto.columnFormats.find((x) => x.fieldName === i.dataField),
editorOptions: {
...editorOptions,
...(colData?.lookupDto?.dataSourceType
? {
dataSource: getCachedLookupDataSource(colData?.editorOptions, colData),
valueExpr: colData?.lookupDto?.valueExpr?.toLowerCase(),
displayExpr: colData?.lookupDto?.displayExpr?.toLowerCase(),
}
: {}),
},
colData,
tagBoxOptions: i.tagBoxOptions,
gridBoxOptions: i.gridBoxOptions,
}
@ -109,7 +113,7 @@ const CardItem = ({
}),
} as GroupItem
})
}, [gridDto])
}, [gridDto, getCachedLookupDataSource])
const permissionResults: PermissionResults = {
c:
@ -186,6 +190,23 @@ const Card = ({ listFormCode, searchParams }: CardProps) => {
const [pageSizeOptions, setPageSizeOptions] = useState<Option[]>([])
const [dataSource, setDataSource] = useState<CustomStore>()
// ✅ Lookup cache burada (Card seviyesinde, tüm CardItemlar ortak kullanır)
const { getLookupDataSource } = useLookupDataSource({ listFormCode })
const lookupCache = useRef<Map<string, any>>(new Map())
const getCachedLookupDataSource = useCallback(
(editorOptions: any, colData: any) => {
const key = colData?.fieldName
if (!key) return null
if (!lookupCache.current.has(key)) {
lookupCache.current.set(key, getLookupDataSource(editorOptions, colData))
}
return lookupCache.current.get(key)
},
[getLookupDataSource]
)
const onPageSizeSelect = ({ value }: Option) => {
setPageSize(value)
setCurrentPage(1)
@ -231,7 +252,8 @@ const Card = ({ listFormCode, searchParams }: CardProps) => {
if (!gridDto) return
const pagerOptions = gridDto.gridOptions.pagerOptionDto
const allowedSizes = pagerOptions?.allowedPageSizes
const allowedSizes =
pagerOptions?.allowedPageSizes
?.split(',')
.map((s) => Number(s.trim()))
.filter((n) => !isNaN(n) && n > 0) || [10, 20, 50, 100]
@ -271,6 +293,7 @@ const Card = ({ listFormCode, searchParams }: CardProps) => {
listFormCode={listFormCode}
dataSource={dataSource}
refreshData={loadData}
getCachedLookupDataSource={getCachedLookupDataSource} // 🔹 Prop olarak veriliyor
/>
)
})}