feat: custom filter form add input component
This commit is contained in:
parent
c56ce13a0d
commit
d06cce2cfa
@ -14,7 +14,7 @@ export class Locale {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useTranslation = () => {
|
export const useTranslation = (): any => {
|
||||||
const { i18n } = useApp();
|
const { i18n } = useApp();
|
||||||
const t = (key: string, props = {}) => i18n.t(key, { ns: NAMESPACE, ...props });
|
const t = (key: string, props = {}) => i18n.t(key, { ns: NAMESPACE, ...props });
|
||||||
return { t };
|
return { t };
|
||||||
|
@ -25,33 +25,22 @@ import {
|
|||||||
removeNullCondition,
|
removeNullCondition,
|
||||||
useAPIClient,
|
useAPIClient,
|
||||||
} from '@nocobase/client';
|
} from '@nocobase/client';
|
||||||
import { Alert, ConfigProvider, Typography } from 'antd';
|
import { ConfigProvider } from 'antd';
|
||||||
import React, { memo, useCallback, useContext, useMemo } from 'react';
|
import React, { memo, useCallback, useContext, useMemo } from 'react';
|
||||||
import { Schema, SchemaOptionsContext, observer, useField, useFieldSchema, useForm } from '@formily/react';
|
import { Schema, SchemaOptionsContext, observer, useField, useFieldSchema } from '@formily/react';
|
||||||
import { FormLayout } from '@formily/antd-v5';
|
import { FormLayout } from '@formily/antd-v5';
|
||||||
import { uid } from '@formily/shared';
|
import { uid } from '@formily/shared';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { Field } from '@formily/core';
|
||||||
import { useMemoizedFn } from 'ahooks';
|
|
||||||
import { Field, onFieldValueChange } from '@formily/core';
|
|
||||||
import { EditFormulaTitleField, EditTitle, EditTitleField } from '../../components/SchemaSettingOptions';
|
import { EditFormulaTitleField, EditTitle, EditTitleField } from '../../components/SchemaSettingOptions';
|
||||||
import _ from 'lodash';
|
import _ from 'lodash';
|
||||||
import { SchemaSettingsRemove } from '../../components/FormFilter/SchemaSettingsRemove';
|
import { SchemaSettingsRemove } from '../../components/FormFilter/SchemaSettingsRemove';
|
||||||
export const NAMESPACE = 'data-visualization';
|
import { useTranslation } from '../../locale';
|
||||||
|
|
||||||
export function lang(key: string) {
|
|
||||||
return i18n.t(key, { ns: [NAMESPACE, 'client'] });
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useChartsTranslation() {
|
|
||||||
return useTranslation([NAMESPACE, 'client'], { nsMode: 'fallback' });
|
|
||||||
}
|
|
||||||
|
|
||||||
export const useFieldComponents = () => {
|
export const useFieldComponents = () => {
|
||||||
const { t } = useChartsTranslation();
|
const { t } = useTranslation();
|
||||||
const options = [
|
const options = [
|
||||||
|
{ label: t('Input'), value: 'Input' },
|
||||||
{ label: t('Select'), value: 'Select' },
|
{ label: t('Select'), value: 'Select' },
|
||||||
// { label: t('Radio group'), value: 'Radio.Group' },
|
|
||||||
// { label: t('Checkbox group'), value: 'Checkbox.Group' },
|
|
||||||
];
|
];
|
||||||
return {
|
return {
|
||||||
options,
|
options,
|
||||||
@ -63,8 +52,7 @@ export const FilterCustomItemInitializer: React.FC<{
|
|||||||
insert?: any;
|
insert?: any;
|
||||||
}> = memo((props) => {
|
}> = memo((props) => {
|
||||||
const { locale } = useContext(ConfigProvider.ConfigContext);
|
const { locale } = useContext(ConfigProvider.ConfigContext);
|
||||||
const { t: lang } = useChartsTranslation();
|
const { t } = useTranslation();
|
||||||
const t = useMemoizedFn(lang);
|
|
||||||
const { scope, components } = useContext(SchemaOptionsContext);
|
const { scope, components } = useContext(SchemaOptionsContext);
|
||||||
const { theme } = useGlobalTheme();
|
const { theme } = useGlobalTheme();
|
||||||
const { insert } = props;
|
const { insert } = props;
|
||||||
@ -83,11 +71,6 @@ export const FilterCustomItemInitializer: React.FC<{
|
|||||||
() => (
|
() => (
|
||||||
<SchemaComponentOptions scope={{ ...scope, useCollectionManager_deprecated }} components={{ ...components }}>
|
<SchemaComponentOptions scope={{ ...scope, useCollectionManager_deprecated }} components={{ ...components }}>
|
||||||
<FormLayout layout={'vertical'}>
|
<FormLayout layout={'vertical'}>
|
||||||
<Alert
|
|
||||||
type="info"
|
|
||||||
message={t('To filter with custom fields, use "Current filter" variables in the chart configuration.')}
|
|
||||||
style={{ marginBottom: 16 }}
|
|
||||||
/>
|
|
||||||
<ConfigProvider locale={locale}>
|
<ConfigProvider locale={locale}>
|
||||||
<SchemaComponent
|
<SchemaComponent
|
||||||
schema={{
|
schema={{
|
||||||
@ -178,7 +161,7 @@ export const FilterFormItemCustom = () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const FilterItemCustomDesigner: React.FC = () => {
|
export const FilterItemCustomDesigner: React.FC = () => {
|
||||||
const { t } = useChartsTranslation();
|
const { t } = useTranslation();
|
||||||
const fieldSchema = useFieldSchema();
|
const fieldSchema = useFieldSchema();
|
||||||
const fieldName = fieldSchema['name'] as string;
|
const fieldName = fieldSchema['name'] as string;
|
||||||
const name = fieldName.includes('custom') ? fieldSchema['x-decorator-props'] : fieldName;
|
const name = fieldName.includes('custom') ? fieldSchema['x-decorator-props'] : fieldName;
|
||||||
|
Loading…
Reference in New Issue
Block a user