mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-01-19 14:04:28 +00:00
feat: add URL link for setter titles
This commit is contained in:
parent
700e5b06dd
commit
4678408963
@ -7,8 +7,23 @@ import { Tip } from '../tip';
|
|||||||
import './title.less';
|
import './title.less';
|
||||||
|
|
||||||
export class Title extends Component<{ title: TitleContent; className?: string; onClick?: () => void }> {
|
export class Title extends Component<{ title: TitleContent; className?: string; onClick?: () => void }> {
|
||||||
|
constructor(props: any) {
|
||||||
|
super(props);
|
||||||
|
this.handleClick = this.handleClick.bind(this);
|
||||||
|
}
|
||||||
|
handleClick(e: React.MouseEvent) {
|
||||||
|
const { title, onClick } = this.props as any;
|
||||||
|
const url = title && (title.docUrl || title.url);
|
||||||
|
if (url) {
|
||||||
|
window.open(url);
|
||||||
|
// 防止触发行操作(如折叠面板)
|
||||||
|
e.stopPropagation();
|
||||||
|
}
|
||||||
|
// TODO: 操作交互冲突,目前 mixedSetter 仅有 2 个 setter 注册时用到了 onClick
|
||||||
|
onClick && onClick(e);
|
||||||
|
}
|
||||||
render() {
|
render() {
|
||||||
let { title, className, onClick } = this.props;
|
let { title, className } = this.props;
|
||||||
if (title == null) {
|
if (title == null) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
@ -40,7 +55,7 @@ export class Title extends Component<{ title: TitleContent; className?: string;
|
|||||||
'has-tip': !!tip,
|
'has-tip': !!tip,
|
||||||
'only-icon': !title.label
|
'only-icon': !title.label
|
||||||
})}
|
})}
|
||||||
onClick={onClick}
|
onClick={this.handleClick}
|
||||||
>
|
>
|
||||||
{icon ? <b className="lc-title-icon">{icon}</b> : null}
|
{icon ? <b className="lc-title-icon">{icon}</b> : null}
|
||||||
{title.label ? intl(title.label) : null}
|
{title.label ? intl(title.label) : null}
|
||||||
|
|||||||
@ -28,6 +28,11 @@ export class Field extends Component<FieldProps> {
|
|||||||
display: this.props.defaultDisplay || 'inline',
|
display: this.props.defaultDisplay || 'inline',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
constructor(props: any) {
|
||||||
|
super(props);
|
||||||
|
this.handleClear = this.handleClear.bind(this);
|
||||||
|
}
|
||||||
|
|
||||||
private toggleExpand = () => {
|
private toggleExpand = () => {
|
||||||
const { onExpandChange } = this.props;
|
const { onExpandChange } = this.props;
|
||||||
const collapsed = !this.state.collapsed;
|
const collapsed = !this.state.collapsed;
|
||||||
@ -68,6 +73,10 @@ export class Field extends Component<FieldProps> {
|
|||||||
});
|
});
|
||||||
this.dispose = () => observer.disconnect();
|
this.dispose = () => observer.disconnect();
|
||||||
}
|
}
|
||||||
|
private handleClear(e: React.MouseEvent) {
|
||||||
|
e.stopPropagation();
|
||||||
|
this.props.onClear && this.props.onClear();
|
||||||
|
}
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
const { defaultDisplay } = this.props;
|
const { defaultDisplay } = this.props;
|
||||||
if (!defaultDisplay || defaultDisplay === 'inline') {
|
if (!defaultDisplay || defaultDisplay === 'inline') {
|
||||||
@ -118,7 +127,7 @@ export class Field extends Component<FieldProps> {
|
|||||||
>
|
>
|
||||||
<div className="lc-field-head" onClick={isAccordion ? this.toggleExpand : undefined}>
|
<div className="lc-field-head" onClick={isAccordion ? this.toggleExpand : undefined}>
|
||||||
<div className="lc-field-title">
|
<div className="lc-field-title">
|
||||||
{createValueState(valueState, onClear)}
|
{createValueState(valueState, this.handleClear)}
|
||||||
<Title title={title || ''} />
|
<Title title={title || ''} />
|
||||||
<InlineTip position="top">{tipContent}</InlineTip>
|
<InlineTip position="top">{tipContent}</InlineTip>
|
||||||
</div>
|
</div>
|
||||||
@ -143,7 +152,7 @@ export class Field extends Component<FieldProps> {
|
|||||||
*
|
*
|
||||||
* TODO: turn number to enum
|
* TODO: turn number to enum
|
||||||
*/
|
*/
|
||||||
function createValueState(valueState?: number, onClear?: () => void) {
|
function createValueState(valueState?: number, onClear?: (e: React.MouseEvent) => void) {
|
||||||
let tip: any = null;
|
let tip: any = null;
|
||||||
let className = 'lc-valuestate';
|
let className = 'lc-valuestate';
|
||||||
let icon: any = null;
|
let icon: any = null;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user