sozsoft/sozsoft-platform
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Claude güncellemesi FormTab güncellemeri optimizasyon

Browse source
This commit is contained in:
Sedat ÖZTÜRK 2026-08-09 02:33:32 +03:00
parent 0d27742f8c
commit 56b74b85a5
28 changed files with 393 additions and 939 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
ui/src/views/admin/listForm/edit/ChartTabAnnotations.tsx
View file

@ -20,7 +20,7 @@ import Tr from '@/components/ui/Table/Tr'
import { SelectBoxOption } from '@/types/shared'
import { Field, FieldProps, Form, Formik } from 'formik'
import { FaEdit, FaFileMedical, FaTrash } from 'react-icons/fa'
import { object, string } from 'yup'
import { object } from 'yup'
import { FormEditProps } from './FormEdit'
import { useStoreState } from '@/store/store'
import { useLocalization } from '@/utils/hooks/useLocalization'
@ -35,9 +35,12 @@ import { JsonRowDialogData } from './json-row-operations/types'
import { useState } from 'react'
import JsonRowOpDialogAnnotation from './json-row-operations/JsonRowOpDialogAnnotation'
const schema = object().shape({
name: string().required(),
})
// Bu sekme ListForm nesnesinin tamamını düzenler; `name` / `title` / `height`
// gibi alanların girdisi burada yok. Şema bu alanları zorunlu tutuyordu ve
// ListForm'da boş olduklarında Kaydet hiçbir mesaj vermeden çalışmıyordu.
// (Zorunluluk, aynı adları gerçekten alan olarak barındıran JsonRowOpDialog*
// dosyalarından kopyalanmış.)
const schema = object()
function ChartTabAnnotations(props: FormEditProps) {
const [isJsonRowOpDialogOpen, setIsJsonRowOpDialogOpen] = useState(false)

12
ui/src/views/admin/listForm/edit/ChartTabAxis.tsx
View file

@ -24,7 +24,7 @@ import { FormEditProps } from '../../listForm/edit/FormEdit'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { useStoreState } from '@/store/store'
import { ListFormEditTabs } from '@/proxy/admin/list-form/options'
import { object, string } from 'yup'
import { object } from 'yup'
import {
chartArgumentAxisHoverModeListOptions,
chartArgumentAxisTypeListOptions,
@ -37,10 +37,12 @@ import { useState } from 'react'
import { JsonRowDialogData } from './json-row-operations/types'
import JsonRowOpDialogAxis from './json-row-operations/JsonRowOpDialogAxis'
const schema = object().shape({
name: string().required(),
title: string().required(),
})
// Bu sekme ListForm nesnesinin tamamını düzenler; `name` / `title` / `height`
// gibi alanların girdisi burada yok. Şema bu alanları zorunlu tutuyordu ve
// ListForm'da boş olduklarında Kaydet hiçbir mesaj vermeden çalışmıyordu.
// (Zorunluluk, aynı adları gerçekten alan olarak barındıran JsonRowOpDialog*
// dosyalarından kopyalanmış.)
const schema = object()
function ChartTabAxis(props: FormEditProps) {
const [isJsonRowOpDialogOpen, setIsJsonRowOpDialogOpen] = useState(false)

13
ui/src/views/admin/listForm/edit/ChartTabPanes.tsx
View file

@ -10,16 +10,17 @@ import { FormEditProps } from '../../listForm/edit/FormEdit'
import { useStoreState } from '@/store/store'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { ListFormEditTabs } from '@/proxy/admin/list-form/options'
import { object, string } from 'yup'
import { object } from 'yup'
import { JsonRowDialogData } from './json-row-operations/types'
import { useState } from 'react'
import JsonRowOpDialogPane from './json-row-operations/JsonRowOpDialogPane'
const schema = object().shape({
height: string().required(),
name: string().required(),
backgroundColor: string().notRequired(),
})
// Bu sekme ListForm nesnesinin tamamını düzenler; `name` / `title` / `height`
// gibi alanların girdisi burada yok. Şema bu alanları zorunlu tutuyordu ve
// ListForm'da boş olduklarında Kaydet hiçbir mesaj vermeden çalışmıyordu.
// (Zorunluluk, aynı adları gerçekten alan olarak barındıran JsonRowOpDialog*
// dosyalarından kopyalanmış.)
const schema = object()
function ChartTabPanes(props: FormEditProps) {
const [isJsonRowOpDialogOpen, setIsJsonRowOpDialogOpen] = useState(false)

11
ui/src/views/admin/listForm/edit/ChartTabSeries.tsx
View file

@ -28,7 +28,7 @@ import { FormEditProps } from '../../listForm/edit/FormEdit'
import { ListFormEditTabs } from '@/proxy/admin/list-form/options'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { useStoreState } from '@/store/store'
import { object, string } from 'yup'
import { object } from 'yup'
import {
chartSeriesTypeOptions,
chartSeriesSelectionModeOptions,
@ -41,9 +41,12 @@ import CreatableSelect from 'react-select/creatable'
import { getListFormFields } from '@/services/admin/list-form-field.service'
import groupBy from 'lodash/groupBy'
const schema = object().shape({
name: string().required(),
})
// Bu sekme ListForm nesnesinin tamamını düzenler; `name` / `title` / `height`
// gibi alanların girdisi burada yok. Şema bu alanları zorunlu tutuyordu ve
// ListForm'da boş olduklarında Kaydet hiçbir mesaj vermeden çalışmıyordu.
// (Zorunluluk, aynı adları gerçekten alan olarak barındıran JsonRowOpDialog*
// dosyalarından kopyalanmış.)
const schema = object()
function ChartTabSeries(props: FormEditProps & { listFormCode: string }) {
const [isJsonRowOpDialogOpen, setIsJsonRowOpDialogOpen] = useState(false)

1
ui/src/views/admin/listForm/edit/FormTabDatabaseDataSource.tsx
View file

@ -120,6 +120,7 @@ function FormTabDatabaseDataSource(props: FormEditProps) {
return (
<Container>
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {

1
ui/src/views/admin/listForm/edit/FormTabDatabaseDelete.tsx
View file

@ -42,6 +42,7 @@ function FormTabDatabaseDelete({
return (
<Container>
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {

1
ui/src/views/admin/listForm/edit/FormTabDatabaseInsert.tsx
View file

@ -42,6 +42,7 @@ function FormTabDatabaseInsert({
return (
<Container>
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {

1
ui/src/views/admin/listForm/edit/FormTabDatabaseSelect.tsx
View file

@ -42,6 +42,7 @@ function FormTabDatabaseSelect({
return (
<Container>
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {

1
ui/src/views/admin/listForm/edit/FormTabDatabaseUpdate.tsx
View file

@ -42,6 +42,7 @@ function FormTabDatabaseUpdate({
return (
<Container>
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {

18
ui/src/views/admin/listForm/edit/FormTabPermissions.tsx
View file

@ -11,14 +11,18 @@ import { FormEditProps } from './FormEdit'
import { PermissionDefinitionRecord } from '@/proxy/admin/models'
import { getPermissionsList } from '@/services/identity.service'
// Alanlar `permissionDto.*` altında; şema düz kökten tanımlandığı için hiçbir
// şeyi doğrulamıyordu.
const schema = object().shape({
c: string(),
r: string(),
u: string(),
d: string(),
e: string(),
i: string(),
n: string(),
permissionDto: object().shape({
c: string().nullable(),
r: string().nullable(),
u: string().nullable(),
d: string().nullable(),
e: string().nullable(),
i: string().nullable(),
n: string().nullable(),
}),
})
function FormTabPermissions(props: FormEditProps) {

1
ui/src/views/admin/listForm/edit/FormTabWorkflow.tsx
View file

@ -329,6 +329,7 @@ export function FormTabWorkflow(
return (
<div>
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {

21
ui/src/views/admin/listForm/edit/form-fields/FormFieldEdit.tsx
View file

@ -2,21 +2,20 @@ import { Tabs } from '@/components/ui'
import TabContent from '@/components/ui/Tabs/TabContent'
import TabList from '@/components/ui/Tabs/TabList'
import TabNav from '@/components/ui/Tabs/TabNav'
import { ColumnFormatEditDto } from '@/proxy/admin/list-form-field/models'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { useLocalization } from '@/utils/hooks/useLocalization'
import FormFieldTabConditionalFormatting from './FormFieldTabConditionalFormatting'
import FormFieldTabCssOptions from './FormFieldTabCssOptions'
import FormFieldTabCustomization from './FormFieldTabCustomization'
import FormFieldTabDetails from './FormFieldTabDetails'
import FormFieldTabFiltering from './FormFieldTabFiltering'
import FormFieldTabGroupSummary from './FormFieldTabGroupSummary'
import FormFieldTabGrouping from './FormFieldTabGrouping'
import FormFieldTabHeadering from './FormFieldTabHeadering'
import FormFieldTabJoinOptions from './FormFieldTabJoinOptions'
import FormFieldTabLookup from './FormFieldTabLookup'
import FormFieldTabOptions from './FormFieldTabOptions'
import FormFieldTabPermissions from './FormFieldTabPermissions'
import FormFieldTabTotalSummary from './FormFieldTabTotalSummary'
import FormFieldTabSummary from './FormFieldTabSummary'
import FormFieldTabValidationRules from './FormFieldTabValidationRules'
import { FormFieldEditProps } from './FormFields'
import FormFieldTabPivotSetting from './FormFieldTabPivotSetting'
@ -104,10 +103,22 @@ function FormFieldEdit({
<FormFieldTabGrouping initialValues={item} onSubmit={onSubmit} />
</TabContent>
<TabContent value="groupSummary">
<FormFieldTabGroupSummary initialValues={item} fields={fields} onSubmit={onSubmit} />
<FormFieldTabSummary
dtoKey="columnGroupSummaryDto"
editTab={ListFormFieldEditTabs.GroupSummaryForm}
initialValues={item}
fields={fields}
onSubmit={onSubmit}
/>
</TabContent>
<TabContent value="totalSummary">
<FormFieldTabTotalSummary initialValues={item} fields={fields} onSubmit={onSubmit} />
<FormFieldTabSummary
dtoKey="columnTotalSummaryDto"
editTab={ListFormFieldEditTabs.TotalSummaryForm}
initialValues={item}
fields={fields}
onSubmit={onSubmit}
/>
</TabContent>
<TabContent value="joinOptions">
<FormFieldTabJoinOptions initialValues={item} onSubmit={onSubmit} />

32
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabConditionalFormatting.tsx
View file

@ -7,7 +7,6 @@ import {
FormItem,
Input,
Notification,
Select,
Table,
toast,
} from '@/components/ui'
@ -20,7 +19,7 @@ import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-f
import { useLocalization } from '@/utils/hooks/useLocalization'
import setNull from '@/utils/setNull'
import { Field, FieldProps, Form, Formik } from 'formik'
import { Field, Form, Formik } from 'formik'
import { useState } from 'react'
import { FaEdit, FaPlusSquare, FaCheck, FaTrashAlt } from 'react-icons/fa'
import { object, string } from 'yup'
@ -32,6 +31,7 @@ import {
ColumnStylingDto,
ColumnValidationComparisonTypeEnum,
} from '@/proxy/form/models'
import SelectField from '../shared/SelectField'
const NewItem: ColumnStylingDto = {
rowType: ColumnRowTypeListOptions.Data,
@ -225,19 +225,11 @@ function FormFieldTabConditionalFormatting({
invalid={errors.rowType && touched.rowType}
errorMessage={errors.rowType}
>
<Field type="text" autoComplete="off" name="rowType" placeholder="Row Type">
{({ field, form }: FieldProps<ColumnRowTypeListOptions>) => (
<Select
field={field}
form={form}
<SelectField
name="rowType"
options={columnRowTypeListOptions}
value={columnRowTypeListOptions.filter(
(option: any) => option.value === values.rowType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
isClearable={false}
/>
)}
</Field>
</FormItem>
<FormItem
@ -255,19 +247,11 @@ function FormFieldTabConditionalFormatting({
invalid={errors.condition && touched.condition}
errorMessage={errors.condition}
>
<Field type="text" autoComplete="off" name="condition" placeholder="Condition">
{({ field, form }: FieldProps<ColumnValidationComparisonTypeEnum>) => (
<Select
field={field}
form={form}
<SelectField
name="condition"
options={columnValidationComparisonTypeListOptions}
value={columnValidationComparisonTypeListOptions.filter(
(option: any) => option.value === values.condition,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
isClearable={false}
/>
)}
</Field>
</FormItem>
<FormItem

21
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabCustomization.tsx
View file

@ -1,13 +1,13 @@
import { Container } from '@/components/shared'
import { Button, Checkbox, FormContainer, FormItem, Select } from '@/components/ui'
import { Button, Checkbox, FormContainer, FormItem } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { SelectBoxOption } from '@/types/shared'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, FieldProps, Form, Formik } from 'formik'
import { Field, Form, Formik } from 'formik'
import { bool, object, string } from 'yup'
import { fixedPositionOptions } from '../options'
import { FormFieldEditProps } from './FormFields'
import { FixedPositionEnum } from '@/proxy/form/models'
import SelectField from '../shared/SelectField'
const schema = object().shape({
columnCustomizationDto: object()
@ -51,21 +51,10 @@ function FormFieldTabCustomization({
<FormItem
label={translate('::ListForms.ListFormFieldEdit.CustomizationFixedPosition')}
>
<Field type="text" name="columnCustomizationDto.fixedPosition">
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="columnCustomizationDto.fixedPosition"
options={fixedPositionOptions}
value={fixedPositionOptions.filter(
(option: any) =>
option.value === values?.columnCustomizationDto?.fixedPosition,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<Button block size="sm" className="mt-1" variant="solid" loading={isSubmitting} type="submit">

49
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabDetails.tsx
View file

@ -1,8 +1,7 @@
import { Button, Card, Checkbox, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, Checkbox, FormItem, Input } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { SelectBoxOption } from '@/types/shared'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, FieldProps, Form, Formik } from 'formik'
import { Field, Form, Formik } from 'formik'
import { useState } from 'react'
import { FaSlidersH } from 'react-icons/fa'
import { bool, number, object, string } from 'yup'
@ -11,6 +10,7 @@ import EditorOptionsBuilderDialog from '../json-row-operations/EditorOptionsBuil
import { isValidJsonText } from '../json-row-operations/editor-options/jsonUtils'
import { FormFieldEditProps } from './FormFields'
import { tooltipFormatListOptions } from '@/proxy/admin/list-form/options'
import SelectField from '../shared/SelectField'
const schema = object().shape({
fieldName: string().required().max(100),
@ -119,52 +119,23 @@ function FormFieldTabDetails({
errorMessage={errors.sourceDbType as string}
>
{/* Temizlenirse zorunlu alan doğrulaması formu sessizce bloke ediyordu. */}
<Field type="text" name="sourceDbType">
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={false}
<SelectField
name="sourceDbType"
options={dbSourceTypeOptions}
value={dbSourceTypeOptions.filter(
(option: any) => option.value === values.sourceDbType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
isClearable={false}
/>
)}
</Field>
</FormItem>
<FormItem label={translate('::ListForms.ListFormFieldEdit.DetailsAlignment')}>
<Field type="text" name="alignment">
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="alignment"
options={listFormAlignmentOptions}
value={listFormAlignmentOptions.filter(
(option) => option.value === values.alignment,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem label={translate('::ListForms.ListFormFieldEdit.DetailsFormat')}>
<Field type="text" name="format">
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="format"
options={tooltipFormatListOptions}
value={tooltipFormatListOptions.filter(
(option) => option.value === values.format,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.DetailsEditorOptions')}

188
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabGroupSummary.tsx
View file

@ -1,188 +0,0 @@
import { Container } from '@/components/shared'
import { Button, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, FieldProps, Form, Formik } from 'formik'
import { bool, object, string } from 'yup'
import { columnSummaryTypeListOptions } from '../options'
import { FormFieldEditProps } from './FormFields'
import { tooltipFormatListOptions } from '@/proxy/admin/list-form/options'
import { SelectBoxOption } from '@/types/shared'
const schema = object().shape({
columnGroupingDto: object()
.shape({
summaryType: string(),
valueFormat: string(),
showInGroupFooter: bool(),
alignByColumn: bool(),
displayFormat: string(),
showInColumn: string(),
})
.required(),
})
function FormFieldTabGroupSummary({
initialValues,
onSubmit,
fields,
}: {
initialValues: ColumnFormatEditDto
fields: ColumnFormatEditDto[]
} & FormFieldEditProps) {
const { translate } = useLocalization()
const fieldList: SelectBoxOption[] = fields.length
? fields.map((field) => ({
value: field.fieldName,
label: `${field.fieldName}`,
}))
: []
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {
await onSubmit(ListFormFieldEditTabs.GroupSummaryForm, values, formikHelpers)
}}
>
{({ touched, errors, isSubmitting, values }) => (
<Form>
<FormContainer size="sm">
<FormItem label={translate('::ListForms.ListFormFieldEdit.SummaryType')}>
<Field
type="text"
autoComplete="off"
name="columnGroupSummaryDto.summaryType"
placeholder={translate('::ListForms.ListFormFieldEdit.SummaryType')}
>
{({ field, form }: FieldProps<any>) => (
<Select
field={field}
form={form}
isClearable={true}
options={columnSummaryTypeListOptions}
value={columnSummaryTypeListOptions.filter(
(option) => option.value === values.columnGroupSummaryDto.summaryType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat')}
>
<Field
type="text"
autoComplete="off"
name="columnGroupSummaryDto.valueFormat"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat',
)}
>
{({ field, form }: FieldProps<any>) => (
<Select
field={field}
form={form}
isClearable={true}
options={tooltipFormatListOptions}
value={tooltipFormatListOptions.filter(
(option) => option.value === values.columnGroupSummaryDto.valueFormat,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryDisplayFormat')}
invalid={
errors.columnGroupSummaryDto?.displayFormat &&
touched.columnGroupSummaryDto?.displayFormat
}
errorMessage={errors.columnGroupSummaryDto?.displayFormat}
>
<Field
type="text"
autoComplete="off"
name="columnGroupSummaryDto.displayFormat"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryDisplayFormat',
)}
component={Input}
/>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryShowInColumn')}
invalid={
errors.columnGroupSummaryDto?.showInColumn &&
touched.columnGroupSummaryDto?.showInColumn
}
errorMessage={errors.columnGroupSummaryDto?.showInColumn}
>
<Field
type="text"
autoFocus={true}
name="columnGroupSummaryDto.showInColumn"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryShowInColumn',
)}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={fieldList}
value={fieldList.filter(
(option) => option.value === values.columnGroupSummaryDto?.showInColumn,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryShowInGroupFooter')}
>
<Field
name="columnGroupSummaryDto.showInGroupFooter"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryShowInGroupFooter',
)}
component={Checkbox}
/>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryAlignByColumn')}
>
<Field
name="columnGroupSummaryDto.alignByColumn"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryAlignByColumn',
)}
component={Checkbox}
/>
</FormItem>
<Button block size="sm" variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::Saving') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}
export default FormFieldTabGroupSummary

39
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabJoinOptions.tsx
View file

@ -1,4 +1,4 @@
import { Button, Card, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, FormItem, Input } from '@/components/ui'
import {
ColumnFormatEditDto,
GridColumnJoinConditionEnum,
@ -6,10 +6,11 @@ import {
ListFormFieldEditTabs,
} from '@/proxy/admin/list-form-field/models'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, FieldProps, Form, Formik } from 'formik'
import { Field, Form, Formik } from 'formik'
import { object, string } from 'yup'
import { gridColumnJoinConditionOptions, gridColumnJoinTypeListOptions } from '../options'
import { FormFieldEditProps } from './FormFields'
import SelectField from '../shared/SelectField'
const schema = object().shape({
columnJoinTableDto: object()
@ -53,25 +54,10 @@ function FormFieldTabJoinOptions({
labelWidth="40%"
label={translate('::ListForms.ListFormFieldEdit.JoinOptionsJoinType')}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="columnJoinTableDto.joinType"
placeholder={translate('::ListForms.ListFormFieldEdit.JoinOptionsJoinType')}
>
{({ field, form }: FieldProps<GridColumnJoinTypeListEnum>) => (
<Select
field={field}
form={form}
isClearable={true}
options={gridColumnJoinTypeListOptions}
value={gridColumnJoinTypeListOptions.filter(
(option) => option.value === values.columnJoinTableDto.joinType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -171,25 +157,10 @@ function FormFieldTabJoinOptions({
}
errorMessage={errors.columnJoinTableDto?.joinCondition2}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="columnJoinTableDto.joinCondition2"
placeholder={translate('::ListForms.ListFormFieldEdit.JoinOptionsJoinCondition2')}
>
{({ field, form }: FieldProps<GridColumnJoinConditionEnum>) => (
<Select
field={field}
form={form}
isClearable={true}
options={gridColumnJoinConditionOptions}
value={gridColumnJoinConditionOptions.filter(
(option) => option.value === values.columnJoinTableDto.joinCondition2,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem

40
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabLookup.tsx
View file

@ -1,8 +1,7 @@
import { Button, Card, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, FormItem, Input } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import type { DatabaseColumnDto, SqlObjectExplorerDto } from '@/proxy/sql-query-manager/models'
import { sqlObjectManagerService } from '@/services/sql-query-manager.service'
import { SelectBoxOption } from '@/types/shared'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { useStoreState } from '@/store/store'
import { Field, FieldProps, Form, Formik } from 'formik'
@ -13,6 +12,7 @@ import { cascadeFilterOperator, columnLookupDataSourceTypeListOptions } from '..
import { FormFieldEditProps } from './FormFields'
import { ColumnCascadeFilterOperatorEnum, UiLookupDataSourceTypeEnum } from '@/proxy/form/models'
import { buildLookupQuery } from '../../lookupQuery'
import SelectField from '../shared/SelectField'
const schema = object().shape({
lookupDto: object()
@ -288,25 +288,10 @@ function FormFieldTabLookup({
invalid={errors.lookupDto?.dataSourceType && touched.lookupDto?.dataSourceType}
errorMessage={errors.lookupDto?.dataSourceType}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="lookupDto.dataSourceType"
placeholder={translate('::ListForms.ListFormFieldEdit.LookupDataSourceType')}
>
{({ field, form }: FieldProps<UiLookupDataSourceTypeEnum>) => (
<Select
field={field}
form={form}
isClearable={true}
options={columnLookupDataSourceTypeListOptions}
value={columnLookupDataSourceTypeListOptions.filter(
(option: any) => option.value === values.lookupDto?.dataSourceType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -406,27 +391,10 @@ function FormFieldTabLookup({
}
errorMessage={errors.lookupDto?.cascadeFilterOperator}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="lookupDto.cascadeFilterOperator"
placeholder={translate(
'::ListForms.ListFormFieldEdit.LookupCascadeFilterOperator',
)}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={cascadeFilterOperator}
value={cascadeFilterOperator.filter(
(option: any) => option.value === values.lookupDto?.cascadeFilterOperator,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem

15
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabOptions.tsx
View file

@ -10,6 +10,7 @@ import { EditingFormDto, SortDirectionEnum } from '@/proxy/form/models'
import { FaCode } from 'react-icons/fa'
import { useState } from 'react'
import EditorScriptBuilderDialog from '../json-row-operations/EditorScriptBuilderDialog'
import SelectField from '../shared/SelectField'
const schema = object().shape({
listOrderNo: number(),
@ -81,20 +82,10 @@ function FormFieldTabOptions({
invalid={errors.sortDirection && touched.sortDirection}
errorMessage={errors.sortDirection}
>
<Field type="text" name="sortDirection">
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="sortDirection"
options={sortDirectionOptions}
value={sortDirectionOptions.filter(
(option: any) => option.value === values.sortDirection,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.OptionsSortIndex')}

18
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabPermissions.tsx
View file

@ -8,6 +8,7 @@ import { useEffect, useState } from 'react'
import { bool, object, string } from 'yup'
import { FormFieldEditProps } from './FormFields'
import { getPermissions } from '@/services/identity.service'
import SelectField from '../shared/SelectField'
const schema = object().shape({
permissionDto: object().shape({
@ -72,25 +73,10 @@ function FormFieldTabPermissions({
invalid={errors.permissionDto?.r && touched.permissionDto?.r}
errorMessage={errors.permissionDto?.r}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="permissionDto.r"
placeholder={translate('::Read')}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={permissionOptions}
value={permissionOptions.filter(
(option) => option.value === values.permissionDto?.r,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::Create')}

101
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabPivotSetting.tsx
View file

@ -1,10 +1,9 @@
import { Button, Card, Checkbox, FormItem, Select } from '@/components/ui'
import { Button, Card, Checkbox, FormItem } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, FieldProps, Form, Formik } from 'formik'
import { Field, Form, Formik } from 'formik'
import { boolean, object, string } from 'yup'
import { FormFieldEditProps } from './FormFields'
import { SelectBoxOption } from '@/types/shared'
import {
columnSummaryTypeListOptions,
pivotSettingsAreaOptions,
@ -12,16 +11,19 @@ import {
pivotSortDirectionOptions,
} from '../options'
import { tooltipFormatListOptions } from '@/proxy/admin/list-form/options'
import SelectField from '../shared/SelectField'
const schema = object().shape({
pivotSettingsDto: object().shape({
isPivot: boolean(),
expanded: boolean(),
sortOrder: string(),
// Bu alanlar temizlenebilir Select'e bağlı; format listesindeki "None"
// seçeneği null döndürüyor ve nullable olmadan Kaydet sessizce iptal oluyor.
sortOrder: string().nullable(),
area: string().required(),
format: string(),
summaryType: string(),
groupInterval: string(),
format: string().nullable(),
summaryType: string().nullable(),
groupInterval: string().nullable(),
wordWrapEnabled: boolean(),
}),
})
@ -60,25 +62,10 @@ function FormFieldTabPivotSetting({
invalid={errors.pivotSettingsDto?.area && touched.pivotSettingsDto?.area}
errorMessage={errors.pivotSettingsDto?.area}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="pivotSettingsDto.area"
placeholder={translate('::ListForms.ListFormFieldEdit.PivotSettingArea')}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={pivotSettingsAreaOptions}
value={pivotSettingsAreaOptions.filter(
(option: any) => option.value === values.pivotSettingsDto?.area,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -86,25 +73,10 @@ function FormFieldTabPivotSetting({
invalid={errors.pivotSettingsDto?.format && touched.pivotSettingsDto?.format}
errorMessage={errors.pivotSettingsDto?.format}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="pivotSettingsDto.format"
placeholder={translate('::ListForms.ListFormFieldEdit.DetailsFormat')}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={tooltipFormatListOptions}
value={tooltipFormatListOptions.filter(
(option) => option.value === values.pivotSettingsDto?.format,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -114,25 +86,10 @@ function FormFieldTabPivotSetting({
}
errorMessage={errors.pivotSettingsDto?.summaryType}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="pivotSettingsDto.summaryType"
placeholder={translate('::ListForms.ListFormFieldEdit.SummaryType')}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={columnSummaryTypeListOptions}
value={columnSummaryTypeListOptions.filter(
(option: any) => option.value === values.pivotSettingsDto?.summaryType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
</Card>
@ -144,25 +101,10 @@ function FormFieldTabPivotSetting({
}
errorMessage={errors.pivotSettingsDto?.groupInterval}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="pivotSettingsDto.groupInterval"
placeholder={translate('::ListForms.ListFormFieldEdit.PivotSettingGroupInterval')}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={pivotSettingsGroupIntervalOptions}
value={pivotSettingsGroupIntervalOptions.filter(
(option: any) => option.value === values.pivotSettingsDto?.groupInterval,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -170,25 +112,10 @@ function FormFieldTabPivotSetting({
invalid={errors.pivotSettingsDto?.sortOrder && touched.pivotSettingsDto?.sortOrder}
errorMessage={errors.pivotSettingsDto?.sortOrder}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="pivotSettingsDto.sortOrder"
placeholder={translate('::ListForms.ListFormFieldEdit.PivotSettingSortOrder')}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={pivotSortDirectionOptions}
value={pivotSortDirectionOptions.filter(
(option: any) => option.value === values.pivotSettingsDto?.sortOrder,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem

119
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabSummary.tsx Normal file
View file

@ -0,0 +1,119 @@
import { Container } from '@/components/shared'
import { Button, Checkbox, FormContainer, FormItem, Input } from '@/components/ui'
import { ColumnFormatEditDto } from '@/proxy/admin/list-form-field/models'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, Form, Formik } from 'formik'
import { bool, object, string } from 'yup'
import { columnSummaryTypeListOptions } from '../options'
import { FormFieldEditProps } from './FormFields'
import { tooltipFormatListOptions } from '@/proxy/admin/list-form/options'
import { SelectBoxOption } from '@/types/shared'
import SelectField from '../shared/SelectField'
/**
* Grup özeti ve genel toplam sekmelerinin ortak gövdesi.
*
* İki sekme yalnızca hangi DTO'yu düzenlediği ve hangi editType ile kaydettiği
* konusunda ayrışıyordu; dosyalar bunun dışında birebir aynıydı.
*/
type SummaryDtoKey = 'columnGroupSummaryDto' | 'columnTotalSummaryDto'
// Temizlenebilir Select'ler null yazabildiği için tüm metin alanları nullable.
const buildSchema = (dtoKey: SummaryDtoKey) =>
object().shape({
[dtoKey]: object().shape({
summaryType: string().nullable(),
valueFormat: string().nullable(),
showInGroupFooter: bool(),
alignByColumn: bool(),
displayFormat: string().nullable(),
showInColumn: string().nullable(),
}),
})
function FormFieldTabSummary({
initialValues,
onSubmit,
fields,
dtoKey,
editTab,
}: {
initialValues: ColumnFormatEditDto
fields: ColumnFormatEditDto[]
dtoKey: SummaryDtoKey
editTab: string
} & FormFieldEditProps) {
const { translate } = useLocalization()
const fieldList: SelectBoxOption[] = fields.map((field) => ({
value: field.fieldName,
label: `${field.fieldName}`,
}))
const schema = buildSchema(dtoKey)
const label = (key: string) => translate(`::ListForms.ListFormFieldEdit.${key}`)
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {
await onSubmit(editTab, values, formikHelpers)
}}
>
{({ isSubmitting }) => (
<Form>
<FormContainer size="sm">
<FormItem label={label('SummaryType')}>
<SelectField
name={`${dtoKey}.summaryType`}
options={columnSummaryTypeListOptions}
/>
</FormItem>
<FormItem label={label('GroupingSummaryValueFormat')}>
<SelectField
name={`${dtoKey}.valueFormat`}
options={tooltipFormatListOptions}
/>
</FormItem>
<FormItem label={label('GroupingSummaryDisplayFormat')}>
<Field
type="text"
autoComplete="off"
name={`${dtoKey}.displayFormat`}
placeholder={label('GroupingSummaryDisplayFormat')}
component={Input}
/>
</FormItem>
<FormItem label={label('GroupingSummaryShowInColumn')}>
<SelectField
name={`${dtoKey}.showInColumn`}
options={fieldList}
/>
</FormItem>
<FormItem label={label('GroupingSummaryShowInGroupFooter')}>
<Field name={`${dtoKey}.showInGroupFooter`} component={Checkbox} />
</FormItem>
<FormItem label={label('GroupingSummaryAlignByColumn')}>
<Field name={`${dtoKey}.alignByColumn`} component={Checkbox} />
</FormItem>
<Button block size="sm" variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::Saving') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}
export default FormFieldTabSummary

188
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabTotalSummary.tsx
View file

@ -1,188 +0,0 @@
import { Container } from '@/components/shared'
import { Button, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, FieldProps, Form, Formik } from 'formik'
import { bool, object, string } from 'yup'
import { columnSummaryTypeListOptions } from '../options'
import { FormFieldEditProps } from './FormFields'
import { tooltipFormatListOptions } from '@/proxy/admin/list-form/options'
import { SelectBoxOption } from '@/types/shared'
const schema = object().shape({
columnTotalSummaryDto: object()
.shape({
summaryType: string(),
valueFormat: string(),
showInGroupFooter: bool(),
alignByColumn: bool(),
displayFormat: string(),
showInColumn: string(),
})
.required(),
})
function FormFieldTabTotalSummary({
initialValues,
onSubmit,
fields,
}: {
initialValues: ColumnFormatEditDto
fields: ColumnFormatEditDto[]
} & FormFieldEditProps) {
const { translate } = useLocalization()
const fieldList: SelectBoxOption[] = fields.length
? fields.map((field) => ({
value: field.fieldName,
label: `${field.fieldName}`,
}))
: []
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={initialValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {
await onSubmit(ListFormFieldEditTabs.TotalSummaryForm, values, formikHelpers)
}}
>
{({ touched, errors, isSubmitting, values }) => (
<Form>
<FormContainer size="sm">
<FormItem label={translate('::ListForms.ListFormFieldEdit.SummaryType')}>
<Field
type="text"
autoComplete="off"
name="columnTotalSummaryDto.summaryType"
placeholder={translate('::ListForms.ListFormFieldEdit.SummaryType')}
>
{({ field, form }: FieldProps<any>) => (
<Select
field={field}
form={form}
isClearable={true}
options={columnSummaryTypeListOptions}
value={columnSummaryTypeListOptions.filter(
(option) => option.value === values.columnTotalSummaryDto.summaryType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat')}
>
<Field
type="text"
autoComplete="off"
name="columnTotalSummaryDto.valueFormat"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat',
)}
>
{({ field, form }: FieldProps<any>) => (
<Select
field={field}
form={form}
isClearable={true}
options={tooltipFormatListOptions}
value={tooltipFormatListOptions.filter(
(option) => option.value === values.columnTotalSummaryDto.valueFormat,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryDisplayFormat')}
invalid={
errors.columnTotalSummaryDto?.displayFormat &&
touched.columnTotalSummaryDto?.displayFormat
}
errorMessage={errors.columnTotalSummaryDto?.displayFormat}
>
<Field
type="text"
autoComplete="off"
name="columnTotalSummaryDto.displayFormat"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryDisplayFormat',
)}
component={Input}
/>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryShowInColumn')}
invalid={
errors.columnTotalSummaryDto?.showInColumn &&
touched.columnTotalSummaryDto?.showInColumn
}
errorMessage={errors.columnTotalSummaryDto?.showInColumn}
>
<Field
type="text"
autoFocus={true}
name="columnTotalSummaryDto.showInColumn"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryShowInColumn',
)}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={fieldList}
value={fieldList.filter(
(option) => option.value === values.columnTotalSummaryDto?.showInColumn,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryShowInGroupFooter')}
>
<Field
name="columnTotalSummaryDto.showInGroupFooter"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryShowInGroupFooter',
)}
component={Checkbox}
/>
</FormItem>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryAlignByColumn')}
>
<Field
name="columnTotalSummaryDto.alignByColumn"
placeholder={translate(
'::ListForms.ListFormFieldEdit.GroupingSummaryAlignByColumn',
)}
component={Checkbox}
/>
</FormItem>
<Button block size="sm" className="mt-1" variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::Saving') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}
export default FormFieldTabTotalSummary

35
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabValidationRules.tsx
View file

@ -7,7 +7,6 @@ import {
FormItem,
Input,
Notification,
Select,
Table,
toast,
} from '@/components/ui'
@ -21,7 +20,7 @@ import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-f
import { useLocalization } from '@/utils/hooks/useLocalization'
import setNull from '@/utils/setNull'
import { Field, FieldProps, Form, Formik } from 'formik'
import { Field, Form, Formik } from 'formik'
import { useState } from 'react'
import { FaEdit, FaPlusSquare, FaCheck, FaTrashAlt } from 'react-icons/fa'
import { bool, object, string } from 'yup'
@ -35,6 +34,7 @@ import {
ColumnValidationTypeListEnum,
ValidationRuleDto,
} from '@/proxy/form/models'
import SelectField from '../shared/SelectField'
const NewItem: ValidationRuleDto = {
type: ColumnValidationTypeListEnum.None,
@ -235,20 +235,10 @@ function FormFieldTabValidationRules({
invalid={errors.type && touched.type}
errorMessage={errors.type}
>
<Field type="text" autoComplete="off" name="type" placeholder="Type">
{({ field, form }: FieldProps<ColumnValidationTypeListEnum>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="type"
options={columnValidationTypeListOptions}
value={columnValidationTypeListOptions.filter(
(option: any) => option.value === values.type,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -290,25 +280,10 @@ function FormFieldTabValidationRules({
invalid={errors.comparisonType && touched.comparisonType}
errorMessage={errors.comparisonType}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="comparisonType"
placeholder="Comparison Type"
>
{({ field, form }: FieldProps<ColumnValidationComparisonTypeEnum>) => (
<Select
field={field}
form={form}
isClearable={true}
options={columnValidationComparisonTypeListOptions}
value={columnValidationComparisonTypeListOptions.filter(
(option: any) => option.value === values.comparisonType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem

196
ui/src/views/admin/listForm/edit/form-fields/FormFields.tsx
View file

@ -8,7 +8,6 @@ import {
FormItem,
Input,
Notification,
Select,
Table,
toast,
} from '@/components/ui'
@ -34,7 +33,7 @@ import { useStoreState } from '@/store'
import { useLocalization } from '@/utils/hooks/useLocalization'
import setNull from '@/utils/setNull'
import classNames from 'classnames'
import { Field, FieldProps, Form, Formik, FormikHelpers } from 'formik'
import { Field, Form, Formik, FormikHelpers } from 'formik'
import { useCallback, useEffect, useState } from 'react'
import { FaFileMedical, FaCopy, FaEyeSlash, FaMinus, FaTimes, FaTable } from 'react-icons/fa'
import { number, object, string } from 'yup'
@ -44,6 +43,7 @@ import { IdentityRoleDto, IdentityUserDto } from '@/proxy/admin/models'
import { sqlObjectManagerService } from '@/services/sql-query-manager.service'
import type { DatabaseColumnDto } from '@/proxy/sql-query-manager/models'
import type { EditingFormDto } from '@/proxy/form/models'
import SelectField from '../shared/SelectField'
export interface FormFieldEditProps {
onSubmit: (
@ -351,49 +351,25 @@ function FormFields({
invalid={errors.cultureName && touched.cultureName}
errorMessage={errors.cultureName}
>
<Field type="text" name="cultureName">
{({ field, form }: FieldProps<LanguageInfo>) => (
<Select
placeholder={translate('::App.Listform.ListformField.CultureName')}
field={field}
form={form}
<SelectField
name="cultureName"
options={langOptions}
isClearable={true}
value={langOptions.filter((option) => option.value === values?.cultureName)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
placeholder={translate('::App.Listform.ListformField.CultureName')}
/>
)}
</Field>
</FormItem>
<FormItem invalid={errors.roleId && touched.roleId} errorMessage={errors.roleId}>
<Field type="text" name="roleId">
{({ field, form }: FieldProps<IdentityRoleDto>) => (
<Select
placeholder={translate('::ListForms.ListFormField.Role')}
field={field}
form={form}
<SelectField
name="roleId"
options={roleList}
isClearable={true}
value={roleList.filter((option) => option.value === values.roleId)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
placeholder={translate('::ListForms.ListFormField.Role')}
/>
)}
</Field>
</FormItem>
<FormItem invalid={errors.userId && touched.userId} errorMessage={errors.userId}>
<Field type="text" name="userId">
{({ field, form }: FieldProps<IdentityUserDto>) => (
<Select
placeholder={translate('::ListForms.ListFormField.User')}
field={field}
form={form}
<SelectField
name="userId"
options={userList}
isClearable={true}
value={userList.filter((option) => option.value === values.userId)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
placeholder={translate('::ListForms.ListFormField.User')}
/>
)}
</Field>
</FormItem>
<Button block size="sm" variant="solid" loading={isSubmitting} type="submit">
@ -590,43 +566,26 @@ function FormFields({
errorMessage={errors.fieldName}
asterisk={true}
>
<Field type="text" name="fieldName">
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
<SelectField
name="fieldName"
options={columnOptions}
isClearable={true}
value={columnOptions.filter((option) => option.value === values.fieldName)}
onChange={(option) => {
form.setFieldValue(field.name, option?.value)
// Sütun seçilince veri tipi kaynaktan otomatik doldurulur.
onValueChange={(value, form) =>
form.setFieldValue(
'sourceDbType',
sqlDataTypeToDbType(
columns.find((c) => c.columnName === option?.value)?.dataType || '',
columns.find((column) => column.columnName === value)?.dataType || '',
) as any,
)
}}
}
/>
)}
</Field>
</FormItem>
<FormItem label={translate('::ListForms.ListFormEdit.CustomValueType')}>
<Field type="text" name="sourceDbType">
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="sourceDbType"
options={dbSourceTypeOptions}
value={dbSourceTypeOptions.filter(
(option: any) => option.value === values.sourceDbType,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -635,23 +594,10 @@ function FormFields({
errorMessage={errors.cultureName}
asterisk={true}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="cultureName"
placeholder={translate('::App.Listform.ListformField.CultureName')}
>
{({ field, form }: FieldProps<LanguageInfo>) => (
<Select
field={field}
form={form}
isClearable={true}
options={langOptions}
value={langOptions.filter((option) => option.value === values.cultureName)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -659,23 +605,10 @@ function FormFields({
invalid={errors.roleId && touched.roleId}
errorMessage={errors.roleId}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="roleId"
placeholder={translate('::ListForms.ListFormField.Role')}
>
{({ field, form }: FieldProps<IdentityRoleDto>) => (
<Select
field={field}
form={form}
options={roleList}
isClearable={true}
value={roleList.filter((option) => option.value === values.roleId)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -683,23 +616,10 @@ function FormFields({
invalid={errors.userId && touched.userId}
errorMessage={errors.userId}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="userId"
placeholder={translate('::ListForms.ListFormField.User')}
>
{({ field, form }: FieldProps<IdentityUserDto>) => (
<Select
field={field}
form={form}
options={userList}
isClearable={true}
value={userList.filter((option) => option.value === values.userId)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<Button block size="sm" variant="solid" loading={isSubmitting} type="submit">
@ -819,25 +739,10 @@ function FormFields({
invalid={errors.sourceFieldName && touched.sourceFieldName}
errorMessage={errors.sourceFieldName}
>
<Field
type="text"
autoFocus={true}
<SelectField
name="sourceFieldName"
placeholder={translate('::ListForms.ListFormField.CopySourceFieldName')}
>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={true}
options={fieldList}
value={fieldList.filter(
(option) => option.value === values.sourceFieldName,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -859,20 +764,10 @@ function FormFields({
invalid={errors.sourceCultureName && touched.sourceCultureName}
errorMessage={errors.sourceCultureName}
>
<Field type="text" name="sourceCultureName" placeholder="Source Culture Name">
{({ field, form }: FieldProps<LanguageInfo>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="sourceCultureName"
options={langOptions}
value={langOptions.filter(
(option) => option.value === values.sourceCultureName,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -880,20 +775,10 @@ function FormFields({
invalid={errors.targetCultureName && touched.targetCultureName}
errorMessage={errors.targetCultureName}
>
<Field type="text" name="targetCultureName" placeholder="Target Culture Name">
{({ field, form }: FieldProps<LanguageInfo>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="targetCultureName"
options={langOptions}
value={langOptions.filter(
(option) => option.value === values.targetCultureName,
)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -901,18 +786,10 @@ function FormFields({
invalid={errors.roleId && touched.roleId}
errorMessage={errors.roleId}
>
<Field type="text" autoComplete="off" name="roleId" placeholder="Role">
{({ field, form }: FieldProps<IdentityRoleDto>) => (
<Select
field={field}
form={form}
isClearable={true}
<SelectField
name="roleId"
options={roleList}
value={roleList.filter((option) => option.value === values.roleId)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<FormItem
@ -920,23 +797,10 @@ function FormFields({
invalid={errors.userId && touched.userId}
errorMessage={errors.userId}
>
<Field
type="text"
autoComplete="off"
<SelectField
name="userId"
placeholder={translate('::ListForms.ListFormField.User')}
>
{({ field, form }: FieldProps<IdentityUserDto>) => (
<Select
field={field}
form={form}
isClearable={true}
options={userList}
value={userList.filter((option) => option.value === values.userId)}
onChange={(option) => form.setFieldValue(field.name, option?.value)}
/>
)}
</Field>
</FormItem>
<div className="grid grid-cols-4 gap-4">
<FormItem label={translate('::App.Reports.Search')} labelClass="justify-center">

5
ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogAxis.tsx
View file

@ -38,8 +38,9 @@ import { BreakDto } from '@/proxy/admin/charts/models'
const schema = Yup.object().shape({
visible: Yup.boolean().notRequired(),
valueType: Yup.string().notRequired(),
type: Yup.string().notRequired(),
// Eksen tipi listesindeki "None" seçeneği null döndürüyor.
valueType: Yup.string().nullable().notRequired(),
type: Yup.string().nullable().notRequired(),
position: Yup.string().notRequired(),
name: Yup.string().required(),
title: Yup.string().notRequired(),

2
ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogSeries.tsx
View file

@ -52,7 +52,7 @@ const schema = object().shape({
visible: boolean().notRequired(),
backgroundColor: string().notRequired(),
customizeText: string().notRequired(),
format: string().notRequired(),
format: string().nullable().notRequired(),
font: object().shape({
color: string().notRequired(),
family: string().notRequired(),

54
ui/src/views/admin/listForm/edit/shared/SelectField.tsx Normal file
View file

@ -0,0 +1,54 @@
import { Select } from '@/components/ui'
import { SelectBoxOption } from '@/types/shared'
import { Field, FieldProps } from 'formik'
/**
* ListForm düzenleme ekranlarındaki standart "Formik + Select" alanı.
*
* Bu kalıp klasör genelinde 100'den fazla yerde satır satır kopyalanmıştı ve
* her kopyada seçili değer `values.<alan>` üzerinden ayrıca yazıldığı için
* alan adı ile okunan değerin uyuşmadığı kopyala-yapıştır hataları oluşuyordu.
* Burada değer doğrudan Formik alanından okunur; uyuşmazlık mümkün değildir.
*/
type SelectFieldProps = {
name: string
options: readonly any[]
placeholder?: string
/** Varsayılan true; zorunlu alanlarda false verilmeli. */
isClearable?: boolean
isDisabled?: boolean
/**
* Seçim sonrası ek iş yapmak için (bağlı alanları temizlemek gibi).
* Alanın kendi değeri zaten yazılmış olarak çağrılır.
*/
onValueChange?: (value: any, form: FieldProps['form']) => void
}
const SelectField = ({
name,
options,
placeholder,
isClearable = true,
isDisabled,
onValueChange,
}: SelectFieldProps) => (
<Field name={name}>
{({ field, form }: FieldProps<SelectBoxOption>) => (
<Select
field={field}
form={form}
isClearable={isClearable}
isDisabled={isDisabled}
options={options as any}
placeholder={placeholder}
value={options.find((option) => option?.value === field.value) ?? null}
onChange={(option: any) => {
form.setFieldValue(name, option?.value)
onValueChange?.(option?.value, form)
}}
/>
)}
</Field>
)
export default SelectField