From 7587e2cdb735ba65ce48400fd2b63ba73d50b80e Mon Sep 17 00:00:00 2001 From: chenos Date: Fri, 27 Aug 2021 14:26:24 +0800 Subject: [PATCH] feat: improve code --- packages/client/src/schemas/add-new/index.tsx | 2 +- packages/client/src/schemas/kanban/index.tsx | 63 +++++++++++++++++-- packages/client/src/schemas/kanban/style.less | 22 +++++++ packages/client/src/schemas/upload/index.tsx | 19 ++++-- 4 files changed, 95 insertions(+), 11 deletions(-) diff --git a/packages/client/src/schemas/add-new/index.tsx b/packages/client/src/schemas/add-new/index.tsx index 704b629e6..99357c874 100644 --- a/packages/client/src/schemas/add-new/index.tsx +++ b/packages/client/src/schemas/add-new/index.tsx @@ -411,7 +411,7 @@ function generateCardItemSchema(component) { 'x-designable-bar': 'Kanban.Card.DesignableBar', 'x-read-pretty': true, 'x-decorator-props': { - useResource: '{{ Kanban.useSingleResource }}', + useResource: '{{ Kanban.useRowResource }}', }, properties: {}, }, diff --git a/packages/client/src/schemas/kanban/index.tsx b/packages/client/src/schemas/kanban/index.tsx index 35617bb76..7da038fc3 100644 --- a/packages/client/src/schemas/kanban/index.tsx +++ b/packages/client/src/schemas/kanban/index.tsx @@ -175,6 +175,7 @@ const InternalKanban = observer((props: any) => { } return resource.list({ ...params, + appends: fieldFields(schemas.get('Kanban.Card')), perPage: -1, sort: 'sort', }); @@ -426,7 +427,7 @@ Kanban.useCreateResource = ({ onSuccess }) => { const service = useRequest( (params?: any) => { return Promise.resolve({ - [groupField.name]: column.value + [groupField.name]: column.value, }); }, { @@ -471,7 +472,7 @@ Kanban.useUpdateAction = () => { }; }; -Kanban.useSingleResource = ({ onSuccess }) => { +Kanban.useRowResource = ({ onSuccess }) => { const { props } = useKanban(); const { collection } = useCollectionContext(); const ctx = useContext(KanbanCardContext); @@ -479,10 +480,6 @@ Kanban.useSingleResource = ({ onSuccess }) => { resourceName: collection?.name || props.collectionName, resourceKey: ctx?.record?.id, }); - console.log( - 'collection?.name || props.collectionName', - collection?.name || props.collectionName, - ); const service = useRequest( (params?: any) => { return Promise.resolve(ctx.record); @@ -497,6 +494,60 @@ Kanban.useSingleResource = ({ onSuccess }) => { return { resource, service, initialValues: service.data, ...service }; }; +const fieldFields = (schema: Schema) => { + const names = []; + schema.reduceProperties((buf, current) => { + if (current['x-component'] === 'Form.Field') { + const fieldName = current['x-component-props']?.['fieldName']; + if (fieldName) { + buf.push(fieldName); + } + } else { + const fieldNames = fieldFields(current); + buf.push(...fieldNames); + } + return buf; + }, names); + return names; +}; + +Kanban.useSingleResource = ({ onSuccess }) => { + const { props } = useKanban(); + const { collection } = useCollectionContext(); + const ctx = useContext(KanbanCardContext); + const { schema } = useDesignable(); + const [visible] = useContext(VisibleContext); + + const resource = Resource.make({ + resourceName: collection?.name || props.collectionName, + resourceKey: ctx?.record?.id, + }); + const service = useRequest( + (params?: any) => { + console.log('useSingleResource', params); + return resource.get({ ...params, appends: fieldFields(schema) }); + }, + { + formatResult: (result) => result?.data, + onSuccess, + // refreshDeps: [ctx?.record], + // defaultParams: [ + // { + // defaultAppends: fieldFields(schema), + // }, + // ], + manual: true, + // manual, + }, + ); + useEffect(() => { + if (visible) { + service.run(); + } + }, [visible]); + return { resource, service, initialValues: service.data, ...service }; +}; + Kanban.Card = observer((props) => { const [visible, setVisible] = useState(false); const { index, schemas } = useContext(KanbanCardContext); diff --git a/packages/client/src/schemas/kanban/style.less b/packages/client/src/schemas/kanban/style.less index 6b8e7f5e0..499485d43 100644 --- a/packages/client/src/schemas/kanban/style.less +++ b/packages/client/src/schemas/kanban/style.less @@ -91,3 +91,25 @@ line-height: 32px; padding: 0 12px; } + +.nb-kanban-item { + .ant-formily-item { + align-items: center; + } + .nb-upload { + .ant-upload-list-item-actions { + display: none; + } + .ant-upload-list-picture-card-container { + margin: 0 3px 3px 0; + height: 32px; + width: 32px; + } + .ant-upload-list-picture-card .ant-upload-list-item-name { + display: none; + } + .ant-upload-list-picture .ant-upload-list-item, .ant-upload-list-picture-card .ant-upload-list-item { + padding: 1px; + } + } +} diff --git a/packages/client/src/schemas/upload/index.tsx b/packages/client/src/schemas/upload/index.tsx index fe43c8caa..08638e1d9 100644 --- a/packages/client/src/schemas/upload/index.tsx +++ b/packages/client/src/schemas/upload/index.tsx @@ -457,7 +457,8 @@ Upload.Attachment = connect( aria-label="Zoom in" title="Zoom in" className="ril-zoom-in ril__toolbarItemChild ril__builtinButton" - onClick={() => { + onClick={(e) => { + e.preventDefault(); const file = images[photoIndex]; saveAs(file.url, `${file.title}${file.extname}`); }} @@ -489,6 +490,7 @@ Upload.Attachment = connect( {images.map((file) => { const handleClick = (e) => { e.preventDefault(); + e.stopPropagation(); const index = images.indexOf(file); setVisible(true); setPhotoIndex(index); @@ -532,7 +534,9 @@ Upload.Attachment = connect( size={'small'} type={'text'} icon={} - onClick={async () => { + onClick={(e) => { + e.preventDefault(); + e.stopPropagation(); saveAs(file.url, `${file.title}${file.extname}`); }} /> @@ -553,7 +557,12 @@ Upload.Attachment = connect( prevSrc={ images[(photoIndex + images.length - 1) % images.length]?.imageUrl } - onCloseRequest={() => setVisible(false)} + // @ts-ignore + onCloseRequest={(e) => { + e.preventDefault(); + e.stopPropagation(); + setVisible(false); + }} onMovePrevRequest={() => setPhotoIndex((photoIndex + images.length - 1) % images.length) } @@ -568,7 +577,9 @@ Upload.Attachment = connect( aria-label="Zoom in" title="Zoom in" className="ril-zoom-in ril__toolbarItemChild ril__builtinButton" - onClick={() => { + onClick={(e) => { + e.preventDefault(); + e.stopPropagation(); const file = images[photoIndex]; saveAs(file.url, `${file.title}${file.extname}`); }}