feat: improve ui design for linkage action (#1659)

* feat: improve ui design for linkage action

* revert

* fix: not working
This commit is contained in:
Dunqing 2023-04-17 10:30:13 +08:00 committed by GitHub
parent 06d67a93ab
commit 1654b42037
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 44 additions and 41 deletions

View File

@ -3,7 +3,7 @@
.ant-space-item:empty:not(:last-child) + .ant-space-item-split { .ant-space-item:empty:not(:last-child) + .ant-space-item-split {
display: none; display: none;
} }
.ant-space-item-split:has(+ .ant-space-item:empty) { .ant-space-item-split:has(+ .ant-space-item:last-child:empty) {
display: none; display: none;
} }
} }

View File

@ -98,48 +98,53 @@ export const Action: ComposedAction = observer((props: any) => {
field.linkageProperty = {}; field.linkageProperty = {};
linkageRules linkageRules
.filter((k) => !k.disabled) .filter((k) => !k.disabled)
.map((v) => { .forEach((v) => {
return v.actions?.map((h) => { return v.actions?.map((h) => {
linkageAction(h.operator, field, v.condition, values); linkageAction(h.operator, field, v.condition, values);
}); });
}); });
}, [linkageRules, values]); }, [linkageRules, values, designable]);
const renderButton = () => (
<SortableItem const renderButton = () => {
{...others} if (!designable && field?.data?.hidden) {
loading={field?.data?.loading} return null;
icon={<Icon type={icon} />} }
disabled={disabled} return (
style={{ <SortableItem
display: !designable && field?.data?.hidden && 'none', {...others}
opacity: designable && field?.data?.hidden && 0.1, loading={field?.data?.loading}
}} icon={<Icon type={icon} />}
onClick={(e: React.MouseEvent) => { disabled={disabled}
if (!disabled) { style={{
e.preventDefault(); opacity: designable && field?.data?.hidden && 0.1,
e.stopPropagation(); }}
const onOk = () => { onClick={(e: React.MouseEvent) => {
onClick?.(e); if (!disabled) {
setVisible(true); e.preventDefault();
run(); e.stopPropagation();
}; const onOk = () => {
if (confirm) { onClick?.(e);
Modal.confirm({ setVisible(true);
...confirm, run();
onOk, };
}); if (confirm) {
} else { Modal.confirm({
onOk(); ...confirm,
onOk,
});
} else {
onOk();
}
} }
} }}
}} component={tarComponent || Button}
component={tarComponent || Button} className={classnames(className, actionDesignerCss)}
className={classnames(className, actionDesignerCss)} >
> {title || compile(fieldSchema.title)}
{title || compile(fieldSchema.title)} <Designer {...designerProps} />
<Designer {...designerProps} /> </SortableItem>
</SortableItem> );
); };
return ( return (
<ActionContext.Provider <ActionContext.Provider

View File

@ -56,10 +56,8 @@ export const ReadPrettyRecordPicker: React.FC = observer((props: any) => {
return ( return (
<Fragment key={`${record.id}_${index}`}> <Fragment key={`${record.id}_${index}`}>
<span> <span>
{snapshot ? ( {snapshot || isTagsMode ? (
text text
) : isTagsMode ? (
<Typography.Text underline>{text}</Typography.Text>
) : ( ) : (
<a <a
onClick={(e) => { onClick={(e) => {