refactor: useFieldModeOptions (#2612)

* refactor: useFieldModeOptions

* refactor: code improve

* refactor: code improve

packages/core/client/src/schema-component/hooks/useFieldModeOptions.tsx

@@ -1,4 +1,4 @@
-import { useField, useFieldSchema } from '@formily/react';
+import { useField, useFieldSchema, useForm } from '@formily/react';
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useCollection, useCollectionManager } from '../../collection-manager';
@@ -8,7 +8,8 @@ export const useFieldModeOptions = (props?) => {
   const currentFieldSchema = useFieldSchema();
   const fieldSchema = props?.fieldSchema || currentFieldSchema;
   const field = useField();
-  const isReadPretty = field.readPretty;
+  const form = useForm();
+  const isReadPretty = field.readPretty && form.readPretty;
   const isSubTableField = props?.fieldSchema;
   const { getField } = useCollection();
   const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']);

packages/plugins/graph-collection-manager/src/client/GraphDrawPage.tsx

@@ -47,6 +47,7 @@ import {
   getInheritCollections,
   getPopupContainer,
   useGCMTranslation,
+  cleanGraphContainer,
 } from './utils';
 const { drop, groupBy, last, maxBy, minBy, take, uniq } = lodash;
 
@@ -628,7 +629,6 @@ export const GraphDrawPage = React.memo(() => {
     targetGraph.selectedCollections = queryString;
   };
   const handleConnectionParents = (collections) => {
-    console.log(collections);
     let data = targetGraph.selectedCollections.split(',') || [];
     data = data.concat(collections);
     const queryString = uniq(data).toString();
@@ -1079,6 +1079,9 @@ export const GraphDrawPage = React.memo(() => {
     } else {
       !selectedCollections && renderInitGraphCollection(collections);
     }
+    return () => {
+      cleanGraphContainer();
+    };
   }, [searchParams, collectionList]);
 
   const loadCollections = async () => {

packages/plugins/graph-collection-manager/src/client/components/SelectCollectionsAction.tsx

@@ -30,9 +30,6 @@ export const SelectCollectionsAction = (props) => {
       getPopupContainer={getPopupContainer}
       mode="multiple"
       allowClear
-      onSearch={(value) => {
-        console.log(value);
-      }}
       options={collectionOptions}
       onChange={handleChange}
       style={{ minWidth: 200, position: 'fixed', margin: '24px', zIndex: 1000, maxWidth: '60%' }}

packages/plugins/graph-collection-manager/src/client/utils.tsx

@@ -552,3 +552,7 @@ export const getPopupContainer = () => {
   }
   return (graphContainer = document.getElementById('graph_container'));
 };
+
+export const cleanGraphContainer = () => {
+  graphContainer = null;
+};