import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { fromJS } from 'immutable'
|
import { Form, Row, Col, Input, Select, notification } from 'antd'
|
|
import Api from '@/api'
|
// import { formRule } from '@/utils/option.js'
|
import './index.scss'
|
|
class MainSearch extends Component {
|
static propTpyes = {
|
dict: PropTypes.object, // 字典项
|
config: PropTypes.object,
|
MenuId: PropTypes.string,
|
MenuName: PropTypes.string,
|
MenuNo: PropTypes.string,
|
parentId: PropTypes.string,
|
initMenuList: PropTypes.func,
|
updateConfig: PropTypes.func
|
}
|
|
state = {
|
fstMenuId: '',
|
menulist: [],
|
smenulist: []
|
}
|
|
UNSAFE_componentWillMount () {
|
const { parentId } = this.props
|
let param = {
|
func: 's_Get_FSMenusForOpen',
|
SndMenuID: parentId,
|
TYPE: 20,
|
TypeCharOne: 'PC'
|
}
|
|
Api.getSystemConfig(param).then(result => {
|
if (result.status) {
|
let menulist = result.data.map(smenu => {
|
let _smenu = {
|
value: smenu.FstID,
|
text: smenu.FstName,
|
options: smenu.SndData.map(menu => {
|
return {
|
value: menu.SndID,
|
text: menu.SndName,
|
}
|
})
|
}
|
|
return _smenu
|
})
|
|
let smenulist = []
|
menulist.forEach(item => {
|
if (item.value === result.FstIDSeleted) {
|
smenulist = item.options
|
}
|
})
|
|
this.props.initMenuList({fstMenuList: fromJS(menulist).toJS(), fstMenuId: result.FstIDSeleted})
|
|
this.setState({
|
fstMenuId: result.FstIDSeleted,
|
menulist,
|
smenulist
|
}, () => {
|
this.props.form.setFieldsValue({
|
fstMenuId: result.FstIDSeleted,
|
parentId: parentId
|
})
|
})
|
} else {
|
notification.warning({
|
top: 92,
|
message: result.message,
|
duration: 5
|
})
|
}
|
})
|
}
|
|
UNSAFE_componentWillReceiveProps(nextProps) {
|
const { config } = this.props
|
if (!config && nextProps.config) {
|
this.props.form.setFieldsValue({easyCode: nextProps.config.easyCode})
|
}
|
}
|
|
// 一二级菜单切换
|
selectChange = (key, value) => {
|
const { config } = this.props
|
const { menulist } = this.state
|
|
if (key === 'fstMenuId') {
|
let smenulist = []
|
menulist.forEach(item => {
|
if (item.value === value) {
|
smenulist = item.options
|
}
|
})
|
|
this.setState({
|
smenulist
|
}, () => {
|
let _id = smenulist[0] ? smenulist[0].value : ''
|
this.props.form.setFieldsValue({parentId: _id})
|
this.props.updateConfig({...config, fstMenuId: value, parentId: _id})
|
})
|
} else if (key === 'parentId') {
|
this.props.updateConfig({...config, parentId: value})
|
}
|
}
|
|
// 菜单名称
|
changeName = (e) => {
|
this.props.updateConfig({...this.props.config, MenuName: e.target.value})
|
}
|
|
// 菜单参数
|
changeNo = (e) => {
|
this.props.updateConfig({...this.props.config, MenuNo: e.target.value})
|
}
|
|
// 助记码
|
changeEasyCode = (e) => {
|
this.props.updateConfig({...this.props.config, easyCode: e.target.value})
|
}
|
|
render() {
|
const { dict, MenuName, MenuNo, config } = this.props
|
const { menulist, smenulist } = this.state
|
const { getFieldDecorator } = this.props.form
|
const formItemLayout = {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 8 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 16 }
|
}
|
}
|
|
return (
|
<Form {...formItemLayout} className="ant-advanced-search-form">
|
<Row>
|
<Col span={24}>
|
<Form.Item label={dict['mob.menu.first'] + dict['mob.menu']}>
|
{getFieldDecorator('fstMenuId', {
|
initialValue: '',
|
rules: [
|
{
|
required: true,
|
message: dict['mob.required.select'] + dict['mob.menu.first'] + dict['mob.menu'] + '!'
|
}
|
]
|
})(
|
<Select onChange={(value) => {this.selectChange('fstMenuId', value)}}>
|
{menulist.map(option =>
|
<Select.Option key={option.value} value={option.value}>
|
{option.text}
|
</Select.Option>
|
)}
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item label={dict['mob.menu.second'] + dict['mob.menu']}>
|
{getFieldDecorator('parentId', {
|
initialValue: '',
|
rules: [
|
{
|
required: true,
|
message: dict['mob.required.select'] + dict['mob.menu.second'] + dict['mob.menu'] + '!'
|
}
|
]
|
})(
|
<Select onChange={(value) => {this.selectChange('parentId', value)}}>
|
{smenulist.map(option =>
|
<Select.Option key={option.value} value={option.value}>
|
{option.text}
|
</Select.Option>
|
)}
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item label={dict['mob.menu'] + dict['mob.name']}>
|
{getFieldDecorator('MenuName', {
|
initialValue: MenuName,
|
rules: [
|
{
|
required: true,
|
message: dict['mob.required.input'] + dict['mob.menu'] + dict['mob.name'] + '!'
|
}
|
]
|
})(<Input placeholder="" autoComplete="off" onChange={this.changeName}/>)}
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item label={dict['mob.menu'] + dict['mob.param']}>
|
{getFieldDecorator('MenuNo', {
|
initialValue: MenuNo,
|
rules: [
|
{
|
required: true,
|
message: dict['mob.required.input'] + dict['mob.menu'] + dict['mob.param'] + '!'
|
}
|
]
|
})(<Input placeholder="" autoComplete="off" onChange={this.changeNo}/>)}
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item label={dict['mob.menu.easycode']}>
|
{getFieldDecorator('easyCode', {
|
initialValue: config.easyCode
|
})(<Input placeholder="" autoComplete="off" onChange={this.changeEasyCode}/>)}
|
</Form.Item>
|
</Col>
|
</Row>
|
</Form>
|
)
|
}
|
}
|
|
export default Form.create()(MainSearch)
|
