import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { Form, Row, Col, Input, Select, notification } from 'antd'
|
import moment from 'moment'
|
|
import Api from '@/api'
|
import Utils from '@/utils/utils.js'
|
import './index.scss'
|
|
const { TextArea } = Input
|
|
class ScriptForm extends Component {
|
static propTpyes = {
|
applist: PropTypes.array,
|
inputSubmit: PropTypes.func
|
}
|
|
state = {
|
type: 'subapp',
|
sublist: [],
|
views: [],
|
appId: '',
|
subAppId: ''
|
}
|
|
viewList = {}
|
|
UNSAFE_componentWillMount() {
|
const { applist } = this.props
|
|
let sublist = []
|
let appId = ''
|
let subAppId = ''
|
if (applist[0]) {
|
sublist = applist[0].sublist || []
|
appId = applist[0].ID + ',' + applist[0].kei_no
|
|
if (sublist[0]) {
|
subAppId = sublist[0].ID + ',' + sublist[0].lang + ',' + sublist[0].typename
|
}
|
}
|
|
this.viewList = {}
|
|
this.setState({sublist, appId, subAppId})
|
}
|
|
/**
|
* @description 获取表单值
|
*/
|
handleConfirm = () => {
|
return new Promise(resolve => {
|
this.props.form.validateFieldsAndScroll((err, values) => {
|
if (!err) {
|
resolve(values)
|
}
|
})
|
})
|
}
|
|
changeType = (val) => {
|
this.setState({type: val}, () => {
|
this.getViews()
|
})
|
}
|
|
changeApp = (val) => {
|
const { applist } = this.props
|
|
let app = applist.filter(item => `${item.ID},${item.kei_no}` === val)[0]
|
|
let appId = ''
|
let subAppId = ''
|
let sublist = []
|
if (app) {
|
sublist = app.sublist || []
|
appId = app.ID + ',' + app.kei_no
|
|
if (sublist[0]) {
|
subAppId = sublist[0].ID + ',' + sublist[0].lang + ',' + sublist[0].typename
|
}
|
}
|
|
this.setState({sublist, subAppId, appId}, () => {
|
this.getViews()
|
})
|
this.props.form.setFieldsValue({subAppId})
|
}
|
|
changeSubApp = (val) => {
|
this.setState({subAppId: val}, () => {
|
this.getViews()
|
})
|
}
|
|
getViews = () => {
|
const { type, appId, subAppId } = this.state
|
|
if (type !== 'view' || !appId || !subAppId) return
|
|
this.setState({views: []})
|
this.props.form.setFieldsValue({viewId: ''})
|
|
let kei = appId.split(',')[1]
|
let m = subAppId.split(',')
|
|
let _param = {
|
func: 's_get_app_menus',
|
TypeCharOne: kei,
|
typename: m[2],
|
lang: m[1],
|
LText: `select '${window.GLOB.appkey}'`,
|
timestamp: moment().format('YYYY-MM-DD HH:mm:ss')
|
}
|
|
_param.secretkey = Utils.encrypt(_param.LText, _param.timestamp)
|
|
Api.getCloudConfig(_param).then(res => {
|
if (!res.status) {
|
notification.warning({
|
top: 92,
|
message: res.message,
|
duration: 5
|
})
|
return
|
}
|
|
this.setState({views: res.menus})
|
})
|
}
|
|
/**
|
* @description 回车提交
|
*/
|
handleSubmit = (e) => {
|
e.preventDefault()
|
this.props.inputSubmit()
|
}
|
|
render() {
|
const { applist } = this.props
|
const { getFieldDecorator } = this.props.form
|
const { sublist, appId, subAppId, type, views } = this.state
|
const formItemLayout = {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 8 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 16 }
|
}
|
}
|
return (
|
<Form {...formItemLayout} className="app-script-form">
|
<Row gutter={24}>
|
<Col span={12}>
|
<Form.Item label="类型">
|
{getFieldDecorator('VType', {
|
initialValue: 'subapp',
|
rules: [{
|
required: true,
|
message: '请选择类型!'
|
}]
|
})(
|
<Select onChange={this.changeType}>
|
<Select.Option value="subapp">子应用</Select.Option>
|
<Select.Option value="view">页面</Select.Option>
|
<Select.Option value="role">权限树</Select.Option>
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={12}>
|
<Form.Item label="应用">
|
{getFieldDecorator('appId', {
|
initialValue: appId,
|
rules: [{
|
required: true,
|
message: '请选择应用!'
|
}]
|
})(
|
<Select onChange={this.changeApp}>
|
{applist.map(item => {
|
return <Select.Option key={item.ID} value={item.ID + ',' + item.kei_no}>{item.remark}</Select.Option>
|
})}
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
<Col span={12}>
|
<Form.Item label="子应用">
|
{getFieldDecorator('subAppId', {
|
initialValue: subAppId,
|
rules: [{
|
required: true,
|
message: '请选择子应用!'
|
}]
|
})(
|
<Select onChange={this.changeSubApp}>
|
{sublist.map(item => {
|
return <Select.Option key={item.ID} value={item.ID + ',' + item.lang + ',' + item.typename}>{`${item.typename}（${item.lang !== 'zh-CN' ? '英文' : '中文'}）${item.title || ''}`}</Select.Option>
|
})}
|
</Select>
|
)}
|
</Form.Item>
|
</Col>
|
{type === 'view' ? <Col span={12}>
|
<Form.Item label="页面">
|
{getFieldDecorator('viewId', {
|
initialValue: '',
|
rules: [{
|
required: true,
|
message: '请选择页面!'
|
}]
|
})(
|
<Select>
|
{views.map(item => {
|
return <Select.Option key={item.MenuID} value={item.MenuID}>{item.MenuName}</Select.Option>
|
})}
|
</Select>
|
)}
|
</Form.Item>
|
</Col> : null}
|
<Col span={24} className="remark">
|
<Form.Item label="说明">
|
{getFieldDecorator('Remark', {
|
initialValue: '',
|
rules: [{
|
max: 512,
|
message: '说明不可超过512个字符!'
|
}]
|
})(<TextArea autoSize={{ minRows: 2, maxRows: 6 }} />)}
|
</Form.Item>
|
</Col>
|
</Row>
|
</Form>
|
)
|
}
|
}
|
|
export default Form.create()(ScriptForm)
|
