upgrade formily

This commit is contained in:
chenos 2021-08-20 00:05:29 +08:00
parent 4b20cd7bbf
commit 7d604cdf9a
3 changed files with 60 additions and 261 deletions

View File

@ -21,9 +21,9 @@
"@antv/g2plot": "^2.3.27",
"@dnd-kit/core": "^3.1.1",
"@dnd-kit/sortable": "^4.0.0",
"@formily/antd": "^2.0.0-rc.1",
"@formily/core": "^2.0.0-rc.1",
"@formily/react": "^2.0.0-rc.1",
"@formily/antd": "^2.0.0-rc.2",
"@formily/core": "^2.0.0-rc.2",
"@formily/react": "^2.0.0-rc.2",
"@monaco-editor/react": "^4.2.1",
"ahooks": "^2.10.2",
"axios": "^0.21.1",

View File

@ -1,201 +0,0 @@
import React, { useContext, useMemo, useRef, useState } from 'react';
import { createForm } from '@formily/core';
import {
SchemaOptionsContext,
Schema,
useFieldSchema,
observer,
SchemaExpressionScopeContext,
FormProvider,
ISchema,
useField,
useForm,
RecursionField,
} from '@formily/react';
import {
useSchemaPath,
SchemaField,
useDesignable,
removeSchema,
updateSchema,
} from '../';
import get from 'lodash/get';
import { Button, Dropdown, Menu, Space, Switch } from 'antd';
import { MenuOutlined, DragOutlined } from '@ant-design/icons';
import cls from 'classnames';
import { FormDialog, FormLayout } from '@formily/antd';
import './style.less';
import AddNew from '../add-new';
import { DraggableBlockContext } from '../../components/drag-and-drop';
import { isGridRowOrCol } from '../grid';
import constate from 'constate';
import { useEffect } from 'react';
import { uid } from '@formily/shared';
import { getSchemaPath } from '../../components/schema-renderer';
import { RandomNameContext } from '.';
import { useCollectionContext, useDisplayedMapContext } from '../../constate';
import SwitchMenuItem from '../../components/SwitchMenuItem';
export const FieldDesignableBar = observer((props) => {
const field = useField();
const { schema, deepRemove } = useDesignable();
const [visible, setVisible] = useState(false);
const { dragRef } = useContext(DraggableBlockContext);
const randomName = useContext(RandomNameContext);
const displayed = useDisplayedMapContext();
const fieldName = schema['x-component-props']?.['fieldName'];
const { getField } = useCollectionContext();
const collectionField = getField(fieldName);
console.log({ collectionField });
const realField = field
.query(field.address.concat(randomName, fieldName))
.take();
return (
<div className={cls('designable-bar', { active: visible })}>
<span
onClick={(e) => {
e.stopPropagation();
}}
className={cls('designable-bar-actions', { active: visible })}
>
<Space size={2}>
<AddNew.FormItem defaultAction={'insertAfter'} ghost />
{dragRef && <DragOutlined ref={dragRef} />}
<Dropdown
placement={'bottomRight'}
trigger={['click']}
visible={visible}
onVisibleChange={(visible) => {
setVisible(visible);
}}
overlay={
<Menu>
<Menu.Item
key={'update'}
onClick={async () => {
const values = await FormDialog('修改字段名称', () => {
return (
<FormLayout layout={'vertical'}>
<SchemaField
schema={{
type: 'object',
properties: {
fieldName: {
type: 'string',
title: '原字段名称',
'x-read-pretty': true,
'x-decorator': 'FormItem',
'x-component': 'Input',
},
title: {
type: 'string',
title: '自定义名称',
'x-decorator': 'FormItem',
'x-component': 'Input',
},
},
}}
/>
</FormLayout>
);
}).open({
initialValues: {
fieldName: collectionField?.uiSchema?.title,
title: schema['title'],
},
});
const title = values.title || null;
field
.query(field.address.concat(randomName, fieldName))
.take((f) => {
f.title = title || collectionField?.uiSchema?.title;
});
schema['title'] = title;
await updateSchema({
key: schema['key'],
title,
});
}}
>
</Menu.Item>
<Menu.Item
style={{ minWidth: 150 }}
onClick={async () => {
const values = await FormDialog('编辑描述', () => {
return (
<FormLayout layout={'vertical'}>
<SchemaField
schema={{
type: 'object',
properties: {
description: {
type: 'string',
'x-component': 'Input.TextArea',
},
},
}}
/>
</FormLayout>
);
}).open({
initialValues: {
description: schema['description'],
},
});
const description = values.description || null;
realField.description =
description || collectionField?.uiSchema?.description;
schema['description'] = description;
await updateSchema({
key: schema['key'],
description,
});
}}
>
</Menu.Item>
<SwitchMenuItem
title={'必填'}
checked={schema.required as boolean}
onChange={(checked) => {
field
.query(field.address.concat(randomName, fieldName))
.take((f: any) => {
f.required = checked;
schema.required = checked;
updateSchema(schema);
});
}}
/>
<Menu.Divider />
<Menu.Item
key={'delete'}
onClick={async () => {
const removed = deepRemove();
const fieldName =
schema['x-component-props']?.['fieldName'];
console.log({ schema, removed, fieldName });
const last = removed.pop();
displayed.remove(fieldName);
if (isGridRowOrCol(last)) {
await removeSchema(last);
}
}}
>
</Menu.Item>
</Menu>
}
>
<MenuOutlined />
</Dropdown>
</Space>
</span>
</div>
);
});

