test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-02 11:58:10 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

feat: icon-select组件 上传回调 (#6471)

Browse Source 
* feat: icon-select组件 上传回调

* icon-select组件修改

* 自定义上传图标 回显

* 重新触发test

---------

Co-authored-by: xujiahao01 <xujiahao01@baidu.com>
This commit is contained in:
徐佳豪 2023-03-29 14:01:55 +08:00 committed by hongyang03
parent b6e5fd556f
commit 1620c6eb97
1 changed files with 40 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
packages/amis/src/renderers/Form/IconSelect.tsx
View File

@ -86,9 +86,12 @@ export default class IconSelectControl extends React.PureComponent<
let findItem: IconSelectStore.SvgIcon | undefined = undefined;
if (IconSelectStore.svgIcons && IconSelectStore.svgIcons.length) {
for (let i = 0; i < IconSelectStore.svgIcons.length; i++) {
findItem = find(IconSelectStore.svgIcons[i].children, i => i.svg === svg);
findItem = find(
IconSelectStore.svgIcons[i].children,
i => i.svg === svg
);
if (findItem) {
break;
break;
}
}
}
@ -118,9 +121,10 @@ export default class IconSelectControl extends React.PureComponent<
disabled,
value: valueTemp,
placeholder,
clearable
clearable,
} = this.props;
const value = typeof valueTemp === 'string' ? this.getValueBySvg(valueTemp) : valueTemp;
const value =
typeof valueTemp === 'string' ? this.getValueBySvg(valueTemp) : valueTemp;
const pureValue =
(value?.id && String(value.id).replace(/^svg-/, '')) || '';
@ -128,12 +132,14 @@ export default class IconSelectControl extends React.PureComponent<
return (
<div className={cx(`${ns}IconSelectControl-input-area`)}>
{pureValue && (
{pureValue ? (
<div className={cx(`${ns}IconSelectControl-input-icon-show`)}>
<svg>
<use xlinkHref={`#${pureValue}`}></use>
</svg>
</div>
) : (
<Icon icon={valueTemp} className="icon" />
)}
<span className={cx(`${ns}IconSelectControl-input-icon-id`)}>
{iconName}
@ -196,7 +202,7 @@ export default class IconSelectControl extends React.PureComponent<
const checkedIcon = this.state.tmpCheckIconId;
if (this.props.returnSvg) {
this.props.onChange &&
this.props.onChange(checkedIcon && checkedIcon.svg || '');
this.props.onChange((checkedIcon && checkedIcon.svg) || '');
} else {
this.props.onChange &&
this.props.onChange(
@ -209,6 +215,13 @@ export default class IconSelectControl extends React.PureComponent<
this.toggleModel(false);
}
@autobind
async handleLocalUpload(icon: string) {
this.props.onChange && this.props.onChange(icon);
this.toggleModel(false);
}
handleClickIconInModal(icon: IconChecked) {
this.setState({
tmpCheckIconId: icon?.id === this.state.tmpCheckIconId?.id ? null : icon
@ -285,7 +298,13 @@ export default class IconSelectControl extends React.PureComponent<
@autobind
renderModalContent() {
const {render, classPrefix: ns, loadingConfig, funcSchema} = this.props;
const {
render,
classPrefix: ns,
loadingConfig,
funcSchema,
funcCom: FuncCom
} = this.props;
const icons = this.getIconsByType();
@ -317,10 +336,11 @@ export default class IconSelectControl extends React.PureComponent<
)) ||
null}
{(
funcSchema
&& render('func', funcSchema, {className: cx(`${ns}IconSelectControl-Modal-func`)})
) || null}
{FuncCom ? (
<div className={cx(`${ns}IconSelectControl-Modal-func`)}>
<FuncCom onUpload={this.handleLocalUpload} />
</div>
) : null}
<div className={cx(`${ns}IconSelectControl-Modal-content`)}>
<Spinner
@ -354,7 +374,8 @@ export default class IconSelectControl extends React.PureComponent<
@autobind
toggleModel(isShow?: boolean) {
const {value: valueTemp} = this.props;
const value = typeof valueTemp === 'string' ? this.getValueBySvg(valueTemp) : valueTemp;
const value =
typeof valueTemp === 'string' ? this.getValueBySvg(valueTemp) : valueTemp;
if (isShow === undefined) {
this.setState({
@ -376,7 +397,13 @@ export default class IconSelectControl extends React.PureComponent<
}
render() {
const {className, style, classPrefix: ns, disabled, translate: __} = this.props;
const {
className,
style,
classPrefix: ns,
disabled,
translate: __
} = this.props;
return (
<div