import { defineComponent } from 'vue'; import { useNamespace } from '@ibiz-template/vue-util'; import { WFLink } from '@ibiz-template/controller'; import '@ibiz-template/theme/style/components/common/wf-toolbar/wf-toolbar.scss'; export const WFToolbar = defineComponent({ name: 'WFToolbar', props: { wfLinks: { type: Array<WFLink>, required: true, }, }, setup(props, { emit }) { const ns = useNamespace('wf-toolbar'); // 点击事件抛给表格执行 const _handleClick = async (link: WFLink, event: MouseEvent) => { emit('wf-link-click', link, event); }; // 按钮点击加延时。解决子界面行编辑没有失焦的情况下先触发了按钮的行为。 const handleClick = async (link: WFLink, event: MouseEvent) => { setTimeout(() => { _handleClick(link, event); }, 30); }; return { ns, handleClick }; }, render() { const wfLinks = this.wfLinks || []; return ( <div class={`${this.ns.b()}`}> {wfLinks.length > 0 && wfLinks.map(link => { return ( <div key={link.sequenceFlowId} class={this.ns.e('item')}> <i-button title={link.sequenceFlowName} on-click={(e: MouseEvent) => this.handleClick(link, e)} > {link.sequenceFlowName || ''} </i-button> </div> ); })} </div> ); }, });