FormDevexpress Default Value değerleri düzenlendi
This commit is contained in:
parent
2df3e359c4
commit
5e6d2f518b
2 changed files with 127 additions and 45 deletions
|
|
@ -156,6 +156,7 @@ const FormDevExpress = (props: {
|
||||||
const formDataRef = useRef(formData)
|
const formDataRef = useRef(formData)
|
||||||
const formItemsRef = useRef(formItems)
|
const formItemsRef = useRef(formItems)
|
||||||
const formInstanceRef = useRef<any>()
|
const formInstanceRef = useRef<any>()
|
||||||
|
const lastContentReadyScriptKeyRef = useRef<string>()
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
formDataRef.current = formData
|
formDataRef.current = formData
|
||||||
|
|
@ -224,13 +225,77 @@ const FormDevExpress = (props: {
|
||||||
updateCascadeDisabledStates()
|
updateCascadeDisabledStates()
|
||||||
}, [formData, mode])
|
}, [formData, mode])
|
||||||
|
|
||||||
|
const runReadOnlyScripts = (form: any) => {
|
||||||
|
if (!form) return
|
||||||
|
|
||||||
|
const currentFormData = {
|
||||||
|
...(formDataRef.current || {}),
|
||||||
|
...(form?.option?.('formData') || {}),
|
||||||
|
}
|
||||||
|
formDataRef.current = currentFormData
|
||||||
|
|
||||||
|
formItemsRef.current
|
||||||
|
.flatMap((group) => flattenFormItems([group]))
|
||||||
|
.filter((formItem) => shouldRunEditorScriptOnContentReady(formItem.editorScript))
|
||||||
|
.forEach((formItem) => {
|
||||||
|
try {
|
||||||
|
const editor = {
|
||||||
|
dataField: formItem.dataField,
|
||||||
|
component: form,
|
||||||
|
}
|
||||||
|
const formData = currentFormData
|
||||||
|
const e = {
|
||||||
|
component: form,
|
||||||
|
dataField: formItem.dataField,
|
||||||
|
value: getValueByField(currentFormData, formItem.dataField),
|
||||||
|
}
|
||||||
|
const runtimeSetEditorReadOnly = (field: string, readOnly: boolean) =>
|
||||||
|
setFormEditorReadOnly(form, field, readOnly)
|
||||||
|
|
||||||
|
eval(formItem.editorScript!)
|
||||||
|
} catch (err) {
|
||||||
|
console.error('Script execution failed on contentReady for', formItem.name, err)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const form = formInstanceRef.current
|
||||||
|
if (!form || mode === 'view' || !formData || !formItems?.length) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const scriptFields = formItemsRef.current
|
||||||
|
.flatMap((group) => flattenFormItems([group]))
|
||||||
|
.filter((formItem) => shouldRunEditorScriptOnContentReady(formItem.editorScript))
|
||||||
|
.map((formItem) => formItem.dataField)
|
||||||
|
.join('|')
|
||||||
|
|
||||||
|
if (!scriptFields) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const scriptKey = `${mode}|${scriptFields}|${JSON.stringify(formData)}`
|
||||||
|
if (lastContentReadyScriptKeyRef.current === scriptKey) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
lastContentReadyScriptKeyRef.current = scriptKey
|
||||||
|
setTimeout(() => runReadOnlyScripts(form), 0)
|
||||||
|
}, [formData, formItems, mode])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<FormDx
|
<FormDx
|
||||||
ref={refForm}
|
ref={refForm}
|
||||||
className={`${DX_CLASSNAMES} ${!isSubForm ? 'px-2' : ''} pb-2`}
|
className={`${DX_CLASSNAMES} ${!isSubForm ? 'px-2' : ''} pb-2`}
|
||||||
formData={formData}
|
formData={formData}
|
||||||
onFieldDataChanged={async (e: FieldDataChangedEvent) => {
|
onFieldDataChanged={async (e: FieldDataChangedEvent) => {
|
||||||
const newFormData = { ...formData, [e.dataField!]: e.value }
|
if (!e.dataField) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const newFormData = { ...formData, [e.dataField]: e.value }
|
||||||
|
let hasChanges = !Object.is(formData?.[e.dataField], e.value)
|
||||||
|
|
||||||
// Cascading child field'leri temizle (parent field değiştiğinde)
|
// Cascading child field'leri temizle (parent field değiştiğinde)
|
||||||
const allItems = formItemsRef.current.flatMap((group) => flattenFormItems([group]))
|
const allItems = formItemsRef.current.flatMap((group) => flattenFormItems([group]))
|
||||||
|
|
@ -241,10 +306,15 @@ const FormDevExpress = (props: {
|
||||||
|
|
||||||
// Parent field değiştiğinde child field'leri temizle
|
// Parent field değiştiğinde child field'leri temizle
|
||||||
cascadingChildren.forEach((child) => {
|
cascadingChildren.forEach((child) => {
|
||||||
|
if (!Object.is(newFormData[child.dataField!], null)) {
|
||||||
newFormData[child.dataField!] = null
|
newFormData[child.dataField!] = null
|
||||||
|
hasChanges = true
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
if (hasChanges) {
|
||||||
setFormData(newFormData)
|
setFormData(newFormData)
|
||||||
|
}
|
||||||
|
|
||||||
// Cascade disabled durumlarını güncelle (setTimeout ile editor güncellemesinden sonra çalışsın)
|
// Cascade disabled durumlarını güncelle (setTimeout ile editor güncellemesinden sonra çalışsın)
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
|
@ -285,40 +355,8 @@ const FormDevExpress = (props: {
|
||||||
formInstanceRef.current = e.component
|
formInstanceRef.current = e.component
|
||||||
|
|
||||||
const form = e.component
|
const form = e.component
|
||||||
const runtimeSetEditorReadOnly = (field: string, readOnly: boolean) =>
|
|
||||||
setFormEditorReadOnly(form, field, readOnly)
|
|
||||||
|
|
||||||
const runReadOnlyScripts = () => {
|
runReadOnlyScripts(form)
|
||||||
const currentFormData = {
|
|
||||||
...(formDataRef.current || {}),
|
|
||||||
...(form?.option?.('formData') || {}),
|
|
||||||
}
|
|
||||||
formDataRef.current = currentFormData
|
|
||||||
|
|
||||||
formItemsRef.current
|
|
||||||
.flatMap((group) => flattenFormItems([group]))
|
|
||||||
.filter((formItem) => shouldRunEditorScriptOnContentReady(formItem.editorScript))
|
|
||||||
.forEach((formItem) => {
|
|
||||||
try {
|
|
||||||
const editor = {
|
|
||||||
dataField: formItem.dataField,
|
|
||||||
component: form,
|
|
||||||
}
|
|
||||||
const formData = currentFormData
|
|
||||||
const e = {
|
|
||||||
component: form,
|
|
||||||
dataField: formItem.dataField,
|
|
||||||
value: getValueByField(currentFormData, formItem.dataField),
|
|
||||||
}
|
|
||||||
|
|
||||||
eval(formItem.editorScript!)
|
|
||||||
} catch (err) {
|
|
||||||
console.error('Script execution failed on contentReady for', formItem.name, err)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
runReadOnlyScripts()
|
|
||||||
|
|
||||||
const groupItems = e.component.option('items') as any[]
|
const groupItems = e.component.option('items') as any[]
|
||||||
const firstItem = groupItems?.[0]?.items?.[0]
|
const firstItem = groupItems?.[0]?.items?.[0]
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@ import { Container, Loading } from '@/components/shared'
|
||||||
import { useLocalization } from '@/utils/hooks/useLocalization'
|
import { useLocalization } from '@/utils/hooks/useLocalization'
|
||||||
import { DataType } from 'devextreme/common'
|
import { DataType } from 'devextreme/common'
|
||||||
import { SimpleItem } from 'devextreme/ui/form'
|
import { SimpleItem } from 'devextreme/ui/form'
|
||||||
import { useEffect, useState } from 'react'
|
import { useEffect, useRef, useState } from 'react'
|
||||||
import { Helmet } from 'react-helmet'
|
import { Helmet } from 'react-helmet'
|
||||||
import { useNavigate, useParams, useSearchParams } from 'react-router-dom'
|
import { useNavigate, useParams, useSearchParams } from 'react-router-dom'
|
||||||
import FormButtons from './FormButtons'
|
import FormButtons from './FormButtons'
|
||||||
|
|
@ -12,6 +12,9 @@ import { useGridData } from './useFormData'
|
||||||
import { useCurrentMenuIcon } from '@/utils/hooks/useCurrentMenuIcon'
|
import { useCurrentMenuIcon } from '@/utils/hooks/useCurrentMenuIcon'
|
||||||
import { Badge } from '@/components/ui'
|
import { Badge } from '@/components/ui'
|
||||||
import { APP_NAME } from '@/constants/app.constant'
|
import { APP_NAME } from '@/constants/app.constant'
|
||||||
|
import { FieldCustomValueTypeEnum } from '@/proxy/form/models'
|
||||||
|
import { getNextSequenceValue } from '@/services/form.service'
|
||||||
|
import { autoNumber } from '../list/Utils'
|
||||||
|
|
||||||
const FormNew = (
|
const FormNew = (
|
||||||
props: FormProps = {
|
props: FormProps = {
|
||||||
|
|
@ -26,6 +29,7 @@ const FormNew = (
|
||||||
const { translate } = useLocalization()
|
const { translate } = useLocalization()
|
||||||
const MenuIcon = useCurrentMenuIcon('w-5 h-5')
|
const MenuIcon = useCurrentMenuIcon('w-5 h-5')
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
|
const initializedListFormCodeRef = useRef<string>()
|
||||||
|
|
||||||
const {
|
const {
|
||||||
fetchData,
|
fetchData,
|
||||||
|
|
@ -58,16 +62,34 @@ const FormNew = (
|
||||||
}, [searchParams, sParams])
|
}, [searchParams, sParams])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!formItems) {
|
initializedListFormCodeRef.current = undefined
|
||||||
|
}, [listFormCode])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!formItems?.length || !gridDto?.columnFormats) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
// Sadece formData yoksa (ilk yüklemede) initial data oluştur
|
if (initializedListFormCodeRef.current === listFormCode) {
|
||||||
// Kullanıcının girdiği bilgileri korumak için mevcut formData varsa setleme
|
return
|
||||||
if (!formData) {
|
|
||||||
setFormData(createInitialFormData())
|
|
||||||
}
|
}
|
||||||
}, [formItems])
|
|
||||||
|
initializedListFormCodeRef.current = listFormCode
|
||||||
|
let isActive = true
|
||||||
|
|
||||||
|
const initializeFormData = async () => {
|
||||||
|
const initialFormData = await createInitialFormData()
|
||||||
|
if (isActive) {
|
||||||
|
setFormData(initialFormData)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
initializeFormData()
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
isActive = false
|
||||||
|
}
|
||||||
|
}, [listFormCode, formItems?.length, gridDto?.columnFormats])
|
||||||
|
|
||||||
// newParams değiştiğinde sadece newParams'tan gelen alanları güncelle
|
// newParams değiştiğinde sadece newParams'tan gelen alanları güncelle
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
@ -146,7 +168,7 @@ const FormNew = (
|
||||||
}
|
}
|
||||||
}, [formItems, newParams, gridDto?.columnFormats])
|
}, [formItems, newParams, gridDto?.columnFormats])
|
||||||
|
|
||||||
function createInitialFormData() {
|
async function createInitialFormData() {
|
||||||
const data: any = {}
|
const data: any = {}
|
||||||
if (!formItems?.length) {
|
if (!formItems?.length) {
|
||||||
return data
|
return data
|
||||||
|
|
@ -173,7 +195,29 @@ const FormNew = (
|
||||||
continue
|
continue
|
||||||
}
|
}
|
||||||
|
|
||||||
if (colFormat.defaultValue != null) {
|
if (colFormat.defaultValue !== null && colFormat.defaultValue !== undefined) {
|
||||||
|
if (
|
||||||
|
typeof colFormat.defaultValue === 'string' &&
|
||||||
|
colFormat.defaultValue === '@AUTONUMBER'
|
||||||
|
) {
|
||||||
|
data[colFormat.fieldName] = autoNumber()
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
if (colFormat.defaultValueType === FieldCustomValueTypeEnum.Sequence) {
|
||||||
|
try {
|
||||||
|
const response = await getNextSequenceValue(String(colFormat.defaultValue))
|
||||||
|
data[colFormat.fieldName] = response.data
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Sequence default value alınamadı:', {
|
||||||
|
fieldName: colFormat.fieldName,
|
||||||
|
defaultValue: colFormat.defaultValue,
|
||||||
|
error,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
data[colFormat.fieldName] = colFormat.defaultValue
|
data[colFormat.fieldName] = colFormat.defaultValue
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue