listForm komponent style güncellemeleri
This commit is contained in:
Sedat ÖZTÜRK
parent
b1bd573905
commit
876844b078
29 changed files with 1949 additions and 1773 deletions
|
|
@ -163,145 +163,159 @@ function ChartTabAxis(props: FormEditProps) {
|
|||
/>
|
||||
</TabContent>
|
||||
<TabContent value="axis_argument">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-3">
|
||||
<Card className="my-2" header="General">
|
||||
<FormItem
|
||||
label="Visible"
|
||||
invalid={
|
||||
!!(errors.argumentAxisDto?.visible && touched.argumentAxisDto?.visible)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.visible}
|
||||
>
|
||||
<Field name="argumentAxisDto.visible" component={Checkbox} />
|
||||
</FormItem>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-3">
|
||||
<Card className="my-2 col-span-2" header="General">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<FormItem
|
||||
label="Visible"
|
||||
invalid={
|
||||
!!(errors.argumentAxisDto?.visible && touched.argumentAxisDto?.visible)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.visible}
|
||||
>
|
||||
<Field name="argumentAxisDto.visible" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Workdays Only"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.workdaysOnly &&
|
||||
touched.argumentAxisDto?.workdaysOnly
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.workdaysOnly}
|
||||
>
|
||||
<Field name="argumentAxisDto.workdaysOnly" component={Checkbox} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Workdays Only"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.workdaysOnly &&
|
||||
touched.argumentAxisDto?.workdaysOnly
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.workdaysOnly}
|
||||
>
|
||||
<Field name="argumentAxisDto.workdaysOnly" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Title"
|
||||
invalid={!!(errors.argumentAxisDto?.title && touched.argumentAxisDto?.title)}
|
||||
errorMessage={errors.argumentAxisDto?.title}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.title" component={Input} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Title"
|
||||
invalid={
|
||||
!!(errors.argumentAxisDto?.title && touched.argumentAxisDto?.title)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.title}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.title" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Hover Mode"
|
||||
invalid={
|
||||
!!(errors.argumentAxisDto?.hoverMode && touched.argumentAxisDto?.hoverMode)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.hoverMode}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.hoverMode">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisHoverModeListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisHoverModeListOptions.filter(
|
||||
(option) => option.value === values.argumentAxisDto.hoverMode,
|
||||
<FormItem
|
||||
label="Hover Mode"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.hoverMode &&
|
||||
touched.argumentAxisDto?.hoverMode
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.hoverMode}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.hoverMode">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisHoverModeListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisHoverModeListOptions.filter(
|
||||
(option) => option.value === values.argumentAxisDto.hoverMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Argument Type"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.argumentType &&
|
||||
touched.argumentAxisDto?.argumentType
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.argumentType}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.argumentType">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisTypeListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisTypeListOptions.filter(
|
||||
(option) => option.value === values.argumentAxisDto.argumentType,
|
||||
</Field>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div>
|
||||
<FormItem
|
||||
label="Argument Type"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.argumentType &&
|
||||
touched.argumentAxisDto?.argumentType
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.argumentType}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.argumentType">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisTypeListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisTypeListOptions.filter(
|
||||
(option) => option.value === values.argumentAxisDto.argumentType,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Position"
|
||||
invalid={
|
||||
!!(errors.argumentAxisDto?.position && touched.argumentAxisDto?.position)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.position}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.position">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisPositionListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisPositionListOptions.filter(
|
||||
(option) => option.value === values.argumentAxisDto.position,
|
||||
<FormItem
|
||||
label="Position"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.position && touched.argumentAxisDto?.position
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.position}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.position">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisPositionListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisPositionListOptions.filter(
|
||||
(option) => option.value === values.argumentAxisDto.position,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Width"
|
||||
invalid={!!(errors.argumentAxisDto?.width && touched.argumentAxisDto?.width)}
|
||||
errorMessage={errors.argumentAxisDto?.width}
|
||||
>
|
||||
<Field type="number" name="argumentAxisDto.width" component={Input} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Width"
|
||||
invalid={
|
||||
!!(errors.argumentAxisDto?.width && touched.argumentAxisDto?.width)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.width}
|
||||
>
|
||||
<Field type="number" name="argumentAxisDto.width" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Aggregation Interval"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.aggregationInterval &&
|
||||
touched.argumentAxisDto?.aggregationInterval
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.aggregationInterval}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.aggregationInterval">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisIntervalListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisIntervalListOptions.filter(
|
||||
(option) =>
|
||||
option.value === values.argumentAxisDto.aggregationInterval,
|
||||
<FormItem
|
||||
label="Aggregation Interval"
|
||||
invalid={
|
||||
!!(
|
||||
errors.argumentAxisDto?.aggregationInterval &&
|
||||
touched.argumentAxisDto?.aggregationInterval
|
||||
)
|
||||
}
|
||||
errorMessage={errors.argumentAxisDto?.aggregationInterval}
|
||||
>
|
||||
<Field type="text" name="argumentAxisDto.aggregationInterval">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartArgumentAxisIntervalListOptions}
|
||||
isClearable={true}
|
||||
value={chartArgumentAxisIntervalListOptions.filter(
|
||||
(option) =>
|
||||
option.value === values.argumentAxisDto.aggregationInterval,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card className="my-2" header="Grid">
|
||||
|
|
@ -333,7 +347,7 @@ function ChartTabAxis(props: FormEditProps) {
|
|||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className='!h-10 !p-0 !m-0 !border-0'
|
||||
className="!h-10 !p-0 !m-0 !border-0"
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
|
|
@ -499,7 +513,7 @@ function ChartTabAxis(props: FormEditProps) {
|
|||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className='!h-10 !p-0 !m-0 !border-0'
|
||||
className="!h-10 !p-0 !m-0 !border-0"
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -17,7 +17,11 @@ import { Field, FieldProps, Form, Formik, FormikErrors, FormikTouched } from 'fo
|
|||
import { FormEditProps } from '../../listForm/edit/FormEdit'
|
||||
import { useLocalization } from '@/utils/hooks/useLocalization'
|
||||
import { useStoreState } from '@/store/store'
|
||||
import { ListFormEditTabs, themeOptions, tooltipFormatListOptions } from '@/proxy/admin/list-form/options'
|
||||
import {
|
||||
ListFormEditTabs,
|
||||
themeOptions,
|
||||
tooltipFormatListOptions,
|
||||
} from '@/proxy/admin/list-form/options'
|
||||
import { object } from 'yup'
|
||||
import {
|
||||
chartPaletteOptions,
|
||||
|
|
@ -95,7 +99,7 @@ function ChartTabCommonSettings(props: FormEditProps) {
|
|||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className='!h-10 !p-0 !m-0 !border-0'
|
||||
className="!h-10 !p-0 !m-0 !border-0"
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
|
|
@ -326,128 +330,144 @@ function ChartTabCommonSettings(props: FormEditProps) {
|
|||
</Card>
|
||||
</TabContent>
|
||||
<TabContent value="commonSettings_tooltip">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-3">
|
||||
<Card className="my-2" header="General">
|
||||
<FormItem
|
||||
label="Enabled"
|
||||
invalid={!!(errors.tooltipDto?.enabled && touched.tooltipDto?.enabled)}
|
||||
errorMessage={errors.tooltipDto?.enabled as string}
|
||||
>
|
||||
<Field name="tooltipDto.keepLabels" component={Checkbox} />
|
||||
</FormItem>
|
||||
<div className="grid grid-cols-1 lg:grid-cols-4 gap-3">
|
||||
<Card className="my-2 col-span-2" header="General">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<FormItem
|
||||
label="Enabled"
|
||||
invalid={!!(errors.tooltipDto?.enabled && touched.tooltipDto?.enabled)}
|
||||
errorMessage={errors.tooltipDto?.enabled as string}
|
||||
>
|
||||
<Field name="tooltipDto.keepLabels" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Shared"
|
||||
invalid={!!(errors.tooltipDto?.shared && touched.tooltipDto?.shared)}
|
||||
errorMessage={errors.tooltipDto?.shared as string}
|
||||
>
|
||||
<Field name="tooltipDto.shared" component={Checkbox} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Shared"
|
||||
invalid={!!(errors.tooltipDto?.shared && touched.tooltipDto?.shared)}
|
||||
errorMessage={errors.tooltipDto?.shared as string}
|
||||
>
|
||||
<Field name="tooltipDto.shared" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Format"
|
||||
invalid={!!(errors.tooltipDto?.format && touched.tooltipDto?.format)}
|
||||
errorMessage={errors.tooltipDto?.format}
|
||||
>
|
||||
<Field type="text" name="tooltipDto.format">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={tooltipFormatListOptions}
|
||||
isClearable={true}
|
||||
value={tooltipFormatListOptions.filter(
|
||||
(option) => option.value === values.tooltipDto.format,
|
||||
<FormItem
|
||||
label="Format"
|
||||
invalid={!!(errors.tooltipDto?.format && touched.tooltipDto?.format)}
|
||||
errorMessage={errors.tooltipDto?.format}
|
||||
>
|
||||
<Field type="text" name="tooltipDto.format">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={tooltipFormatListOptions}
|
||||
isClearable={true}
|
||||
value={tooltipFormatListOptions.filter(
|
||||
(option) => option.value === values.tooltipDto.format,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Location"
|
||||
invalid={!!(errors.tooltipDto?.location && touched.tooltipDto?.location)}
|
||||
errorMessage={errors.tooltipDto?.location}
|
||||
>
|
||||
<Field type="text" name="tooltipDto.location">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartTooltipLocationListOptions}
|
||||
isClearable={true}
|
||||
value={chartTooltipLocationListOptions.filter(
|
||||
(option) => option.value === values.tooltipDto.location,
|
||||
<FormItem
|
||||
label="Location"
|
||||
invalid={!!(errors.tooltipDto?.location && touched.tooltipDto?.location)}
|
||||
errorMessage={errors.tooltipDto?.location}
|
||||
>
|
||||
<Field type="text" name="tooltipDto.location">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartTooltipLocationListOptions}
|
||||
isClearable={true}
|
||||
value={chartTooltipLocationListOptions.filter(
|
||||
(option) => option.value === values.tooltipDto.location,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div>
|
||||
<FormItem
|
||||
label="Color"
|
||||
invalid={!!(errors.tooltipDto?.color && touched.tooltipDto?.color)}
|
||||
errorMessage={errors.tooltipDto?.color}
|
||||
>
|
||||
<Field name="tooltipDto.color">
|
||||
{({ field, form }: FieldProps) => (
|
||||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className="!h-10 !p-0 !m-0 !border-0"
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Argument Format"
|
||||
invalid={
|
||||
!!(
|
||||
errors.tooltipDto?.argumentFormat &&
|
||||
touched.tooltipDto?.argumentFormat
|
||||
)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.argumentFormat}
|
||||
>
|
||||
<Field name="tooltipDto.argumentFormat" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Arrow Length"
|
||||
invalid={
|
||||
!!(errors.tooltipDto?.arrowLength && touched.tooltipDto?.arrowLength)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.arrowLength}
|
||||
>
|
||||
<Field type="number" name="tooltipDto.arrowLength" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Padding Top/Bottom"
|
||||
invalid={
|
||||
!!(
|
||||
errors.tooltipDto?.paddingTopBottom &&
|
||||
touched.tooltipDto?.paddingTopBottom
|
||||
)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.paddingTopBottom}
|
||||
>
|
||||
<Field
|
||||
type="number"
|
||||
name="tooltipDto.paddingTopBottom"
|
||||
component={Input}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Color"
|
||||
invalid={!!(errors.tooltipDto?.color && touched.tooltipDto?.color)}
|
||||
errorMessage={errors.tooltipDto?.color}
|
||||
>
|
||||
<Field name="tooltipDto.color">
|
||||
{({ field, form }: FieldProps) => (
|
||||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className='!h-10 !p-0 !m-0 !border-0'
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
<FormItem
|
||||
label="Padding Left/Right"
|
||||
invalid={
|
||||
!!(
|
||||
errors.tooltipDto?.paddingLeftRight &&
|
||||
touched.tooltipDto?.paddingLeftRight
|
||||
)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.paddingLeftRight}
|
||||
>
|
||||
<Field
|
||||
type="number"
|
||||
name="tooltipDto.paddingLeftRight"
|
||||
component={Input}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Argument Format"
|
||||
invalid={
|
||||
!!(errors.tooltipDto?.argumentFormat && touched.tooltipDto?.argumentFormat)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.argumentFormat}
|
||||
>
|
||||
<Field name="tooltipDto.argumentFormat" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Arrow Length"
|
||||
invalid={
|
||||
!!(errors.tooltipDto?.arrowLength && touched.tooltipDto?.arrowLength)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.arrowLength}
|
||||
>
|
||||
<Field type="number" name="tooltipDto.arrowLength" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Padding Top/Bottom"
|
||||
invalid={
|
||||
!!(
|
||||
errors.tooltipDto?.paddingTopBottom &&
|
||||
touched.tooltipDto?.paddingTopBottom
|
||||
)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.paddingTopBottom}
|
||||
>
|
||||
<Field type="number" name="tooltipDto.paddingTopBottom" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Padding Left/Right"
|
||||
invalid={
|
||||
!!(
|
||||
errors.tooltipDto?.paddingLeftRight &&
|
||||
touched.tooltipDto?.paddingLeftRight
|
||||
)
|
||||
}
|
||||
errorMessage={errors.tooltipDto?.paddingLeftRight}
|
||||
>
|
||||
<Field type="number" name="tooltipDto.paddingLeftRight" component={Input} />
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card className="my-2" header="Font">
|
||||
|
|
@ -463,7 +483,7 @@ function ChartTabCommonSettings(props: FormEditProps) {
|
|||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className='!h-10 !p-0 !m-0 !border-0'
|
||||
className="!h-10 !p-0 !m-0 !border-0"
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
|
|
@ -649,7 +669,7 @@ function ChartTabCommonSettings(props: FormEditProps) {
|
|||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className='!h-10 !p-0 !m-0 !border-0'
|
||||
className="!h-10 !p-0 !m-0 !border-0"
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -229,282 +229,296 @@ function ChartTabSeries(props: FormEditProps & { listFormCode: string }) {
|
|||
</TabContent>
|
||||
<TabContent value="series_common">
|
||||
<Card className="my-2">
|
||||
<FormItem
|
||||
label="Visible"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.visible &&
|
||||
touched.commonSeriesSettingsDto?.visible
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.visible}
|
||||
>
|
||||
<Field name="commonSeriesSettingsDto.visible" component={Checkbox} />
|
||||
</FormItem>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<FormItem
|
||||
label="Visible"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.visible &&
|
||||
touched.commonSeriesSettingsDto?.visible
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.visible}
|
||||
>
|
||||
<Field name="commonSeriesSettingsDto.visible" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Show In Legend"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.showInLegend &&
|
||||
touched.commonSeriesSettingsDto?.showInLegend
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.showInLegend}
|
||||
>
|
||||
<Field name="commonSeriesSettingsDto.showInLegend" component={Checkbox} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Show In Legend"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.showInLegend &&
|
||||
touched.commonSeriesSettingsDto?.showInLegend
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.showInLegend}
|
||||
>
|
||||
<Field name="commonSeriesSettingsDto.showInLegend" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Ignore Empty Points"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.ignoreEmptyPoints &&
|
||||
touched.commonSeriesSettingsDto?.ignoreEmptyPoints
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.ignoreEmptyPoints}
|
||||
>
|
||||
<Field name="commonSeriesSettingsDto.ignoreEmptyPoints" component={Checkbox} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Ignore Empty Points"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.ignoreEmptyPoints &&
|
||||
touched.commonSeriesSettingsDto?.ignoreEmptyPoints
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.ignoreEmptyPoints}
|
||||
>
|
||||
<Field
|
||||
name="commonSeriesSettingsDto.ignoreEmptyPoints"
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Type"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.type &&
|
||||
touched.commonSeriesSettingsDto?.type
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.type}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.type">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesTypeOptions}
|
||||
isClearable={true}
|
||||
value={chartSeriesTypeOptions.filter(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.type,
|
||||
<FormItem
|
||||
label="Type"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.type &&
|
||||
touched.commonSeriesSettingsDto?.type
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.type}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.type">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesTypeOptions}
|
||||
isClearable={true}
|
||||
value={chartSeriesTypeOptions.filter(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.type,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Selection Mode"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.selectionMode &&
|
||||
touched.commonSeriesSettingsDto?.selectionMode
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.selectionMode}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.selectionMode">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesSelectionModeOptions}
|
||||
isClearable={true}
|
||||
value={chartSeriesSelectionModeOptions.filter(
|
||||
(option) =>
|
||||
option.value === values.commonSeriesSettingsDto.selectionMode,
|
||||
<FormItem
|
||||
label="Selection Mode"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.selectionMode &&
|
||||
touched.commonSeriesSettingsDto?.selectionMode
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.selectionMode}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.selectionMode">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesSelectionModeOptions}
|
||||
isClearable={true}
|
||||
value={chartSeriesSelectionModeOptions.filter(
|
||||
(option) =>
|
||||
option.value === values.commonSeriesSettingsDto.selectionMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Argument Field"
|
||||
invalid={
|
||||
errors.commonSeriesSettingsDto?.argumentField &&
|
||||
touched.commonSeriesSettingsDto?.argumentField
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.argumentField}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.argumentField">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
componentAs={CreatableSelect}
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList.find(
|
||||
(option) =>
|
||||
option.value === values.commonSeriesSettingsDto.argumentField,
|
||||
<FormItem
|
||||
label="Argument Field"
|
||||
invalid={
|
||||
errors.commonSeriesSettingsDto?.argumentField &&
|
||||
touched.commonSeriesSettingsDto?.argumentField
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.argumentField}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.argumentField">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
componentAs={CreatableSelect}
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList.find(
|
||||
(option) =>
|
||||
option.value === values.commonSeriesSettingsDto.argumentField,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
menuPlacement="auto"
|
||||
maxMenuHeight={150}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
menuPlacement="auto"
|
||||
maxMenuHeight={150}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Value Field"
|
||||
invalid={
|
||||
errors.commonSeriesSettingsDto?.valueField &&
|
||||
touched.commonSeriesSettingsDto?.valueField
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.valueField}
|
||||
>
|
||||
<Field type="text" name="valueField">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
componentAs={CreatableSelect}
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList.find(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.valueField,
|
||||
<FormItem
|
||||
label="Value Field"
|
||||
invalid={
|
||||
errors.commonSeriesSettingsDto?.valueField &&
|
||||
touched.commonSeriesSettingsDto?.valueField
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.valueField}
|
||||
>
|
||||
<Field type="text" name="valueField">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
componentAs={CreatableSelect}
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList.find(
|
||||
(option) =>
|
||||
option.value === values.commonSeriesSettingsDto.valueField,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
menuPlacement="auto"
|
||||
maxMenuHeight={150}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
menuPlacement="auto"
|
||||
maxMenuHeight={150}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Axis"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.axis &&
|
||||
touched.commonSeriesSettingsDto?.axis
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.axis}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.axis">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={valueAxisList()}
|
||||
isClearable={true}
|
||||
value={valueAxisList()?.find(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.axis,
|
||||
</Field>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div>
|
||||
<FormItem
|
||||
label="Axis"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.axis &&
|
||||
touched.commonSeriesSettingsDto?.axis
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.axis}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.axis">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={valueAxisList()}
|
||||
isClearable={true}
|
||||
value={valueAxisList()?.find(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.axis,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Pane"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.pane &&
|
||||
touched.commonSeriesSettingsDto?.pane
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.pane}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.pane">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={valuePaneList()}
|
||||
isClearable={true}
|
||||
value={valuePaneList()?.find(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.pane,
|
||||
<FormItem
|
||||
label="Pane"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.pane &&
|
||||
touched.commonSeriesSettingsDto?.pane
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.pane}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.pane">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={valuePaneList()}
|
||||
isClearable={true}
|
||||
value={valuePaneList()?.find(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.pane,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Color"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.color &&
|
||||
touched.commonSeriesSettingsDto?.color
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.color}
|
||||
>
|
||||
<Field name="commonSeriesSettingsDto.color">
|
||||
{({ field, form }: FieldProps) => (
|
||||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className='!h-10 !p-0 !m-0 !border-0'
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Corner Radius"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.cornerRadius &&
|
||||
touched.commonSeriesSettingsDto?.cornerRadius
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.cornerRadius}
|
||||
>
|
||||
<Field
|
||||
type="number"
|
||||
name="commonSeriesSettingsDto.cornerRadius"
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Type"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.dashStyle &&
|
||||
touched.commonSeriesSettingsDto?.dashStyle
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.dashStyle}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.dashStyle">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesDashStyleOptions}
|
||||
isClearable={true}
|
||||
value={chartSeriesDashStyleOptions.filter(
|
||||
(option) => option.value === values.commonSeriesSettingsDto.dashStyle,
|
||||
<FormItem
|
||||
label="Color"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.color &&
|
||||
touched.commonSeriesSettingsDto?.color
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.color}
|
||||
>
|
||||
<Field name="commonSeriesSettingsDto.color">
|
||||
{({ field, form }: FieldProps) => (
|
||||
<Input
|
||||
{...field}
|
||||
type="color"
|
||||
className="!h-10 !p-0 !m-0 !border-0"
|
||||
onChange={(e) => form.setFieldValue(field.name, e.target.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Width"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.width &&
|
||||
touched.commonSeriesSettingsDto?.width
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.width}
|
||||
>
|
||||
<Field type="number" name="commonSeriesSettingsDto.width" component={Input} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Corner Radius"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.cornerRadius &&
|
||||
touched.commonSeriesSettingsDto?.cornerRadius
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.cornerRadius}
|
||||
>
|
||||
<Field
|
||||
type="number"
|
||||
name="commonSeriesSettingsDto.cornerRadius"
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Type"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.dashStyle &&
|
||||
touched.commonSeriesSettingsDto?.dashStyle
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.dashStyle}
|
||||
>
|
||||
<Field type="text" name="commonSeriesSettingsDto.dashStyle">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesDashStyleOptions}
|
||||
isClearable={true}
|
||||
value={chartSeriesDashStyleOptions.filter(
|
||||
(option) =>
|
||||
option.value === values.commonSeriesSettingsDto.dashStyle,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label="Width"
|
||||
invalid={
|
||||
!!(
|
||||
errors.commonSeriesSettingsDto?.width &&
|
||||
touched.commonSeriesSettingsDto?.width
|
||||
)
|
||||
}
|
||||
errorMessage={errors.commonSeriesSettingsDto?.width}
|
||||
>
|
||||
<Field
|
||||
type="number"
|
||||
name="commonSeriesSettingsDto.width"
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</TabContent>
|
||||
</Tabs>
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ function FormTabColumns(props: FormEditProps) {
|
|||
}
|
||||
|
||||
return (
|
||||
<Container className="grid xl:grid-cols-2">
|
||||
<Container>
|
||||
<Formik
|
||||
initialValues={listFormValues}
|
||||
validationSchema={validationSchema}
|
||||
|
|
@ -40,253 +40,275 @@ function FormTabColumns(props: FormEditProps) {
|
|||
{({ touched, errors, isSubmitting, values }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowColumnHeaders')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showColumnHeaders &&
|
||||
touched.columnOptionDto?.showColumnHeaders
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showColumnHeaders}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showColumnHeaders"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowColumnHeaders')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowBorders')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showBorders && touched.columnOptionDto?.showBorders
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showBorders}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showBorders"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowBorders')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowRowLines')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showRowLines && touched.columnOptionDto?.showRowLines
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showRowLines}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showRowLines"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowRowLines')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowColumnLines')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showColumnLines &&
|
||||
touched.columnOptionDto?.showColumnLines
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showColumnLines}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showColumnLines"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowColumnLines')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionRowAlternationEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.rowAlternationEnabled &&
|
||||
touched.columnOptionDto?.rowAlternationEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.rowAlternationEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.rowAlternationEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionRowAlternationEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionAllowColumnReordering')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.allowColumnReordering &&
|
||||
touched.columnOptionDto?.allowColumnReordering
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.allowColumnReordering}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.allowColumnReordering"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionAllowColumnReordering')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnAutoWidth')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnAutoWidth &&
|
||||
touched.columnOptionDto?.columnAutoWidth
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnAutoWidth}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnAutoWidth"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnAutoWidth')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnFixingEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnFixingEnabled &&
|
||||
touched.columnOptionDto?.columnFixingEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnFixingEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnFixingEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnFixingEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionRtlEnabled')}
|
||||
invalid={errors.columnOptionDto?.rtlEnabled && touched.columnOptionDto?.rtlEnabled}
|
||||
errorMessage={errors.columnOptionDto?.rtlEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.rtlEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionRtlEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnChooserEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnChooserEnabled &&
|
||||
touched.columnOptionDto?.columnChooserEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnChooserEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnChooserEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnChooserEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnChooserMode')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnChooserMode &&
|
||||
touched.columnOptionDto?.columnChooserMode
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnChooserMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="columnOptionDto.columnChooserMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnChooserMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<ColumnChooserMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={columnChooserModeOptions}
|
||||
value={columnChooserModeOptions?.filter(
|
||||
(option) => option.value === values.columnOptionDto.columnChooserMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div className="my-2">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowColumnHeaders')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showColumnHeaders &&
|
||||
touched.columnOptionDto?.showColumnHeaders
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showColumnHeaders}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showColumnHeaders"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowColumnHeaders')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionAllowColumnResizing')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.allowColumnResizing &&
|
||||
touched.columnOptionDto?.allowColumnResizing
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.allowColumnResizing}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.allowColumnResizing"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionAllowColumnResizing')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnResizingMode')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnResizingMode &&
|
||||
touched.columnOptionDto?.columnResizingMode
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnResizingMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="columnOptionDto.columnResizingMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnResizingMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<ColumnResizeMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={columnResizingModeOptions}
|
||||
value={columnResizingModeOptions?.filter(
|
||||
(option) => option.value === values.columnOptionDto.columnResizingMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowBorders')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showBorders && touched.columnOptionDto?.showBorders
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showBorders}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showBorders"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowBorders')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionHoverStateEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.hoverStateEnabled &&
|
||||
touched.columnOptionDto?.hoverStateEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.hoverStateEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.hoverStateEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionHoverStateEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnHidingEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnHidingEnabled &&
|
||||
touched.columnOptionDto?.columnHidingEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnHidingEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnHidingEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnHidingEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionFocusedRowEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.focusedRowEnabled &&
|
||||
touched.columnOptionDto?.focusedRowEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.focusedRowEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.focusedRowEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionFocusedRowEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowRowLines')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showRowLines && touched.columnOptionDto?.showRowLines
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showRowLines}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showRowLines"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowRowLines')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionShowColumnLines')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.showColumnLines &&
|
||||
touched.columnOptionDto?.showColumnLines
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.showColumnLines}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.showColumnLines"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionShowColumnLines')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionRowAlternationEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.rowAlternationEnabled &&
|
||||
touched.columnOptionDto?.rowAlternationEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.rowAlternationEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.rowAlternationEnabled"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionRowAlternationEnabled',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionAllowColumnReordering')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.allowColumnReordering &&
|
||||
touched.columnOptionDto?.allowColumnReordering
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.allowColumnReordering}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.allowColumnReordering"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionAllowColumnReordering',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnAutoWidth')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnAutoWidth &&
|
||||
touched.columnOptionDto?.columnAutoWidth
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnAutoWidth}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnAutoWidth"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnAutoWidth')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnFixingEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnFixingEnabled &&
|
||||
touched.columnOptionDto?.columnFixingEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnFixingEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnFixingEnabled"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionColumnFixingEnabled',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div className="my-2">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionRtlEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.rtlEnabled && touched.columnOptionDto?.rtlEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.rtlEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.rtlEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionRtlEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnChooserEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnChooserEnabled &&
|
||||
touched.columnOptionDto?.columnChooserEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnChooserEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnChooserEnabled"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionColumnChooserEnabled',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnChooserMode')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnChooserMode &&
|
||||
touched.columnOptionDto?.columnChooserMode
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnChooserMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="columnOptionDto.columnChooserMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnChooserMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<ColumnChooserMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={columnChooserModeOptions}
|
||||
value={columnChooserModeOptions?.filter(
|
||||
(option) => option.value === values.columnOptionDto.columnChooserMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionAllowColumnResizing')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.allowColumnResizing &&
|
||||
touched.columnOptionDto?.allowColumnResizing
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.allowColumnResizing}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.allowColumnResizing"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionAllowColumnResizing',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnResizingMode')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnResizingMode &&
|
||||
touched.columnOptionDto?.columnResizingMode
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnResizingMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="columnOptionDto.columnResizingMode"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionColumnResizingMode',
|
||||
)}
|
||||
>
|
||||
{({ field, form }: FieldProps<ColumnResizeMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={columnResizingModeOptions}
|
||||
value={columnResizingModeOptions?.filter(
|
||||
(option) => option.value === values.columnOptionDto.columnResizingMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionHoverStateEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.hoverStateEnabled &&
|
||||
touched.columnOptionDto?.hoverStateEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.hoverStateEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.hoverStateEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionHoverStateEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnHidingEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.columnHidingEnabled &&
|
||||
touched.columnOptionDto?.columnHidingEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.columnHidingEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.columnHidingEnabled"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionColumnHidingEnabled',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionFocusedRowEnabled')}
|
||||
invalid={
|
||||
errors.columnOptionDto?.focusedRowEnabled &&
|
||||
touched.columnOptionDto?.focusedRowEnabled
|
||||
}
|
||||
errorMessage={errors.columnOptionDto?.focusedRowEnabled}
|
||||
>
|
||||
<Field
|
||||
name="columnOptionDto.focusedRowEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionFocusedRowEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit" className="my-2">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ function FormTabDatabaseDelete({
|
|||
placeholder={translate('::ListForms.ListFormEdit.DatabaseDeleteCommand')}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
|
|
@ -96,7 +96,7 @@ function FormTabDatabaseDelete({
|
|||
)}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
|
|
@ -111,7 +111,7 @@ function FormTabDatabaseDelete({
|
|||
placeholder={translate('::ListForms.ListFormEdit.DatabaseDeleteAfterCommand')}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@ function FormTabDatabaseInsert({
|
|||
placeholder={translate('::ListForms.ListFormEdit.DatabaseInsertCommand')}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
|
|
@ -95,7 +95,7 @@ function FormTabDatabaseInsert({
|
|||
)}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
|
|
@ -110,7 +110,7 @@ function FormTabDatabaseInsert({
|
|||
placeholder={translate('::ListForms.ListFormEdit.DatabaseInsertAfterCommand')}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@ function FormTabDatabaseUpdate({
|
|||
placeholder={translate('::ListForms.ListFormEdit.DatabaseUpdateCommand')}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
|
|
@ -95,7 +95,7 @@ function FormTabDatabaseUpdate({
|
|||
)}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
|
|
@ -110,7 +110,7 @@ function FormTabDatabaseUpdate({
|
|||
placeholder={translate('::ListForms.ListFormEdit.DatabaseUpdateAfterCommand')}
|
||||
component={Input}
|
||||
textArea={true}
|
||||
rows={6}
|
||||
rows={4}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -223,18 +223,19 @@ function FormTabDetails(
|
|||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.IsSub')}
|
||||
invalid={errors.isSubForm && touched.isSubForm}
|
||||
errorMessage={errors.isSubForm}
|
||||
>
|
||||
<Field
|
||||
name="isSubForm"
|
||||
placeholder={translate('::ListForms.ListFormEdit.IsSub')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.IsSub')}
|
||||
invalid={errors.isSubForm && touched.isSubForm}
|
||||
errorMessage={errors.isSubForm}
|
||||
>
|
||||
<Field
|
||||
name="isSubForm"
|
||||
placeholder={translate('::ListForms.ListFormEdit.IsSub')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SubFormsListFormType')}
|
||||
|
|
|
|||
|
|
@ -41,295 +41,303 @@ function FormTabEdit(props: FormEditProps & { listFormCode: string }) {
|
|||
{({ touched, errors, values, isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<Card className="my-2" header="General">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowAdding')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowAdding && touched.editingOptionDto?.allowAdding
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowAdding}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAddPageUrl')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.addPageUrl &&
|
||||
touched.editingOptionDto?.addPageUrl
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.addPageUrl}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.addPageUrl"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAddPageUrl')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowUpdating')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowUpdating &&
|
||||
touched.editingOptionDto?.allowUpdating
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowUpdating}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowUpdating"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowUpdating')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SendOnlyChangedFormValuesUpdate')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.sendOnlyChangedFormValuesUpdate &&
|
||||
touched.editingOptionDto?.sendOnlyChangedFormValuesUpdate
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.sendOnlyChangedFormValuesUpdate}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.sendOnlyChangedFormValuesUpdate"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SendOnlyChangedFormValuesUpdate',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDetail')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowDetail && touched.editingOptionDto?.allowDetail
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowDetail}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowDetail"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDetail')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDuplicate')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowDuplicate && touched.editingOptionDto?.allowDuplicate
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowDuplicate}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowDuplicate"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDuplicate')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDeleting')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowDeleting &&
|
||||
touched.editingOptionDto?.allowDeleting
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowDeleting}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDeleteAll')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowAllDeleting &&
|
||||
touched.editingOptionDto?.allowAllDeleting
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowAllDeleting}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowAllDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDeleteAll')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingConfirmDelete')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.confirmDelete &&
|
||||
touched.editingOptionDto?.confirmDelete
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.confirmDelete}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.confirmDelete"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingConfirmDelete')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingUseIcons')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.useIcons && touched.editingOptionDto?.useIcons
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.useIcons}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.useIcons"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingUseIcons')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingSelectTextOnEditStart')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.selectTextOnEditStart &&
|
||||
touched.editingOptionDto?.selectTextOnEditStart
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.selectTextOnEditStart}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.selectTextOnEditStart"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.EditingSelectTextOnEditStart',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingMode')}
|
||||
invalid={errors.editingOptionDto?.mode && touched.editingOptionDto?.mode}
|
||||
errorMessage={errors.editingOptionDto?.mode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.mode"
|
||||
placeholder={translate('::SidePanel.Mode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<GridsEditMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionModeOptions}
|
||||
value={editingOptionModeOptions?.filter(
|
||||
(option) => option.value === values.editingOptionDto.mode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3">
|
||||
<Card className="my-2 col-span-2" header="General">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowAdding')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowAdding &&
|
||||
touched.editingOptionDto?.allowAdding
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowAdding}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingRefreshMode')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.refreshMode && touched.editingOptionDto?.refreshMode
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.refreshMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.refreshMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingRefreshMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<GridsEditRefreshMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionRefreshModeOptions}
|
||||
value={editingOptionRefreshModeOptions?.filter(
|
||||
(option) => option.value === values.editingOptionDto.refreshMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAddPageUrl')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.addPageUrl &&
|
||||
touched.editingOptionDto?.addPageUrl
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.addPageUrl}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.addPageUrl"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAddPageUrl')}
|
||||
component={Input}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingNewRowPosition')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.newRowPosition &&
|
||||
touched.editingOptionDto?.newRowPosition
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.newRowPosition}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.newRowPosition"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingNewRowPosition')}
|
||||
>
|
||||
{({ field, form }: FieldProps<NewRowPosition>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionNewRowPositionOptions}
|
||||
value={editingOptionNewRowPositionOptions?.filter(
|
||||
(option) => option.value === values.editingOptionDto.newRowPosition,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowUpdating')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowUpdating &&
|
||||
touched.editingOptionDto?.allowUpdating
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowUpdating}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowUpdating"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowUpdating')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingStartEditAction')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.startEditAction &&
|
||||
touched.editingOptionDto?.startEditAction
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.startEditAction}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.startEditAction"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingStartEditAction')}
|
||||
>
|
||||
{({ field, form }: FieldProps<StartEditAction>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionStartEditActionOptions}
|
||||
value={editingOptionStartEditActionOptions?.filter(
|
||||
(option) => option.value === values.editingOptionDto.startEditAction,
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate(
|
||||
'::ListForms.ListFormEdit.SendOnlyChangedFormValuesUpdate',
|
||||
)}
|
||||
invalid={
|
||||
errors.editingOptionDto?.sendOnlyChangedFormValuesUpdate &&
|
||||
touched.editingOptionDto?.sendOnlyChangedFormValuesUpdate
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.sendOnlyChangedFormValuesUpdate}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.sendOnlyChangedFormValuesUpdate"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SendOnlyChangedFormValuesUpdate',
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingEditColumnName')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.editColumnName &&
|
||||
touched.editingOptionDto?.editColumnName
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.editColumnName}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.editColumnName"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingEditColumnName')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDetail')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowDetail &&
|
||||
touched.editingOptionDto?.allowDetail
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowDetail}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowDetail"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDetail')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDuplicate')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowDuplicate &&
|
||||
touched.editingOptionDto?.allowDuplicate
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowDuplicate}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowDuplicate"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDuplicate')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDeleting')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowDeleting &&
|
||||
touched.editingOptionDto?.allowDeleting
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowDeleting}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingAllowDeleteAll')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.allowAllDeleting &&
|
||||
touched.editingOptionDto?.allowAllDeleting
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.allowAllDeleting}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.allowAllDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingAllowDeleteAll')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingConfirmDelete')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.confirmDelete &&
|
||||
touched.editingOptionDto?.confirmDelete
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.confirmDelete}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.confirmDelete"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingConfirmDelete')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingUseIcons')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.useIcons && touched.editingOptionDto?.useIcons
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.useIcons}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.useIcons"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingUseIcons')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingSelectTextOnEditStart')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.selectTextOnEditStart &&
|
||||
touched.editingOptionDto?.selectTextOnEditStart
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.selectTextOnEditStart}
|
||||
>
|
||||
<Field
|
||||
name="editingOptionDto.selectTextOnEditStart"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.EditingSelectTextOnEditStart',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingMode')}
|
||||
invalid={errors.editingOptionDto?.mode && touched.editingOptionDto?.mode}
|
||||
errorMessage={errors.editingOptionDto?.mode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.mode"
|
||||
placeholder={translate('::SidePanel.Mode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<GridsEditMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionModeOptions}
|
||||
value={editingOptionModeOptions?.filter(
|
||||
(option) => option.value === values.editingOptionDto.mode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingRefreshMode')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.refreshMode &&
|
||||
touched.editingOptionDto?.refreshMode
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.refreshMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.refreshMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingRefreshMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<GridsEditRefreshMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionRefreshModeOptions}
|
||||
value={editingOptionRefreshModeOptions?.filter(
|
||||
(option) => option.value === values.editingOptionDto.refreshMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingNewRowPosition')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.newRowPosition &&
|
||||
touched.editingOptionDto?.newRowPosition
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.newRowPosition}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.newRowPosition"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingNewRowPosition')}
|
||||
>
|
||||
{({ field, form }: FieldProps<NewRowPosition>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionNewRowPositionOptions}
|
||||
value={editingOptionNewRowPositionOptions?.filter(
|
||||
(option) => option.value === values.editingOptionDto.newRowPosition,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingStartEditAction')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.startEditAction &&
|
||||
touched.editingOptionDto?.startEditAction
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.startEditAction}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.startEditAction"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingStartEditAction')}
|
||||
>
|
||||
{({ field, form }: FieldProps<StartEditAction>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={editingOptionStartEditActionOptions}
|
||||
value={editingOptionStartEditActionOptions?.filter(
|
||||
(option) =>
|
||||
option.value === values.editingOptionDto.startEditAction,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EditingEditColumnName')}
|
||||
invalid={
|
||||
errors.editingOptionDto?.editColumnName &&
|
||||
touched.editingOptionDto?.editColumnName
|
||||
}
|
||||
errorMessage={errors.editingOptionDto?.editColumnName}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.editColumnName"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EditingEditColumnName')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Card className="my-2" header="Popup">
|
||||
{values.editingOptionDto.mode === 'popup' && (
|
||||
|
|
|
|||
|
|
@ -84,373 +84,390 @@ function FormTabGantt(props: FormEditProps) {
|
|||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<Card className="mt-4">
|
||||
<h5 className="mb-4">{translate('::ListForms.SchedulerOptions.BasicSettings')}</h5>
|
||||
<FormItem
|
||||
label={translate('::App.Listform.ListformField.KeyFieldName')}
|
||||
invalid={errors.ganttOptionDto?.keyExpr && touched.ganttOptionDto?.keyExpr}
|
||||
errorMessage={errors.ganttOptionDto?.keyExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.keyExpr"
|
||||
placeholder={translate(
|
||||
'::App.Listform.ListformField.KeyFieldName',
|
||||
)}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.keyExpr,
|
||||
<Card
|
||||
className="mt-4"
|
||||
header={translate('::ListForms.SchedulerOptions.BasicSettings')}
|
||||
>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<FormItem
|
||||
label={translate('::App.Listform.ListformField.KeyFieldName')}
|
||||
invalid={errors.ganttOptionDto?.keyExpr && touched.ganttOptionDto?.keyExpr}
|
||||
errorMessage={errors.ganttOptionDto?.keyExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.keyExpr"
|
||||
placeholder={translate('::App.Listform.ListformField.KeyFieldName')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.keyExpr,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ParentIdExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.parentIdExpr && touched.ganttOptionDto?.parentIdExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.parentIdExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.parentIdExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ParentIdExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.parentIdExpr,
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ParentIdExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.parentIdExpr && touched.ganttOptionDto?.parentIdExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.parentIdExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.parentIdExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ParentIdExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.parentIdExpr,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.HasItemsExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.hasItemsExpr && touched.ganttOptionDto?.hasItemsExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.hasItemsExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="ganttOptionDto.hasItemsExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.HasItemsExpr')}
|
||||
component={Input}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.HasItemsExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.hasItemsExpr && touched.ganttOptionDto?.hasItemsExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.hasItemsExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="ganttOptionDto.hasItemsExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.HasItemsExpr')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.RootValue')}
|
||||
invalid={
|
||||
!!(errors.ganttOptionDto?.rootValue && touched.ganttOptionDto?.rootValue)
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.rootValue as string}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="ganttOptionDto.rootValue"
|
||||
placeholder={translate('::ListForms.ListFormEdit.RootValue')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.RootValue')}
|
||||
invalid={
|
||||
!!(errors.ganttOptionDto?.rootValue && touched.ganttOptionDto?.rootValue)
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.rootValue as string}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="ganttOptionDto.rootValue"
|
||||
placeholder={translate('::ListForms.ListFormEdit.RootValue')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AutoExpandAll')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.autoExpandAll &&
|
||||
touched.ganttOptionDto?.autoExpandAll
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.autoExpandAll}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.autoExpandAll"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AutoExpandAll')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AutoExpandAll')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.autoExpandAll && touched.ganttOptionDto?.autoExpandAll
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.autoExpandAll}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.autoExpandAll"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AutoExpandAll')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.RecursiveSelection')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.recursiveSelection &&
|
||||
touched.ganttOptionDto?.recursiveSelection
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.recursiveSelection}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.recursiveSelection"
|
||||
placeholder={translate('::ListForms.ListFormEdit.RecursiveSelection')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ScaleType')}
|
||||
invalid={errors.ganttOptionDto?.scaleType && touched.ganttOptionDto?.scaleType}
|
||||
errorMessage={errors.ganttOptionDto?.scaleType}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.scaleType"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ScaleType')}
|
||||
>
|
||||
{({ field, form }: FieldProps<GanttScaleType>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={gantScaleOptions}
|
||||
value={gantScaleOptions?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.scaleType,
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.RecursiveSelection')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.recursiveSelection &&
|
||||
touched.ganttOptionDto?.recursiveSelection
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.recursiveSelection}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.recursiveSelection"
|
||||
placeholder={translate('::ListForms.ListFormEdit.RecursiveSelection')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ScaleType')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.scaleType && touched.ganttOptionDto?.scaleType
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.scaleType}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.scaleType"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ScaleType')}
|
||||
>
|
||||
{({ field, form }: FieldProps<GanttScaleType>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={gantScaleOptions}
|
||||
value={gantScaleOptions?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.scaleType,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.TitleExpr')}
|
||||
invalid={errors.ganttOptionDto?.titleExpr && touched.ganttOptionDto?.titleExpr}
|
||||
errorMessage={errors.ganttOptionDto?.titleExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.titleExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.TitleExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.titleExpr,
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.TitleExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.titleExpr && touched.ganttOptionDto?.titleExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.titleExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.titleExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.TitleExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.titleExpr,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.StartExpr')}
|
||||
invalid={errors.ganttOptionDto?.startExpr && touched.ganttOptionDto?.startExpr}
|
||||
errorMessage={errors.ganttOptionDto?.startExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.startExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.StartExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.startExpr,
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.StartExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.startExpr && touched.ganttOptionDto?.startExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.startExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.startExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.StartExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.startExpr,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EndExpr')}
|
||||
invalid={errors.ganttOptionDto?.endExpr && touched.ganttOptionDto?.endExpr}
|
||||
errorMessage={errors.ganttOptionDto?.endExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.endExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EndExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.endExpr,
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.EndExpr')}
|
||||
invalid={errors.ganttOptionDto?.endExpr && touched.ganttOptionDto?.endExpr}
|
||||
errorMessage={errors.ganttOptionDto?.endExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.endExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.EndExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.endExpr,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ProgressExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.progressExpr && touched.ganttOptionDto?.progressExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.progressExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.progressExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ProgressExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.progressExpr,
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ProgressExpr')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.progressExpr && touched.ganttOptionDto?.progressExpr
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.progressExpr}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
name="ganttOptionDto.progressExpr"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ProgressExpr')}
|
||||
>
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={fieldList}
|
||||
value={fieldList?.filter(
|
||||
(option) => option.value === values.ganttOptionDto.progressExpr,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</Field>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<Card className="mt-4">
|
||||
<h5 className="mb-4">
|
||||
{translate('::ListForms.SchedulerOptions.InteractionSettings')}
|
||||
</h5>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowEditing')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowEditing && touched.ganttOptionDto?.allowEditing
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowEditing}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowEditing"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowEditing')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<Card
|
||||
className="mt-4"
|
||||
header={translate('::ListForms.SchedulerOptions.InteractionSettings')}
|
||||
>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowEditing')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowEditing && touched.ganttOptionDto?.allowEditing
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowEditing}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowEditing"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowEditing')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowTaskAdding')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowTaskAdding &&
|
||||
touched.ganttOptionDto?.allowTaskAdding
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowTaskAdding}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowTaskAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowTaskAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowTaskAdding')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowTaskAdding &&
|
||||
touched.ganttOptionDto?.allowTaskAdding
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowTaskAdding}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowTaskAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowTaskAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowTaskUpdating')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowTaskUpdating &&
|
||||
touched.ganttOptionDto?.allowTaskUpdating
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowTaskUpdating}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowTaskUpdating"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowTaskUpdating')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowTaskUpdating')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowTaskUpdating &&
|
||||
touched.ganttOptionDto?.allowTaskUpdating
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowTaskUpdating}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowTaskUpdating"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowTaskUpdating')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowTaskDeleting')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowTaskDeleting &&
|
||||
touched.ganttOptionDto?.allowTaskDeleting
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowTaskDeleting}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowTaskDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowTaskDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowTaskDeleting')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowTaskDeleting &&
|
||||
touched.ganttOptionDto?.allowTaskDeleting
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowTaskDeleting}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowTaskDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowTaskDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowDependencyAdding')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowDependencyAdding &&
|
||||
touched.ganttOptionDto?.allowDependencyAdding
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowDependencyAdding}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowDependencyAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowDependencyAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowDependencyAdding')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowDependencyAdding &&
|
||||
touched.ganttOptionDto?.allowDependencyAdding
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowDependencyAdding}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowDependencyAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowDependencyAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowDependencyDeleting')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowDependencyDeleting &&
|
||||
touched.ganttOptionDto?.allowDependencyDeleting
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowDependencyDeleting}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowDependencyDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowDependencyDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowDependencyDeleting')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowDependencyDeleting &&
|
||||
touched.ganttOptionDto?.allowDependencyDeleting
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowDependencyDeleting}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowDependencyDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowDependencyDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowResourceAdding')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowResourceAdding &&
|
||||
touched.ganttOptionDto?.allowResourceAdding
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowResourceAdding}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowResourceAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowResourceAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowResourceAdding')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowResourceAdding &&
|
||||
touched.ganttOptionDto?.allowResourceAdding
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowResourceAdding}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowResourceAdding"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowResourceAdding')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowResourceDeleting')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowResourceDeleting &&
|
||||
touched.ganttOptionDto?.allowResourceDeleting
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowResourceDeleting}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowResourceDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowResourceDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowResourceDeleting')}
|
||||
invalid={
|
||||
errors.ganttOptionDto?.allowResourceDeleting &&
|
||||
touched.ganttOptionDto?.allowResourceDeleting
|
||||
}
|
||||
errorMessage={errors.ganttOptionDto?.allowResourceDeleting}
|
||||
>
|
||||
<Field
|
||||
name="ganttOptionDto.allowResourceDeleting"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowResourceDeleting')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ function FormTabPager(props: FormEditProps) {
|
|||
}
|
||||
|
||||
return (
|
||||
<Container className="grid xl:grid-cols-2">
|
||||
<Container>
|
||||
<Formik
|
||||
initialValues={listFormValues}
|
||||
validationSchema={validationSchema}
|
||||
|
|
@ -36,195 +36,204 @@ function FormTabPager(props: FormEditProps) {
|
|||
{({ touched, errors, isSubmitting, values }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PageSize')}
|
||||
invalid={errors.pageSize && touched.pageSize}
|
||||
errorMessage={errors.pageSize}
|
||||
>
|
||||
<Field
|
||||
type="number"
|
||||
className="w-20"
|
||||
autoComplete="off"
|
||||
name="pageSize"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PageSize')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormFieldEdit.OptionsVisible')}
|
||||
invalid={errors.pagerOptionDto?.visible && touched.pagerOptionDto?.visible}
|
||||
errorMessage={errors.pagerOptionDto?.visible}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.visible"
|
||||
placeholder={translate('::ListForms.ListFormFieldEdit.OptionsVisible')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingShowPageSizeSelector')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.showPageSizeSelector &&
|
||||
touched.pagerOptionDto?.showPageSizeSelector
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.showPageSizeSelector}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.showPageSizeSelector"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingShowPageSizeSelector')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingShowInfo')}
|
||||
invalid={errors.pagerOptionDto?.showInfo && touched.pagerOptionDto?.showInfo}
|
||||
errorMessage={errors.pagerOptionDto?.showInfo}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.showInfo"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingShowInfo')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingShowNavigationButtons')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.showNavigationButtons &&
|
||||
touched.pagerOptionDto?.showNavigationButtons
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.showNavigationButtons}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.showNavigationButtons"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingShowNavigationButtons')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingAllowedPageSizes')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.allowedPageSizes &&
|
||||
touched.pagerOptionDto?.allowedPageSizes
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.allowedPageSizes}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.allowedPageSizes"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingAllowedPageSizes')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingInfoText')}
|
||||
invalid={errors.pagerOptionDto?.infoText && touched.pagerOptionDto?.infoText}
|
||||
errorMessage={errors.pagerOptionDto?.infoText}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.infoText"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingInfoText')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingDisplayMode')}
|
||||
invalid={errors.pagerOptionDto?.displayMode && touched.pagerOptionDto?.displayMode}
|
||||
errorMessage={errors.pagerOptionDto?.displayMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.displayMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingDisplayMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<PagerDisplayMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={pagerDisplayModeOptions}
|
||||
value={pagerDisplayModeOptions?.filter(
|
||||
(option) => option.value === values.pagerOptionDto.displayMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div className="my-2">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PageSize')}
|
||||
invalid={errors.pageSize && touched.pageSize}
|
||||
errorMessage={errors.pageSize}
|
||||
>
|
||||
<Field
|
||||
type="number"
|
||||
className="w-20"
|
||||
autoComplete="off"
|
||||
name="pageSize"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PageSize')}
|
||||
component={Input}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingScrollingMode')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.scrollingMode && touched.pagerOptionDto?.scrollingMode
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.scrollingMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.scrollingMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingScrollingMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<ScrollMode | 'virtual'>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={pagerScrollingModeOptions}
|
||||
value={pagerScrollingModeOptions?.filter(
|
||||
(option) => option.value === values.pagerOptionDto.scrollingMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormFieldEdit.OptionsVisible')}
|
||||
invalid={errors.pagerOptionDto?.visible && touched.pagerOptionDto?.visible}
|
||||
errorMessage={errors.pagerOptionDto?.visible}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.visible"
|
||||
placeholder={translate('::ListForms.ListFormFieldEdit.OptionsVisible')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingLoadPanelEnabled')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.loadPanelEnabled &&
|
||||
touched.pagerOptionDto?.loadPanelEnabled
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.loadPanelEnabled}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.loadPanelEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingLoadPanelEnabled')}
|
||||
>
|
||||
{({ field, form }: FieldProps<boolean | 'auto'>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={loadPanelEnabledOptions}
|
||||
value={loadPanelEnabledOptions?.filter(
|
||||
(option) => option.value === values.pagerOptionDto.loadPanelEnabled,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingShowPageSizeSelector')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.showPageSizeSelector &&
|
||||
touched.pagerOptionDto?.showPageSizeSelector
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.showPageSizeSelector}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.showPageSizeSelector"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingShowPageSizeSelector')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingLoadPanelText')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.loadPanelText && touched.pagerOptionDto?.loadPanelText
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.loadPanelText}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.loadPanelText"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingLoadPanelText')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingShowInfo')}
|
||||
invalid={errors.pagerOptionDto?.showInfo && touched.pagerOptionDto?.showInfo}
|
||||
errorMessage={errors.pagerOptionDto?.showInfo}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.showInfo"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingShowInfo')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingShowNavigationButtons')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.showNavigationButtons &&
|
||||
touched.pagerOptionDto?.showNavigationButtons
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.showNavigationButtons}
|
||||
>
|
||||
<Field
|
||||
name="pagerOptionDto.showNavigationButtons"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.PagingShowNavigationButtons',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingAllowedPageSizes')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.allowedPageSizes &&
|
||||
touched.pagerOptionDto?.allowedPageSizes
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.allowedPageSizes}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.allowedPageSizes"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingAllowedPageSizes')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div className="my-2">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingInfoText')}
|
||||
invalid={errors.pagerOptionDto?.infoText && touched.pagerOptionDto?.infoText}
|
||||
errorMessage={errors.pagerOptionDto?.infoText}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.infoText"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingInfoText')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingDisplayMode')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.displayMode && touched.pagerOptionDto?.displayMode
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.displayMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.displayMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingDisplayMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<PagerDisplayMode>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={pagerDisplayModeOptions}
|
||||
value={pagerDisplayModeOptions?.filter(
|
||||
(option) => option.value === values.pagerOptionDto.displayMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingScrollingMode')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.scrollingMode && touched.pagerOptionDto?.scrollingMode
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.scrollingMode}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.scrollingMode"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingScrollingMode')}
|
||||
>
|
||||
{({ field, form }: FieldProps<ScrollMode | 'virtual'>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={pagerScrollingModeOptions}
|
||||
value={pagerScrollingModeOptions?.filter(
|
||||
(option) => option.value === values.pagerOptionDto.scrollingMode,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingLoadPanelEnabled')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.loadPanelEnabled &&
|
||||
touched.pagerOptionDto?.loadPanelEnabled
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.loadPanelEnabled}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.loadPanelEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingLoadPanelEnabled')}
|
||||
>
|
||||
{({ field, form }: FieldProps<boolean | 'auto'>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
isClearable={true}
|
||||
options={loadPanelEnabledOptions}
|
||||
value={loadPanelEnabledOptions?.filter(
|
||||
(option) => option.value === values.pagerOptionDto.loadPanelEnabled,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.PagingLoadPanelText')}
|
||||
invalid={
|
||||
errors.pagerOptionDto?.loadPanelText && touched.pagerOptionDto?.loadPanelText
|
||||
}
|
||||
errorMessage={errors.pagerOptionDto?.loadPanelText}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="pagerOptionDto.loadPanelText"
|
||||
placeholder={translate('::ListForms.ListFormEdit.PagingLoadPanelText')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ function FormTabColumns(props: FormEditProps) {
|
|||
}
|
||||
|
||||
return (
|
||||
<Container className="grid xl:grid-cols-2">
|
||||
<Container>
|
||||
<Formik
|
||||
initialValues={listFormValues}
|
||||
validationSchema={validationSchema}
|
||||
|
|
@ -31,147 +31,160 @@ function FormTabColumns(props: FormEditProps) {
|
|||
{({ touched, errors, isSubmitting, values }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowFieldPanel')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showFieldPanel && touched.pivotOptionDto?.showFieldPanel
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showFieldPanel}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showFieldPanel"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowFieldPanel')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowFieldDragging')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.allowFieldDragging &&
|
||||
touched.pivotOptionDto?.allowFieldDragging
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.allowFieldDragging}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.allowFieldDragging"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowFieldDragging')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnChooserEnabled')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.columnChooserEnabled &&
|
||||
touched.pivotOptionDto?.columnChooserEnabled
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.columnChooserEnabled}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.columnChooserEnabled"
|
||||
placeholder={translate('::ListForms.ListFormEdit.SelectionColumnChooserEnabled')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowColumnFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showRowFields && touched.pivotOptionDto?.showRowFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showRowFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showColumnFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowColumnFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowRowFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showRowFields && touched.pivotOptionDto?.showRowFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showRowFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showRowFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowRowFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowDataFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showDataFields && touched.pivotOptionDto?.showDataFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showDataFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showDataFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowDataFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowFilterFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showFilterFields &&
|
||||
touched.pivotOptionDto?.showFilterFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showFilterFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showFilterFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowFilterFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowChart')}
|
||||
invalid={errors.pivotOptionDto?.showChart && touched.pivotOptionDto?.showChart}
|
||||
errorMessage={errors.pivotOptionDto?.showChart}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showChart"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowChart')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ChartHeight')}
|
||||
invalid={errors.pivotOptionDto?.chartHeight && touched.pivotOptionDto?.chartHeight}
|
||||
errorMessage={errors.pivotOptionDto?.chartHeight}
|
||||
>
|
||||
<Field
|
||||
className="w-20"
|
||||
type="number"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.chartHeight"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ChartHeight')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Type"
|
||||
invalid={
|
||||
errors.pivotOptionDto?.chartCommonSeriesType &&
|
||||
touched.pivotOptionDto?.chartCommonSeriesType
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.chartCommonSeriesType}
|
||||
>
|
||||
<Field type="text" name="pivotOptionDto.chartCommonSeriesType">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesTypeOptions}
|
||||
value={chartSeriesTypeOptions.filter(
|
||||
(option) => option.value === values.pivotOptionDto.chartCommonSeriesType,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowFieldPanel')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showFieldPanel &&
|
||||
touched.pivotOptionDto?.showFieldPanel
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showFieldPanel}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showFieldPanel"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowFieldPanel')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.AllowFieldDragging')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.allowFieldDragging &&
|
||||
touched.pivotOptionDto?.allowFieldDragging
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.allowFieldDragging}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.allowFieldDragging"
|
||||
placeholder={translate('::ListForms.ListFormEdit.AllowFieldDragging')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.SelectionColumnChooserEnabled')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.columnChooserEnabled &&
|
||||
touched.pivotOptionDto?.columnChooserEnabled
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.columnChooserEnabled}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.columnChooserEnabled"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormEdit.SelectionColumnChooserEnabled',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowColumnFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showRowFields && touched.pivotOptionDto?.showRowFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showRowFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showColumnFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowColumnFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowRowFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showRowFields && touched.pivotOptionDto?.showRowFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showRowFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showRowFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowRowFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowDataFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showDataFields &&
|
||||
touched.pivotOptionDto?.showDataFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showDataFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showDataFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowDataFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowFilterFields')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.showFilterFields &&
|
||||
touched.pivotOptionDto?.showFilterFields
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.showFilterFields}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showFilterFields"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowFilterFields')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ShowChart')}
|
||||
invalid={errors.pivotOptionDto?.showChart && touched.pivotOptionDto?.showChart}
|
||||
errorMessage={errors.pivotOptionDto?.showChart}
|
||||
>
|
||||
<Field
|
||||
name="pivotOptionDto.showChart"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ShowChart')}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormEdit.ChartHeight')}
|
||||
invalid={
|
||||
errors.pivotOptionDto?.chartHeight && touched.pivotOptionDto?.chartHeight
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.chartHeight}
|
||||
>
|
||||
<Field
|
||||
className="w-20"
|
||||
type="number"
|
||||
autoComplete="off"
|
||||
name="editingOptionDto.chartHeight"
|
||||
placeholder={translate('::ListForms.ListFormEdit.ChartHeight')}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
label="Type"
|
||||
invalid={
|
||||
errors.pivotOptionDto?.chartCommonSeriesType &&
|
||||
touched.pivotOptionDto?.chartCommonSeriesType
|
||||
}
|
||||
errorMessage={errors.pivotOptionDto?.chartCommonSeriesType}
|
||||
>
|
||||
<Field type="text" name="pivotOptionDto.chartCommonSeriesType">
|
||||
{({ field, form }: FieldProps<SelectBoxOption>) => (
|
||||
<Select
|
||||
field={field}
|
||||
form={form}
|
||||
options={chartSeriesTypeOptions}
|
||||
value={chartSeriesTypeOptions.filter(
|
||||
(option) =>
|
||||
option.value === values.pivotOptionDto.chartCommonSeriesType,
|
||||
)}
|
||||
onChange={(option) => form.setFieldValue(field.name, option?.value)}
|
||||
/>
|
||||
)}
|
||||
</Field>
|
||||
</FormItem>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit" className="my-2">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
|
|
|
|||
|
|
@ -82,10 +82,11 @@ function FormTabScheduler(props: FormEditProps) {
|
|||
{({ touched, errors, isSubmitting, values }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<Card className="mt-4">
|
||||
<h5 className="mb-4">{translate('::ListForms.SchedulerOptions.BasicSettings')}</h5>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-3">
|
||||
<Card
|
||||
className="mt-4"
|
||||
header={translate('::ListForms.SchedulerOptions.BasicSettings')}
|
||||
>
|
||||
<FormItem
|
||||
label={translate('::ListForms.SchedulerOptions.TextExpr')}
|
||||
invalid={
|
||||
|
|
@ -181,9 +182,10 @@ function FormTabScheduler(props: FormEditProps) {
|
|||
</FormItem>
|
||||
</Card>
|
||||
|
||||
<Card className="mt-4">
|
||||
<h5 className="mb-4">{translate('::ListForms.SchedulerOptions.ViewSettings')}</h5>
|
||||
|
||||
<Card
|
||||
className="mt-4"
|
||||
header={translate('::ListForms.SchedulerOptions.ViewSettings')}
|
||||
>
|
||||
<FormItem label={translate('::ListForms.SchedulerOptions.DefaultView')}>
|
||||
<Field name="schedulerOptionDto.defaultView">
|
||||
{({ field, form }: FieldProps) => (
|
||||
|
|
@ -273,11 +275,10 @@ function FormTabScheduler(props: FormEditProps) {
|
|||
</FormItem>
|
||||
</Card>
|
||||
|
||||
<Card className="mt-4">
|
||||
<h5 className="mb-4">
|
||||
{translate('::ListForms.SchedulerOptions.RecurrenceSettings')}
|
||||
</h5>
|
||||
|
||||
<Card
|
||||
className="mt-4"
|
||||
header={translate('::ListForms.SchedulerOptions.RecurrenceSettings')}
|
||||
>
|
||||
<FormItem
|
||||
label={translate('::ListForms.SchedulerOptions.RecurrenceRuleExpr')}
|
||||
invalid={
|
||||
|
|
@ -329,11 +330,10 @@ function FormTabScheduler(props: FormEditProps) {
|
|||
</FormItem>
|
||||
</Card>
|
||||
|
||||
<Card className="mt-4">
|
||||
<h5 className="mb-4">
|
||||
{translate('::ListForms.SchedulerOptions.InteractionSettings')}
|
||||
</h5>
|
||||
|
||||
<Card
|
||||
className="mt-4"
|
||||
header={translate('::ListForms.SchedulerOptions.InteractionSettings')}
|
||||
>
|
||||
<FormItem label={translate('::ListForms.SchedulerOptions.ShowAllDayPanel')}>
|
||||
<Field name="schedulerOptionDto.showAllDayPanel" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
|
@ -363,7 +363,6 @@ function FormTabScheduler(props: FormEditProps) {
|
|||
</FormItem>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit" className="my-2">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>{' '}
|
||||
|
|
|
|||
|
|
@ -25,9 +25,11 @@ function FormFieldEdit({
|
|||
listFormCode,
|
||||
item,
|
||||
onSubmit,
|
||||
fields
|
||||
}: {
|
||||
listFormCode: string
|
||||
item: ColumnFormatEditDto | null
|
||||
fields: ColumnFormatEditDto[]
|
||||
} & FormFieldEditProps) {
|
||||
const { translate } = useLocalization()
|
||||
|
||||
|
|
@ -128,6 +130,7 @@ function FormFieldEdit({
|
|||
listFormCode={listFormCode}
|
||||
initialValues={item}
|
||||
onSubmit={onSubmit}
|
||||
fields={fields}
|
||||
/>
|
||||
</TabContent>
|
||||
<TabContent value="totalSummary">
|
||||
|
|
@ -135,6 +138,7 @@ function FormFieldEdit({
|
|||
listFormCode={listFormCode}
|
||||
initialValues={item}
|
||||
onSubmit={onSubmit}
|
||||
fields={fields}
|
||||
/>
|
||||
</TabContent>
|
||||
<TabContent value="joinOptions">
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@ function FormFieldTabCssOptions({
|
|||
/>
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ function FormFieldTabCustomization({
|
|||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -133,7 +133,7 @@ function FormFieldTabDetails({
|
|||
</FormItem>
|
||||
</Card>
|
||||
</div>
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -84,7 +84,7 @@ function FormFieldTabFiltering({
|
|||
/>
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ 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()
|
||||
|
|
@ -25,12 +26,21 @@ function FormFieldTabGroupSummary({
|
|||
listFormCode,
|
||||
initialValues,
|
||||
onSubmit,
|
||||
fields,
|
||||
}: {
|
||||
listFormCode: string
|
||||
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
|
||||
|
|
@ -121,13 +131,25 @@ function FormFieldTabGroupSummary({
|
|||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
autoFocus={true}
|
||||
name="columnGroupSummaryDto.showInColumn"
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormFieldEdit.GroupingSummaryShowInColumn',
|
||||
)}
|
||||
component={Input}
|
||||
/>
|
||||
>
|
||||
{({ 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
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@ function FormFieldTabGrouping({
|
|||
/>
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ function FormFieldTabHeadering({
|
|||
/>
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -234,7 +234,7 @@ function FormFieldTabJoinOptions({
|
|||
</FormItem>
|
||||
</Card>
|
||||
</div>
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -458,7 +458,7 @@ function FormFieldTabLookup({
|
|||
</FormItem>
|
||||
</Card>
|
||||
</div>
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -113,7 +113,7 @@ function FormFieldTabOptions({
|
|||
</Card>
|
||||
</div>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -159,7 +159,7 @@ function FormFieldTabPermissions({
|
|||
<Field name="permissionDto.i" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -214,7 +214,7 @@ function FormFieldTabPivotSetting({
|
|||
</FormItem>
|
||||
</Card>
|
||||
</div>
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,8 @@ 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 { useState } from 'react'
|
||||
|
||||
const schema = object().shape({
|
||||
columnTotalSummaryDto: object()
|
||||
|
|
@ -25,12 +27,21 @@ function FormFieldTabTotalSummary({
|
|||
listFormCode,
|
||||
initialValues,
|
||||
onSubmit,
|
||||
fields,
|
||||
}: {
|
||||
listFormCode: string
|
||||
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
|
||||
|
|
@ -66,12 +77,16 @@ function FormFieldTabTotalSummary({
|
|||
</Field>
|
||||
</FormItem>
|
||||
|
||||
<FormItem label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat')}>
|
||||
<FormItem
|
||||
label={translate('::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat')}
|
||||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
name="columnTotalSummaryDto.valueFormat"
|
||||
placeholder={translate('::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat')}
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormFieldEdit.GroupingSummaryValueFormat',
|
||||
)}
|
||||
>
|
||||
{({ field, form }: FieldProps<any>) => (
|
||||
<Select
|
||||
|
|
@ -100,7 +115,9 @@ function FormFieldTabTotalSummary({
|
|||
type="text"
|
||||
autoComplete="off"
|
||||
name="columnTotalSummaryDto.displayFormat"
|
||||
placeholder={translate('::ListForms.ListFormFieldEdit.GroupingSummaryDisplayFormat')}
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormFieldEdit.GroupingSummaryDisplayFormat',
|
||||
)}
|
||||
component={Input}
|
||||
/>
|
||||
</FormItem>
|
||||
|
|
@ -115,11 +132,25 @@ function FormFieldTabTotalSummary({
|
|||
>
|
||||
<Field
|
||||
type="text"
|
||||
autoComplete="off"
|
||||
autoFocus={true}
|
||||
name="columnTotalSummaryDto.showInColumn"
|
||||
placeholder={translate('::ListForms.ListFormFieldEdit.GroupingSummaryShowInColumn')}
|
||||
component={Input}
|
||||
/>
|
||||
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
|
||||
|
|
@ -139,12 +170,14 @@ function FormFieldTabTotalSummary({
|
|||
>
|
||||
<Field
|
||||
name="columnTotalSummaryDto.alignByColumn"
|
||||
placeholder={translate('::ListForms.ListFormFieldEdit.GroupingSummaryAlignByColumn')}
|
||||
placeholder={translate(
|
||||
'::ListForms.ListFormFieldEdit.GroupingSummaryAlignByColumn',
|
||||
)}
|
||||
component={Checkbox}
|
||||
/>
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isSubmitting} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -355,7 +355,7 @@ function FormFieldTabValidationRules({
|
|||
<Field name="trim" placeholder="Trim" component={Checkbox} />
|
||||
</FormItem>
|
||||
|
||||
<Button block variant="solid" loading={isLoading} type="submit">
|
||||
<Button className="mt-1" block variant="solid" loading={isLoading} type="submit">
|
||||
{isLoading ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</FormContainer>
|
||||
|
|
|
|||
|
|
@ -505,7 +505,7 @@ function FormFields({
|
|||
</Table>
|
||||
</div>
|
||||
<div className="2xl:col-span-3 lg:col-span-3 xl:col-span-2">
|
||||
<FormFieldEdit listFormCode={listFormCode} item={row} onSubmit={onSubmit} />
|
||||
<FormFieldEdit listFormCode={listFormCode} item={row} onSubmit={onSubmit} fields={fields} />
|
||||
</div>
|
||||
</div>
|
||||
</AdaptableCard>
|
||||
|
|
|
|||
Loading…
Reference in a new issue