oak-frontend-base/es/components/actionBtn/web.pc.js

51 lines
1.9 KiB
JavaScript

import React, { useEffect } from 'react';
import { Space, Button, Dropdown } from 'antd';
import Style from './web.module.less';
import { DownOutlined } from '@ant-design/icons';
function ItemComponent(props) {
const { label, type, onClick } = props;
if (type === 'button') {
return (<Button onClick={() => onClick()}>
{label}
</Button>);
}
return <a onClick={(e) => {
onClick();
e.stopPropagation();
return false;
}}>
{label}
</a>;
}
export default function Render(props) {
const { methods, data } = props;
const { t, makeItems } = methods;
const { schema, actions, onAction, entity, cascadeActions, items, i18n, extraActions, moreItems, } = data;
const zhCNKeys = i18n?.store?.data?.zh_CN && Object.keys(i18n.store.data.zh_CN).length;
useEffect(() => {
makeItems();
}, [zhCNKeys, actions, cascadeActions, extraActions]);
return (<div className={Style.panelContainer}>
<Space align="center" size={12} style={{ width: '100%' }} wrap>
{items?.map((ele, index) => {
return (<ItemComponent key={ele.action} label={ele.label} type="a" onClick={ele.onClick}/>);
})}
{moreItems && moreItems.length > 0 && (<Dropdown menu={{
items: moreItems.map((ele, index) => ({
label: <Button key={`btn${index}`} size="small" type="link" onClick={ele.onClick}>
{ele.label}
</Button>,
key: `btn${index}`,
})),
}} placement="top" arrow>
<a onClick={(e) => e.preventDefault()}>
<Space size={4}>
更多
<DownOutlined />
</Space>
</a>
</Dropdown>)}
</Space>
</div>);
}