| | |
| | | |
| | | const SettingComponent = asyncIconComponent(() => import('@/menu/datasource')) |
| | | const SearchComponent = asyncComponent(() => import('@/templates/sharecomponent/searchcomponent')) |
| | | const ActionComponent = asyncComponent(() => import('@/menu/actioncomponent')) |
| | | const ColumnComponent = asyncComponent(() => import('./columncomponent')) |
| | | // const WrapComponent = asyncIconComponent(() => import('../data-card/wrapsetting')) |
| | | // const SearchComponent = asyncComponent(() => import('@/menu/searchcomponent')) |
| | | const ActionComponent = asyncComponent(() => import('@/menu/components/share/actioncomponent')) |
| | | const NormalHeader = asyncComponent(() => import('@/menu/components/share/normalheader')) |
| | | const ColumnComponent = asyncComponent(() => import('./columns')) |
| | | const WrapComponent = asyncIconComponent(() => import('./wrapsetting')) |
| | | |
| | | const { confirm } = Modal |
| | | |
| | |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | | setting: { interType: 'system' }, |
| | | wrap: { name: card.name, width: 24 }, |
| | | wrap: { name: card.name, width: 24, bordered: 'true', tableType: 'checkbox' }, |
| | | style: { marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px' }, |
| | | headerStyle: { fontSize: '16px' }, |
| | | headerStyle: { fontSize: '16px', borderBottomWidth: '1px', borderBottomColor: '#e8e8e8' }, |
| | | columns: [], |
| | | cols: [ |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 } |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label1', field: '', Hide: 'false', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label2', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | { origin: true, uuid: Utils.getuuid(), Align: 'left', label: 'label3', field: '', Hide: 'false', IsSort: 'true', type: 'text', Width: 120 }, |
| | | ], |
| | | scripts: [] |
| | | } |
| | |
| | | MKEmitter.emit('changeStyle', [card.uuid], ['background', 'border', 'padding', 'margin'], card.style) |
| | | } |
| | | |
| | | changeTitleStyle = () => { |
| | | const { card } = this.state |
| | | |
| | | MKEmitter.emit('changeStyle', [card.uuid, 'header'], ['font', 'border'], card.headerStyle) |
| | | } |
| | | |
| | | getStyle = (comIds, style) => { |
| | | const { card } = this.state |
| | | |
| | |
| | | let _card = {} |
| | | if (comIds.length === 1) { |
| | | _card = {...card, style} |
| | | } else if (comIds.length === 2 && comIds[1] === 'header') { |
| | | _card = {...card, headerStyle: style} |
| | | } else { |
| | | return |
| | | } |
| | |
| | | this.props.updateConfig(_card) |
| | | } |
| | | |
| | | addCard = () => { |
| | | addColumns = () => { |
| | | let card = fromJS(this.state.card).toJS() |
| | | |
| | | // let newcard = { |
| | | // uuid: Utils.getuuid(), |
| | | // setting: { width: 6, type: 'simple'}, |
| | | // style: { |
| | | // paddingTop: '5px', paddingBottom: '5px', paddingLeft: '15px', paddingRight: '15px', |
| | | // }, |
| | | // elements: [] |
| | | // } |
| | | |
| | | card.cols.push({ focus: true, uuid: Utils.getuuid(), label: 'label', field: '', type: 'text' }) |
| | | |
| | | this.setState({card}) |
| | | this.props.updateConfig(card) |
| | | } |
| | | |
| | | addSearch = () => { |
| | | let card = fromJS(this.state.card).toJS() |
| | | |
| | | let newcard = {} |
| | | newcard.uuid = Utils.getuuid() |
| | | newcard.focus = true |
| | | |
| | | newcard.label = 'label' |
| | | newcard.type = 'text' |
| | | newcard.match = '=' |
| | | |
| | | card.search.push(newcard) |
| | | card.search.push({uuid: Utils.getuuid(), focus: true, label: 'label', type: 'text', match: '='}) |
| | | |
| | | this.setState({card}) |
| | | } |
| | |
| | | newcard.errorTime = 10 |
| | | newcard.verify = null |
| | | newcard.show = 'button' |
| | | newcard.btnstyle = {marginRight: '15px'} |
| | | |
| | | // 注册事件-添加按钮 |
| | | MKEmitter.emit('addButton', card.uuid, newcard) |
| | |
| | | setSubConfig = (btn) => { |
| | | |
| | | } |
| | | updateaction = (config) => { |
| | | |
| | | } |
| | | |
| | | render() { |
| | | const { menu } = this.props |
| | |
| | | |
| | | return ( |
| | | <div className="menu-normal-table-edit-box" style={{...card.style, height: card.wrap.height}}> |
| | | <NormalHeader defaultshow="hidden" hideSearch="true" config={card} updateComponent={this.updateComponent}/> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <Icon className="plus" title="添加列" onClick={this.addColumns} type="plus" /> |
| | | {menu && menu.MenuType !== 'billPrint' ? <Icon className="plus" title="添加搜索" onClick={this.addSearch} type="plus-circle" /> : null} |
| | | {menu && menu.MenuType !== 'billPrint' ? <Icon className="plus" title="添加按钮" onClick={this.addButton} type="plus-square" /> : null} |
| | | {/* {menu ? <WrapComponent config={card} MenuType={menu.MenuType} updateConfig={this.updateComponent} /> : null} */} |
| | | {menu ? <WrapComponent config={card} MenuType={menu.MenuType} updateConfig={this.updateComponent} /> : null} |
| | | <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" /> |
| | | <Icon className="close" title="删除组件" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} /> |
| | | <SettingComponent config={card} updateConfig={this.updateComponent} /> |
| | |
| | | <Icon type="tool" /> |
| | | </Popover> |
| | | <SearchComponent config={card} updatesearch={this.updateconfig}/> |
| | | <ActionComponent |
| | | type="normaltable" |
| | | config={card} |
| | | updateaction={this.updateComponent} |
| | | /> |
| | | <ActionComponent config={card} setSubConfig={this.setSubConfig} updateaction={this.updateComponent}/> |
| | | <ColumnComponent config={card} updatecolumn={this.updateconfig}/> |
| | | </div> |
| | | ) |