Claude güncellemesi FormTab güncellemeri optimizasyon
This commit is contained in:
parent
0d27742f8c
commit
56b74b85a5
28 changed files with 393 additions and 939 deletions
|
|
@ -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)
|
||||
|
|
|
|||
|
|
@ -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)
|
||||
|
|
|
|||
|
|
@ -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)
|
||||
|
|
|
|||
|
|
@ -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)
|
||||
|
|
|
|||
|
|
@ -120,6 +120,7 @@ function FormTabDatabaseDataSource(props: FormEditProps) {
|
|||
return (
|
||||
<Container>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
initialValues={initialValues}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, formikHelpers) => {
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ function FormTabDatabaseDelete({
|
|||
return (
|
||||
<Container>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
initialValues={initialValues}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, formikHelpers) => {
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ function FormTabDatabaseInsert({
|
|||
return (
|
||||
<Container>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
initialValues={initialValues}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, formikHelpers) => {
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ function FormTabDatabaseSelect({
|
|||
return (
|
||||
<Container>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
initialValues={initialValues}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, formikHelpers) => {
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ function FormTabDatabaseUpdate({
|
|||
return (
|
||||
<Container>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
initialValues={initialValues}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, formikHelpers) => {
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -329,6 +329,7 @@ export function FormTabWorkflow(
|
|||
return (
|
||||
<div>
|
||||
<Formik
|
||||
enableReinitialize
|
||||
initialValues={initialValues}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, formikHelpers) => {
|
||||
|
|
|
|||
|
|
@ -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} />
|
||||
|
|
|
|||
|
|
@ -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}
|
||||
options={columnRowTypeListOptions}
|
||||
value={columnRowTypeListOptions.filter(
|
||||
(option: any) => option.value === values.rowType,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="rowType"
|
||||
options={columnRowTypeListOptions}
|
||||
isClearable={false}
|
||||
/>
|
||||
</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}
|
||||
options={columnValidationComparisonTypeListOptions}
|
||||
value={columnValidationComparisonTypeListOptions.filter(
|
||||
(option: any) => option.value === values.condition,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="condition"
|
||||
options={columnValidationComparisonTypeListOptions}
|
||||
isClearable={false}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
|
|
|
|||
|
|
@ -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}
|
||||
options={fixedPositionOptions}
|
||||
value={fixedPositionOptions.filter(
|
||||
(option: any) =>
|
||||
option.value === values?.columnCustomizationDto?.fixedPosition,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="columnCustomizationDto.fixedPosition"
|
||||
options={fixedPositionOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<Button block size="sm" className="mt-1" variant="solid" loading={isSubmitting} type="submit">
|
||||
|
|
|
|||
|
|
@ -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}
|
||||
options={dbSourceTypeOptions}
|
||||
value={dbSourceTypeOptions.filter(
|
||||
(option: any) => option.value === values.sourceDbType,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="sourceDbType"
|
||||
options={dbSourceTypeOptions}
|
||||
isClearable={false}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem label={translate('::ListForms.ListFormFieldEdit.DetailsAlignment')}>
|
||||
<Field type="text" name="alignment">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={listFormAlignmentOptions}
|
||||
value={listFormAlignmentOptions.filter(
|
||||
(option) => option.value === values.alignment,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="alignment"
|
||||
options={listFormAlignmentOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem label={translate('::ListForms.ListFormFieldEdit.DetailsFormat')}>
|
||||
<Field type="text" name="format">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={tooltipFormatListOptions}
|
||||
value={tooltipFormatListOptions.filter(
|
||||
(option) => option.value === values.format,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="format"
|
||||
options={tooltipFormatListOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormFieldEdit.DetailsEditorOptions')}
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
@ -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>
|
||||
options={gridColumnJoinTypeListOptions}
|
||||
/>
|
||||
</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>
|
||||
options={gridColumnJoinConditionOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
options={columnLookupDataSourceTypeListOptions}
|
||||
/>
|
||||
</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>
|
||||
options={cascadeFilterOperator}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
|
|
|
|||
|
|
@ -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}
|
||||
options={sortDirectionOptions}
|
||||
value={sortDirectionOptions.filter(
|
||||
(option: any) => option.value === values.sortDirection,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="sortDirection"
|
||||
options={sortDirectionOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormFieldEdit.OptionsSortIndex')}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
options={permissionOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::Create')}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
options={pivotSettingsAreaOptions}
|
||||
/>
|
||||
</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>
|
||||
options={tooltipFormatListOptions}
|
||||
/>
|
||||
</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>
|
||||
options={columnSummaryTypeListOptions}
|
||||
/>
|
||||
</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>
|
||||
options={pivotSettingsGroupIntervalOptions}
|
||||
/>
|
||||
</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>
|
||||
options={pivotSortDirectionOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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}
|
||||
options={columnValidationTypeListOptions}
|
||||
value={columnValidationTypeListOptions.filter(
|
||||
(option: any) => option.value === values.type,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="type"
|
||||
options={columnValidationTypeListOptions}
|
||||
/>
|
||||
</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>
|
||||
options={columnValidationComparisonTypeListOptions}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
|
|
|
|||
|
|
@ -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}
|
||||
options={langOptions}
|
||||
isClearable={true}
|
||||
value={langOptions.filter((option) => option.value === values?.cultureName)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="cultureName"
|
||||
options={langOptions}
|
||||
placeholder={translate('::App.Listform.ListformField.CultureName')}
|
||||
/>
|
||||
</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}
|
||||
options={roleList}
|
||||
isClearable={true}
|
||||
value={roleList.filter((option) => option.value === values.roleId)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="roleId"
|
||||
options={roleList}
|
||||
placeholder={translate('::ListForms.ListFormField.Role')}
|
||||
/>
|
||||
</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}
|
||||
options={userList}
|
||||
isClearable={true}
|
||||
value={userList.filter((option) => option.value === values.userId)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="userId"
|
||||
options={userList}
|
||||
placeholder={translate('::ListForms.ListFormField.User')}
|
||||
/>
|
||||
</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}
|
||||
options={columnOptions}
|
||||
isClearable={true}
|
||||
value={columnOptions.filter((option) => option.value === values.fieldName)}
|
||||
onChange={(option) => {
|
||||
form.setFieldValue(field.name, option?.value)
|
||||
form.setFieldValue(
|
||||
'sourceDbType',
|
||||
sqlDataTypeToDbType(
|
||||
columns.find((c) => c.columnName === option?.value)?.dataType || '',
|
||||
) as any,
|
||||
)
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="fieldName"
|
||||
options={columnOptions}
|
||||
// Sütun seçilince veri tipi kaynaktan otomatik doldurulur.
|
||||
onValueChange={(value, form) =>
|
||||
form.setFieldValue(
|
||||
'sourceDbType',
|
||||
sqlDataTypeToDbType(
|
||||
columns.find((column) => column.columnName === value)?.dataType || '',
|
||||
) as any,
|
||||
)
|
||||
}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem label={translate('::ListForms.ListFormEdit.CustomValueType')}>
|
||||
<Field type="text" name="sourceDbType">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={dbSourceTypeOptions}
|
||||
value={dbSourceTypeOptions.filter(
|
||||
(option: any) => option.value === values.sourceDbType,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="sourceDbType"
|
||||
options={dbSourceTypeOptions}
|
||||
/>
|
||||
</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>
|
||||
options={langOptions}
|
||||
/>
|
||||
</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>
|
||||
options={roleList}
|
||||
/>
|
||||
</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>
|
||||
options={userList}
|
||||
/>
|
||||
</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>
|
||||
options={fieldList}
|
||||
/>
|
||||
</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}
|
||||
options={langOptions}
|
||||
value={langOptions.filter(
|
||||
(option) => option.value === values.sourceCultureName,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="sourceCultureName"
|
||||
options={langOptions}
|
||||
/>
|
||||
</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}
|
||||
options={langOptions}
|
||||
value={langOptions.filter(
|
||||
(option) => option.value === values.targetCultureName,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="targetCultureName"
|
||||
options={langOptions}
|
||||
/>
|
||||
</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}
|
||||
options={roleList}
|
||||
value={roleList.filter((option) => option.value === values.roleId)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
<SelectField
|
||||
name="roleId"
|
||||
options={roleList}
|
||||
/>
|
||||
</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>
|
||||
options={userList}
|
||||
/>
|
||||
</FormItem>
|
||||
<div className="grid grid-cols-4 gap-4">
|
||||
<FormItem label={translate('::App.Reports.Search')} labelClass="justify-center">
|
||||
|
|
|
|||
|
|
@ -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(),
|
||||
|
|
|
|||
|
|
@ -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
54
ui/src/views/admin/listForm/edit/shared/SelectField.tsx
Normal 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
|
||||
Loading…
Reference in a new issue