From 4e4c4eae27e32c7f153922bae847f7d41cdb9675 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=A2=AB=E9=9B=A8=E6=B0=B4=E8=BF=87=E6=BB=A4=E7=9A=84?=
=?UTF-8?q?=E7=A9=BA=E6=B0=94-Rain?= <958414905@qq.com>
Date: Tue, 1 Aug 2023 16:19:15 +0800
Subject: [PATCH] fix(default-value): should not show 'N/A' when a normal value
is selected. (#2365)
* fix(default-value): fix N/A
* fix: fix invalid selection
---
.../association-field/AssociationSelect.tsx | 16 ++++--
.../antd/form-item/FormItem.tsx | 6 +--
.../src/schema-settings/SchemaSettings.tsx | 52 +++++++++----------
.../VariableInput/VariableInput.tsx | 2 +-
4 files changed, 42 insertions(+), 34 deletions(-)
diff --git a/packages/core/client/src/schema-component/antd/association-field/AssociationSelect.tsx b/packages/core/client/src/schema-component/antd/association-field/AssociationSelect.tsx
index af9990550..cd6865bef 100644
--- a/packages/core/client/src/schema-component/antd/association-field/AssociationSelect.tsx
+++ b/packages/core/client/src/schema-component/antd/association-field/AssociationSelect.tsx
@@ -2,7 +2,7 @@ import { LoadingOutlined, PlusOutlined } from '@ant-design/icons';
import { RecursionField, connect, mapProps, observer, useField, useFieldSchema, useForm } from '@formily/react';
import { Space, message } from 'antd';
import { isFunction } from 'mathjs';
-import React from 'react';
+import React, { useState } from 'react';
import { useTranslation } from 'react-i18next';
import { RecordProvider, useAPIClient } from '../../../';
import { isVariable } from '../../common/utils/uitls';
@@ -22,6 +22,10 @@ const InternalAssociationSelect = observer((props: AssociationSelectProps) => {
const { options: collectionField } = useAssociationFieldContext();
const initValue = isVariable(props.value) ? undefined : props.value;
const value = Array.isArray(initValue) ? initValue.filter(Boolean) : initValue;
+
+ // 因为通过 Schema 的形式书写的组件,在值变更的时候 `value` 的值没有改变,所以需要维护一个 `innerValue` 来变更值
+ const [innerValue, setInnerValue] = useState(value);
+
const addMode = fieldSchema['x-component-props']?.addMode;
const isAllowAddNew = fieldSchema['x-add-new'];
const { t } = useTranslation();
@@ -29,6 +33,7 @@ const InternalAssociationSelect = observer((props: AssociationSelectProps) => {
const form = useForm();
const api = useAPIClient();
const resource = api.resource(collectionField.target);
+
const handleCreateAction = async (props) => {
const { search: value, callBack } = props;
const {
@@ -63,6 +68,7 @@ const InternalAssociationSelect = observer((props: AssociationSelectProps) => {
);
};
+
return (
@@ -71,8 +77,12 @@ const InternalAssociationSelect = observer((props: AssociationSelectProps) => {
{...props}
size={'middle'}
objectValue={objectValue}
- value={value}
+ value={value || innerValue}
service={service}
+ onChange={(value) => {
+ setInnerValue(value);
+ props.onChange?.(value);
+ }}
CustomDropdownRender={addMode === 'quickAdd' && QuickAddContent}
>
@@ -99,7 +109,7 @@ interface AssociationSelectInterface {
FilterDesigner: React.FC;
}
-export const AssociationSelect = InternalAssociationSelect as unknown as AssociationSelectInterface;
+export const AssociationSelect = (InternalAssociationSelect as unknown) as AssociationSelectInterface;
export const AssociationSelectReadPretty = connect(
(props: any) => {
diff --git a/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx b/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx
index 403c479f3..d5e526dcc 100644
--- a/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx
+++ b/packages/core/client/src/schema-component/antd/form-item/FormItem.tsx
@@ -1,7 +1,7 @@
import { css, cx } from '@emotion/css';
-import { ArrayCollapse, ArrayItems, FormItem as Item, FormLayout } from '@formily/antd-v5';
+import { ArrayCollapse, ArrayItems, FormLayout, FormItem as Item } from '@formily/antd-v5';
import { Field } from '@formily/core';
-import { ISchema, observer, Schema, useField, useFieldSchema } from '@formily/react';
+import { ISchema, observer, useField, useFieldSchema } from '@formily/react';
import { dayjs } from '@nocobase/utils/client';
import { Select } from 'antd';
import _ from 'lodash';
@@ -20,7 +20,7 @@ import {
} from '../../../collection-manager';
import { isTitleField } from '../../../collection-manager/Configuration/CollectionFields';
import { GeneralSchemaItems } from '../../../schema-items/GeneralSchemaItems';
-import { GeneralSchemaDesigner, isPatternDisabled, isShowDefaultValue, SchemaSettings } from '../../../schema-settings';
+import { GeneralSchemaDesigner, SchemaSettings, isPatternDisabled, isShowDefaultValue } from '../../../schema-settings';
import { useIsShowMultipleSwitch } from '../../../schema-settings/hooks/useIsShowMultipleSwitch';
import { isVariable, parseVariables, useVariablesCtx } from '../../common/utils/uitls';
import { useCompile, useDesignable, useFieldModeOptions } from '../../hooks';
diff --git a/packages/core/client/src/schema-settings/SchemaSettings.tsx b/packages/core/client/src/schema-settings/SchemaSettings.tsx
index 899fbf0f0..a3e2246ca 100644
--- a/packages/core/client/src/schema-settings/SchemaSettings.tsx
+++ b/packages/core/client/src/schema-settings/SchemaSettings.tsx
@@ -98,8 +98,6 @@ interface SchemaSettingsContextProps {
collectionName?: any;
}
-const mouseEnterDelay = 150;
-
const SchemaSettingsContext = createContext(null);
export const useSchemaSettings = () => {
@@ -1443,7 +1441,7 @@ export const findParentFieldSchema = (fieldSchema: Schema) => {
}
};
-SchemaSettings.DefaultValue = function DefaultvalueConfigure(props) {
+SchemaSettings.DefaultValue = function DefaultValueConfigure(props) {
const variablesCtx = useVariablesCtx();
const currentSchema = useFieldSchema();
const fieldSchema = props?.fieldSchema ?? currentSchema;
@@ -1463,9 +1461,10 @@ SchemaSettings.DefaultValue = function DefaultvalueConfigure(props) {
const parentFieldSchema = collectionField?.interface === 'm2o' && findParentFieldSchema(fieldSchema);
const parentCollectionField = parentFieldSchema && getCollectionJoinField(parentFieldSchema?.['x-collection-field']);
const tableCtx = useTableBlockContext();
- const isAllowContexVariable =
+ const isAllowContextVariable =
collectionField?.interface === 'm2m' ||
(parentCollectionField?.type === 'hasMany' && collectionField?.interface === 'm2o');
+
return (
- );
+ const schema = {
+ ...(s || {}),
+ 'x-component-props': {
+ ...s['x-component-props'],
+ collectionName: collectionField?.collectionName,
+ targetField,
+ onChange: props.onChange,
+ defaultValue: getFieldDefaultValue(s, collectionField),
+ style: {
+ width: '100%',
+ verticalAlign: 'top',
+ minWidth: '200px',
+ },
+ },
+ };
+
+ return ;
},
},
- name: 'default',
title: t('Default value'),
default: getFieldDefaultValue(fieldSchema, collectionField),
},
diff --git a/packages/core/client/src/schema-settings/VariableInput/VariableInput.tsx b/packages/core/client/src/schema-settings/VariableInput/VariableInput.tsx
index 457cbee1a..88aecd88b 100644
--- a/packages/core/client/src/schema-settings/VariableInput/VariableInput.tsx
+++ b/packages/core/client/src/schema-settings/VariableInput/VariableInput.tsx
@@ -64,7 +64,7 @@ export const VariableInput = (props: Props) => {
onChange={onChange}
scope={scope}
style={style}
- changeOnSelect={contextCollectionName!==null}
+ changeOnSelect={contextCollectionName !== null}
>