| | |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Modal, Button } from 'antd' |
| | | import moment from 'moment' |
| | | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import { getCardCellForm } from './formconfig' |
| | | import { getActionForm, getBaseTableActionForm } from '@/menu/components/share/actioncomponent/formconfig' |
| | | |
| | | import Utils, { FuncUtils } from '@/utils/utils.js' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import MenuUtils from '@/utils/utils-custom.js' |
| | | import ElementForm from './elementform' |
| | |
| | | |
| | | class CardCellComponent extends Component { |
| | | static propTpyes = { |
| | | cards: PropTypes.object, // 菜单配置信息 |
| | | cards: PropTypes.object, |
| | | cardCell: PropTypes.object, |
| | | side: PropTypes.string, |
| | | elements: PropTypes.array, // 元素集 |
| | | updateElement: PropTypes.func // 菜单配置更新 |
| | | timestamp: PropTypes.any, |
| | | elements: PropTypes.array, |
| | | updateElement: PropTypes.func |
| | | } |
| | | |
| | | state = { |
| | |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps(nextProps) { |
| | | if (this.props.side !== nextProps.side) { |
| | | if (this.props.timestamp !== nextProps.timestamp && nextProps.timestamp) { |
| | | this.setState({ |
| | | elements: fromJS(nextProps.elements).toJS() |
| | | }) |
| | |
| | | options = ['background', 'border', 'margin'] |
| | | } else if (element.eleType === 'color') { |
| | | options = ['border', 'margin', 'padding'] |
| | | } else if (element.eleType === 'number' || element.eleType === 'icon') { |
| | | options.push('display') |
| | | } else if (element.eleType === 'text') { |
| | | options[0] = 'font2' |
| | | options.push('display') |
| | |
| | | options = ['padding', 'margin'] |
| | | } else if (element.eleType === 'splitline') { |
| | | options = ['padding', 'margin'] |
| | | } |
| | | |
| | | if (element.eleType !== 'button' && element.eleType !== 'tag') { |
| | | options.push('position') |
| | | } |
| | | |
| | | options.push('clear') |
| | |
| | | |
| | | getStyle = (style) => { |
| | | const { card, elements } = this.state |
| | | |
| | | // if (card.eleType === 'button') { |
| | | // if ((style.paddingLeft || style.paddingRight) && !style.width) { |
| | | // style.width = 'auto' |
| | | // } |
| | | // } |
| | | |
| | | let _card = this.resetCardStyle(card, style) |
| | | |
| | |
| | | _card.style = style |
| | | let line = _card.height || null |
| | | |
| | | if (['currentDate', 'sequence', 'icon'].includes(_card.eleType)) { |
| | | if (['currentDate', 'sequence'].includes(_card.eleType) || (_card.eleType === 'icon' && _card.tipType !== 'text')) { |
| | | line = 1 |
| | | } |
| | | |
| | |
| | | } else if (_card.eleType === 'picture') { |
| | | _card.style = style |
| | | delete _card.style.backgroundImage |
| | | delete _card.style.paddingTop |
| | | delete _card.style.paddingBottom |
| | | delete _card.style.paddingLeft |
| | | delete _card.style.paddingRight |
| | | } else { |
| | | _card.style = style |
| | | } |
| | |
| | | supId = '' |
| | | } |
| | | } |
| | | let menu = window.GLOB.customMenu |
| | | |
| | | let modules = MenuUtils.getSubModules(window.GLOB.customMenu.components, cards.uuid, supId) |
| | | let modules = MenuUtils.getSubModules(menu.components, cards.uuid, supId, menu.interfaces || null) |
| | | |
| | | if (cards.subtype === 'basetable') { |
| | | this.setState({ |
| | | actvisible: true, |
| | | card: card, |
| | | formlist: getBaseTableActionForm(card, functip, cards, usefulFields, modules) |
| | | formlist: getBaseTableActionForm(card, functip, cards, usefulFields, modules, 'line') |
| | | }) |
| | | } else { |
| | | let anchors = MenuUtils.getAnchors(window.GLOB.customMenu.components, cards.uuid) || [] |
| | | let anchors = MenuUtils.getAnchors(menu.components, cards.uuid) || [] |
| | | |
| | | this.setState({ |
| | | actvisible: true, |
| | | card: card, |
| | | formlist: getActionForm(card, functip, cards, usefulFields, modules, anchors, side) |
| | | formlist: getActionForm(card, functip, cards, usefulFields, modules, anchors, side, 'line') |
| | | }) |
| | | } |
| | | } |
| | |
| | | if (cell.uuid === res.uuid) { |
| | | res.style = cell.style || {} |
| | | |
| | | if (res.eleType !== 'text') { |
| | | if (!['text', 'number', 'icon'].includes(res.eleType)) { |
| | | delete res.style.display |
| | | } |
| | | |
| | |
| | | } else if (['text', 'number', 'formula', 'currentDate', 'sequence', 'icon'].includes(res.eleType)) { |
| | | let line = res.height || null |
| | | |
| | | if (['currentDate', 'sequence', 'icon'].includes(res.eleType)) { |
| | | if (['currentDate', 'sequence'].includes(res.eleType) || (res.eleType === 'icon' && res.tipType !== 'text')) { |
| | | line = 1 |
| | | } |
| | | |
| | |
| | | res.innerHeight = res.barHeight + (res.displayValue === 'true' ? fontSize + 2 : 0) |
| | | } else if (res.eleType === 'picture') { |
| | | delete res.style.backgroundImage |
| | | delete res.style.paddingTop |
| | | delete res.style.paddingBottom |
| | | delete res.style.paddingLeft |
| | | delete res.style.paddingRight |
| | | } else if (res.eleType === 'tag') { |
| | | delete res.style.position |
| | | if (cell.eleType !== 'tag') { |
| | | res.style = { |
| | | backgroundColor: 'var(--mk-sys-color1)', |
| | | color: 'var(--mk-sys-color)', |
| | | borderColor: 'var(--mk-sys-color)', |
| | | borderWidth: '1px', |
| | | borderRadius: '4px', |
| | | paddingLeft: '7px', |
| | | paddingRight: '7px', |
| | | marginRight: '8px', |
| | | marginBottom: '8px', |
| | | } |
| | | } |
| | | } |
| | | |
| | | return res |
| | |
| | | let color = { primary: '#1890ff', yellow: '#c49f47', orange: 'orange', danger: '#ff4d4f', green: '#26C281', dgreen: '#32c5d2', purple: '#8E44AD', cyan: '#13c2c2', gray: '#666666', default: 'rgba(0, 0, 0, 0.65)' } |
| | | |
| | | this.actionFormRef.handleConfirm().then(res => { |
| | | if (res.width % 0.5) { |
| | | res.width = parseInt(res.width / 0.5) * 0.5 |
| | | } |
| | | if (res.width % 1) { |
| | | res.width = (res.width + '').replace(/.5/, 'x') |
| | | } |
| | | |
| | | let _elements = elements.map(cell => { |
| | | if (cell.uuid === res.uuid) { |
| | | res.eleType = cell.eleType || null |
| | | res.style = cell.style || null |
| | | // res.modal = cell.modal || null |
| | | // res.config = cell.config || null |
| | | res.wrapStyle = cell.wrapStyle || null |
| | | // res = {...cell, ...res} |
| | | |
| | | // if (!res.control) { |
| | | // delete res.controlField |
| | | // delete res.controlVal |
| | | // } |
| | | |
| | | // delete res.focus |
| | | |
| | | if (res.OpenType === 'form') { |
| | | if (cell.OpenType !== 'form') { |
| | | res.style = {} |
| | | } |
| | | } else if (res.class !== cell.class || res.show !== cell.show || !res.style) { |
| | | let cl = res.class.replace('border-', '') |
| | | let style = {} |
| | | if (res.show === 'link' || res.show === 'icon') { |
| | | style.color = color[cl] |
| | | style.backgroundColor = 'transparent' |
| | | } else if (res.class === 'default') { |
| | | style.color = 'rgba(0, 0, 0, 0.65)' |
| | | style.backgroundColor = '#fff' |
| | | style.borderColor = '#d9d9d9' |
| | | } else if (res.class.indexOf('border') > -1) { |
| | | style.color = color[cl] |
| | | style.backgroundColor = '#fff' |
| | | style.borderColor = color[cl] |
| | | // } else if (res.class !== cell.class || res.show !== cell.show || !res.style) { |
| | | } else if (res.class !== cell.class || !res.style) { |
| | | if (res.class) { |
| | | let cl = res.class.replace('border-', '') |
| | | let style = {} |
| | | if (res.class === 'default') { |
| | | style.color = 'rgba(0, 0, 0, 0.65)' |
| | | style.backgroundColor = 'transparent' |
| | | style.borderColor = '#d9d9d9' |
| | | } else if (res.class.indexOf('border') > -1) { |
| | | style.color = color[cl] |
| | | style.backgroundColor = 'transparent' |
| | | style.borderColor = color[cl] |
| | | } else { |
| | | style.color = '#ffffff' |
| | | style.backgroundColor = color[cl] |
| | | } |
| | | res.style = {...res.style, ...style} |
| | | } else { |
| | | style.color = '#ffffff' |
| | | style.backgroundColor = color[cl] |
| | | res.style = res.style || {} |
| | | } |
| | | res.style = {...res.style, ...style} |
| | | } |
| | | |
| | | if (res.width === 0 && cell.width !== 0) { |
| | | res.style = res.style || {} |
| | | |
| | | res.style.paddingLeft = '15px' |
| | | res.style.paddingRight = '15px' |
| | | res.style.marginRight = '15px' |
| | | res.style.width = 'auto' |
| | | |
| | | delete res.style.marginLeft |
| | | } |
| | | |
| | | res.updateTime = moment().format('YYYY-MM-DD HH:mm') |
| | | |
| | | return res |
| | | } |
| | |
| | | let _elements = elements.map(cell => { |
| | | if (cell.uuid === card.uuid) { |
| | | cell.verify = res |
| | | cell.updateTime = moment().format('YYYY-MM-DD HH:mm') |
| | | } |
| | | |
| | | return cell |
| | |
| | | } |
| | | |
| | | dropButton = (id) => { |
| | | const { cards, cardCell } = this.props |
| | | const { cards } = this.props |
| | | |
| | | if (!cards.action) return |
| | | if (cardCell.type === 'custom') return |
| | | |
| | | let index = cards.action.findIndex(item => item.uuid === id) |
| | | |
| | |
| | | * @description 创建按钮存储过程 |
| | | */ |
| | | creatFunc = () => { |
| | | const { cards } = this.props |
| | | const menu = window.GLOB.customMenu |
| | | let _config = fromJS(this.props.cards).toJS() |
| | | |
| | | this.actionFormRef.handleConfirm().then(res => { |
| | | let btn = res // 按钮信息 |
| | | let newLText = '' // 创建存储过程sql |
| | | let DelText = '' // 删除存储过程sql |
| | | return new Promise((resolve) => { |
| | | this.actionFormRef.handleConfirm().then(res => { |
| | | let btn = fromJS(res).toJS() |
| | | let _config = fromJS(cards).toJS() |
| | | |
| | | if (btn.intertype !== 'inner') return |
| | | if (btn.OpenType === 'excelIn') { |
| | | btn.func = btn.innerFunc |
| | | btn.menuNo = menu.MenuNo |
| | | btn.MenuName = menu.MenuName + _config.name |
| | | btn.$type = 'excelIn' |
| | | |
| | | if (btn.OpenType === 'pop') { |
| | | let _param = { |
| | | funcName: btn.innerFunc, |
| | | name: _config.setting.tableName || '', |
| | | fields: btn.modal ? btn.modal.fields : [], |
| | | menuNo: menu.MenuNo |
| | | resolve(btn) |
| | | } else if (btn.OpenType === 'excelOut') { |
| | | _config.MenuName = menu.MenuName + '-' + _config.name |
| | | _config.menuNo = menu.MenuNo |
| | | _config.MenuID = menu.MenuID |
| | | _config.func = btn.innerFunc |
| | | _config.$type = 'table' |
| | | |
| | | resolve(_config) |
| | | } else { |
| | | btn.func = btn.innerFunc |
| | | btn.name = _config.setting.tableName || '' |
| | | btn.menuNo = menu.MenuNo |
| | | btn.MenuID = menu.MenuID |
| | | btn.MenuName = menu.MenuName + _config.name |
| | | btn.fields = [] |
| | | btn.columns = _config.columns |
| | | btn.primaryKey = _config.setting.primaryKey || 'ID' |
| | | btn.$type = 'btn' |
| | | |
| | | if (btn.OpenType === 'pop') { |
| | | btn.fields = btn.modal ? btn.modal.fields : [] |
| | | } |
| | | |
| | | resolve(btn) |
| | | } |
| | | newLText = Utils.formatOptions(FuncUtils.getfunc(_param, btn, menu, _config)) |
| | | DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) |
| | | } else if (btn.OpenType === 'excelIn') { |
| | | let _param = { |
| | | funcName: btn.innerFunc, |
| | | menuNo: menu.MenuNo |
| | | } |
| | | newLText = Utils.formatOptions(FuncUtils.getexcelInfunc(_param, btn, menu)) |
| | | DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) |
| | | } else if (btn.OpenType === 'excelOut') { |
| | | newLText = Utils.formatOptions(FuncUtils.getTableFunc(btn.innerFunc, menu, _config)) // 创建存储过程sql |
| | | DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) |
| | | } else { |
| | | let _param = { |
| | | funcName: btn.innerFunc, |
| | | name: _config.setting.tableName || '', |
| | | fields: '', |
| | | menuNo: menu.MenuNo |
| | | } |
| | | newLText = Utils.formatOptions(FuncUtils.getfunc(_param, btn, menu, _config)) |
| | | DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc)) |
| | | } |
| | | |
| | | this.refs.btnCreatFunc.exec(btn.innerFunc, newLText, DelText) |
| | | }) |
| | | }) |
| | | } |
| | | |
| | |
| | | {/* 编辑按钮:复制、编辑 */} |
| | | <Modal |
| | | title="编辑元素" |
| | | wrapClassName="mk-scroll-modal" |
| | | visible={visible} |
| | | width={850} |
| | | maskClosable={false} |
| | |
| | | {/* 编辑按钮:复制、编辑 */} |
| | | <Modal |
| | | title="按钮·编辑" |
| | | wrapClassName="mk-scroll-modal" |
| | | visible={actvisible} |
| | | width={920} |
| | | maskClosable={false} |
| | | onCancel={this.editModalCancel} |
| | | footer={[ |
| | | record && record.intertype === 'inner' && cards.subtype === 'dualdatacard' ? <CreateFunc key="create" ref="btnCreatFunc" trigger={this.creatFunc}/> : null, |
| | | record && record.intertype === 'inner' && cards.subtype === 'dualdatacard' ? <CreateFunc key="create" getMsg={this.creatFunc}/> : null, |
| | | <Button key="cancel" onClick={this.editModalCancel}>取消</Button>, |
| | | <Button key="confirm" type="primary" onClick={this.handleActionSubmit}>确定</Button> |
| | | ]} |
| | | destroyOnClose |
| | | > |
| | | <ActionForm |
| | | type={cards.type === 'balcony' ? '' : 'card'} |
| | | type={cards.type === 'balcony' || cardCell.$cardType === 'extendCard' ? '' : 'card'} |
| | | card={card} |
| | | formlist={this.state.formlist} |
| | | inputSubmit={this.handleActionSubmit} |