114
yarn.lock
View File

@ -1915,78 +1915,78 @@
resolved "https://registry.npmjs.org/@formatjs/intl-utils/-/intl-utils-2.3.0.tgz#2dc8c57044de0340eb53a7ba602e59abf80dc799"
integrity sha512-KWk80UPIzPmUg+P0rKh6TqspRw0G6eux1PuJr+zz47ftMaZ9QDwbGzHZbtzWkl5hgayM/qrKRutllRC7D/vVXQ==
"@formily/antd@^2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/antd/-/antd-2.0.0-rc.1.tgz#32040bbfcdbb90d33d238ce6fd562850844fc5c3"
integrity sha512-wQtB3wrr1ZVIOfOuKeMY5V5eUS6Yb/lrR1A1Gr6fdXpIHQSJoET9pWIy4r8d99V67vdEKCzUiPJG8+6BFOgdEQ==
"@formily/antd@^2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/antd/-/antd-2.0.0-rc.2.tgz#81dd3ced30f42ce121e89cebb6ecbdc529ad6c3f"
integrity sha512-IJxGOyIPICZgEemQxKCc1p/5VESeCrTaTTC6AGaFkFShxFvlOx8XwXq7/BAgIuFstwV6vkbnXO656G/3SZXByg==
dependencies:
"@ant-design/icons" "^4.0.0"
"@formily/core" "2.0.0-rc.1"
"@formily/json-schema" "2.0.0-rc.1"
"@formily/react" "2.0.0-rc.1"
"@formily/reactive" "2.0.0-rc.1"
"@formily/reactive-react" "2.0.0-rc.1"
"@formily/shared" "2.0.0-rc.1"
"@formily/core" "2.0.0-rc.2"
"@formily/json-schema" "2.0.0-rc.2"
"@formily/react" "2.0.0-rc.2"
"@formily/reactive" "2.0.0-rc.2"
"@formily/reactive-react" "2.0.0-rc.2"
"@formily/shared" "2.0.0-rc.2"
"@juggle/resize-observer" "^3.3.1"
classnames "^2.2.6"
react-sortable-hoc "^1.11.0"
react-sticky-box "^0.9.3"
"@formily/core@2.0.0-rc.1", "@formily/core@^2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/core/-/core-2.0.0-rc.1.tgz#7e5eea4350d4d4adabd93187c84d9a2c43dc9726"
integrity sha512-5bqNmXTDsM9F0AQipUDxRQsRNSqp2ipFtbTYnt7cokDv6BZBdRW2H6AGJEJfi++wpQszxln0W2kgBEEiogBDjA==
"@formily/core@2.0.0-rc.2", "@formily/core@^2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/core/-/core-2.0.0-rc.2.tgz#715cae845d638d6a327a3f33953b3be5adaf9144"
integrity sha512-uYC390qbs7K39s3Ekb0+pooYnxkCoSWD3Up+PstanMESnW8fzFnij0sJgGUbPYgiK44MpTARf8TvIsVmEn907w==
dependencies:
"@formily/reactive" "2.0.0-rc.1"
"@formily/shared" "2.0.0-rc.1"
"@formily/validator" "2.0.0-rc.1"
"@formily/reactive" "2.0.0-rc.2"
"@formily/shared" "2.0.0-rc.2"
"@formily/validator" "2.0.0-rc.2"
"@formily/json-schema@2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/json-schema/-/json-schema-2.0.0-rc.1.tgz#43536e3fbd5bb84d4a0458281815bb03625ea4d5"
integrity sha512-bPxkoqNcp48sGtulUwp0hA3SQ7OwAihDoxun+wWK5RSWRFi+MSLi20wQ7ilUYzUKuo5a524IP3c2D5G8R1MoPA==
"@formily/json-schema@2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/json-schema/-/json-schema-2.0.0-rc.2.tgz#41285e44cead0670a8d0c36471ecb0d4f8aeaf28"
integrity sha512-JL7Mca+9meeaN0xuJufvDKjPgKETseDyIRv4oGuxYJvA1SadvTjQy8N1W68bo1F8HnptXlNbGKYQ61l7CQU+lA==
dependencies:
"@formily/core" "2.0.0-rc.1"
"@formily/reactive" "2.0.0-rc.1"
"@formily/shared" "2.0.0-rc.1"
"@formily/core" "2.0.0-rc.2"
"@formily/reactive" "2.0.0-rc.2"
"@formily/shared" "2.0.0-rc.2"
"@formily/path@2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/path/-/path-2.0.0-rc.1.tgz#10dcc5dae368857e80e3200b72ad684d1a88d488"
integrity sha512-glPa2ScqhzEw7VoPcxgNz+H9KGxsdmBgX2N/5tj1aXt2b58p/GRVFHqAP5/7l8N0BrOilrc/9Xy0Y1YaQpH6cw==
"@formily/path@2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/path/-/path-2.0.0-rc.2.tgz#04d19acfdd43878e1f9f037f93e24dc6d67939c9"
integrity sha512-vdLEy1vkiQvLT17ABJNMqPdUm/igTxiUZOYr/jrxJB6FHTZ5yrxxib49qSWDTiiFuuwYNp4xIt/F4CcSMlLAMQ==
"@formily/react@2.0.0-rc.1", "@formily/react@^2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/react/-/react-2.0.0-rc.1.tgz#e6460037ab4ea1e1b1d0625c03cf2fb5f930d886"
integrity sha512-hipff12R43BomKl/vDMVu/mwVyYGz94R6fYs6duWfS9sa1r3rX4sn6qQj8LNS147F92rnJTY1vzOwlQRakC23Q==
"@formily/react@2.0.0-rc.2", "@formily/react@^2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/react/-/react-2.0.0-rc.2.tgz#d0c53ea2583a573a6a0e72ef2ab806062f726f49"
integrity sha512-gsDWRPxEFkzpgeq4zi4BDS6baKk90cnMKbOJyvwE0QfUp6Lk0wP1aOq9bNLtzkIYbYQYPNP1aAE/3UwLrCZT1w==
dependencies:
"@formily/core" "2.0.0-rc.1"
"@formily/json-schema" "2.0.0-rc.1"
"@formily/reactive" "2.0.0-rc.1"
"@formily/reactive-react" "2.0.0-rc.1"
"@formily/shared" "2.0.0-rc.1"
"@formily/validator" "2.0.0-rc.1"
"@formily/core" "2.0.0-rc.2"
"@formily/json-schema" "2.0.0-rc.2"
"@formily/reactive" "2.0.0-rc.2"
"@formily/reactive-react" "2.0.0-rc.2"
"@formily/shared" "2.0.0-rc.2"
"@formily/validator" "2.0.0-rc.2"
hoist-non-react-statics "^3.3.2"
"@formily/reactive-react@2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/reactive-react/-/reactive-react-2.0.0-rc.1.tgz#e86a41b2f58713869351826b4e72aa03c3a81439"
integrity sha512-fFl3OPVtZ9DaPGR007DY7VHUhIENKZ0/ZtWUSonKdol27qS+0qgsZGLC7BaaCmanINcIpIE0D6RMGrJuleKPOA==
"@formily/reactive-react@2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/reactive-react/-/reactive-react-2.0.0-rc.2.tgz#860a788673452887ef5225c195116367bbccdc79"
integrity sha512-EKC/SbSpjagxMQYoV1Lc10yn6k0JXzWJNEpe8r05ayCzJzvg+t8H3jGKJmDrKUp186jT7iEhLb1O6JcySGkJRw==
dependencies:
"@formily/reactive" "2.0.0-rc.1"
"@formily/reactive" "2.0.0-rc.2"
hoist-non-react-statics "^3.3.2"
"@formily/reactive@2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/reactive/-/reactive-2.0.0-rc.1.tgz#b2db74194fa29ec39746f77cd1062e02d19fd59f"
integrity sha512-2s/kasCDDJX9X0afiyvXWuCKap7kRaM1Go9o9EygFt7LiuknN+sZXQh8mnPLgCaP3ad/Oc4MsGP3LOjOgvYLkg==
"@formily/reactive@2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/reactive/-/reactive-2.0.0-rc.2.tgz#e94d433a69e6e84c92a9edd8acb19217796e2687"
integrity sha512-363eZWAfhGqNQWDIWXxiQT8nWpDvkpUBg+djkUVAvFE7TKmbSpSUpj7rTo60dDNLVdWN59/VfVIlBy8jN45cXA==
"@formily/shared@2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/shared/-/shared-2.0.0-rc.1.tgz#e15968f2c1eab49d6a7d97bc4732c6aa78ec470f"
integrity sha512-xkl0MQ2Il7nFQs7mZ9RhzsmL320j8wf1wfMeEq+UCG0BQc41PO+XgCZebK9ryE/eRw+Pi11iFykoNiO3xa1XYA==
"@formily/shared@2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/shared/-/shared-2.0.0-rc.2.tgz#5e8797d62e3f85bf6c8d84e5533894d30359bfcb"
integrity sha512-2FF5KxsqZWUdsbq1qiq7iWOb2k9s3k563WOsZhYdOpjYJ0KcyP97hlYm4g7q5cjVeocXLtQjWCgHlDadZ1QihQ==
dependencies:
"@formily/path" "2.0.0-rc.1"
"@formily/path" "2.0.0-rc.2"
camel-case "^4.1.1"
lower-case "^2.0.1"
no-case "^3.0.4"
@ -1994,12 +1994,12 @@
pascal-case "^3.1.1"
upper-case "^2.0.1"
"@formily/validator@2.0.0-rc.1":
version "2.0.0-rc.1"
resolved "https://registry.npmjs.org/@formily/validator/-/validator-2.0.0-rc.1.tgz#656b0e80517468d5b9818d78482502a69466778f"
integrity sha512-D98zD1meO62k3hAFzpWxDRxlYAP5kLYhJ9hxKOk2055sDH7xQhwK6mArGVl7Nc8eNG30Liczm3R6xNIbH/eN1A==
"@formily/validator@2.0.0-rc.2":
version "2.0.0-rc.2"
resolved "https://registry.npmjs.org/@formily/validator/-/validator-2.0.0-rc.2.tgz#c99b66a047c71bfcabc55b5bb3cfaddfb490ac3c"
integrity sha512-r4VmLvQuYKdra6nsl2rC9Ac5clw8isE3ipcqR2rRiWbDZRV8b5WpSZn5faP5DAs/Sq4e4gX1l7ffoWOAf/S6Fw==
dependencies:
"@formily/shared" "2.0.0-rc.1"
"@formily/shared" "2.0.0-rc.2"
"@gulp-sourcemaps/identity-map@1.X":
version "1.0.2"