|
|
|
@ -1,15 +1,22 @@
|
|
|
|
import {ModalForm, ProForm, ProFormDependency, ProFormRadio} from '@ant-design/pro-components';
|
|
|
|
import IconSelector from '@/components/IconSelector';
|
|
|
|
import {ProFormText} from '@ant-design/pro-components';
|
|
|
|
import { putMenuUpdateMenu } from '@/services/system/Menu';
|
|
|
|
import {ProFormSwitch} from '@ant-design/pro-components';
|
|
|
|
import { createIcon } from '@/utils/IconUtil';
|
|
|
|
import {ProFormSelect, ProFormDigit} from '@ant-design/pro-components';
|
|
|
|
import {
|
|
|
|
import {FormattedMessage, useIntl} from '@umijs/max';
|
|
|
|
ModalForm,
|
|
|
|
import React, {useEffect, useState} from 'react';
|
|
|
|
ProForm,
|
|
|
|
import {App, Button, Form, message, Modal} from 'antd';
|
|
|
|
ProFormDependency,
|
|
|
|
import {putMenuUpdateMenu} from "@/services/system/Menu";
|
|
|
|
ProFormDigit,
|
|
|
|
import {createIcon} from "@/utils/IconUtil";
|
|
|
|
ProFormRadio,
|
|
|
|
import IconSelector from "@/components/IconSelector";
|
|
|
|
ProFormSelect,
|
|
|
|
|
|
|
|
ProFormSwitch,
|
|
|
|
|
|
|
|
ProFormText,
|
|
|
|
|
|
|
|
} from '@ant-design/pro-components';
|
|
|
|
|
|
|
|
import { FormattedMessage, useIntl } from '@umijs/max';
|
|
|
|
|
|
|
|
import { Form, Modal, message } from 'antd';
|
|
|
|
|
|
|
|
import React, { useEffect, useState } from 'react';
|
|
|
|
// 表单宽度 804 两列
|
|
|
|
// 表单宽度 804 两列
|
|
|
|
import { proFormItemStyleProps, proFormModelWidth } from '../../../../../config/defaultForm';
|
|
|
|
import { proFormItemStyleProps, proFormModelWidth } from '../../../../../config/defaultForm';
|
|
|
|
|
|
|
|
import { proIconSelectStyle, proIconSelectWrapStyle } from '../../../../../config/defaultIcon';
|
|
|
|
export type FormValueType = {
|
|
|
|
export type FormValueType = {
|
|
|
|
target?: string;
|
|
|
|
target?: string;
|
|
|
|
template?: string;
|
|
|
|
template?: string;
|
|
|
|
@ -25,17 +32,19 @@ export type UpdateFormProps = {
|
|
|
|
reload: any;
|
|
|
|
reload: any;
|
|
|
|
};
|
|
|
|
};
|
|
|
|
const UpdateForm: React.FC<UpdateFormProps> = (props) => {
|
|
|
|
const UpdateForm: React.FC<UpdateFormProps> = (props) => {
|
|
|
|
|
|
|
|
|
|
|
|
const intl = useIntl();
|
|
|
|
const intl = useIntl();
|
|
|
|
const [form] = Form.useForm<API.Menu>();
|
|
|
|
const [form] = Form.useForm<API.Menu>();
|
|
|
|
const [menuIconName, setMenuIconName] = useState<any>();
|
|
|
|
const [menuIconName, setMenuIconName] = useState<any>();
|
|
|
|
const [iconSelectorOpen, setIconSelectorOpen] = useState<boolean>(false);
|
|
|
|
const [iconSelectorOpen, setIconSelectorOpen] = useState<boolean>(false);
|
|
|
|
const [parentId, setParentId] = useState<number>(0);
|
|
|
|
const [parentId, setParentId] = useState<number>(0);
|
|
|
|
const [parentSelectOptions, setParentSelectOptions] = useState<any[]>([{label: '根节点', value: 0}]);
|
|
|
|
const [parentSelectOptions, setParentSelectOptions] = useState<any[]>([
|
|
|
|
|
|
|
|
{ label: '根节点', value: 0 },
|
|
|
|
|
|
|
|
]);
|
|
|
|
|
|
|
|
|
|
|
|
useEffect(()=>{
|
|
|
|
useEffect(() => {
|
|
|
|
setMenuIconName(props.values.icon)
|
|
|
|
setIconSelectorOpen(false);
|
|
|
|
}, [props.updateModalOpen])
|
|
|
|
setMenuIconName(props.values.icon);
|
|
|
|
|
|
|
|
}, [props.updateModalOpen]);
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<ModalForm<API.Menu>
|
|
|
|
<ModalForm<API.Menu>
|
|
|
|
@ -53,207 +62,297 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
|
|
|
|
}}
|
|
|
|
}}
|
|
|
|
submitTimeout={2000}
|
|
|
|
submitTimeout={2000}
|
|
|
|
onFinish={async (values) => {
|
|
|
|
onFinish={async (values) => {
|
|
|
|
console.log(values)
|
|
|
|
setMenuIconName('');
|
|
|
|
putMenuUpdateMenu(values).then(() => {
|
|
|
|
console.log(values);
|
|
|
|
message.success(intl.formatMessage({id: 'common.success', defaultMessage: '$$$'}))
|
|
|
|
putMenuUpdateMenu(values)
|
|
|
|
props.reload()
|
|
|
|
.then(() => {
|
|
|
|
}).catch(() => {
|
|
|
|
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
|
|
|
|
message.error(intl.formatMessage({id: 'common.error', defaultMessage: '$$$'}))
|
|
|
|
props.reload();
|
|
|
|
})
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch(() => {
|
|
|
|
|
|
|
|
message.error(intl.formatMessage({ id: 'common.error', defaultMessage: '$$$' }));
|
|
|
|
|
|
|
|
});
|
|
|
|
props.handleModal();
|
|
|
|
props.handleModal();
|
|
|
|
return true;
|
|
|
|
return true;
|
|
|
|
}}
|
|
|
|
}}
|
|
|
|
>
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProFormText width={proFormItemStyleProps.column2Width} name="id" label="id" disabled={true} initialValue={props.values.id}/>
|
|
|
|
<ProFormText
|
|
|
|
<ProFormSelect width={proFormItemStyleProps.column2Width} name="parentId"
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
disabled={true}
|
|
|
|
name="id"
|
|
|
|
initialValue={parentId}
|
|
|
|
label="id"
|
|
|
|
request={async () => parentSelectOptions}
|
|
|
|
disabled={true}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.parentId" defaultMessage="$$$"/>}
|
|
|
|
initialValue={props.values.id}
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_select', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.parentId', defaultMessage: '$$$'})}`}
|
|
|
|
/>
|
|
|
|
|
|
|
|
<ProFormSelect
|
|
|
|
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
|
|
|
|
name="parentId"
|
|
|
|
|
|
|
|
disabled={true}
|
|
|
|
|
|
|
|
initialValue={parentId}
|
|
|
|
|
|
|
|
request={async () => parentSelectOptions}
|
|
|
|
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.parentId" defaultMessage="$$$" />}
|
|
|
|
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
|
|
|
|
id: 'common.please_select',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}${intl.formatMessage({
|
|
|
|
|
|
|
|
id: 'system.menu.table.list.parentId',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}`}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</ProForm.Group>
|
|
|
|
</ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProFormRadio.Group width={proFormItemStyleProps.column2Width} name="type"
|
|
|
|
<ProFormRadio.Group
|
|
|
|
required={true}
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.type" defaultMessage="$$$"/>}
|
|
|
|
name="type"
|
|
|
|
initialValue={props.values.type}
|
|
|
|
required={true}
|
|
|
|
disabled={true}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.type" defaultMessage="$$$" />}
|
|
|
|
options={[
|
|
|
|
initialValue={props.values.type}
|
|
|
|
{
|
|
|
|
disabled={true}
|
|
|
|
label: intl.formatMessage({id: 'system.menu.table.list.type_M', defaultMessage: '$$$'}),
|
|
|
|
options={[
|
|
|
|
value: 'M',
|
|
|
|
{
|
|
|
|
},
|
|
|
|
label: intl.formatMessage({
|
|
|
|
{
|
|
|
|
id: 'system.menu.table.list.type_M',
|
|
|
|
label: intl.formatMessage({id: 'system.menu.table.list.type_C', defaultMessage: '$$$'}),
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
value: 'C',
|
|
|
|
}),
|
|
|
|
},
|
|
|
|
value: 'M',
|
|
|
|
{
|
|
|
|
},
|
|
|
|
label: intl.formatMessage({id: 'system.menu.table.list.type_F', defaultMessage: '$$$'}),
|
|
|
|
{
|
|
|
|
value: 'F',
|
|
|
|
label: intl.formatMessage({
|
|
|
|
},
|
|
|
|
id: 'system.menu.table.list.type_C',
|
|
|
|
{
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
label: intl.formatMessage({id: 'system.menu.table.list.type_E', defaultMessage: '$$$'}),
|
|
|
|
}),
|
|
|
|
value: 'E',
|
|
|
|
value: 'C',
|
|
|
|
},
|
|
|
|
},
|
|
|
|
]}>
|
|
|
|
{
|
|
|
|
|
|
|
|
label: intl.formatMessage({
|
|
|
|
</ProFormRadio.Group>
|
|
|
|
id: 'system.menu.table.list.type_F',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
value: 'F',
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
label: intl.formatMessage({
|
|
|
|
|
|
|
|
id: 'system.menu.table.list.type_E',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
value: 'E',
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
]}
|
|
|
|
|
|
|
|
></ProFormRadio.Group>
|
|
|
|
</ProForm.Group>
|
|
|
|
</ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProFormText width={proFormItemStyleProps.column2Width} name="title"
|
|
|
|
<ProFormText
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.title" defaultMessage="$$$"/>}
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.title', defaultMessage: '$$$'})}`}
|
|
|
|
name="title"
|
|
|
|
required={true}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.title" defaultMessage="$$$" />}
|
|
|
|
initialValue={props.values.title}
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
rules={[
|
|
|
|
id: 'common.please_input',
|
|
|
|
{
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
required: true,
|
|
|
|
})}${intl.formatMessage({ id: 'system.menu.table.list.title', defaultMessage: '$$$' })}`}
|
|
|
|
message: (
|
|
|
|
required={true}
|
|
|
|
<FormattedMessage
|
|
|
|
initialValue={props.values.title}
|
|
|
|
id="system.menu.table.rule.required.name"
|
|
|
|
rules={[
|
|
|
|
defaultMessage="name is required"
|
|
|
|
{
|
|
|
|
/>
|
|
|
|
required: true,
|
|
|
|
),
|
|
|
|
message: (
|
|
|
|
},
|
|
|
|
<FormattedMessage
|
|
|
|
]}
|
|
|
|
id="system.menu.table.rule.required.name"
|
|
|
|
|
|
|
|
defaultMessage="name is required"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
]}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
<ProFormDigit width={proFormItemStyleProps.column2Width} fieldProps={{precision: 0}} name="sort"
|
|
|
|
<ProFormDigit
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.sort" defaultMessage="$$$"/>}
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.sort', defaultMessage: '$$$'})}`}
|
|
|
|
fieldProps={{ precision: 0 }}
|
|
|
|
initialValue={props.values.sort}
|
|
|
|
name="sort"
|
|
|
|
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.sort" defaultMessage="$$$" />}
|
|
|
|
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
|
|
|
|
id: 'common.please_input',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}${intl.formatMessage({ id: 'system.menu.table.list.sort', defaultMessage: '$$$' })}`}
|
|
|
|
|
|
|
|
initialValue={props.values.sort}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</ProForm.Group>
|
|
|
|
</ProForm.Group>
|
|
|
|
<ProFormDependency name={['type']}>
|
|
|
|
<ProFormDependency name={['type']}>
|
|
|
|
{
|
|
|
|
{(record) => {
|
|
|
|
(record) => {
|
|
|
|
let isShow = record.type !== 'F' && record.type !== 'E';
|
|
|
|
let isShow = (record.type !== 'F' && record.type !== 'E')
|
|
|
|
if (isShow) {
|
|
|
|
if (isShow) {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProFormText
|
|
|
|
<ProFormText width={proFormItemStyleProps.column2Width} name="name"
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.name" defaultMessage="$$$"/>}
|
|
|
|
name="name"
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.name', defaultMessage: '$$$'})}`}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.name" defaultMessage="$$$" />}
|
|
|
|
required={true}
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
initialValue={props.values.name}
|
|
|
|
id: 'common.please_input',
|
|
|
|
rules={[
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
{
|
|
|
|
})}${intl.formatMessage({
|
|
|
|
required: true,
|
|
|
|
id: 'system.menu.table.list.name',
|
|
|
|
message: (
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
<FormattedMessage
|
|
|
|
})}`}
|
|
|
|
id="system.menu.table.rule.required.name"
|
|
|
|
required={true}
|
|
|
|
defaultMessage="name is required"
|
|
|
|
initialValue={props.values.name}
|
|
|
|
/>
|
|
|
|
rules={[
|
|
|
|
),
|
|
|
|
{
|
|
|
|
},
|
|
|
|
required: true,
|
|
|
|
]}
|
|
|
|
message: (
|
|
|
|
/>
|
|
|
|
<FormattedMessage
|
|
|
|
<ProFormText width={proFormItemStyleProps.column2Width} name="path"
|
|
|
|
id="system.menu.table.rule.required.name"
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.path" defaultMessage="$$$"/>}
|
|
|
|
defaultMessage="name is required"
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.path', defaultMessage: '$$$'})}`}
|
|
|
|
/>
|
|
|
|
required={true}
|
|
|
|
),
|
|
|
|
initialValue={props.values.path}
|
|
|
|
},
|
|
|
|
rules={[
|
|
|
|
]}
|
|
|
|
{
|
|
|
|
/>
|
|
|
|
required: true,
|
|
|
|
<ProFormText
|
|
|
|
message: (
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
<FormattedMessage
|
|
|
|
name="path"
|
|
|
|
id="system.menu.table.rule.required.name"
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.path" defaultMessage="$$$" />}
|
|
|
|
defaultMessage="name is required"
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
/>
|
|
|
|
id: 'common.please_input',
|
|
|
|
),
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
},
|
|
|
|
})}${intl.formatMessage({
|
|
|
|
]}
|
|
|
|
id: 'system.menu.table.list.path',
|
|
|
|
/>
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
<ProFormText width={proFormItemStyleProps.column2Width} name="component"
|
|
|
|
})}`}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.component" defaultMessage="$$$"/>}
|
|
|
|
required={true}
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.component', defaultMessage: '$$$'})}`}
|
|
|
|
initialValue={props.values.path}
|
|
|
|
required={true}
|
|
|
|
rules={[
|
|
|
|
initialValue={props.values.component}
|
|
|
|
{
|
|
|
|
hidden={record.type === 'M'}
|
|
|
|
required: true,
|
|
|
|
// disabled={record.type === 'M'}
|
|
|
|
message: (
|
|
|
|
/>
|
|
|
|
<FormattedMessage
|
|
|
|
|
|
|
|
id="system.menu.table.rule.required.name"
|
|
|
|
|
|
|
|
defaultMessage="name is required"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
]}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
<ProFormText
|
|
|
|
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
|
|
|
|
name="component"
|
|
|
|
|
|
|
|
label={
|
|
|
|
|
|
|
|
<FormattedMessage id="system.menu.table.list.component" defaultMessage="$$$" />
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
|
|
|
|
id: 'common.please_input',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}${intl.formatMessage({
|
|
|
|
|
|
|
|
id: 'system.menu.table.list.component',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}`}
|
|
|
|
|
|
|
|
required={true}
|
|
|
|
|
|
|
|
initialValue={props.values.component}
|
|
|
|
|
|
|
|
hidden={record.type === 'M'}
|
|
|
|
|
|
|
|
// disabled={record.type === 'M'}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
|
|
<ProFormSelect
|
|
|
|
<ProFormSelect
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
name="icon"
|
|
|
|
name="icon"
|
|
|
|
label={intl.formatMessage({
|
|
|
|
label={intl.formatMessage({
|
|
|
|
id: 'system.menu.table.list.icon',
|
|
|
|
id: 'system.menu.table.list.icon',
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
})}
|
|
|
|
})}
|
|
|
|
valueEnum={{}}
|
|
|
|
valueEnum={{}}
|
|
|
|
hidden={record.type !== 'M'}
|
|
|
|
hidden={record.type !== 'M'}
|
|
|
|
addonBefore={createIcon(menuIconName)}
|
|
|
|
addonBefore={createIcon(menuIconName)}
|
|
|
|
fieldProps={{
|
|
|
|
fieldProps={{
|
|
|
|
onClick: () => {
|
|
|
|
labelInValue: true,
|
|
|
|
setIconSelectorOpen(true);
|
|
|
|
notFoundContent: null, // 将选项内容为空隐去，使用自定义的图标选择组件
|
|
|
|
},
|
|
|
|
filterOption: false,
|
|
|
|
}}
|
|
|
|
onClick: () => {
|
|
|
|
initialValue={props.values.icon}
|
|
|
|
setIconSelectorOpen(!iconSelectorOpen);
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_select', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.icon', defaultMessage: '$$$'})}`}
|
|
|
|
},
|
|
|
|
rules={[
|
|
|
|
onClear: () => {
|
|
|
|
{
|
|
|
|
setMenuIconName('');
|
|
|
|
required: false,
|
|
|
|
},
|
|
|
|
message: <FormattedMessage id="请选择菜单图标！" defaultMessage="请选择菜单图标！"/>,
|
|
|
|
}}
|
|
|
|
},
|
|
|
|
initialValue={props.values.icon}
|
|
|
|
]}
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
/>
|
|
|
|
id: 'common.please_select',
|
|
|
|
</ProForm.Group>
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
)
|
|
|
|
})}${intl.formatMessage({
|
|
|
|
}
|
|
|
|
id: 'system.menu.table.list.icon',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}`}
|
|
|
|
|
|
|
|
rules={[
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
required: false,
|
|
|
|
|
|
|
|
message: (
|
|
|
|
|
|
|
|
<FormattedMessage id="请选择菜单图标！" defaultMessage="请选择菜单图标！" />
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
]}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
<div style={proIconSelectWrapStyle}>
|
|
|
|
|
|
|
|
{iconSelectorOpen ? (
|
|
|
|
|
|
|
|
<div style={proIconSelectStyle}>
|
|
|
|
|
|
|
|
<IconSelector
|
|
|
|
|
|
|
|
onSelect={(name: string) => {
|
|
|
|
|
|
|
|
form.setFieldsValue({ icon: name });
|
|
|
|
|
|
|
|
setMenuIconName(name);
|
|
|
|
|
|
|
|
setIconSelectorOpen(false);
|
|
|
|
|
|
|
|
}}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
) : (
|
|
|
|
|
|
|
|
''
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</ProForm.Group>
|
|
|
|
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}}
|
|
|
|
|
|
|
|
|
|
|
|
</ProFormDependency>
|
|
|
|
</ProFormDependency>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProFormDependency name={['type']}>
|
|
|
|
<ProFormDependency name={['type']}>
|
|
|
|
{
|
|
|
|
{(record) => {
|
|
|
|
(record) => {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<ProFormText
|
|
|
|
<ProFormText width={proFormItemStyleProps.column2Width} name="permission"
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
initialValue={props.values.permission}
|
|
|
|
name="permission"
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.permission" defaultMessage="$$$"/>}
|
|
|
|
initialValue={props.values.permission}
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.permission', defaultMessage: '$$$'})}`}
|
|
|
|
label={
|
|
|
|
disabled={record.type === 'M'}
|
|
|
|
<FormattedMessage id="system.menu.table.list.permission" defaultMessage="$$$" />
|
|
|
|
/>
|
|
|
|
}
|
|
|
|
)
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
}
|
|
|
|
id: 'common.please_input',
|
|
|
|
}
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}${intl.formatMessage({
|
|
|
|
|
|
|
|
id: 'system.menu.table.list.permission',
|
|
|
|
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}`}
|
|
|
|
|
|
|
|
disabled={record.type === 'M'}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
}}
|
|
|
|
</ProFormDependency>
|
|
|
|
</ProFormDependency>
|
|
|
|
</ProForm.Group>
|
|
|
|
</ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProForm.Group>
|
|
|
|
<ProFormText width={proFormItemStyleProps.column2Width} name="remark"
|
|
|
|
<ProFormText
|
|
|
|
initialValue={props.values.remark}
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.remark" defaultMessage="$$$"/>}
|
|
|
|
name="remark"
|
|
|
|
placeholder={`${intl.formatMessage({id: 'common.please_input', defaultMessage: '$$$'})}${intl.formatMessage({id: 'system.menu.table.list.remark', defaultMessage: '$$$'})}`}
|
|
|
|
initialValue={props.values.remark}
|
|
|
|
required={false}/>
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.remark" defaultMessage="$$$" />}
|
|
|
|
<ProFormSwitch width={proFormItemStyleProps.column2Width} name="hidden" initialValue={props.values.hidden}
|
|
|
|
placeholder={`${intl.formatMessage({
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.hidden" defaultMessage="$$$"/>}
|
|
|
|
id: 'common.please_input',
|
|
|
|
required={false}>
|
|
|
|
defaultMessage: '$$$',
|
|
|
|
|
|
|
|
})}${intl.formatMessage({ id: 'system.menu.table.list.remark', defaultMessage: '$$$' })}`}
|
|
|
|
</ProFormSwitch>
|
|
|
|
required={false}
|
|
|
|
</ProForm.Group>
|
|
|
|
|
|
|
|
<Modal
|
|
|
|
|
|
|
|
width={800}
|
|
|
|
|
|
|
|
open={iconSelectorOpen}
|
|
|
|
|
|
|
|
onCancel={() => {
|
|
|
|
|
|
|
|
setIconSelectorOpen(false);
|
|
|
|
|
|
|
|
}}
|
|
|
|
|
|
|
|
footer={null}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<IconSelector
|
|
|
|
|
|
|
|
onSelect={(name: string) => {
|
|
|
|
|
|
|
|
form.setFieldsValue({icon: name});
|
|
|
|
|
|
|
|
setMenuIconName(name);
|
|
|
|
|
|
|
|
setIconSelectorOpen(false);
|
|
|
|
|
|
|
|
}}
|
|
|
|
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</Modal>
|
|
|
|
<ProFormSwitch
|
|
|
|
|
|
|
|
width={proFormItemStyleProps.column2Width}
|
|
|
|
|
|
|
|
name="hidden"
|
|
|
|
</ModalForm>)
|
|
|
|
initialValue={props.values.hidden}
|
|
|
|
}
|
|
|
|
label={<FormattedMessage id="system.menu.table.list.hidden" defaultMessage="$$$" />}
|
|
|
|
|
|
|
|
required={false}
|
|
|
|
|
|
|
|
></ProFormSwitch>
|
|
|
|
|
|
|
|
</ProForm.Group>
|
|
|
|
|
|
|
|
</ModalForm>
|
|
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
};
|
|
|
|
export default UpdateForm;
|
|
|
|
export default UpdateForm;
|
|
|
|
|
