| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Icon, Modal, Button, notification } from 'antd' |
| | | |
| | | import Utils from '@/utils/utils.js' |
| | | import DevUtils from '@/utils/devutils.js' |
| | | import zhCN from '@/locales/zh-CN/model.js' |
| | | import enUS from '@/locales/en-US/model.js' |
| | | import { getSettingForm } from '@/templates/zshare/formconfig' |
| | | import { Modal, Button } from 'antd' |
| | | import { SettingOutlined } from '@ant-design/icons' |
| | | |
| | | import SettingForm from './settingform' |
| | | import CreateFunc from '@/templates/zshare/createfunc' |
| | | import CreateInterface from '@/templates/zshare/createinterface' |
| | | |
| | | import './index.scss' |
| | | // import './index.scss' |
| | | |
| | | class SettingComponent extends Component { |
| | | static propTpyes = { |
| | | type: PropTypes.string, // 菜单类型 |
| | | mainsearch: PropTypes.any, // 主表的搜索条件,当子表设置接收主表条件时有效 |
| | | MenuID: PropTypes.string, // 菜单ID |
| | | config: PropTypes.object, // 菜单配置信息 |
| | | permFuncField: PropTypes.array, // 存储过程可用开头字段 |
| | | menuformRef: PropTypes.any, // 菜单基本信息表单 |
| | | updatesetting: PropTypes.func |
| | | } |
| | | |
| | | state = { |
| | | dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | menu: null, // 菜单信息 |
| | | search: null, // 搜索条件,包括主表搜索 |
| | | formlist: null, // 表单信息 |
| | | visible: false, // 模态框控制 |
| | | loading: false // 设置信息验证保存中 |
| | | loading: false, // 设置信息验证保存中 |
| | | record: null |
| | | |
| | | } |
| | | |
| | | /** |
| | | * @description 全局设置触发 |
| | | */ |
| | | changeSetting = () => { |
| | | const { menuformRef, MenuID, config, type, permFuncField, mainsearch } = this.props |
| | | let menu = {MenuID: MenuID} |
| | | const { MenuID, config, mainsearch } = this.props |
| | | let menu = { MenuID: MenuID, MenuName: config.MenuName || config.tabName || '', MenuNo: config.MenuNo || config.tabNo || '' } |
| | | |
| | | if (menuformRef) { |
| | | menu = {MenuID: MenuID, MenuName: menuformRef.props.form.getFieldValue('MenuName') || '', MenuNo: menuformRef.props.form.getFieldValue('MenuNo') || ''} |
| | | } |
| | | |
| | | let _columns = fromJS(config.columns).toJS() |
| | | |
| | | let primaryKey = config.setting.primaryKey || '' |
| | | |
| | | if (!primaryKey || _columns.filter(column => column.field === primaryKey).length === 0) { |
| | | _columns.forEach(col => { |
| | | if (col.field.toLowerCase() === 'id') { |
| | | primaryKey = col.field |
| | | } |
| | | }) |
| | | } |
| | | _columns = _columns.filter(item => item.field && item.type !== 'colspan') |
| | | _columns = _columns.map(item => { |
| | | return { |
| | | value: item.field, |
| | | text: item.label |
| | | } |
| | | }) |
| | | |
| | | // _columns.unshift({value: '', text: '未设置'}) |
| | | |
| | | let _config = fromJS(config).toJS() |
| | | let _search = fromJS(config.search).toJS() |
| | | |
| | | if (mainsearch) { // 综合主页搜索及子表搜索条件 |
| | | _config.search = [..._config.search, ...mainsearch] |
| | | _search = [...mainsearch, ..._search] |
| | | } |
| | | |
| | | this.setState({ |
| | | visible: true, |
| | | formlist: getSettingForm(config.setting, permFuncField, MenuID, primaryKey, _columns, type), |
| | | menu: menu, |
| | | config: _config |
| | | search: _search, |
| | | menu: menu |
| | | }) |
| | | } |
| | | |
| | |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | this.settingRef.handleConfirm().then(res => { |
| | | this.settingRef.handleConfirm().then(setting => { |
| | | let res = this.resetSetting(setting, config.setting) |
| | | this.setState({ |
| | | visible: false, |
| | | loading: false |
| | | }) |
| | | |
| | | this.props.updatesetting({...config, setting: res}) |
| | | }, () => { |
| | | this.setState({ |
| | |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * @description 创建表格存储过程 |
| | | */ |
| | | tableCreatFunc = () => { |
| | | const { config } = this.props |
| | | const { menu } = this.state |
| | | // /** |
| | | // * @description 创建表格接口(读出) |
| | | // */ |
| | | // tableCreatInterface = () => { |
| | | // const { config } = this.props |
| | | // const { menu } = this.state |
| | | |
| | | this.settingRef.handleConfirm().then(setting => { |
| | | // this.settingRef.handleConfirm('loading').then(setting => { |
| | | // let res = this.resetSetting(setting, config.setting) |
| | | // let _config = {...config, setting: res} |
| | | // let _menu = { |
| | | // type: config.Template === 'CommonTable' ? 'main' : 'subtable', |
| | | // MenuID: menu.MenuID, |
| | | // menuName: menu.MenuName, |
| | | // menuNo: menu.MenuNo |
| | | // } |
| | | |
| | | if (!(setting.interType === 'inner') || !setting.innerFunc) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '接口类型为-内部,且存在内部函数时,才可以创建存储过程!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | // this.refs.tableCreatInterface.triggerOutInterface(_menu, _config) |
| | | // }) |
| | | // } |
| | | |
| | | let _config = {...config, setting: setting} |
| | | let newLText = Utils.formatOptions(DevUtils.getTableFunc(setting, menu, _config)) // 创建存储过程sql |
| | | let DelText = Utils.formatOptions(DevUtils.dropfunc(setting.innerFunc)) // 删除存储过程sql |
| | | resetSetting = (s, ori) => { |
| | | let setting = fromJS(s).toJS() |
| | | // let maxScript = 0 |
| | | |
| | | this.refs.funcCreatComponent.exec(setting.innerFunc, newLText, DelText).then(result => { |
| | | if (result === 'success') { |
| | | this.props.updatesetting(_config) |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | | setting.show = ori.show || 'true' |
| | | setting.advanceType = ori.advanceType || 'modal' |
| | | setting.advanceWidth = ori.advanceWidth || 1000 |
| | | setting.drawerPlacement = ori.drawerPlacement || 'right' |
| | | setting.searchRatio = ori.searchRatio || 6 |
| | | setting.searchLwidth = ori.searchLwidth !== undefined ? ori.searchLwidth : 33.3 |
| | | setting.resetContrl = ori.resetContrl || 'init' |
| | | |
| | | /** |
| | | * @description 创建表格接口(读出) |
| | | */ |
| | | tableCreatInterface = () => { |
| | | const { config, type } = this.props |
| | | const { menu } = this.state |
| | | // if (window.GLOB.funcs && window.GLOB.funcs.length > 0) { |
| | | // window.GLOB.funcs.forEach(m => { |
| | | // let reg = new RegExp('\\$ex@' + m.func_code + '@ex\\$', 'ig') |
| | | // setting.scripts.forEach(item => { |
| | | // item.sql = item.sql.replace(reg, `/*$ex@${m.func_code}-begin*/\n${m.key_sql}\n/*@ex$-end*/`) |
| | | |
| | | this.settingRef.handleConfirm().then(setting => { |
| | | if (setting.interType !== 'inner' || setting.innerFunc) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '接口类型为-内部,且不存在内部函数时,才可以创建接口!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | // if (item.status === 'false') return |
| | | |
| | | let _config = {...config, setting: setting} |
| | | let _menu = { |
| | | type: type, |
| | | MenuID: menu.MenuID, |
| | | menuName: menu.MenuName, |
| | | menuNo: menu.MenuNo |
| | | } |
| | | // if (/exec\s/ig.test(item.sql)) { |
| | | // maxScript = 1000 |
| | | // } else if (item.sql.length > maxScript) { |
| | | // maxScript = item.sql.length |
| | | // } |
| | | // }) |
| | | // setting.preScripts.forEach(item => { |
| | | // item.sql = item.sql.replace(reg, `/*$ex@${m.func_code}-begin*/\n${m.key_sql}\n/*@ex$-end*/`) |
| | | // }) |
| | | // setting.cbScripts.forEach(item => { |
| | | // item.sql = item.sql.replace(reg, `/*$ex@${m.func_code}-begin*/\n${m.key_sql}\n/*@ex$-end*/`) |
| | | // }) |
| | | // if (setting.dataresource) { |
| | | // setting.dataresource = setting.dataresource.replace(reg, `/*$ex@${m.func_code}-begin*/\n${m.key_sql}\n/*@ex$-end*/`) |
| | | // } |
| | | // }) |
| | | // } else { |
| | | // setting.scripts.forEach(item => { |
| | | // if (item.status === 'false') return |
| | | |
| | | this.refs.tableCreatInterface.triggerOutInterface(_menu, _config) |
| | | }) |
| | | // if (/exec\s/ig.test(item.sql)) { |
| | | // maxScript = 1000 |
| | | // } else if (item.sql.length > maxScript) { |
| | | // maxScript = item.sql.length |
| | | // } |
| | | // }) |
| | | // } |
| | | |
| | | // setting.maxScript = maxScript |
| | | |
| | | return setting |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { type } = this.props |
| | | const { dict, visible, config } = this.state |
| | | const { config } = this.props |
| | | const { visible, search, menu } = this.state |
| | | |
| | | return ( |
| | | <div className="model-menu-setting"> |
| | | <Icon type="setting" onClick={this.changeSetting} /> |
| | | <> |
| | | <SettingOutlined style={{position: 'absolute', fontSize: '18px', right: '7px', top: '5px', padding: '10px', zIndex: 1}} onClick={this.changeSetting} /> |
| | | {/* 设置全局配置及列表数据源 */} |
| | | <Modal |
| | | wrapClassName="model-table-setting-verify-modal" |
| | | title={dict['model.edit']} |
| | | wrapClassName="mk-pop-modal" |
| | | visible={visible} |
| | | width={900} |
| | | width={'75vw'} |
| | | maskClosable={false} |
| | | onCancel={() => { this.setState({ visible: false })}} |
| | | onCancel={() => { this.setState({ visible: false, loading: false })}} |
| | | footer={[ |
| | | <CreateInterface key="interface" dict={dict} ref="tableCreatInterface" trigger={this.tableCreatInterface}/>, |
| | | <CreateFunc key="create" dict={dict} ref="funcCreatComponent" trigger={this.tableCreatFunc}/>, |
| | | <Button key="cancel" onClick={() => { this.setState({ visible: false }) }}>{this.state.dict['model.cancel']}</Button>, |
| | | <Button key="confirm" type="primary" loading={this.state.loading} onClick={this.settingSave}>{this.state.dict['model.confirm']}</Button> |
| | | <Button key="cancel" onClick={() => { this.setState({ visible: false, loading: false }) }}>取消</Button>, |
| | | <Button key="confirm" type="primary" loading={this.state.loading} onClick={this.settingSave}>确定</Button> |
| | | ]} |
| | | destroyOnClose |
| | | > |
| | | <SettingForm |
| | | type={type} |
| | | dict={dict} |
| | | menu={menu} |
| | | config={config} |
| | | menu={this.state.menu} |
| | | inputSubmit={this.settingSave} |
| | | formlist={this.state.formlist} |
| | | search={search} |
| | | updRecord={() => {}} |
| | | wrappedComponentRef={(inst) => this.settingRef = inst} |
| | | /> |
| | | </Modal> |
| | | </div> |
| | | </> |
| | | ) |
| | | } |
| | | } |